Core Elements
Switch
A toggle control for a binary setting.
Usage
Installation
npm install @wunderui/reactThen import what you need:
import { Switch, SwitchItemCell } from "@wunderui/react"Examples
Off
The switch on its own — click to turn it on.
Switch rows
Settings rows with a switch on the right.
In context
How the component is used inside real screens — the same compositions as the Usage section of the Figma page.
File list with selection
A file table: the header checkbox selects all rows, row checkboxes pick single files, switches toggle sharing.
| Name | Size | Shared | |
|---|---|---|---|
| brand-guide.pdf | 4.2 MB | ||
| hero.png | 1.1 MB | ||
| tokens.json | 24 KB | ||
| onboarding.fig | 18 MB |