Clipboard
Allows you to quickly copy data to the clipboard.
import { clipboard } from '@skeletonlabs/skeleton';
This div is set to 'contenteditable'. Make changes then tap copy.
If your data is available as a primitive data type (string, integer, etc), you can provide it directly to the action.
const exampleData: string = 'Your data here.';
<button use:clipboard={exampleData}>Copy</button>
Copying HTML Contents
To copy the innerHTML for an element, set a data-clipboard
data attribute on your target, then provide
element
reference to the action.
<!-- Source -->
<div data-clipboard="exampleElement">(contents)</div>
<!-- Trigger -->
<button use:clipboard={{ element: 'exampleElement' }}>Copy</button>
Copying Input Values
To copy a form input value, set a data-clipboard
data attribute on your target, then provide
input
reference to the action.
<!-- Source -->
<input type="text" value="(contents)" data-clipboard="exampleInput"></input>
<!-- Trigger -->
<button use:clipboard={{ input: 'exampleInput' }}>Copy</button>