### File

`packages/components/eui-slide-toggle/eui-slide-toggle.component.ts`

### Description

Slide toggle component that can be used as a standalone toggle or within reactive forms. Supports custom icons for on/off states and various size/variant options through BaseStatesDirective.

### Implements

`ControlValueAccessor`

### Metadata

changeDetection | `ChangeDetectionStrategy.OnPush`
HostDirectives | `BaseStatesDirective` Inputs : euiPrimary euiSecondary euiInfo euiWarning euiSuccess euiDanger euiAccent euiVariant euiSizeS euiSizeM euiSizeL euiSizeXL euiSizeVariant
selector | `eui-slide-toggle`
imports | `ReactiveFormsModule` `EUI_ICON`
templateUrl | `./eui-slide-toggle.component.html`
styleUrl | `./eui-slide-toggle.scss`

### Index

###### Properties
Public checkboxControl
###### Methods
Public onFocusOut Public registerOnChange Public registerOnTouched Public setDisabledState Public toggle Public writeValue
###### Inputs
disabled iconSvgFillColorOff iconSvgFillColorOn iconSvgNameOff iconSvgNameOn id isChecked
###### Outputs
slideToggleChange
###### HostBindings
class
###### Accessors
cssClasses

### Constructor

`constructor()`

### Inputs

disabled
Type : `boolean`
Default value : `false`
Whether the toggle is disabled

iconSvgFillColorOff
Type : `string`
Default value : `'neutral'`
Fill color for the OFF state icon

iconSvgFillColorOn
Type : `string`
Default value : `'neutral'`
Fill color for the ON state icon

iconSvgNameOff
Type : `string`
Name of the icon to display when toggle is OFF

iconSvgNameOn
Type : `string`
Name of the icon to display when toggle is ON

id
Type : `string`
Default value : ``eui-slide-toggle-${uniqueId()}``
Unique identifier for the toggle

isChecked
Type : `boolean`
Default value : `false`
Current checked state of the toggle

### Outputs

slideToggleChange
Type : `EventEmitter`
Event emitted when toggle state changes

### HostBindings

class
Type : `string`
CSS classes applied to the host element

### Methods

Public onFocusOut
`onFocusOut()`
Handles focus out event Notifies form control of touch event Returns : `void`

Public registerOnChange
`registerOnChange(fn: any)`
Implements ControlValueAccessor Registers change handler Parameters :
Name | Type | Optional
fn | `any` | No
Returns : `void`

Public registerOnTouched
`registerOnTouched(fn: any)`
Implements ControlValueAccessor Registers touch handler Parameters :
Name | Type | Optional
fn | `any` | No
Returns : `void`

Public setDisabledState
`setDisabledState(isDisabled: boolean)`
Implements ControlValueAccessor Updates the toggle's disabled state Parameters :
Name | Type | Optional
isDisabled | `boolean` | No
Returns : `void`

Public toggle
`toggle()`
Toggles the current state if not disabled Emits the new state and notifies form control Returns : `void`

Public writeValue
`writeValue(value: boolean)`
Implements ControlValueAccessor Updates the toggle's checked state Parameters :
Name | Type | Optional
value | `boolean` | No
Returns : `void`

### Properties

Public checkboxControl
Default value : `new FormControl()`
Form control for the toggle when used in reactive forms

### Accessors

cssClasses
get `cssClasses()`
CSS classes applied to the host element Returns : `string`

# results matching ""

# No results matching ""