Link
An inline link with an underline that follows the text colour; renders any element through the render prop.
<Link href="/docs">
Read the docs
</Link>Props
Installation
npx shadcn@latest add https://sproutboat.com/ikada/r/link.jsonThe CLI writes components/ikada/link.tsx and merges the ikada theme into your CSS. Or take it from the package: import { Link } from "@sproutboat/ikada";
Usage
import { Link } from "@/components/ikada/link";
<Link href="/docs">
Read the docs
</Link>Examples
Read the deploy guide before moving robin to eu-west.
<p>
Read the <Link href="/docs/deploys">deploy guide</Link> before moving robin to eu-west.
</p><Link href="https://robin.sproutboat.app" external>
robin.sproutboat.app
</Link><Link href="/docs/deploys" aria-disabled="true">
Deploy guide
</Link>Props
| Prop | Type | Description |
|---|---|---|
| external | boolean | Opens in a new tab with a safe rel, shows an arrow and announces it. Default `false`. |
| render | ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, {}> | Allows you to replace the component's HTML element with a different tag, or compose it with another component. Accepts a `ReactElement` or a function that returns the element to render. |
Also takes every prop of useRender.ComponentProps<"a">.
Source: src/components/link.tsx