Component API
<copy-link-button>
Small icon button that copies value to the clipboard and shows a toast
on success/failure (if a <toast-notification> element is present), and
always dispatches a copy-success/copy-error CustomEvent so consumers
without a toast element can react. Defaults to the current page URL ifvalue is unset.
Install
import "@f-ewald/components/copy-link-button.js";
Usage
<copy-link-button value="https://example.com/listing/42" label="Copy listing link"></copy-link-button>
Attributes / properties
| Property | Attribute | Type | Default | Description |
|---|---|---|---|---|
value | value | string | "" | Text to copy. Defaults to window.location.href at click time. |
label | label | string | "Copy link" | Accessible label / tooltip text. |
disabled | disabled | boolean | false | Disables clipboard copying. |
Events
| Event | Description |
|---|---|
copy-success | The value was copied to the clipboard. |
copy-error | Copying to the clipboard failed. |
Slots
None.
CSS custom properties
| Custom property |
|---|
--ui-focus-ring |
--ui-radius-sm |
--ui-surface-muted |
--ui-text |
--ui-text-muted |