Switch

A control that lets the user toggle a setting on or off.

When to use

• Toggling a single setting (Airplane Mode, notifications, dark mode).
• Any binary on/off choice.

API

Switch::new(id)

Creates a switch with the given element ID.

Method	Type	Default	Description
.checked(checked)	bool	false	Whether the switch is on
.focus_handle(&handle)	&FocusHandle	—	Focus handle (enables keyboard toggling with Space/Enter)
.on_click(fn)	Fn(&ClickEvent, &mut Window, &mut App)	—	Click/toggle handler

Usage

use gpui::{Component, div, prelude::*};
use components::Switch;

div().child(Component::new(
    Switch::new("settings-toggle")
        .checked(this.checked)
        .focus_handle(&this.focus_handle)
        .on_click(cx.listener(|this, _, _, cx| {
            this.checked = !this.checked;
            cx.notify();
        })),
))

Copy the source

crates/components/src/switch.rs — self-contained, stateless, and free to modify.