Link Showcase
Sveltekit-UI
Link Preview
Sveltekit-UI
https://www.sveltekit-ui.com
Component Documentation
Component Name
Link
Builder Function Name
create_link_manager
Description
Renders a hyperlink (`<a>`) with optional popover preview. Can handle internal (SvelteKit `goto`) or external links, show a QR, copy link, etc.
Use like example
Config
| Property | Type | Default | Description |
|---|---|---|---|
| id | string or null | generated unique ID | A unique string ID for this link. |
| href | string | The URL to navigate to. Determines internal vs external link. | |
| display_text | string | The text displayed in the link if no child content is provided. | |
| text_color | CSS color | Color of the link text. | |
| is_show_preview | boolean | !is_internal_link | If true, clicking the link opens a popover with a QR code and copy button. If false, no popover is shown. |
| on_goto_external_link | function | Optional callback when user opens an external link. |
Methods
| Method | Description | Parameters | Returns |
|---|---|---|---|
| init | Sets up popover, QR code manager, copy/goto buttons, etc. Called once with config. | No Params | |
| handle_a_click | Click handler for the `<a>` element. Prevents default and either triggers internal or external link logic. | No Params | |
| open_link | Opens the link via SvelteKit `goto` if internal, or in a new tab if external. | No Params |
Returned Properties
| Property | Type | Description |
|---|---|---|
| href | string | Current link address. |
| popover_manager | object | Popover manager for the link preview popover. |
| copy_link_button_manager | object | Button manager for the 'Copy Link' button in the popover. |
| goto_link_button_manager | object | Button manager for the 'Open Link In New Tab' button in the popover. |
| goto_link_same_tab_button_manager | object | Button manager for the 'Open Link In Same Tab' button in the popover. |
| inline_goto_link_button_manager | object | Button manager displayed inline for direct navigation if `is_show_preview` is false. |
| qr_manager | object | QR manager for generating the link's QR code preview. |
| is_internal_link | boolean | Whether `href` starts with '/' (treated as internal). |
| is_show_preview | boolean | Whether the popover preview is shown on click. |
