Switch

Props

• aria-label
  string

  The accessible name, for when there is no visible label.

• aria-labelledby
  string

  The id of the element that names it, when its label is elsewhere on the page.

• checked
  boolean

  Whether it is checked, when you control it.

• defaultChecked
  boolean

  Whether it starts checked, when the component keeps its own state.

• description
  ReactNode

  One sentence of help under the label.

• disabled
  boolean

  Turns it off: it can't be used, and it looks dimmed.

• disabledReason
  string

  Why it is disabled, shown as a tooltip; it stays focusable so people can read it.

• id
  string

  The id of the control, so a label elsewhere can point to it.

• label
  ReactNode

  The switch's label.

• loading
  boolean

  Shows that the change is being saved and ignores clicks until it is.

• name
  string

  The field name the value is sent under in a form.

• onCheckedChange
  ((checked: boolean) => void)

  Called with the new state when it is checked or unchecked.

• readOnly
  boolean

  Shows the value without letting people change it.

• size
  "md" | "sm" | "lg" = md

  The switch's size.