jsp-dsv0.1

Switchshadcn

A setting that takes effect immediately.

Inputs
Install
npx shadcn add switch
Import from
@/components/ui/switch
Guidance
draft · v0.1.0

Examples

As installed from shadcn – rendering in jsp-ds tokens through the bridge.

A summary of activity at 9:00 each morning.

A setting that takes effect at once. For choices saved with a form, use a checkbox.

Guidance

When to use

  • A setting that takes effect the moment it changes: notifications on, dark mode.

When not to use

  • In a form that's saved with a button – use a checkbox.

Rules

  • The label says what's on when it's on: Daily digest, not Disable digest.
  • Put the switch at the end of the row, the label and description at the start.

Install

Terminal
npx shadcn add switch
Import
import { Switch } from "@/components/ui/switch"

From shadcn’s own registry. Don’t edit the installed file – jsp-ds styles it through the bridge, and fixes go in styles/overrides.css with an issue.