@progress/kendo-angular-inputs
Version:
Kendo UI for Angular Inputs Package - Everything you need to build professional form functionality (Checkbox, ColorGradient, ColorPalette, ColorPicker, FlatColorPicker, FormField, MaskedTextBox, NumericTextBox, RadioButton, RangeSlider, Slider, Switch, Te
209 lines (208 loc) • 6.95 kB
TypeScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { ElementRef, Renderer2, EventEmitter, OnInit, OnDestroy, ChangeDetectorRef, NgZone, Injector, AfterViewInit } from '@angular/core';
import { ControlValueAccessor, NgControl } from '@angular/forms';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { Subscription } from "rxjs";
import { InputRounded, InputSize } from '../common/models';
import { SwitchFocusEvent } from './events/focus-event';
import { SwitchBlurEvent } from './events/blur-event';
import * as i0 from "@angular/core";
/**
* Represents the [Kendo UI Switch component for Angular]({% slug overview_switch %}).
*
* @example
* ```html
* <kendo-switch [(ngModel)]="checked"></kendo-switch>`
* ```
*
* @remarks
* Supported children components are: {@link SwitchCustomMessagesComponent}.
*/
export declare class SwitchComponent implements ControlValueAccessor, OnInit, OnDestroy, AfterViewInit {
private renderer;
private hostElement;
private localizationService;
private injector;
private changeDetector;
private ngZone;
/**
* @hidden
*/
get focusableId(): string;
/**
* Set the **On** label.
* This label takes precedence over the [custom messages component]({% slug api_inputs_switchcustommessagescomponent %}).
* [See example]({% slug labels_switch %}).
*/
onLabel: string;
/**
* Set the **Off** label.
* This label takes precedence over the [custom messages component]({% slug api_inputs_switchcustommessagescomponent %}).
* [See example]({% slug labels_switch %}).
*/
offLabel: string;
/**
* Sets the value of the Switch when it first appears.
*/
set checked(value: boolean);
get checked(): boolean;
/**
* When `true`, disables the Switch.
* [See example]({% slug disabled_switch %}).
* To disable the component in reactive forms, see [Forms Support](slug:formssupport_switch#toc-managing-the-switch-disabled-state-in-reactive-forms).
* @default false
*/
disabled: boolean;
/**
* When `true`, sets the Switch to read-only.
* [See example]({% slug readonly_switch %}).
* @default false
*/
readonly: boolean;
/**
* Set the [`tabindex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the Switch.
* @default 0
*/
tabindex: number;
/**
* Sets the size of the Switch.
*
* @default "medium"
*/
set size(size: InputSize);
get size(): InputSize;
/**
* Sets the border radius of the Switch.
*
* @default "full"
*/
set thumbRounded(thumbRounded: InputRounded);
get thumbRounded(): InputRounded;
/**
* Sets the border radius of the Switch track.
*
* @default "full"
*/
set trackRounded(trackRounded: InputRounded);
get trackRounded(): InputRounded;
/**
* @hidden
*/
set tabIndex(tabIndex: number);
get tabIndex(): number;
/**
* Fires when the user focuses the Switch.
*/
onFocus: EventEmitter<SwitchFocusEvent>;
/**
* Fires when the user blurs the Switch.
*/
onBlur: EventEmitter<SwitchBlurEvent>;
/**
* Fires when the value of the Switch changes.
*/
valueChange: EventEmitter<any>;
direction: string;
hostRole: string;
get hostId(): string;
get ariaChecked(): boolean;
get ariaInvalid(): boolean;
get hostTabIndex(): number;
get ariaDisabled(): boolean;
get ariaReadonly(): boolean;
hostClasses: boolean;
get disabledClass(): boolean;
track: any;
thumb: any;
/**
* @hidden
*/
initialized: boolean;
protected localizationChangeSubscription: Subscription;
protected isFocused: boolean;
protected control: NgControl;
private domSubscriptions;
private _checked;
private _size;
private _trackRounded;
private _thumbRounded;
constructor(renderer: Renderer2, hostElement: ElementRef, localizationService: LocalizationService, injector: Injector, changeDetector: ChangeDetectorRef, ngZone: NgZone);
/**
* @hidden
*/
get onLabelMessage(): string;
/**
* @hidden
*/
get offLabelMessage(): string;
protected ngChange: Function;
protected ngTouched: Function;
protected get isEnabled(): boolean;
ngOnInit(): void;
ngAfterViewInit(): void;
ngOnDestroy(): void;
/**
* Focuses the Switch.
*
*/
focus(): void;
/**
* Blurs the Switch.
*/
blur(): void;
/**
* @hidden
* Called when the status of the component changes to or from `disabled`.
* Depending on the value, it enables or disables the appropriate DOM element.
*/
setDisabledState(isDisabled: boolean): void;
/**
* @hidden
*/
handleFocus: (event: FocusEvent) => void;
/**
* @hidden
*/
handleBlur: (event: FocusEvent) => void;
/**
* @hidden
*/
get isControlInvalid(): boolean;
/**
* @hidden
*/
writeValue(value: boolean): void;
/**
* @hidden
*/
registerOnChange(fn: () => any): void;
/**
* @hidden
*/
registerOnTouched(fn: () => any): void;
/**
* @hidden
*/
keyDownHandler(e: any): void;
/**
* @hidden
*/
clickHandler(): void;
/**
* @hidden
* Used by the FloatingLabel to determine if the component is empty.
*/
isEmpty(): boolean;
private changeValue;
private set focused(value);
private attachHostHandlers;
private setHostClasses;
private handleClasses;
private handleTrackClasses;
private handleThumbClasses;
static ɵfac: i0.ɵɵFactoryDeclaration<SwitchComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<SwitchComponent, "kendo-switch", ["kendoSwitch"], { "focusableId": { "alias": "focusableId"; "required": false; }; "onLabel": { "alias": "onLabel"; "required": false; }; "offLabel": { "alias": "offLabel"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "size": { "alias": "size"; "required": false; }; "thumbRounded": { "alias": "thumbRounded"; "required": false; }; "trackRounded": { "alias": "trackRounded"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "onFocus": "focus"; "onBlur": "blur"; "valueChange": "valueChange"; }, never, never, true, never>;
}