Switch
A control that allows the user to toggle between checked and not checked.
Installation
›pnpm dlx shadcn@latest add @evolphin/switch
Usage
import { Switch } from "@/components/ui/switch";<Switch />Type Definitions
interface SwitchProps {
/** The controlled checked state of the switch */
checked?: boolean; /** The default checked state when uncontrolled */
?: boolean;
/** Event handler called when the checked state changes */
?: (: boolean) => void;
/** Whether the switch is disabled */
?: boolean;
}Examples
Default
API Reference
Switch
| Prop | Type | Default | Description |
|---|---|---|---|
checked | boolean | - | The controlled checked state of the switch. |
defaultChecked | boolean | - | The default checked state when uncontrolled. |
onCheckedChange | (checked: boolean) => void | - | Event handler called when the checked state changes. |
disabled | boolean | false | Whether the switch is disabled. |
required | boolean | false | Whether the switch is required. |
name | string | - | The name of the switch. |
value | string | "on" | The value of the switch. |
className | string | - | Additional CSS classes |