@progress/kendo-angular-inputs 24.2.0-develop.1 → 24.2.0-develop.11

package/checkbox/checkbox.directive.d.ts

@@ -17,7 +17,6 @@ import * as i0 from "@angular/core";
 export declare class CheckBoxDirective {
     private renderer;
     private hostElement;
-    kendoClass: boolean;
     get isDisabled(): boolean;
     /**
      * Sets the `size` property to specify the width and height of the CheckBox

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

@@ -583,8 +583,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1781868407,
-    version: '24.2.0-develop.1',
+    publishDate: 1782467418,
+    version: '24.2.0-develop.11',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -3107,7 +3107,6 @@ class TextBoxDirective {
     renderer;
     inputElement;
     ngZone;
-    hostClasses = true;
     /**
      * @hidden
      */
@@ -3155,6 +3154,8 @@ class TextBoxDirective {
         this.renderer = renderer;
         this.inputElement = inputElement;
         this.ngZone = ngZone;
+        this.renderer.addClass(this.inputElement.nativeElement, 'k-input');
+        this.renderer.addClass(this.inputElement.nativeElement, 'k-textbox');
     }
     ngAfterViewInit() {
         const input = this.inputElement.nativeElement;
@@ -3177,7 +3178,7 @@ class TextBoxDirective {
         this.listeners.forEach(listener => listener());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TextBoxDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: TextBoxDirective, isStandalone: true, selector: "input[kendoTextBox]", inputs: { value: "value" }, host: { properties: { "class.k-textbox": "this.hostClasses", "class.k-input": "this.hostClasses" } }, providers: [{
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: TextBoxDirective, isStandalone: true, selector: "input[kendoTextBox]", inputs: { value: "value" }, providers: [{
                 provide: KendoInput,
                 useExisting: forwardRef(() => TextBoxDirective)
             }], ngImport: i0 });
@@ -3192,13 +3193,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                         }],
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-textbox']
-            }, {
-                type: HostBinding,
-                args: ['class.k-input']
-            }], value: [{
+        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { value: [{
                 type: Input
             }] } });
 
@@ -3216,7 +3211,6 @@ class TextAreaDirective {
     zone;
     changeDetector;
     injector;
-    elementClasses = true;
     autofillClass = true;
     direction;
     /**
@@ -3273,6 +3267,8 @@ class TextAreaDirective {
         this.changeDetector = changeDetector;
         this.injector = injector;
         this.direction = rtl ? 'rtl' : 'ltr';
+        this.renderer.addClass(this.element.nativeElement, 'k-input');
+        this.renderer.addClass(this.element.nativeElement, 'k-textarea');
     }
     /**
      * @hidden
@@ -3422,7 +3418,7 @@ class TextAreaDirective {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TextAreaDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: RTL, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: TextAreaDirective, isStandalone: true, selector: "textarea[kendoTextArea]", inputs: { autoSize: "autoSize", value: "value" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.k-textarea": "this.elementClasses", "class.k-input": "this.elementClasses", "class.k-autofill": "this.autofillClass", "attr.dir": "this.direction" } }, providers: [{
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: TextAreaDirective, isStandalone: true, selector: "textarea[kendoTextArea]", inputs: { autoSize: "autoSize", value: "value" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.k-autofill": "this.autofillClass", "attr.dir": "this.direction" } }, providers: [{
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => TextAreaDirective),
                 multi: true
@@ -3450,13 +3446,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 }, {
                     type: Inject,
                     args: [RTL]
-                }] }], propDecorators: { elementClasses: [{
-                type: HostBinding,
-                args: ['class.k-textarea']
-            }, {
-                type: HostBinding,
-                args: ['class.k-input']
-            }], autofillClass: [{
+                }] }], propDecorators: { autofillClass: [{
                 type: HostBinding,
                 args: ['class.k-autofill']
             }], direction: [{
@@ -4078,7 +4068,6 @@ class NumericTextBoxComponent {
     get disableClass() {
         return this.disabled;
     }
-    hostClasses = true;
     /**
      * @hidden
      */
@@ -4142,6 +4131,8 @@ class NumericTextBoxComponent {
         this.hostElement = hostElement;
         validatePackage(packageMetadata);
         this.direction = localizationService.rtl ? 'rtl' : 'ltr';
+        this.renderer.addClass(this.hostElement.nativeElement, 'k-input');
+        this.renderer.addClass(this.hostElement.nativeElement, 'k-numerictextbox');
     }
     ngOnInit() {
         this.subscriptions = this.localizationService
@@ -4834,7 +4825,7 @@ class NumericTextBoxComponent {
         setHTMLAttributes(attributesToRender, this.renderer, this.numericInput.nativeElement, this.ngZone);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: NumericTextBoxComponent, deps: [{ token: i1$1.IntlService }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i0.Injector }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: NumericTextBoxComponent, isStandalone: true, selector: "kendo-numerictextbox", inputs: { focusableId: "focusableId", disabled: "disabled", readonly: "readonly", title: "title", autoCorrect: "autoCorrect", format: "format", max: "max", min: "min", decimals: "decimals", placeholder: "placeholder", step: "step", spinners: "spinners", rangeValidation: "rangeValidation", tabindex: "tabindex", tabIndex: "tabIndex", changeValueOnScroll: "changeValueOnScroll", selectOnFocus: "selectOnFocus", value: "value", maxlength: "maxlength", size: "size", rounded: "rounded", fillMode: "fillMode", inputAttributes: "inputAttributes" }, outputs: { valueChange: "valueChange", onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur" }, host: { properties: { "class.k-readonly": "this.readonly", "attr.dir": "this.direction", "class.k-disabled": "this.disableClass", "class.k-input": "this.hostClasses", "class.k-numerictextbox": "this.hostClasses" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: NumericTextBoxComponent, isStandalone: true, selector: "kendo-numerictextbox", inputs: { focusableId: "focusableId", disabled: "disabled", readonly: "readonly", title: "title", autoCorrect: "autoCorrect", format: "format", max: "max", min: "min", decimals: "decimals", placeholder: "placeholder", step: "step", spinners: "spinners", rangeValidation: "rangeValidation", tabindex: "tabindex", tabIndex: "tabIndex", changeValueOnScroll: "changeValueOnScroll", selectOnFocus: "selectOnFocus", value: "value", maxlength: "maxlength", size: "size", rounded: "rounded", fillMode: "fillMode", inputAttributes: "inputAttributes" }, outputs: { valueChange: "valueChange", onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur" }, host: { properties: { "class.k-readonly": "this.readonly", "attr.dir": "this.direction", "class.k-disabled": "this.disableClass" } }, providers: [
             LocalizationService,
             { provide: L10N_PREFIX, useValue: 'kendo.numerictextbox' },
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumericTextBoxComponent), multi: true },
@@ -5138,12 +5129,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }], disableClass: [{
                 type: HostBinding,
                 args: ['class.k-disabled']
-            }], hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-input']
-            }, {
-                type: HostBinding,
-                args: ['class.k-numerictextbox']
             }] } });
 
 /**
@@ -5330,9 +5315,8 @@ const mask = ({ prompt, promptPlaceholder }) => rule => new Parser(stream => {
  * @hidden
  */
 const literal = _token => new Parser(stream => {
-    //    let {char, control} = stream.peek();
-    const char = stream.peek().char;
-    if (char === _token) {
+    const { char, control } = stream.peek();
+    if (char === _token && control === _token) {
         stream.eat();
         return new Result(_token, stream, ResultType.Literal);
     }
@@ -5828,7 +5812,6 @@ class MaskedTextBoxComponent {
      */
     valueChange = new EventEmitter();
     direction;
-    hostClasses = true;
     get hostDisabledClass() {
         return this.disabled;
     }
@@ -5867,6 +5850,7 @@ class MaskedTextBoxComponent {
     _fillMode = undefined;
     _inputAttributes;
     parsedAttributes = {};
+    pendingValueUpdate = false;
     constructor(service, renderer, hostElement, ngZone, injector, changeDetector, rtl) {
         this.service = service;
         this.renderer = renderer;
@@ -5877,6 +5861,8 @@ class MaskedTextBoxComponent {
         validatePackage(packageMetadata);
         this.direction = rtl ? 'rtl' : 'ltr';
         this.updateService();
+        this.renderer.addClass(this.hostElement.nativeElement, 'k-input');
+        this.renderer.addClass(this.hostElement.nativeElement, 'k-maskedtextbox');
     }
     ngOnInit() {
         if (this.hostElement) {
@@ -6044,8 +6030,14 @@ class MaskedTextBoxComponent {
         else {
             result = this.service.maskInput(value, this.maskedValue || '', e.target.selectionStart);
         }
+        const maskedValueChanged = result.value !== this.maskedValue;
         this.updateInput(result.value, result.selection);
-        this.updateValueWithEvents(result.value);
+        if (maskedValueChanged) {
+            this.updateValueWithEvents(result.value);
+        }
+        else {
+            this.updateValue(result.value, true);
+        }
     }
     /**
      * @hidden
@@ -6063,7 +6055,12 @@ class MaskedTextBoxComponent {
         const maskedValue = this.service.maskRaw(this.value);
         this.updateInput(maskedValue, null, true);
         if (changes['includeLiterals'] || isChanged('promptPlaceholder', changes)) {
+            this.pendingValueUpdate = true;
             resolvedPromise.then(() => {
+                if (!this.pendingValueUpdate) {
+                    return;
+                }
+                this.pendingValueUpdate = false;
                 this.updateValueWithEvents(this.maskedValue, false);
             });
         }
@@ -6074,10 +6071,8 @@ class MaskedTextBoxComponent {
      */
     writeValue(value) {
         this.value = this.normalizeValue(value);
+        this.pendingValueUpdate = false;
         this.updateInput(this.service.maskRaw(this.value));
-        if (this.includeLiterals) {
-            this.updateValue(this.maskedValue, false);
-        }
         this.changeDetector.markForCheck();
     }
     /**
@@ -6249,7 +6244,7 @@ class MaskedTextBoxComponent {
         setHTMLAttributes(attributesToRender, this.renderer, this.input.nativeElement, this.ngZone);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MaskedTextBoxComponent, deps: [{ token: MaskingService }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: RTL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: MaskedTextBoxComponent, isStandalone: true, selector: "kendo-maskedtextbox", inputs: { focusableId: "focusableId", disabled: "disabled", readonly: "readonly", title: "title", size: "size", rounded: "rounded", fillMode: "fillMode", mask: "mask", value: "value", rules: "rules", prompt: "prompt", promptPlaceholder: "promptPlaceholder", includeLiterals: "includeLiterals", maskOnFocus: "maskOnFocus", maskValidation: "maskValidation", tabindex: "tabindex", tabIndex: "tabIndex", inputAttributes: "inputAttributes" }, outputs: { onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur", valueChange: "valueChange" }, host: { listeners: { "paste": "pasteHandler($event)", "input": "inputHandler($event)" }, properties: { "class.k-readonly": "this.readonly", "attr.dir": "this.direction", "class.k-input": "this.hostClasses", "class.k-maskedtextbox": "this.hostClasses", "class.k-disabled": "this.hostDisabledClass" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: MaskedTextBoxComponent, isStandalone: true, selector: "kendo-maskedtextbox", inputs: { focusableId: "focusableId", disabled: "disabled", readonly: "readonly", title: "title", size: "size", rounded: "rounded", fillMode: "fillMode", mask: "mask", value: "value", rules: "rules", prompt: "prompt", promptPlaceholder: "promptPlaceholder", includeLiterals: "includeLiterals", maskOnFocus: "maskOnFocus", maskValidation: "maskValidation", tabindex: "tabindex", tabIndex: "tabIndex", inputAttributes: "inputAttributes" }, outputs: { onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur", valueChange: "valueChange" }, host: { listeners: { "paste": "pasteHandler($event)", "input": "inputHandler($event)" }, properties: { "class.k-readonly": "this.readonly", "attr.dir": "this.direction", "class.k-disabled": "this.hostDisabledClass" } }, providers: [
             MaskingService,
             {
                 multi: true,
@@ -6458,12 +6453,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }], direction: [{
                 type: HostBinding,
                 args: ['attr.dir']
-            }], hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-input']
-            }, {
-                type: HostBinding,
-                args: ['class.k-maskedtextbox']
             }], hostDisabledClass: [{
                 type: HostBinding,
                 args: ['class.k-disabled']
@@ -6998,7 +6987,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
 class CheckBoxDirective {
     renderer;
     hostElement;
-    kendoClass = true;
     get isDisabled() {
         return this.hostElement.nativeElement.disabled;
     }
@@ -7030,6 +7018,7 @@ class CheckBoxDirective {
     constructor(renderer, hostElement) {
         this.renderer = renderer;
         this.hostElement = hostElement;
+        this.renderer.addClass(this.hostElement.nativeElement, 'k-checkbox');
     }
     ngAfterViewInit() {
         const stylingInputs = ['size', 'rounded'];
@@ -7048,7 +7037,7 @@ class CheckBoxDirective {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CheckBoxDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: CheckBoxDirective, isStandalone: true, selector: "input[kendoCheckBox]", inputs: { size: "size", rounded: "rounded" }, host: { properties: { "class.k-checkbox": "this.kendoClass", "class.k-disabled": "this.isDisabled" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: CheckBoxDirective, isStandalone: true, selector: "input[kendoCheckBox]", inputs: { size: "size", rounded: "rounded" }, host: { properties: { "class.k-disabled": "this.isDisabled" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CheckBoxDirective, decorators: [{
             type: Directive,
@@ -7056,10 +7045,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                     selector: 'input[kendoCheckBox]',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { kendoClass: [{
-                type: HostBinding,
-                args: ['class.k-checkbox']
-            }], isDisabled: [{
+        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { isDisabled: [{
                 type: HostBinding,
                 args: ['class.k-disabled']
             }], size: [{
@@ -7852,10 +7838,10 @@ class TextBoxComponent {
         this.hostElement = hostElement;
         validatePackage(packageMetadata);
         this.direction = localizationService.rtl ? 'rtl' : 'ltr';
-    }
-    ngOnInit() {
         this.renderer.addClass(this.hostElement.nativeElement, 'k-textbox');
         this.renderer.addClass(this.hostElement.nativeElement, 'k-input');
+    }
+    ngOnInit() {
         this.control = this.injector.get(NgControl, null);
         this.checkClearButton();
         this.subscriptions = this.localizationService.changes.subscribe(({ rtl }) => {
@@ -12118,11 +12104,11 @@ class FlatColorPickerComponent {
         }
         event.stopImmediatePropagation();
         const gradient = this.gradientElement?.nativeElement;
-        const palette = this.palette?.host.nativeElement;
-        if (this.activeView === 'gradient') {
+        const palette = this.palette?.host?.nativeElement;
+        if (this.activeView === 'gradient' && gradient) {
             gradient.focus();
         }
-        else {
+        else if (palette) {
             palette.focus();
         }
     }
@@ -13721,7 +13707,9 @@ class ColorPickerComponent {
                 const gradientDragHandle = this.flatColorPicker.gradient?.gradientDragHandle;
                 const palette = this.flatColorPicker.palette?.host;
                 const elementToFocus = gradientDragHandle ? gradientDragHandle : palette;
-                elementToFocus.nativeElement.focus({ preventScroll: true });
+                if (elementToFocus) {
+                    elementToFocus.nativeElement.focus({ preventScroll: true });
+                }
             }
         });
     }
@@ -16277,7 +16265,6 @@ class SignatureComponent {
     cd;
     localization;
     cdr;
-    staticHostClasses = true;
     /**
      * @hidden
      */
@@ -16584,6 +16571,8 @@ class SignatureComponent {
         this.cdr = cdr;
         validatePackage(packageMetadata);
         this.direction = localization.rtl ? 'rtl' : 'ltr';
+        this.renderer.addClass(this.element.nativeElement, 'k-signature');
+        this.renderer.addClass(this.element.nativeElement, 'k-input');
     }
     ngOnInit() {
         this.subscriptions = this.localization
@@ -16885,7 +16874,7 @@ class SignatureComponent {
         return this.localization.get(key);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SignatureComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: SignatureComponent, isStandalone: true, selector: "kendo-signature", inputs: { focusableId: "focusableId", readonly: "readonly", disabled: "disabled", width: "width", height: "height", value: "value", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", color: "color", backgroundColor: "backgroundColor", strokeWidth: "strokeWidth", smooth: "smooth", maximizable: "maximizable", maximized: "maximized", popupScale: "popupScale", exportScale: "exportScale", parentLocalization: "parentLocalization", hideLine: "hideLine" }, outputs: { valueChange: "valueChange", open: "open", close: "close", onFocus: "focus", onBlur: "blur", minimize: "minimize" }, host: { properties: { "class.k-signature": "this.staticHostClasses", "class.k-input": "this.staticHostClasses", "attr.dir": "this.direction", "class.k-readonly": "this.readonly", "class.k-disabled": "this.disabled", "style.width.px": "this.width", "style.height.px": "this.height" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: SignatureComponent, isStandalone: true, selector: "kendo-signature", inputs: { focusableId: "focusableId", readonly: "readonly", disabled: "disabled", width: "width", height: "height", value: "value", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", color: "color", backgroundColor: "backgroundColor", strokeWidth: "strokeWidth", smooth: "smooth", maximizable: "maximizable", maximized: "maximized", popupScale: "popupScale", exportScale: "exportScale", parentLocalization: "parentLocalization", hideLine: "hideLine" }, outputs: { valueChange: "valueChange", open: "open", close: "close", onFocus: "focus", onBlur: "blur", minimize: "minimize" }, host: { properties: { "attr.dir": "this.direction", "class.k-readonly": "this.readonly", "class.k-disabled": "this.disabled", "style.width.px": "this.width", "style.height.px": "this.height" } }, providers: [
             LocalizationService,
             { provide: L10N_PREFIX, useValue: 'kendo.signature' },
             { multi: true, provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SignatureComponent) },
@@ -17116,13 +17105,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                     standalone: true,
                     imports: [LocalizedSignatureMessagesDirective, ButtonComponent, DialogComponent]
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }], propDecorators: { staticHostClasses: [{
-                type: HostBinding,
-                args: ['class.k-signature']
-            }, {
-                type: HostBinding,
-                args: ['class.k-input']
-            }], focusableId: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }], propDecorators: { focusableId: [{
                 type: Input
             }], direction: [{
                 type: HostBinding,
@@ -17577,7 +17560,6 @@ class TextAreaComponent extends TextFieldsBase {
      * @hidden
      */
     focusableId = `k-${guid()}`;
-    hostClasses = true;
     get flowCol() {
         return this.flow === 'vertical';
     }
@@ -17773,6 +17755,8 @@ class TextAreaComponent extends TextFieldsBase {
         this.hostElement = hostElement;
         validatePackage(packageMetadata);
         this.direction = localizationService.rtl ? 'rtl' : 'ltr';
+        this.renderer.addClass(this.hostElement.nativeElement, 'k-input');
+        this.renderer.addClass(this.hostElement.nativeElement, 'k-textarea');
     }
     ngAfterContentInit() {
         this.ngZone.onStable.pipe((take(1))).subscribe(() => {
@@ -18077,7 +18061,7 @@ class TextAreaComponent extends TextFieldsBase {
         setHTMLAttributes(attributesToRender, this.renderer, this.input.nativeElement, this.ngZone);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TextAreaComponent, deps: [{ token: i1.LocalizationService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: TextAreaComponent, isStandalone: true, selector: "kendo-textarea", inputs: { focusableId: "focusableId", flow: "flow", inputAttributes: "inputAttributes", adornmentsOrientation: "adornmentsOrientation", rows: "rows", cols: "cols", maxlength: "maxlength", maxResizableRows: "maxResizableRows", tabindex: "tabindex", tabIndex: "tabIndex", resizable: "resizable", size: "size", rounded: "rounded", fillMode: "fillMode", showPrefixSeparator: "showPrefixSeparator", showSuffixSeparator: "showSuffixSeparator" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "class.k-textarea": "this.hostClasses", "class.k-input": "this.hostClasses", "class.!k-flex-col": "this.flowCol", "class.!k-flex-row": "this.flowRow" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: TextAreaComponent, isStandalone: true, selector: "kendo-textarea", inputs: { focusableId: "focusableId", flow: "flow", inputAttributes: "inputAttributes", adornmentsOrientation: "adornmentsOrientation", rows: "rows", cols: "cols", maxlength: "maxlength", maxResizableRows: "maxResizableRows", tabindex: "tabindex", tabIndex: "tabIndex", resizable: "resizable", size: "size", rounded: "rounded", fillMode: "fillMode", showPrefixSeparator: "showPrefixSeparator", showSuffixSeparator: "showSuffixSeparator" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "class.!k-flex-col": "this.flowCol", "class.!k-flex-row": "this.flowRow" } }, providers: [
             LocalizationService,
             { provide: L10N_PREFIX, useValue: 'kendo.textarea' },
             {
@@ -18201,12 +18185,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 }]
         }], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { focusableId: [{
                 type: Input
-            }], hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-textarea']
-            }, {
-                type: HostBinding,
-                args: ['class.k-input']
             }], flowCol: [{
                 type: HostBinding,
                 args: ['class.\!k-flex-col']

package/maskedtextbox/maskedtextbox.component.d.ts

@@ -171,7 +171,6 @@ export declare class MaskedTextBoxComponent implements ControlValueAccessor, OnC
      */
     valueChange: EventEmitter<string>;
     direction: string;
-    hostClasses: boolean;
     get hostDisabledClass(): boolean;
     /**
      * Returns the `ElementRef` of the visible `input` element.
@@ -198,6 +197,7 @@ export declare class MaskedTextBoxComponent implements ControlValueAccessor, OnC
     private _fillMode;
     private _inputAttributes;
     private parsedAttributes;
+    private pendingValueUpdate;
     constructor(service: MaskingService, renderer: Renderer2, hostElement: ElementRef, ngZone: NgZone, injector: Injector, changeDetector: ChangeDetectorRef, rtl: boolean);
     ngOnInit(): void;
     ngAfterViewInit(): void;

package/numerictextbox/numerictextbox.component.d.ts

@@ -201,7 +201,6 @@ export declare class NumericTextBoxComponent implements ControlValueAccessor, On
      */
     arrowDirection: ArrowDirection;
     get disableClass(): boolean;
-    hostClasses: boolean;
     /**
      * @hidden
      */

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1781868407,
-  "version": "24.2.0-develop.1",
+  "publishDate": 1782467418,
+  "version": "24.2.0-develop.11",
   "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-inputs",
-  "version": "24.2.0-develop.1",
+  "version": "24.2.0-develop.11",
   "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",
@@ -55,7 +55,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1781868407,
+      "publishDate": 1782467418,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
     }
   },
@@ -67,20 +67,20 @@
     "@angular/platform-browser": "19 - 22",
     "@progress/kendo-drawing": "^1.25.0",
     "@progress/kendo-licensing": "^1.11.0",
-    "@progress/kendo-angular-buttons": "24.2.0-develop.1",
-    "@progress/kendo-angular-common": "24.2.0-develop.1",
-    "@progress/kendo-angular-utils": "24.2.0-develop.1",
-    "@progress/kendo-angular-navigation": "24.2.0-develop.1",
-    "@progress/kendo-angular-dialog": "24.2.0-develop.1",
-    "@progress/kendo-angular-intl": "24.2.0-develop.1",
-    "@progress/kendo-angular-l10n": "24.2.0-develop.1",
-    "@progress/kendo-angular-popup": "24.2.0-develop.1",
-    "@progress/kendo-angular-icons": "24.2.0-develop.1",
+    "@progress/kendo-angular-buttons": "24.2.0-develop.11",
+    "@progress/kendo-angular-common": "24.2.0-develop.11",
+    "@progress/kendo-angular-utils": "24.2.0-develop.11",
+    "@progress/kendo-angular-navigation": "24.2.0-develop.11",
+    "@progress/kendo-angular-dialog": "24.2.0-develop.11",
+    "@progress/kendo-angular-intl": "24.2.0-develop.11",
+    "@progress/kendo-angular-l10n": "24.2.0-develop.11",
+    "@progress/kendo-angular-popup": "24.2.0-develop.11",
+    "@progress/kendo-angular-icons": "24.2.0-develop.11",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "24.2.0-develop.1",
+    "@progress/kendo-angular-schematics": "24.2.0-develop.11",
     "@progress/kendo-common": "^1.0.1",
     "@progress/kendo-draggable": "^3.0.0",
     "@progress/kendo-inputs-common": "^3.1.0"

package/signature/signature.component.d.ts

@@ -29,7 +29,6 @@ export declare class SignatureComponent implements ControlValueAccessor {
     private cd;
     localization: LocalizationService;
     private cdr;
-    staticHostClasses: boolean;
     /**
      * @hidden
      */

package/textarea/textarea.component.d.ts

@@ -38,7 +38,6 @@ export declare class TextAreaComponent extends TextFieldsBase implements Control
      * @hidden
      */
     focusableId: string;
-    hostClasses: boolean;
     get flowCol(): boolean;
     get flowRow(): boolean;
     private _flow;

package/textarea/textarea.directive.d.ts

@@ -19,7 +19,6 @@ export declare class TextAreaDirective implements OnInit, OnDestroy, OnChanges,
     private zone;
     private changeDetector;
     private injector;
-    elementClasses: boolean;
     autofillClass: boolean;
     direction: string;
     /**

package/textbox/textbox.directive.d.ts

@@ -19,7 +19,6 @@ export declare class TextBoxDirective implements AfterViewInit, OnDestroy {
     private renderer;
     private inputElement;
     private ngZone;
-    hostClasses: boolean;
     /**
      * @hidden
      */