Use Link Preview when a link needs a little extra context before someone leaves the current page. The preview appears on hover or focus without changing the destination of the link.
Install
Basic usage
Examples
Add an icon when it helps identify the destination. Keep the preview brief and ensure the link label still makes sense without it.
API
| Property | Type | Default | Description |
|---|
link | string | required | The URL of the link to preview. |
text | string | required | The text to display for the link. |
showIcon | boolean | true | Whether to show an icon next to the link text. |
Accessibility
The original link remains the primary control. Ensure its visible text describes the destination on its own.
Styling
Use className and the preview options to match the surrounding text and link treatment.
Found a bug or need help using this component? Open an issue on GitHub.
License & Usage
Sona UI is available under the MIT license. You may use, modify, and distribute this component in personal and commercial projects.