Skip to Content
glob.ui home
Components

Switch

An on/off control with `role="switch"`, controlled or uncontrolled, with an optional form value.

Client componentUses state or handlers, so it starts with "use client".
import { Switch, switchVariants } from "@glob-ui/switch"

Preview

Notifications on

Examples

In a form

With name, a hidden input submits value while the switch is on.

Subscribe to the newsletter

Submitted: not submitted

API

Props are generated from the TypeScript types in the package source.

SwitchProps

Prop

Type

Accessibility

Key or actionBehaviour
Space, EnterToggles the switch.
TabFocuses it.

ARIA. role="switch" with aria-checked. Give it a name with aria-label or a visible label, for example a Field.

On this page