Switch

Install

pnpm dlx shadcn@latest add @namche/switch

Usage

import { Label } from '@/components/ui/label';
import { Switch } from '@/components/ui/switch';

<div className="flex items-center justify-between">
  <Label htmlFor="deploy-alerts">Deployment alerts</Label>
  <Switch id="deploy-alerts" defaultChecked />
</div>

Wraps Base UI's Switch. Takes checked / defaultChecked and onCheckedChange, plus a size="sm" | "default" prop. It exposes data-checked/data-unchecked (not a boolean data-state) for styling, and composes with Label the same way Checkbox does — an adjacent id/ htmlFor pair, no wrapping element required.