Checkbox

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

Usage

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

<template>
  <ShCheckbox v-model="agreed" label="I agree to the terms" />
</template>

Prop	Type	Default	Description
`modelValue`	`boolean`	—	Bound value (use with `v-model`)
`label`	`string`	—	Checkbox label
`indeterminate`	`boolean`	—	Indeterminate state
`defaultIndeterminate`	`boolean`	—	Default indeterminate (uncontrolled)
`defaultChecked`	`boolean`	—	Default checked (uncontrolled)
`accessibilityLabel`	`string`	—	Accessible label
`error`	`string`	—	Error message
`details`	`string`	—	Help text below the checkbox
`required`	`boolean`	—	Marks the field as required
`disabled`	`boolean`	—	Disables the checkbox
`id`	`string`	—	Element ID
`name`	`string`	—	Form field name

Event	Payload	Description
`update:modelValue`	`boolean`	Emitted when checked state changes
`change`	`Event`	Native change event
`input`	`Event`	Native input event

Slot	Description
`default`	Additional content

Renders as <s-checkbox>. See Polaris Checkbox docs.

Select

Dropdown select input with v-model support. Wraps the Polaris <s-select> web component.

Switch

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