Glowup
ACTIONS · 19 / 89
ToggleButton
ToggleButton — a Material You actions component for React Native and web.
󱀫
packages/ui/src/components/ToggleButton/ToggleButton.tsx
Live demo
Properties
5 controls
Active
Label
Icon
Selected check
Disabled
Usage
ToggleButton.tsx
<ToggleButton active label="Grid" />
Variants
The states and shapes this component is meant to be used in.
Segments
View
Icon only
Text alignment
Label only
Standalone
API reference
Generated from the library's TypeScript, so it cannot drift from the implementation.
Props
11 on ToggleButtonProps
Filter props
󰍉
active
required
boolean
onPress
required
() => void
accessibilityRole
"radio" | "checkbox" | "button"
default: "button"
Accessibility role. The group sets this per its selection mode.
disabled
boolean
default: false
grow
boolean
default: false
Stretch to an equal share of the group's width.
icon
MaterialCommunityIconsGlyphs
isFirst
boolean
isLast
boolean
label
string
showSelectedCheck
boolean
default: false
Swap the leading glyph for a check mark while selected — the M3 segmented button affordance that tells "selected" apart from "just highlighted".
style
StyleProp<ViewStyle>
󰅁
Previous
SpeedDial
Next
ToggleButtonGroup
󰅂