Class IgcSwitchComponent

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

element

igc-switch

slot
  • The switch label.
fires

igcChange - Emitted when the control's checked state changes.

fires

igcFocus - Emitted when the control gains focus.

fires

igcBlur - Emitted when the control loses focus.

csspart

base - The base wrapper of the switch.

csspart

control - The switch control.

csspart

thumb - The position indicator of the switch.

csspart

label - The switch label.

Hierarchy

  • IgcCheckboxBaseComponent
    • IgcSwitchComponent

Index

Constructors

Properties

ariaLabelledby: string

Sets the aria-labelledby attribute for the control.

checked: boolean = false

The checked state of the control.

disabled: boolean = false

Disables the control.

invalid: boolean = false

Controls the validity of the control.

labelPosition: "after" | "before" = 'after'

The label position of the control.

name: string

The name attribute of the control.

required: boolean = false

Makes the control a required field.

value: string

The value attribute of the control.

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

Methods

  • blur(): void
  • click(): void
  • connectedCallback(): void
  • disconnectedCallback(): void
  • emitEvent<K, D>(type: K, eventInitDict?: CustomEventInit<D>): boolean
  • Type Parameters

    • K extends keyof IgcCheckboxEventMap

    • D extends boolean | void

    Parameters

    • type: K
    • Optional eventInitDict: CustomEventInit<D>

    Returns boolean

  • focus(options?: FocusOptions): void
  • reportValidity(): boolean
  • setCustomValidity(message: string): void
  • Sets a custom validation message for the control. As long as message is not empty, the control is considered invalid.

    Parameters

    • message: string

    Returns void