# Toggle (fw-toggle)

fw-toggle displays an input control that enables modifying an element’s state between two settings.

# Demo

Small not selected

Mid-sized and selected
Show Code

# Usage

# Properties

Property Attribute Description Type Default
checked checked Sets the selected state as the default state. If the attribute’s value is undefined, the value is set to false. boolean false
disabled disabled Specifies whether to disable the control on the interface. If the attribute’s value is undefined, the value is set to false. boolean false
label label Label for the component, that can be used by screen readers. string ''
name name Name of the component, saved as part of the form data. string ''
showIcon show-icon Specifies whether to show the check and cancel icons on toggle button. If the attribute’s value is undefined, the value is set to true. boolean true
size size Size of the input control. "large" \| "medium" \| "small" 'medium'

# Events

Event Description Type
fwChange Triggered when the input control is selected or deselected. CustomEvent<any>

# Dependencies

# Depends on

# Graph

graph TD;
  fw-toggle --> fw-icon
  fw-icon --> fw-toast-message
  fw-toast-message --> fw-spinner
  fw-toast-message --> fw-icon
  style fw-toggle fill:#f9f,stroke:#333,stroke-width:4px

Built with ❤ at Freshworks