Forms

Switch

An on/off setting that takes effect immediately.

import { Switch } from '@jsonresume/ui'Source(opens in a new tab)

Examples

Basic

Public resumeJob alerts

switch/basic.tsx

import { Stack, Switch } from '@jsonresume/ui';

export default function SwitchBasic() {
  return (
    <Stack gap={3}>
      <Switch label="Public resume" defaultChecked />
      <Switch label="Job alerts" />
    </Stack>
  );
}

Usage

Do

Use for settings that apply instantly.

Don’t

Use inside a form that needs a Save button: use Checkbox.

Accessibility

Exposes role="switch" with its checked state.

Props

Also accepts the attributes of the element Switch renders.
Prop	Type	Default	Description
label	ReactNode	–	Visible label rendered beside the control.