Switch

Toggle switch with v-model support. Wraps the Polaris <s-switch> web component.

Usage

<script setup>
const enabled = ref(false)
</script>

<template>
  <ShSwitch v-model="enabled" label="Enable notifications" />
</template>

Prop	Type	Default	Description
`modelValue`	`boolean`	—	Bound value (use with `v-model`)
`label`	`string`	—	Switch label
`defaultChecked`	`boolean`	—	Default checked (uncontrolled)
`accessibilityLabel`	`string`	—	Accessible label
`labelAccessibilityVisibility`	`'visible' \| 'exclusive'`	—	Label visibility for assistive tech
`error`	`string`	—	Error message
`details`	`string`	—	Help text below the switch
`required`	`boolean`	—	Marks the field as required
`disabled`	`boolean`	—	Disables the switch
`id`	`string`	—	Element ID
`name`	`string`	—	Form field name

Slot	Description
`default`	Additional content

Renders as <s-switch>. See Polaris Switch docs.

Checkbox

Checkbox input with v-model support. Wraps the Polaris <s-checkbox> web component.

ChoiceList

Radio/checkbox group with v-model support. Wraps the Polaris <s-choice-list> web component.