SwitchProps

Properties interface for the Switch component

Props

The following table outlines the props for the SwitchProps:

NameTypeDefaultDescription
checked
boolean
-

Specifies a value that indicates whether the Switch is checked or not. Activates controlled mode.

checkedIcon
node
-

Specifies a custom icon to render inside the handle when the switch is ON (checked).

color
Color.Primary

Specifies the Color style applied to the ON state track and handle. Options include 'Primary', 'Secondary', 'Warning', 'Success', 'Error', and 'Info'.

defaultChecked
boolean
false

Specifies the initial checked state of the Switch. Use for uncontrolled components.

label
string
-

Specifies the text label rendered adjacent to the switch track.

labelPlacement
Position.Right

Specifies the position of the label relative to the Switch track.

offTrackLabel
node
-

Specifies the React node rendered inside the track when the switch is OFF. Can be text or icon.

onTrackLabel
node
-

Specifies the React node rendered inside the track when the switch is ON. Can be text or icon.

size
Size.Medium

Specifies the Size preset controlling track and handle dimensions. Options include 'Small', 'Medium' and 'Large'.

uncheckedIcon
node
-

Specifies a custom icon to render inside the handle when the switch is OFF (unchecked).

value
string
-

Specifies the HTML form value submitted when the switch is checked.

Events

The following table outlines the events for the SwitchProps:

NameTypeDescription
onChange
(event: SwitchChangeEvent) => void

Triggers when the user toggles the switch. event.value is the new boolean state.