Docs

Searchv0.6.0 (main)
Getting started
OverviewInstallationThemesChangelog
Hooks
use_pressuse_moveuse_hoveruse_buttonuse_overlayuse_anchor_link
Atoms
ButtonPopoverAnchorLink
Components
Layout
StackGridSeparatorSkeletonApp BarDrawerTabsTableCollapsible
Input
ButtonInputTiptap editorDate & TimeSliderSelectCheckboxRadioToggleColor Picker
Feedback
AlertToastModalProgressPopoverChipKbd
General
TypographyIconLinkCallback

Toggle#

A toggle is a representation of a boolean value.

let (state, set_state) = create_signal(false); view! { <Toggle state=state set_state=set_state/> }

Icons#

A toggle can be configured with a pair of icons. One icon being rendered in the off position, the other being rendered in the on position.

let (state, set_state) = create_signal(false); view! { <Toggle state=state set_state=set_state icons=ToggleIcons { on: icondata::BsFolderFill, off: icondata::BsFolder, }/> }

Variations#

The toggle comes in two variants: Sliding and Stationary. Sliding toggles are the default and the ones we have used so far.

Stationary toggles are not animated and only consist of a single circle.