Tile UI · SolidJS

CSR · SSR · SSG

Switch

An accessible SolidJS switch with controlled and native form state.

Notifications: on

import { createSignal } from 'solid-js';
import { Button, Switch } from '@tile-ui/solid';

export default function SwitchDemo() {
	const [checked, setChecked] = createSignal(true);
	return (

Use Switch for controlled or uncontrolled boolean settings that submit with a form.

Registry install

pnpm dlx shadcn@latest add @tile-ui/switch

Package usage

import { Switch } from '@tile-ui/solid';

<Switch />

Highlights

  • Two sizes
  • Accessible switch role
  • Pairs with Field and Form

Registry dependencies

Item Purpose
switch Component source and module styles
core Framework-agnostic logic helpers
utils Shared utility helpers
styles Shared SCSS tokens and globals

API reference

Switch

Prop Type Default
size 'default' | 'sm'
checked boolean
defaultChecked boolean
onCheckedChange (checked: boolean) => void
name string
value string
form string
required boolean