• Aktivere/deaktivere en tilstand umiddelbart
  • Som en på/av bryter for eks notifikasjoner
  • Som erstatning for checkbox eller radio i skjema
  • Toggle tilstander som ikke automatisk blir oppdatert. Brukes helst som en lysbryter der endringer skjer umiddelbart.
Installer
KommandoInteraksjon
spaceAktiverer/deaktiverer elementet.
Gruppering av switch
Venstrestilt switch-element. Dette vil være go-to løsning i de fleste tilfeller.
Switch gruppering høyrestilt
Høyrestilt Switch-element funker bra i enkelte tilfeller, spesielt for mobil.
Switch med eks lagre-knapp er ikke anbefalt
Ikke bruk switch som checkbox erstattning
Switch i loading-state
Loading-state bør brukes sparsomt
children ReactNode
Switch-label
hideLabel? boolean
If enabled shows the label and description for screenreaders only
loading? boolean
Toggles loading state with loader-component on switch
position?"left" | "right"
Positions switch on left/right side of label
description? string
Adds a description to extend labling of Switch
size? "medium" | "small"
Changes font-size, padding and gaps
disabled? boolean
Disables element @note Avoid using if possible for accessibility purposes
id? string
Override internal id
className? string
ref? Ref<HTMLInputElement>
Switch extends HTMLInputElement