A control that allows the user to toggle between checked and not checked. This component is an implementation of Switch component from radix-ui.
Possible values are medium, large
Possible values are primary, secondary, tertiary
Possible values are primary, secondary, tertiary
Color of circle inside switch
Object that needs a checked and unckecked color
Color of the outline when is focused
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
| id | string | Yes | ID of the element | |
| handleChange | function | No | Function that allows to handle when switch is clicked | |
| isLoading | boolean | No | Shows a spinner while you are fecthing data | |
| loadingColor | string | white | No | Spinner color |
| loadingSpeed | number | 1 | No | Duration of the spinner animation |
| kind | primary | secondary | tertiary | primary | No | Set defined styles of the component |
| type | standard | success | warning | error | disabled | No | Set the style depending on the type | |
| disabled | boolean | No | Set input to disabled mode | |
| sliderColor | string | white | No | Set the color of circle inside switch |
| switchBackgroundColor | checked: string; unchecked: string | No | Color of checked and unchecked background | |
| enhancerIcons | checked: ReactNode; unchecked: ReactNode | No | Images that are rendered inside slider depending on current state | |
| focusOutlineColor | string | No | Set color of the outline when switch is focused using Tab key |