NoRedInk / noredink-ui / Nri.Ui.Switch.V3

Changes from V2:

- Replace underlying checkbox input with a custom implementation
- Allow attributes that produce msgs to be passed through

view : { label : String, id : String } -> List (Attribute msg) -> Html.Styled.Html msg

Render a switch. The boolean here indicates whether the switch is on or not.

Attributes


type Attribute msg

selected : Basics.Bool -> Attribute msg

What is the status of the Switch, selected or not?

containerCss : List Css.Style -> Attribute msg

Adds CSS to the Switch container.

labelCss : List Css.Style -> Attribute msg

Adds CSS to the element containing the label text.

Note that these styles don't apply to the literal HTML label element, since it contains the icon SVG as well.

custom : List (Html.Styled.Attribute msg) -> Attribute msg

Pass custom attributes through to be attached to the underlying input.

Do NOT use this helper to add css styles, as they may not be applied the way you want/expect if underlying styles change. Instead, please use containerCss or labelCss.

nriDescription : String -> Attribute msg

testId : String -> Attribute msg

onSwitch : (Basics.Bool -> msg) -> Attribute msg

Specify what happens when the switch is toggled.

disabled : Basics.Bool -> Attribute msg

Explicitly specify that you want this switch to be disabled. If you don't specify onSwitch, this is the default, but it's provided so you don't have to resort to filterMap or similar to build a clean list of attributes.