Similar to a checkbox, a switch controls the state of a single setting on or off.

Element
igc-switch
Slots
default — The switch label.
CSS Parts
base — The base wrapper of the switch.
control — The switch input element.
thumb — The position indicator of the switch.
label — The switch label.

IgcSwitchComponent

new IgcSwitchComponent(): IgcSwitchComponent

Defined in src/components/checkbox/switch.ts:40

Returns IgcSwitchComponent

Inherited from: IgcCheckboxBaseComponent

The disabled state of the component.

disabled: boolean

Defined in src/components/common/mixins/forms/types.ts:29

Inherited from: IgcCheckboxBaseComponent

Sets the control into invalid state (visual state only).

invalid: boolean

Defined in src/components/common/mixins/forms/types.ts:36

Inherited from: IgcCheckboxBaseComponent

The label position of the control.

labelPosition: ToggleLabelPosition = 'after'

Defined in src/components/checkbox/checkbox-base.ts:91

Inherited from: IgcCheckboxBaseComponent

The name attribute of the control.

name: string

Defined in src/components/common/mixins/forms/types.ts:42

tagName: "igc-switch" = 'igc-switch'

Defined in src/components/checkbox/switch.ts:29

Inherited from: IgcCheckboxBaseComponent

get checked(): boolean

Defined in src/components/checkbox/checkbox-base.ts:82

Returns boolean

The checked state of the control.

set checked(value: boolean): void

Defined in src/components/checkbox/checkbox-base.ts:78

Parameters

  • value: boolean

Returns void

Inherited from: IgcCheckboxBaseComponent

get defaultChecked(): boolean

Defined in src/components/common/mixins/forms/types.ts:169

Returns boolean

The initial checked state of the component.

set defaultChecked(value: boolean): void

Defined in src/components/common/mixins/forms/types.ts:168

Parameters

  • value: boolean

Returns void

Inherited from: IgcCheckboxBaseComponent

Returns the HTMLFormElement associated with this element.

get form(): HTMLFormElement | null

Defined in src/components/common/mixins/forms/types.ts:45

Returns HTMLFormElement | null

Inherited from: IgcCheckboxBaseComponent

get required(): boolean

Defined in src/components/common/mixins/forms/types.ts:181

Returns boolean

When set, makes the component a required field for validation.

set required(value: boolean): void

Defined in src/components/common/mixins/forms/types.ts:180

Parameters

  • value: boolean

Returns void

Inherited from: IgcCheckboxBaseComponent

A string containing the validation message of this element.

get validationMessage(): string

Defined in src/components/common/mixins/forms/types.ts:54

Returns string

Inherited from: IgcCheckboxBaseComponent

Returns a ValidityState object which represents the different validity states the element can be in, with respect to constraint validation.

get validity(): ValidityState

Defined in src/components/common/mixins/forms/types.ts:51

Returns ValidityState

Inherited from: IgcCheckboxBaseComponent

get value(): string

Defined in src/components/checkbox/checkbox-base.ts:68

Returns string

The value attribute of the control.

set value(value: string): void

Defined in src/components/checkbox/checkbox-base.ts:61

Parameters

  • value: string

Returns void

Inherited from: IgcCheckboxBaseComponent

A boolean value which returns true if the element is a submittable element that is a candidate for constraint validation.

get willValidate(): boolean

Defined in src/components/common/mixins/forms/types.ts:60

Returns boolean

Inherited from: IgcCheckboxBaseComponent

addEventListener(type: K, listener: object, options: boolean | AddEventListenerOptions): void

Defined in src/components/common/mixins/event-emitter.ts:7

Parameters

  • type: K
  • listener: object
  • options: boolean | AddEventListenerOptions

Returns void

Inherited from: IgcCheckboxBaseComponent

Removes focus from the control.

blur(): void

Defined in src/components/checkbox/checkbox-base.ts:106

Returns void

Inherited from: IgcCheckboxBaseComponent

Checks for validity of the control and emits the invalid event if it invalid.

checkValidity(): boolean

Defined in src/components/common/mixins/forms/types.ts:146

Returns boolean

Inherited from: IgcCheckboxBaseComponent

Simulates a click on the control.

click(): void

Defined in src/components/checkbox/checkbox-base.ts:94

Returns void

Inherited from: IgcCheckboxBaseComponent

emitEvent(type: K, eventInitDict: CustomEventInit<D>): boolean

Defined in src/components/common/mixins/event-emitter.ts:30

Parameters

  • type: K
  • eventInitDict: CustomEventInit<D>

Returns boolean

Inherited from: IgcCheckboxBaseComponent

Sets focus on the control.

focus(options: FocusOptions): void

Defined in src/components/checkbox/checkbox-base.ts:100

Parameters

  • options: FocusOptions

Returns void

Inherited from: IgcCheckboxBaseComponent

removeEventListener(type: K, listener: object, options: boolean | EventListenerOptions): void

Defined in src/components/common/mixins/event-emitter.ts:17

Parameters

  • type: K
  • listener: object
  • options: boolean | EventListenerOptions

Returns void

Inherited from: IgcCheckboxBaseComponent

Checks for validity of the control and shows the browser message if it invalid.

reportValidity(): boolean

Defined in src/components/common/mixins/forms/types.ts:149

Returns boolean

Inherited from: IgcCheckboxBaseComponent

Sets a custom validation message for the control. As long as message is not empty, the control is considered invalid.

setCustomValidity(message: string): void

Defined in src/components/common/mixins/forms/types.ts:155

Parameters

  • message: string

Returns void

register(): void

Defined in src/components/checkbox/switch.ts:33

Returns void