@progress/kendo-angular-inputs 13.1.1-develop.1 → 13.2.0-develop.1

package/esm2020/index.mjs

@@ -22,6 +22,8 @@ export { TextBoxModule } from './textbox.module';
 export { TextAreaModule } from './textarea.module';
 export { CheckBoxModule } from './checkbox.module';
 export { RadioButtonModule } from './radiobutton.module';
+export { SwitchBlurEvent } from './switch/events/blur-event';
+export { SwitchFocusEvent } from './switch/events/focus-event';
 // All ColorPicker Components
 export { ColorPickerComponent } from './colorpicker/colorpicker.component';
 export { ColorPaletteComponent } from './colorpicker/color-palette.component';

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-inputs',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1688384977,
-    version: '13.1.1-develop.1',
+    publishDate: 1688396689,
+    version: '13.2.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/esm2020/switch/events/blur-event.mjs

@@ -0,0 +1,9 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Arguments for the `blur` event of the Switch component.
+ */
+export class SwitchBlurEvent {
+}

package/esm2020/switch/events/focus-event.mjs

@@ -0,0 +1,9 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Arguments for the `focus` event of the Switch component.
+ */
+export class SwitchFocusEvent {
+}

package/esm2020/switch/switch.component.mjs

@@ -9,13 +9,11 @@ import { hasObservers, guid, Keys, KendoInput } from '@progress/kendo-angular-co
 import { validatePackage } from '@progress/kendo-licensing';
 import { packageMetadata } from '../package-metadata';
 import { requiresZoneOnBlur, getStylingClasses } from '../common/utils';
-import { Subscription } from "rxjs";
 import { skip, take } from "rxjs/operators";
 import { browser } from '@progress/kendo-common';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
 import * as i2 from "./localization/localized-switch-messages.directive";
-import * as i3 from "@progress/kendo-angular-common";
 const FOCUSED = 'k-focus';
 const DEFAULT_SIZE = 'medium';
 const DEFAULT_THUMB_ROUNDED = 'full';
@@ -31,10 +29,6 @@ export class SwitchComponent {
         this.injector = injector;
         this.changeDetector = changeDetector;
         this.ngZone = ngZone;
-        /**
-         * @hidden
-         */
-        this.focusableId = `k-${guid()}`;
         /**
          * Determines whether the Switch is disabled ([see example]({% slug disabled_switch %})).
          */
@@ -48,23 +42,24 @@ export class SwitchComponent {
          */
         this.tabindex = 0;
         /**
-         * Fires each time the user focuses the `input` element.
+         * Fires each time the Switch component is focused as a result of user interaction.
          */
         this.onFocus = new EventEmitter();
         /**
-         * Fires each time the `input` element gets blurred.
+         * Fires each time the Switch component is blurred as a result of user interaction.
          */
         this.onBlur = new EventEmitter();
         /**
          * Fires each time the user selects a new value.
          */
         this.valueChange = new EventEmitter();
+        this.hostRole = 'switch';
         this.hostClasses = true;
         /**
          * @hidden
          */
         this.initialized = false;
-        this.hostClickSubscription = new Subscription;
+        this.domSubscriptions = [];
         this._checked = false;
         this._size = 'medium';
         this._trackRounded = 'full';
@@ -74,14 +69,16 @@ export class SwitchComponent {
         /**
          * @hidden
          */
-        this.handleFocus = () => {
+        this.handleFocus = (event) => {
             if (this.isFocused) {
                 return;
             }
+            event.stopImmediatePropagation();
             this.focused = true;
             if (hasObservers(this.onFocus)) {
                 this.ngZone.run(() => {
-                    this.onFocus.emit();
+                    const eventArgs = { originalEvent: event };
+                    this.onFocus.emit(eventArgs);
                 });
             }
         };
@@ -93,12 +90,14 @@ export class SwitchComponent {
             if (this.hostElement.nativeElement.contains(relatedTarget)) {
                 return;
             }
+            event.stopImmediatePropagation();
             this.changeDetector.markForCheck();
             this.focused = false;
             if (hasObservers(this.onBlur) || requiresZoneOnBlur(this.control)) {
                 this.ngZone.run(() => {
                     this.ngTouched();
-                    this.onBlur.emit();
+                    const eventArgs = { originalEvent: event };
+                    this.onBlur.emit(eventArgs);
                 });
             }
         };
@@ -107,6 +106,15 @@ export class SwitchComponent {
         this.keyDownHandler = this.keyDownHandler.bind(this);
         this.clickHandler = this.clickHandler.bind(this);
     }
+    /**
+     * @hidden
+     */
+    get focusableId() {
+        if (this.hostElement.nativeElement.hasAttribute('id')) {
+            return this.hostElement.nativeElement.getAttribute('id');
+        }
+        return `k-${guid()}`;
+    }
     /**
      * Sets the value of the Switch when it is initially displayed.
      */
@@ -182,6 +190,18 @@ export class SwitchComponent {
     get ieClass() {
         return browser && browser.msie;
     }
+    get hostId() {
+        return this.focusableId;
+    }
+    get ariaChecked() {
+        return this.checked;
+    }
+    get ariaInvalid() {
+        return this.isControlInvalid ? true : undefined;
+    }
+    get hostTabIndex() {
+        return this.disabled ? undefined : this.tabIndex;
+    }
     get ariaDisabled() {
         return this.disabled ? true : undefined;
     }
@@ -222,21 +242,22 @@ export class SwitchComponent {
     }
     ngAfterViewInit() {
         const wrapper = this.hostElement.nativeElement;
-        this.attachHostClickHandler();
         if (!this.checked && !wrapper.classList.contains('k-switch-off')) {
             this.renderer.addClass(wrapper, 'k-switch-off');
         }
         this.handleClasses(this.size, 'size');
         this.handleTrackClasses(this.trackRounded);
         this.handleThumbClasses(this.thumbRounded);
+        this.attachHostHandlers();
     }
     ngOnDestroy() {
         if (this.localizationChangeSubscription) {
             this.localizationChangeSubscription.unsubscribe();
         }
-        if (this.hostClickSubscription) {
-            this.hostClickSubscription.unsubscribe();
-        }
+        this.domSubscriptions.forEach(subscription => subscription());
+        const wrapper = this.hostElement.nativeElement;
+        wrapper.removeEventListener('focus', this.handleFocus, true);
+        wrapper.removeEventListener('blur', this.handleBlur, true);
     }
     /**
      * Focuses the Switch.
@@ -254,19 +275,19 @@ export class SwitchComponent {
      * ```
      */
     focus() {
-        if (!this.track) {
+        if (!this.hostElement) {
             return;
         }
-        this.track.nativeElement.focus();
+        this.hostElement.nativeElement.focus();
     }
     /**
      * Blurs the Switch.
      */
     blur() {
-        if (!this.track) {
+        if (!this.hostElement) {
             return;
         }
-        this.track.nativeElement.blur();
+        this.hostElement.nativeElement.blur();
     }
     /**
      * @hidden
@@ -349,9 +370,12 @@ export class SwitchComponent {
             this.isFocused = value;
         }
     }
-    attachHostClickHandler() {
+    attachHostHandlers() {
         this.ngZone.runOutsideAngular(() => {
-            this.hostClickSubscription.add(this.renderer.listen(this.hostElement.nativeElement, 'click', this.clickHandler));
+            const wrapper = this.hostElement.nativeElement;
+            this.domSubscriptions.push(this.renderer.listen(wrapper, 'click', this.clickHandler), this.renderer.listen(wrapper, 'keydown', this.keyDownHandler));
+            wrapper.addEventListener('focus', this.handleFocus, true);
+            wrapper.addEventListener('blur', this.handleBlur, true);
         });
     }
     setHostClasses(value) {
@@ -406,7 +430,7 @@ export class SwitchComponent {
     }
 }
 SwitchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SwitchComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SwitchComponent, selector: "kendo-switch", inputs: { focusableId: "focusableId", onLabel: "onLabel", offLabel: "offLabel", checked: "checked", disabled: "disabled", readonly: "readonly", tabindex: "tabindex", size: "size", thumbRounded: "thumbRounded", trackRounded: "trackRounded", tabIndex: "tabIndex" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "attr.dir": "this.direction", "class.k-ie": "this.ieClass", "attr.aria-disabled": "this.ariaDisabled", "attr.aria-readonly": "this.ariaReadonly", "class.k-switch": "this.hostClasses", "class.k-disabled": "this.disabledClass" } }, providers: [
+SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SwitchComponent, selector: "kendo-switch", inputs: { focusableId: "focusableId", onLabel: "onLabel", offLabel: "offLabel", checked: "checked", disabled: "disabled", readonly: "readonly", tabindex: "tabindex", size: "size", thumbRounded: "thumbRounded", trackRounded: "trackRounded", tabIndex: "tabIndex" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "attr.dir": "this.direction", "class.k-ie": "this.ieClass", "attr.role": "this.hostRole", "attr.id": "this.hostId", "attr.aria-checked": "this.ariaChecked", "attr.aria-invalid": "this.ariaInvalid", "attr.tabindex": "this.hostTabIndex", "attr.aria-disabled": "this.ariaDisabled", "attr.aria-readonly": "this.ariaReadonly", "class.k-switch": "this.hostClasses", "class.k-disabled": "this.disabledClass" } }, providers: [
         LocalizationService,
         { provide: L10N_PREFIX, useValue: 'kendo.switch' },
         {
@@ -429,29 +453,17 @@ SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
         <span
             #track
             class="k-switch-track"
-            [id]="focusableId"
-            role="switch"
             [style.transitionDuration]="initialized ? '200ms' : '0ms'"
-            [attr.aria-checked]="checked"
-            [attr.tabindex]="(disabled ? undefined : tabIndex)"
-            [attr.aria-disabled]="disabled"
-            [attr.aria-invalid]="isControlInvalid"
-            [kendoEventsOutsideAngular]="{ keydown: keyDownHandler, focus: handleFocus, blur: handleBlur }"
         >
             <span class="k-switch-label-on" [attr.aria-hidden]="true" >{{onLabelMessage}}</span>
             <span class="k-switch-label-off" [attr.aria-hidden]="true">{{offLabelMessage}}</span>
         </span>
         <span
             class="k-switch-thumb-wrap"
-            tabindex="-1"
-            [style.transitionDuration]="initialized ? '200ms' : '0ms'" [kendoEventsOutsideAngular]="{
-                keydown: keyDownHandler,
-                focus: handleFocus,
-                blur: handleBlur
-            }">
+            [style.transitionDuration]="initialized ? '200ms' : '0ms'">
             <span #thumb class="k-switch-thumb"></span>
         </span>
-  `, isInline: true, directives: [{ type: i2.LocalizedSwitchMessagesDirective, selector: "[kendoSwitchLocalizedMessages]" }, { type: i3.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
+  `, isInline: true, directives: [{ type: i2.LocalizedSwitchMessagesDirective, selector: "[kendoSwitchLocalizedMessages]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SwitchComponent, decorators: [{
             type: Component,
             args: [{
@@ -481,26 +493,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         <span
             #track
             class="k-switch-track"
-            [id]="focusableId"
-            role="switch"
             [style.transitionDuration]="initialized ? '200ms' : '0ms'"
-            [attr.aria-checked]="checked"
-            [attr.tabindex]="(disabled ? undefined : tabIndex)"
-            [attr.aria-disabled]="disabled"
-            [attr.aria-invalid]="isControlInvalid"
-            [kendoEventsOutsideAngular]="{ keydown: keyDownHandler, focus: handleFocus, blur: handleBlur }"
         >
             <span class="k-switch-label-on" [attr.aria-hidden]="true" >{{onLabelMessage}}</span>
             <span class="k-switch-label-off" [attr.aria-hidden]="true">{{offLabelMessage}}</span>
         </span>
         <span
             class="k-switch-thumb-wrap"
-            tabindex="-1"
-            [style.transitionDuration]="initialized ? '200ms' : '0ms'" [kendoEventsOutsideAngular]="{
-                keydown: keyDownHandler,
-                focus: handleFocus,
-                blur: handleBlur
-            }">
+            [style.transitionDuration]="initialized ? '200ms' : '0ms'">
             <span #thumb class="k-switch-thumb"></span>
         </span>
   `
@@ -541,6 +541,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }], ieClass: [{
                 type: HostBinding,
                 args: ['class.k-ie']
+            }], hostRole: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], hostId: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }], ariaChecked: [{
+                type: HostBinding,
+                args: ['attr.aria-checked']
+            }], ariaInvalid: [{
+                type: HostBinding,
+                args: ['attr.aria-invalid']
+            }], hostTabIndex: [{
+                type: HostBinding,
+                args: ['attr.tabindex']
             }], ariaDisabled: [{
                 type: HostBinding,
                 args: ['attr.aria-disabled']

package/fesm2015/progress-kendo-angular-inputs.mjs

@@ -539,8 +539,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-inputs',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1688384977,
-    version: '13.1.1-develop.1',
+    publishDate: 1688396689,
+    version: '13.2.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -2360,10 +2360,6 @@ class SwitchComponent {
         this.injector = injector;
         this.changeDetector = changeDetector;
         this.ngZone = ngZone;
-        /**
-         * @hidden
-         */
-        this.focusableId = `k-${guid()}`;
         /**
          * Determines whether the Switch is disabled ([see example]({% slug disabled_switch %})).
          */
@@ -2377,23 +2373,24 @@ class SwitchComponent {
          */
         this.tabindex = 0;
         /**
-         * Fires each time the user focuses the `input` element.
+         * Fires each time the Switch component is focused as a result of user interaction.
          */
         this.onFocus = new EventEmitter();
         /**
-         * Fires each time the `input` element gets blurred.
+         * Fires each time the Switch component is blurred as a result of user interaction.
          */
         this.onBlur = new EventEmitter();
         /**
          * Fires each time the user selects a new value.
          */
         this.valueChange = new EventEmitter();
+        this.hostRole = 'switch';
         this.hostClasses = true;
         /**
          * @hidden
          */
         this.initialized = false;
-        this.hostClickSubscription = new Subscription;
+        this.domSubscriptions = [];
         this._checked = false;
         this._size = 'medium';
         this._trackRounded = 'full';
@@ -2403,14 +2400,16 @@ class SwitchComponent {
         /**
          * @hidden
          */
-        this.handleFocus = () => {
+        this.handleFocus = (event) => {
             if (this.isFocused) {
                 return;
             }
+            event.stopImmediatePropagation();
             this.focused = true;
             if (hasObservers(this.onFocus)) {
                 this.ngZone.run(() => {
-                    this.onFocus.emit();
+                    const eventArgs = { originalEvent: event };
+                    this.onFocus.emit(eventArgs);
                 });
             }
         };
@@ -2422,12 +2421,14 @@ class SwitchComponent {
             if (this.hostElement.nativeElement.contains(relatedTarget)) {
                 return;
             }
+            event.stopImmediatePropagation();
             this.changeDetector.markForCheck();
             this.focused = false;
             if (hasObservers(this.onBlur) || requiresZoneOnBlur(this.control)) {
                 this.ngZone.run(() => {
                     this.ngTouched();
-                    this.onBlur.emit();
+                    const eventArgs = { originalEvent: event };
+                    this.onBlur.emit(eventArgs);
                 });
             }
         };
@@ -2436,6 +2437,15 @@ class SwitchComponent {
         this.keyDownHandler = this.keyDownHandler.bind(this);
         this.clickHandler = this.clickHandler.bind(this);
     }
+    /**
+     * @hidden
+     */
+    get focusableId() {
+        if (this.hostElement.nativeElement.hasAttribute('id')) {
+            return this.hostElement.nativeElement.getAttribute('id');
+        }
+        return `k-${guid()}`;
+    }
     /**
      * Sets the value of the Switch when it is initially displayed.
      */
@@ -2511,6 +2521,18 @@ class SwitchComponent {
     get ieClass() {
         return browser && browser.msie;
     }
+    get hostId() {
+        return this.focusableId;
+    }
+    get ariaChecked() {
+        return this.checked;
+    }
+    get ariaInvalid() {
+        return this.isControlInvalid ? true : undefined;
+    }
+    get hostTabIndex() {
+        return this.disabled ? undefined : this.tabIndex;
+    }
     get ariaDisabled() {
         return this.disabled ? true : undefined;
     }
@@ -2551,21 +2573,22 @@ class SwitchComponent {
     }
     ngAfterViewInit() {
         const wrapper = this.hostElement.nativeElement;
-        this.attachHostClickHandler();
         if (!this.checked && !wrapper.classList.contains('k-switch-off')) {
             this.renderer.addClass(wrapper, 'k-switch-off');
         }
         this.handleClasses(this.size, 'size');
         this.handleTrackClasses(this.trackRounded);
         this.handleThumbClasses(this.thumbRounded);
+        this.attachHostHandlers();
     }
     ngOnDestroy() {
         if (this.localizationChangeSubscription) {
             this.localizationChangeSubscription.unsubscribe();
         }
-        if (this.hostClickSubscription) {
-            this.hostClickSubscription.unsubscribe();
-        }
+        this.domSubscriptions.forEach(subscription => subscription());
+        const wrapper = this.hostElement.nativeElement;
+        wrapper.removeEventListener('focus', this.handleFocus, true);
+        wrapper.removeEventListener('blur', this.handleBlur, true);
     }
     /**
      * Focuses the Switch.
@@ -2583,19 +2606,19 @@ class SwitchComponent {
      * ```
      */
     focus() {
-        if (!this.track) {
+        if (!this.hostElement) {
             return;
         }
-        this.track.nativeElement.focus();
+        this.hostElement.nativeElement.focus();
     }
     /**
      * Blurs the Switch.
      */
     blur() {
-        if (!this.track) {
+        if (!this.hostElement) {
             return;
         }
-        this.track.nativeElement.blur();
+        this.hostElement.nativeElement.blur();
     }
     /**
      * @hidden
@@ -2678,9 +2701,12 @@ class SwitchComponent {
             this.isFocused = value;
         }
     }
-    attachHostClickHandler() {
+    attachHostHandlers() {
         this.ngZone.runOutsideAngular(() => {
-            this.hostClickSubscription.add(this.renderer.listen(this.hostElement.nativeElement, 'click', this.clickHandler));
+            const wrapper = this.hostElement.nativeElement;
+            this.domSubscriptions.push(this.renderer.listen(wrapper, 'click', this.clickHandler), this.renderer.listen(wrapper, 'keydown', this.keyDownHandler));
+            wrapper.addEventListener('focus', this.handleFocus, true);
+            wrapper.addEventListener('blur', this.handleBlur, true);
         });
     }
     setHostClasses(value) {
@@ -2737,7 +2763,7 @@ class SwitchComponent {
     }
 }
 SwitchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SwitchComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SwitchComponent, selector: "kendo-switch", inputs: { focusableId: "focusableId", onLabel: "onLabel", offLabel: "offLabel", checked: "checked", disabled: "disabled", readonly: "readonly", tabindex: "tabindex", size: "size", thumbRounded: "thumbRounded", trackRounded: "trackRounded", tabIndex: "tabIndex" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "attr.dir": "this.direction", "class.k-ie": "this.ieClass", "attr.aria-disabled": "this.ariaDisabled", "attr.aria-readonly": "this.ariaReadonly", "class.k-switch": "this.hostClasses", "class.k-disabled": "this.disabledClass" } }, providers: [
+SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SwitchComponent, selector: "kendo-switch", inputs: { focusableId: "focusableId", onLabel: "onLabel", offLabel: "offLabel", checked: "checked", disabled: "disabled", readonly: "readonly", tabindex: "tabindex", size: "size", thumbRounded: "thumbRounded", trackRounded: "trackRounded", tabIndex: "tabIndex" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "attr.dir": "this.direction", "class.k-ie": "this.ieClass", "attr.role": "this.hostRole", "attr.id": "this.hostId", "attr.aria-checked": "this.ariaChecked", "attr.aria-invalid": "this.ariaInvalid", "attr.tabindex": "this.hostTabIndex", "attr.aria-disabled": "this.ariaDisabled", "attr.aria-readonly": "this.ariaReadonly", "class.k-switch": "this.hostClasses", "class.k-disabled": "this.disabledClass" } }, providers: [
         LocalizationService,
         { provide: L10N_PREFIX, useValue: 'kendo.switch' },
         {
@@ -2760,29 +2786,17 @@ SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
         <span
             #track
             class="k-switch-track"
-            [id]="focusableId"
-            role="switch"
             [style.transitionDuration]="initialized ? '200ms' : '0ms'"
-            [attr.aria-checked]="checked"
-            [attr.tabindex]="(disabled ? undefined : tabIndex)"
-            [attr.aria-disabled]="disabled"
-            [attr.aria-invalid]="isControlInvalid"
-            [kendoEventsOutsideAngular]="{ keydown: keyDownHandler, focus: handleFocus, blur: handleBlur }"
         >
             <span class="k-switch-label-on" [attr.aria-hidden]="true" >{{onLabelMessage}}</span>
             <span class="k-switch-label-off" [attr.aria-hidden]="true">{{offLabelMessage}}</span>
         </span>
         <span
             class="k-switch-thumb-wrap"
-            tabindex="-1"
-            [style.transitionDuration]="initialized ? '200ms' : '0ms'" [kendoEventsOutsideAngular]="{
-                keydown: keyDownHandler,
-                focus: handleFocus,
-                blur: handleBlur
-            }">
+            [style.transitionDuration]="initialized ? '200ms' : '0ms'">
             <span #thumb class="k-switch-thumb"></span>
         </span>
-  `, isInline: true, directives: [{ type: LocalizedSwitchMessagesDirective, selector: "[kendoSwitchLocalizedMessages]" }, { type: i3.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
+  `, isInline: true, directives: [{ type: LocalizedSwitchMessagesDirective, selector: "[kendoSwitchLocalizedMessages]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SwitchComponent, decorators: [{
             type: Component,
             args: [{
@@ -2812,26 +2826,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         <span
             #track
             class="k-switch-track"
-            [id]="focusableId"
-            role="switch"
             [style.transitionDuration]="initialized ? '200ms' : '0ms'"
-            [attr.aria-checked]="checked"
-            [attr.tabindex]="(disabled ? undefined : tabIndex)"
-            [attr.aria-disabled]="disabled"
-            [attr.aria-invalid]="isControlInvalid"
-            [kendoEventsOutsideAngular]="{ keydown: keyDownHandler, focus: handleFocus, blur: handleBlur }"
         >
             <span class="k-switch-label-on" [attr.aria-hidden]="true" >{{onLabelMessage}}</span>
             <span class="k-switch-label-off" [attr.aria-hidden]="true">{{offLabelMessage}}</span>
         </span>
         <span
             class="k-switch-thumb-wrap"
-            tabindex="-1"
-            [style.transitionDuration]="initialized ? '200ms' : '0ms'" [kendoEventsOutsideAngular]="{
-                keydown: keyDownHandler,
-                focus: handleFocus,
-                blur: handleBlur
-            }">
+            [style.transitionDuration]="initialized ? '200ms' : '0ms'">
             <span #thumb class="k-switch-thumb"></span>
         </span>
   `
@@ -2872,6 +2874,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }], ieClass: [{
                 type: HostBinding,
                 args: ['class.k-ie']
+            }], hostRole: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], hostId: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }], ariaChecked: [{
+                type: HostBinding,
+                args: ['attr.aria-checked']
+            }], ariaInvalid: [{
+                type: HostBinding,
+                args: ['attr.aria-invalid']
+            }], hostTabIndex: [{
+                type: HostBinding,
+                args: ['attr.tabindex']
             }], ariaDisabled: [{
                 type: HostBinding,
                 args: ['attr.aria-disabled']
@@ -15053,9 +15070,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 }]
         }] });
 
+/**
+ * Arguments for the `blur` event of the Switch component.
+ */
+class SwitchBlurEvent {
+}
+
+/**
+ * Arguments for the `focus` event of the Switch component.
+ */
+class SwitchFocusEvent {
+}
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ActiveColorClickEvent, CheckBoxDirective, CheckBoxModule, ColorGradientComponent, ColorPaletteComponent, ColorPickerCancelEvent, ColorPickerCloseEvent, ColorPickerComponent, ColorPickerCustomMessagesComponent, ColorPickerModule, ColorPickerOpenEvent, ErrorComponent, FlatColorPickerComponent, FormFieldComponent, FormFieldModule, HintComponent, InputSeparatorComponent, InputsModule, LabelTemplateDirective, LocalizedColorPickerMessagesDirective, LocalizedNumericTextBoxMessagesDirective, LocalizedRangeSliderMessagesDirective, LocalizedSignatureMessagesDirective, LocalizedSliderMessagesDirective, LocalizedSwitchMessagesDirective, LocalizedTextBoxMessagesDirective, MaskedTextBoxComponent, MaskedTextBoxModule, NumericLabelDirective, NumericTextBoxComponent, NumericTextBoxCustomMessagesComponent, NumericTextBoxModule, RadioButtonDirective, RadioButtonModule, RangeSliderComponent, RangeSliderCustomMessagesComponent, RangeSliderModule, SharedModule, SignatureCloseEvent, SignatureComponent, SignatureCustomMessagesComponent, SignatureMessages, SignatureModule, SignatureOpenEvent, SliderComponent, SliderCustomMessagesComponent, SliderModule, SliderTicksComponent, SwitchComponent, SwitchCustomMessagesComponent, SwitchModule, TextAreaComponent, TextAreaDirective, TextAreaModule, TextAreaSuffixComponent, TextBoxComponent, TextBoxCustomMessagesComponent, TextBoxDirective, TextBoxModule, TextBoxPrefixTemplateDirective, TextBoxSuffixTemplateDirective };
+export { ActiveColorClickEvent, CheckBoxDirective, CheckBoxModule, ColorGradientComponent, ColorPaletteComponent, ColorPickerCancelEvent, ColorPickerCloseEvent, ColorPickerComponent, ColorPickerCustomMessagesComponent, ColorPickerModule, ColorPickerOpenEvent, ErrorComponent, FlatColorPickerComponent, FormFieldComponent, FormFieldModule, HintComponent, InputSeparatorComponent, InputsModule, LabelTemplateDirective, LocalizedColorPickerMessagesDirective, LocalizedNumericTextBoxMessagesDirective, LocalizedRangeSliderMessagesDirective, LocalizedSignatureMessagesDirective, LocalizedSliderMessagesDirective, LocalizedSwitchMessagesDirective, LocalizedTextBoxMessagesDirective, MaskedTextBoxComponent, MaskedTextBoxModule, NumericLabelDirective, NumericTextBoxComponent, NumericTextBoxCustomMessagesComponent, NumericTextBoxModule, RadioButtonDirective, RadioButtonModule, RangeSliderComponent, RangeSliderCustomMessagesComponent, RangeSliderModule, SharedModule, SignatureCloseEvent, SignatureComponent, SignatureCustomMessagesComponent, SignatureMessages, SignatureModule, SignatureOpenEvent, SliderComponent, SliderCustomMessagesComponent, SliderModule, SliderTicksComponent, SwitchBlurEvent, SwitchComponent, SwitchCustomMessagesComponent, SwitchFocusEvent, SwitchModule, TextAreaComponent, TextAreaDirective, TextAreaModule, TextAreaSuffixComponent, TextBoxComponent, TextBoxCustomMessagesComponent, TextBoxDirective, TextBoxModule, TextBoxPrefixTemplateDirective, TextBoxSuffixTemplateDirective };
 

package/fesm2020/progress-kendo-angular-inputs.mjs

@@ -538,8 +538,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-inputs',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1688384977,
-    version: '13.1.1-develop.1',
+    publishDate: 1688396689,
+    version: '13.2.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -2357,10 +2357,6 @@ class SwitchComponent {
         this.injector = injector;
         this.changeDetector = changeDetector;
         this.ngZone = ngZone;
-        /**
-         * @hidden
-         */
-        this.focusableId = `k-${guid()}`;
         /**
          * Determines whether the Switch is disabled ([see example]({% slug disabled_switch %})).
          */
@@ -2374,23 +2370,24 @@ class SwitchComponent {
          */
         this.tabindex = 0;
         /**
-         * Fires each time the user focuses the `input` element.
+         * Fires each time the Switch component is focused as a result of user interaction.
          */
         this.onFocus = new EventEmitter();
         /**
-         * Fires each time the `input` element gets blurred.
+         * Fires each time the Switch component is blurred as a result of user interaction.
          */
         this.onBlur = new EventEmitter();
         /**
          * Fires each time the user selects a new value.
          */
         this.valueChange = new EventEmitter();
+        this.hostRole = 'switch';
         this.hostClasses = true;
         /**
          * @hidden
          */
         this.initialized = false;
-        this.hostClickSubscription = new Subscription;
+        this.domSubscriptions = [];
         this._checked = false;
         this._size = 'medium';
         this._trackRounded = 'full';
@@ -2400,14 +2397,16 @@ class SwitchComponent {
         /**
          * @hidden
          */
-        this.handleFocus = () => {
+        this.handleFocus = (event) => {
             if (this.isFocused) {
                 return;
             }
+            event.stopImmediatePropagation();
             this.focused = true;
             if (hasObservers(this.onFocus)) {
                 this.ngZone.run(() => {
-                    this.onFocus.emit();
+                    const eventArgs = { originalEvent: event };
+                    this.onFocus.emit(eventArgs);
                 });
             }
         };
@@ -2419,12 +2418,14 @@ class SwitchComponent {
             if (this.hostElement.nativeElement.contains(relatedTarget)) {
                 return;
             }
+            event.stopImmediatePropagation();
             this.changeDetector.markForCheck();
             this.focused = false;
             if (hasObservers(this.onBlur) || requiresZoneOnBlur(this.control)) {
                 this.ngZone.run(() => {
                     this.ngTouched();
-                    this.onBlur.emit();
+                    const eventArgs = { originalEvent: event };
+                    this.onBlur.emit(eventArgs);
                 });
             }
         };
@@ -2433,6 +2434,15 @@ class SwitchComponent {
         this.keyDownHandler = this.keyDownHandler.bind(this);
         this.clickHandler = this.clickHandler.bind(this);
     }
+    /**
+     * @hidden
+     */
+    get focusableId() {
+        if (this.hostElement.nativeElement.hasAttribute('id')) {
+            return this.hostElement.nativeElement.getAttribute('id');
+        }
+        return `k-${guid()}`;
+    }
     /**
      * Sets the value of the Switch when it is initially displayed.
      */
@@ -2508,6 +2518,18 @@ class SwitchComponent {
     get ieClass() {
         return browser && browser.msie;
     }
+    get hostId() {
+        return this.focusableId;
+    }
+    get ariaChecked() {
+        return this.checked;
+    }
+    get ariaInvalid() {
+        return this.isControlInvalid ? true : undefined;
+    }
+    get hostTabIndex() {
+        return this.disabled ? undefined : this.tabIndex;
+    }
     get ariaDisabled() {
         return this.disabled ? true : undefined;
     }
@@ -2548,21 +2570,22 @@ class SwitchComponent {
     }
     ngAfterViewInit() {
         const wrapper = this.hostElement.nativeElement;
-        this.attachHostClickHandler();
         if (!this.checked && !wrapper.classList.contains('k-switch-off')) {
             this.renderer.addClass(wrapper, 'k-switch-off');
         }
         this.handleClasses(this.size, 'size');
         this.handleTrackClasses(this.trackRounded);
         this.handleThumbClasses(this.thumbRounded);
+        this.attachHostHandlers();
     }
     ngOnDestroy() {
         if (this.localizationChangeSubscription) {
             this.localizationChangeSubscription.unsubscribe();
         }
-        if (this.hostClickSubscription) {
-            this.hostClickSubscription.unsubscribe();
-        }
+        this.domSubscriptions.forEach(subscription => subscription());
+        const wrapper = this.hostElement.nativeElement;
+        wrapper.removeEventListener('focus', this.handleFocus, true);
+        wrapper.removeEventListener('blur', this.handleBlur, true);
     }
     /**
      * Focuses the Switch.
@@ -2580,19 +2603,19 @@ class SwitchComponent {
      * ```
      */
     focus() {
-        if (!this.track) {
+        if (!this.hostElement) {
             return;
         }
-        this.track.nativeElement.focus();
+        this.hostElement.nativeElement.focus();
     }
     /**
      * Blurs the Switch.
      */
     blur() {
-        if (!this.track) {
+        if (!this.hostElement) {
             return;
         }
-        this.track.nativeElement.blur();
+        this.hostElement.nativeElement.blur();
     }
     /**
      * @hidden
@@ -2675,9 +2698,12 @@ class SwitchComponent {
             this.isFocused = value;
         }
     }
-    attachHostClickHandler() {
+    attachHostHandlers() {
         this.ngZone.runOutsideAngular(() => {
-            this.hostClickSubscription.add(this.renderer.listen(this.hostElement.nativeElement, 'click', this.clickHandler));
+            const wrapper = this.hostElement.nativeElement;
+            this.domSubscriptions.push(this.renderer.listen(wrapper, 'click', this.clickHandler), this.renderer.listen(wrapper, 'keydown', this.keyDownHandler));
+            wrapper.addEventListener('focus', this.handleFocus, true);
+            wrapper.addEventListener('blur', this.handleBlur, true);
         });
     }
     setHostClasses(value) {
@@ -2732,7 +2758,7 @@ class SwitchComponent {
     }
 }
 SwitchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SwitchComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SwitchComponent, selector: "kendo-switch", inputs: { focusableId: "focusableId", onLabel: "onLabel", offLabel: "offLabel", checked: "checked", disabled: "disabled", readonly: "readonly", tabindex: "tabindex", size: "size", thumbRounded: "thumbRounded", trackRounded: "trackRounded", tabIndex: "tabIndex" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "attr.dir": "this.direction", "class.k-ie": "this.ieClass", "attr.aria-disabled": "this.ariaDisabled", "attr.aria-readonly": "this.ariaReadonly", "class.k-switch": "this.hostClasses", "class.k-disabled": "this.disabledClass" } }, providers: [
+SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: SwitchComponent, selector: "kendo-switch", inputs: { focusableId: "focusableId", onLabel: "onLabel", offLabel: "offLabel", checked: "checked", disabled: "disabled", readonly: "readonly", tabindex: "tabindex", size: "size", thumbRounded: "thumbRounded", trackRounded: "trackRounded", tabIndex: "tabIndex" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "attr.dir": "this.direction", "class.k-ie": "this.ieClass", "attr.role": "this.hostRole", "attr.id": "this.hostId", "attr.aria-checked": "this.ariaChecked", "attr.aria-invalid": "this.ariaInvalid", "attr.tabindex": "this.hostTabIndex", "attr.aria-disabled": "this.ariaDisabled", "attr.aria-readonly": "this.ariaReadonly", "class.k-switch": "this.hostClasses", "class.k-disabled": "this.disabledClass" } }, providers: [
         LocalizationService,
         { provide: L10N_PREFIX, useValue: 'kendo.switch' },
         {
@@ -2755,29 +2781,17 @@ SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
         <span
             #track
             class="k-switch-track"
-            [id]="focusableId"
-            role="switch"
             [style.transitionDuration]="initialized ? '200ms' : '0ms'"
-            [attr.aria-checked]="checked"
-            [attr.tabindex]="(disabled ? undefined : tabIndex)"
-            [attr.aria-disabled]="disabled"
-            [attr.aria-invalid]="isControlInvalid"
-            [kendoEventsOutsideAngular]="{ keydown: keyDownHandler, focus: handleFocus, blur: handleBlur }"
         >
             <span class="k-switch-label-on" [attr.aria-hidden]="true" >{{onLabelMessage}}</span>
             <span class="k-switch-label-off" [attr.aria-hidden]="true">{{offLabelMessage}}</span>
         </span>
         <span
             class="k-switch-thumb-wrap"
-            tabindex="-1"
-            [style.transitionDuration]="initialized ? '200ms' : '0ms'" [kendoEventsOutsideAngular]="{
-                keydown: keyDownHandler,
-                focus: handleFocus,
-                blur: handleBlur
-            }">
+            [style.transitionDuration]="initialized ? '200ms' : '0ms'">
             <span #thumb class="k-switch-thumb"></span>
         </span>
-  `, isInline: true, directives: [{ type: LocalizedSwitchMessagesDirective, selector: "[kendoSwitchLocalizedMessages]" }, { type: i3.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
+  `, isInline: true, directives: [{ type: LocalizedSwitchMessagesDirective, selector: "[kendoSwitchLocalizedMessages]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SwitchComponent, decorators: [{
             type: Component,
             args: [{
@@ -2807,26 +2821,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         <span
             #track
             class="k-switch-track"
-            [id]="focusableId"
-            role="switch"
             [style.transitionDuration]="initialized ? '200ms' : '0ms'"
-            [attr.aria-checked]="checked"
-            [attr.tabindex]="(disabled ? undefined : tabIndex)"
-            [attr.aria-disabled]="disabled"
-            [attr.aria-invalid]="isControlInvalid"
-            [kendoEventsOutsideAngular]="{ keydown: keyDownHandler, focus: handleFocus, blur: handleBlur }"
         >
             <span class="k-switch-label-on" [attr.aria-hidden]="true" >{{onLabelMessage}}</span>
             <span class="k-switch-label-off" [attr.aria-hidden]="true">{{offLabelMessage}}</span>
         </span>
         <span
             class="k-switch-thumb-wrap"
-            tabindex="-1"
-            [style.transitionDuration]="initialized ? '200ms' : '0ms'" [kendoEventsOutsideAngular]="{
-                keydown: keyDownHandler,
-                focus: handleFocus,
-                blur: handleBlur
-            }">
+            [style.transitionDuration]="initialized ? '200ms' : '0ms'">
             <span #thumb class="k-switch-thumb"></span>
         </span>
   `
@@ -2867,6 +2869,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }], ieClass: [{
                 type: HostBinding,
                 args: ['class.k-ie']
+            }], hostRole: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], hostId: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }], ariaChecked: [{
+                type: HostBinding,
+                args: ['attr.aria-checked']
+            }], ariaInvalid: [{
+                type: HostBinding,
+                args: ['attr.aria-invalid']
+            }], hostTabIndex: [{
+                type: HostBinding,
+                args: ['attr.tabindex']
             }], ariaDisabled: [{
                 type: HostBinding,
                 args: ['attr.aria-disabled']
@@ -15018,9 +15035,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 }]
         }] });
 
+/**
+ * Arguments for the `blur` event of the Switch component.
+ */
+class SwitchBlurEvent {
+}
+
+/**
+ * Arguments for the `focus` event of the Switch component.
+ */
+class SwitchFocusEvent {
+}
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ActiveColorClickEvent, CheckBoxDirective, CheckBoxModule, ColorGradientComponent, ColorPaletteComponent, ColorPickerCancelEvent, ColorPickerCloseEvent, ColorPickerComponent, ColorPickerCustomMessagesComponent, ColorPickerModule, ColorPickerOpenEvent, ErrorComponent, FlatColorPickerComponent, FormFieldComponent, FormFieldModule, HintComponent, InputSeparatorComponent, InputsModule, LabelTemplateDirective, LocalizedColorPickerMessagesDirective, LocalizedNumericTextBoxMessagesDirective, LocalizedRangeSliderMessagesDirective, LocalizedSignatureMessagesDirective, LocalizedSliderMessagesDirective, LocalizedSwitchMessagesDirective, LocalizedTextBoxMessagesDirective, MaskedTextBoxComponent, MaskedTextBoxModule, NumericLabelDirective, NumericTextBoxComponent, NumericTextBoxCustomMessagesComponent, NumericTextBoxModule, RadioButtonDirective, RadioButtonModule, RangeSliderComponent, RangeSliderCustomMessagesComponent, RangeSliderModule, SharedModule, SignatureCloseEvent, SignatureComponent, SignatureCustomMessagesComponent, SignatureMessages, SignatureModule, SignatureOpenEvent, SliderComponent, SliderCustomMessagesComponent, SliderModule, SliderTicksComponent, SwitchComponent, SwitchCustomMessagesComponent, SwitchModule, TextAreaComponent, TextAreaDirective, TextAreaModule, TextAreaSuffixComponent, TextBoxComponent, TextBoxCustomMessagesComponent, TextBoxDirective, TextBoxModule, TextBoxPrefixTemplateDirective, TextBoxSuffixTemplateDirective };
+export { ActiveColorClickEvent, CheckBoxDirective, CheckBoxModule, ColorGradientComponent, ColorPaletteComponent, ColorPickerCancelEvent, ColorPickerCloseEvent, ColorPickerComponent, ColorPickerCustomMessagesComponent, ColorPickerModule, ColorPickerOpenEvent, ErrorComponent, FlatColorPickerComponent, FormFieldComponent, FormFieldModule, HintComponent, InputSeparatorComponent, InputsModule, LabelTemplateDirective, LocalizedColorPickerMessagesDirective, LocalizedNumericTextBoxMessagesDirective, LocalizedRangeSliderMessagesDirective, LocalizedSignatureMessagesDirective, LocalizedSliderMessagesDirective, LocalizedSwitchMessagesDirective, LocalizedTextBoxMessagesDirective, MaskedTextBoxComponent, MaskedTextBoxModule, NumericLabelDirective, NumericTextBoxComponent, NumericTextBoxCustomMessagesComponent, NumericTextBoxModule, RadioButtonDirective, RadioButtonModule, RangeSliderComponent, RangeSliderCustomMessagesComponent, RangeSliderModule, SharedModule, SignatureCloseEvent, SignatureComponent, SignatureCustomMessagesComponent, SignatureMessages, SignatureModule, SignatureOpenEvent, SliderComponent, SliderCustomMessagesComponent, SliderModule, SliderTicksComponent, SwitchBlurEvent, SwitchComponent, SwitchCustomMessagesComponent, SwitchFocusEvent, SwitchModule, TextAreaComponent, TextAreaDirective, TextAreaModule, TextAreaSuffixComponent, TextBoxComponent, TextBoxCustomMessagesComponent, TextBoxDirective, TextBoxModule, TextBoxPrefixTemplateDirective, TextBoxSuffixTemplateDirective };
 

package/index.d.ts

@@ -23,6 +23,8 @@ export { TextBoxModule } from './textbox.module';
 export { TextAreaModule } from './textarea.module';
 export { CheckBoxModule } from './checkbox.module';
 export { RadioButtonModule } from './radiobutton.module';
+export { SwitchBlurEvent } from './switch/events/blur-event';
+export { SwitchFocusEvent } from './switch/events/focus-event';
 export { InputRounded, CheckBoxRounded, InputFillMode, InputSize } from './common/models';
 export { ColorPickerComponent } from './colorpicker/colorpicker.component';
 export { ColorPaletteComponent } from './colorpicker/color-palette.component';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-inputs",
-  "version": "13.1.1-develop.1",
+  "version": "13.2.0-develop.1",
   "description": "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, TextArea, and TextBox Components)",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -33,19 +33,19 @@
     "@angular/platform-browser": "13 - 16",
     "@progress/kendo-drawing": "^1.17.2",
     "@progress/kendo-licensing": "^1.0.2",
-    "@progress/kendo-angular-buttons": "13.1.1-develop.1",
-    "@progress/kendo-angular-common": "13.1.1-develop.1",
-    "@progress/kendo-angular-dialog": "13.1.1-develop.1",
-    "@progress/kendo-angular-intl": "13.1.1-develop.1",
-    "@progress/kendo-angular-l10n": "13.1.1-develop.1",
-    "@progress/kendo-angular-popup": "13.1.1-develop.1",
-    "@progress/kendo-angular-icons": "13.1.1-develop.1",
+    "@progress/kendo-angular-buttons": "13.2.0-develop.1",
+    "@progress/kendo-angular-common": "13.2.0-develop.1",
+    "@progress/kendo-angular-dialog": "13.2.0-develop.1",
+    "@progress/kendo-angular-intl": "13.2.0-develop.1",
+    "@progress/kendo-angular-l10n": "13.2.0-develop.1",
+    "@progress/kendo-angular-popup": "13.2.0-develop.1",
+    "@progress/kendo-angular-icons": "13.2.0-develop.1",
     "rxjs": "^6.5.3 || ^7.0.0",
-    "@progress/kendo-angular-upload": "13.1.1-develop.1"
+    "@progress/kendo-angular-upload": "13.2.0-develop.1"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "13.1.1-develop.1",
+    "@progress/kendo-angular-schematics": "13.2.0-develop.1",
     "@progress/kendo-common": "^0.2.2",
     "@progress/kendo-draggable": "^3.0.0",
     "@progress/kendo-inputs-common": "^3.1.0"

package/switch/events/blur-event.d.ts

@@ -0,0 +1,13 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Arguments for the `blur` event of the Switch component.
+ */
+export declare class SwitchBlurEvent {
+    /**
+     * The original DOM [`blur`](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event) event.
+     */
+    originalEvent: FocusEvent;
+}

package/switch/events/focus-event.d.ts

@@ -0,0 +1,13 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Arguments for the `focus` event of the Switch component.
+ */
+export declare class SwitchFocusEvent {
+    /**
+     * The original DOM [`focus`](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event) event.
+     */
+    originalEvent: FocusEvent;
+}

package/switch/switch.component.d.ts

@@ -7,6 +7,8 @@ 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 %}).
@@ -21,7 +23,7 @@ export declare class SwitchComponent implements ControlValueAccessor, OnInit, On
     /**
      * @hidden
      */
-    focusableId: string;
+    get focusableId(): string;
     /**
      * Changes the **On** label so that it can be localized ([see example]({% slug labels_switch %})).
      */
@@ -88,19 +90,24 @@ export declare class SwitchComponent implements ControlValueAccessor, OnInit, On
     set tabIndex(tabIndex: number);
     get tabIndex(): number;
     /**
-     * Fires each time the user focuses the `input` element.
+     * Fires each time the Switch component is focused as a result of user interaction.
      */
-    onFocus: EventEmitter<any>;
+    onFocus: EventEmitter<SwitchFocusEvent>;
     /**
-     * Fires each time the `input` element gets blurred.
+     * Fires each time the Switch component is blurred as a result of user interaction.
      */
-    onBlur: EventEmitter<any>;
+    onBlur: EventEmitter<SwitchBlurEvent>;
     /**
      * Fires each time the user selects a new value.
      */
     valueChange: EventEmitter<any>;
     direction: string;
     get ieClass(): boolean;
+    hostRole: string;
+    get hostId(): string;
+    get ariaChecked(): boolean;
+    get ariaInvalid(): boolean;
+    get hostTabIndex(): number;
     get ariaDisabled(): boolean;
     get ariaReadonly(): boolean;
     hostClasses: boolean;
@@ -114,7 +121,7 @@ export declare class SwitchComponent implements ControlValueAccessor, OnInit, On
     protected localizationChangeSubscription: Subscription;
     protected isFocused: boolean;
     protected control: NgControl;
-    private hostClickSubscription;
+    private domSubscriptions;
     private _checked;
     private _size;
     private _trackRounded;
@@ -163,11 +170,11 @@ export declare class SwitchComponent implements ControlValueAccessor, OnInit, On
     /**
      * @hidden
      */
-    handleFocus: () => void;
+    handleFocus: (event: FocusEvent) => void;
     /**
      * @hidden
      */
-    handleBlur: (event: any) => void;
+    handleBlur: (event: FocusEvent) => void;
     /**
      * @hidden
      */
@@ -199,7 +206,7 @@ export declare class SwitchComponent implements ControlValueAccessor, OnInit, On
     isEmpty(): boolean;
     private changeValue;
     private set focused(value);
-    private attachHostClickHandler;
+    private attachHostHandlers;
     private setHostClasses;
     private handleClasses;
     private handleTrackClasses;