{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "link",
  "type": "registry:ui",
  "title": "Link",
  "description": "An inline link in text: always underlined with an engraved hairline that darkens on hover; an external link's arrow nudges toward where it goes.",
  "dependencies": [
    "@base-ui/react@^1.8.0"
  ],
  "registryDependencies": [
    "https://metalui.dev/r/tokens.json"
  ],
  "files": [
    {
      "path": "packages/metalui/src/components/link/link.tsx",
      "type": "registry:ui",
      "target": "components/metalui/link/link.tsx",
      "content": "'use client';\n\nimport * as React from 'react';\nimport { useRender } from '@base-ui/react/use-render';\n\n/* ─────────────────────────────────────────────────────────\n * LINK, an inline link in text\n *\n *   rest      the text's own type and ink, always underlined with an engraved hairline\n *             (colour alone never marks a link)\n *   hover     the underline darkens to the text's ink (160 ms)\n *   external  a small arrow after it; hovered, it nudges one step up and out on the part spring,\n *             toward where the link goes; it opens in a new tab and says so to assistive tech\n *   pressed   it dims for the press\n *   focus     the green ring\n * Reduce Motion: the arrow does not travel (the part spring is instant).\n * `render` swaps the element (a router's link) and keeps the look.\n * ───────────────────────────────────────────────────────── */\n\nconst LINK = 'mu-link link-anchor outline-none focus-visible:focus-ring';\n// The underline lives on the text, so the external arrow beside it stays undecorated and inline.\nconst LINE = 'mu-link-line link-line';\nconst OUT = 'mu-link-out link-out';\n\nexport interface LinkProps extends useRender.ComponentProps<'a'> {\n  /** Leaves this site: adds the arrow, opens in a new tab, and says so. */\n  external?: boolean;\n}\n\n/** An inline link. `external` marks and opens links that leave the site. */\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(function Link({ external, render, className, children, ...props }, ref) {\n  const own = className ? `${LINK} ${className}` : LINK;\n  return useRender({\n    render,\n    ref,\n    defaultTagName: 'a',\n    props: {\n      ...props,\n      className: own,\n      ...(external ? { target: '_blank', rel: 'noopener noreferrer' } : null),\n      children: (\n        <>\n          <span className={LINE}>{children}</span>\n          {external && (\n            <>\n              {/* A text glyph, not an inline-block: punctuation after the link stays on its line. */}\n              <span aria-hidden className={OUT}>↗</span>\n              <span className=\"sr-only\"> (opens in a new tab)</span>\n            </>\n          )}\n        </>\n      ),\n    },\n  });\n});\n"
    }
  ],
  "docs": "Agent guide: https://metalui.dev/r/link.md. SwiftUI: MetalLink in the MetalUI Swift package."
}