{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "link",
  "title": "Link",
  "description": "A link inside running text, underlined.",
  "dependencies": [
    "@base-ui/react",
    "@stylexjs/stylex"
  ],
  "registryDependencies": [
    "https://constella.aayush.cv/r/base.json"
  ],
  "files": [
    {
      "path": "src/components/typography/link.tsx",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport * as stylex from \"@stylexjs/stylex\";\n\nimport type { Sx } from \"@/lib/constella/styles\";\nimport { colors, durations, media, space } from \"@/lib/constella/tokens.stylex\";\n\ntype LinkProps = Omit<useRender.ComponentProps<\"a\">, \"className\" | \"style\"> & {\n  sx?: Sx;\n};\n\nconst styles = stylex.create({\n  base: {\n    color: colors.textPrimary,\n    textDecorationColor: {\n      default: colors.border,\n      [media.hover]: {\n        default: colors.border,\n        \":hover\": colors.textPrimary,\n      },\n      \":active\": colors.textPrimary,\n    },\n    textDecorationLine: \"underline\",\n    textUnderlineOffset: space.xxs,\n    transitionDuration: durations.hover,\n    transitionProperty: \"text-decoration-color\",\n    transitionTimingFunction: \"ease\",\n  },\n});\n\n/** A link inside running text. Pass a router's link as `render`. */\nfunction Link({ render, sx, ...props }: LinkProps) {\n  return useRender({\n    defaultTagName: \"a\",\n    props: mergeProps<\"a\">(props, stylex.props(styles.base, sx)),\n    render,\n    state: { slot: \"link\" },\n  });\n}\n\nexport { Link };\nexport type { LinkProps };\n",
      "type": "registry:component"
    }
  ],
  "docs": "Usage: https://constella.aayush.cv/docs/components/link/index.md",
  "type": "registry:ui"
}