Link
A token-styled anchor.
Usage
import { Link } from "@kanzo-tech/ui";<Link href="/board/Q-1058">Read the contract</Link>This is a plain <a>. For router navigation, wear your framework's link with
asChild — the design system deliberately knows nothing about any router.
Variants
plain inherits the surrounding colour and only underlines on hover, for links inside a
sentence that should not be four blue words.
API Reference
| Prop | Type | Default |
|---|---|---|
variant | "default" | "subtle" | "plain" | "default" |
Extends React.ComponentProps<"a">, so href, target, rel and ref pass through.
LinkProps is exported, so a wrapper can take the same props without restating them.
A router link
asChild is the whole routing seam, here and everywhere else in the library — there is no
linkComponent prop on any component, and nothing imports a router:
<Link asChild>
<NextLink href="/datasets">Datasets</NextLink>
</Link>The recipe itself is deliberately not exported. A link treatment that can be applied to
arbitrary markup is a second way to spell what asChild already does, and two spellings of one
idea is the thing this library keeps collapsing.