Tile UI · SolidJS
CSR · SSR · SSGToggle
A controlled or uncontrolled SolidJS toggle button.
Pressed state: false
import { createSignal } from 'solid-js';
import { Toggle } from '@tile-ui/solid';
export default function ToggleDemo() {
const [pressed, setPressed] = createSignal(false);
Use Toggle for controlled or uncontrolled binary state in SolidJS.
Registry install
pnpm dlx shadcn@latest add @tile-ui/toggle
Package usage
import { Toggle } from '@tile-ui/solid';
<Toggle variant="outline">Bold</Toggle>
Highlights
- Three variants
- Three sizes
- Pressed state
Registry dependencies
| Item | Purpose |
|---|---|
toggle |
Component source and module styles |
core |
Framework-agnostic logic helpers |
utils |
Shared utility helpers |
styles |
Shared SCSS tokens and globals |
API reference
Toggle
| Prop | Type | Default |
|---|---|---|
variant |
'default' | 'outline' | 'ghost' |
— |
size |
'sm' | 'default' | 'lg' |
— |
pressed |
boolean |
— |
defaultPressed |
boolean |
— |
onPressedChange |
(pressed: boolean) => void |
— |