blue
View on GitHub

Switch

A switch toggles between two states, often used to enable or disable settings or features.


Usage

Light
Blue
Zoho Puvi
<script>
	import { Switch } from 'deskblocks';
</script>

<Switch />

Size

Light
Blue
Zoho Puvi
<Switch size="small" />
<Switch size="large" />

Disabled state

Light
Blue
Zoho Puvi
<Switch disabled checked />
<Switch disabled />

Props

checked boolean false Determines whether the switch is in the “on” (checked) state.
disabled boolean false Disables the switch, preventing user interaction.
value string undefined Sets the value associated with the switch when it is checked.
required boolean false Indicates whether the switch must be toggled before form submission.
size ‘small’ | ‘medium’ ‘small’ Specifies the size of the switch.
id string randomId Specifies a unique identifier for the switch.
class string undefined Custom CSS class name for additional styling.

Events