# Boolean Switch Examples and Reference

### Default Boolean Switch

An example of a default boolean switch without any extra properties.

    library(dash)
    library(dashDaq)
    library(dashHtmlComponents)

    app <- Dash$new()

    app$layout(htmlDiv(list(
      daqBooleanSwitch(id = "my-boolean-switch",
                       on = FALSE),
      htmlDiv(id = "boolean-switch-output")
    )))

    app$callback(
      output(id = "boolean-switch-output", property = "children"),
      params = list(input(id = "my-boolean-switch", property = "on")),
      update_booleanswitch <- function(on) {
        return (sprintf("The switch is %s.", on))
      }
    )

    app$run_server()

The switch is False.

### Color

Set the color of the boolean switch with `color=#<hex_value>`.

    library(dashDaq)

    daqBooleanSwitch(
      on = TRUE,
      color = "#9B51E0"
    )

### Label

Set the label and label position using the `label` and `labelPosition` properties.

    library(dashDaq)

    daqBooleanSwitch(
      on = TRUE,
      label = "Label",
      labelPosition = "top"
    )

Label

### Vertical Switch

Create a vertical oriented switch by setting `vertical=TRUE`.

    library(dashDaq)

    daqBooleanSwitch(
      on = TRUE,
      label = "Vertical",
      vertical = TRUE
    )

Vertical

### Disabled Switch

To disable the Boolean Switch set the property `disabled` to `TRUE`.

    library(dashDaq)

    daqBooleanSwitch(
      on = TRUE,
      label = "Vertical",
      vertical = TRUE
    )

Disabled

## BooleanSwitch Properties

> Our recommended IDE for writing Dash apps is Dash Enterprise's Data Science Workspaces, which has typeahead support for Dash Component Properties. Find out if your company is using Dash Enterprise.

`id` (character; optional): The ID used to identify this component in Dash callbacks.

`on` (logical; default `FALSE`): Whether or not the switch is on.

`color` (character; optional): Color to highlight active switch background.

`vertical` (logical; default `FALSE`): If TRUE, switch will be vertical instead of horizontal.

`disabled` (logical; optional): If TRUE, switch cannot be clicked.

`theme` (named list; default `light`): Theme configuration to be set by a ThemeProvider.

`label` (named list; optional): Description to be displayed alongside the control. To control styling, pass an object with label and style properties.

`label` is a character | named list with keys:

- `label` (character; optional)

- `style` (named list; optional)

`labelPosition` (a value equal to: 'top' or 'bottom'; default `'top'`): Where the component label is positioned.

`className` (character; optional): Class to apply to the root component element.

`style` (named list; optional): Style to apply to the root object.

`persistence` (logical | character | numeric; optional): Used to allow user interactions in this component to be persisted when the component - or the page - is refreshed. If `persisted` is truthy and hasn't changed from its previous value, a `value` that the user has changed while using the app will keep that change, as long as the new `value` also matches what was given originally. Used in conjunction with `persistence_type`.

`persisted_props` (unnamed list of values equal to: 'on'; default `['on']`): Properties whose user interactions will persist after refreshing the component or the page. Since only `on` is allowed this prop can normally be ignored.

`persistence_type` (a value equal to: 'local', 'session' or 'memory'; default `'local'`): Where persisted user changes will be stored: memory: only kept in memory, reset on page refresh. local: window.localStorage, data is kept after the browser quit. session: window.sessionStorage, data is cleared once the browser quit.

`size` (numeric; optional): size of the switch.