nalarx-ui
Components

Switch

An on/off control with fixed 34×20 geometry.

bunx shadcn@latest add @nalarx/switch

Usage

<Switch checked={enabled} onCheckedChange={setEnabled} aria-label="Enable the agent" />

Props

Every Base UI Switch.Root prop: checked, defaultChecked, onCheckedChange, disabled, name…

Accessibility

There is no text inside, so give it aria-label or wrap it in a <label>. Space toggles it.

The off track is --ink-4, at least 4.96:1 against --bg and --bg-elev in both themes, so an off switch stays visible on any surface (WCAG 1.4.11 asks for 3:1).

Replaces

NxSwitch in both apps (onChange becomes onCheckedChange, label becomes aria-label) and the Platform's base/Switch.tsx.

Field

A label, a control and one line under it for the hint or the error.

Checkbox

A 16px checkbox; checked and indeterminate states in ink.

On this page

UsagePropsAccessibilityReplaces