Link primitives facilitate navigation within your application. Options include Box Link and Text Link, both utilizing Next.js Link for seamless routing.
The Box Link primitive uses Next Link under the hood, allowing you to wrap any content as a link.
| Prop | Type | Default | Description |
|---|---|---|---|
href | string | — | The URL to navigate to when the link is clicked. |
target | string | _self | Specifies where to open the linked document. |
scroll | boolean | true | Whether to scroll to the top of the page when navigating. |
prefetch | boolean | true | Indicates if the linked page should be prefetched. |
disabled | boolean | false | Disables the link if set to true. |
The Text Link primitive is a simple clickable text element that also utilizes Next Link for routing.
| Prop | Type | Default | Description |
|---|---|---|---|
text | string | Link | The text displayed for the link. |
href | string | — | The URL to navigate to when the link is clicked. |
target | string | _self | Specifies where to open the linked document. |
scroll | boolean | true | Whether to scroll to the top of the page when navigating. |
prefetch | boolean | true | Indicates if the linked page should be prefetched. |
disabled | boolean | false | Disables the link if set to true. |
Both Box Link and Text Link can be styled using the Style Panel, Global Styles, and Selectors. You can customize their appearance to fit your design needs.