Skip to main content
161

Search Lumen

Find components, APIs, guides, and recipes.

GitHub
React Native docs
FormsReact Native

Toggle

Present a labeled native switch with Lumen brand tint.

Public APILumenToggleReact Native

Native example

Use Toggle

Use for an immediately applied Boolean setting. Use a button when an action does not represent persistent on/off state.

View verified React Native runtime capture
Toggle rendered in the Expo web renderer Lumen playground
Verified runtime captureExpo web renderer
tsx
<LumenToggle
  label="Automatic updates"
  value={automaticUpdates}
  onValueChange={setAutomaticUpdates}
/>

Reference

Public API

The primary shared and platform-specific options exposed by LumenToggle.

APIValues or typeDefaultDescription
valuebooleanRequiredStores native on/off state.
labelstringRequiredProvides the visible and accessible label.
onValueChange(Boolean) -> UnitRequiredUpdates the controlled state.
showLabelBooleantrueCan visually hide a repeated label while preserving its accessible name.
enabledBooleantrueControls native disabled state.

Native behavior

Design and accessibility

When to use it

Use for an immediately applied Boolean setting. Use a button when an action does not represent persistent on/off state.

Accessibility

The visible label and native switch expose standard platform state and activation behavior.

Shared component

Available on other platforms

Apple / SwiftUIAndroid / Compose
React Native docsNative primitives