Slide Toggles
A sliding toggle element that can capture input from a user.
import { SlideToggle } from '@skeletonlabs/skeleton';
This component provides an alternative UI for a checkbox input element.
let valueChecked: boolean = false;
<SlideToggle name="slider-example" bind:checked={valueChecked}>(text)</SlideToggle>
Additional Sizes
Slide toggles have a default base size, but you can optionally use a smaller or larger size.
<SlideToggle ... size="sm" />
<SlideToggle ... size="lg" />
Checkbox Attributes
This component supports Svelte's $$restProps
, which allows for required, disabled, and any other
valid checkbox input attributes.
<SlideToggle ... required disabled />