@progress/kendo-angular-inputs 22.1.0-develop.17 → 22.1.0-develop.19

package/common/models/fillmode.d.ts

@@ -9,4 +9,4 @@
  *
  * @default `solid`
  */
-export type InputFillMode = 'solid' | 'flat' | 'outline' | 'none';
+export type InputFillMode = 'solid' | 'flat' | 'outline';

package/common/models/size.d.ts

@@ -9,4 +9,4 @@
  *
  * @default `medium`
  */
-export type InputSize = 'small' | 'medium' | 'large' | 'none';
+export type InputSize = 'small' | 'medium' | 'large';

package/common/utils.d.ts

@@ -44,6 +44,7 @@ export declare const ROUNDED_MAP: {
     medium: string;
     large: string;
     full: string;
+    none: string;
 };
 /**
  * @hidden

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

@@ -73,7 +73,8 @@ const ROUNDED_MAP = {
     small: 'sm',
     medium: 'md',
     large: 'lg',
-    full: 'full'
+    full: 'full',
+    none: 'none'
 };
 /**
  * @hidden
@@ -86,21 +87,33 @@ const isNone = (style) => style === 'none';
  */
 const getStylingClasses = (componentType, stylingOption, previousValue, newValue) => {
     switch (stylingOption) {
-        case 'size':
+        case 'size': {
             return {
-                toRemove: `k-${componentType}-${SIZE_MAP[previousValue]}`,
-                toAdd: newValue !== 'none' ? `k-${componentType}-${SIZE_MAP[newValue]}` : ''
+                toRemove: previousValue ? `k-${componentType}-${SIZE_MAP[previousValue]}` : null,
+                toAdd: newValue ? `k-${componentType}-${SIZE_MAP[newValue]}` : null
             };
-        case 'rounded':
+        }
+        case 'rounded': {
+            let roundedClassToAdd;
+            if (newValue) {
+                if (newValue !== 'none') {
+                    roundedClassToAdd = `k-rounded-${ROUNDED_MAP[newValue]}`;
+                }
+                else {
+                    roundedClassToAdd = 'k-rounded-none';
+                }
+            }
             return {
-                toRemove: `k-rounded-${ROUNDED_MAP[previousValue]}`,
-                toAdd: newValue !== 'none' ? `k-rounded-${ROUNDED_MAP[newValue]}` : ''
+                toRemove: previousValue ? `k-rounded-${ROUNDED_MAP[previousValue]}` : null,
+                toAdd: roundedClassToAdd || null
             };
-        case 'fillMode':
+        }
+        case 'fillMode': {
             return {
-                toRemove: `k-${componentType}-${previousValue}`,
-                toAdd: newValue !== 'none' ? `k-${componentType}-${newValue}` : ''
+                toRemove: previousValue ? `k-${componentType}-${previousValue}` : null,
+                toAdd: newValue ? `k-${componentType}-${newValue}` : null
             };
+        }
         default:
             break;
     }
@@ -554,7 +567,7 @@ const packageMetadata = {
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
     publishDate: 0,
-    version: '22.1.0-develop.17',
+    version: '22.1.0-develop.19',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -2499,9 +2512,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
         }], ctorParameters: () => [{ type: i1.LocalizationService }] });
 
 const FOCUSED$5 = 'k-focus';
-const DEFAULT_SIZE$e = 'medium';
-const DEFAULT_THUMB_ROUNDED = 'full';
-const DEFAULT_TRACK_ROUNDED = 'full';
 /**
  * Represents the [Kendo UI Switch component for Angular]({% slug overview_switch %}).
  *
@@ -2572,12 +2582,11 @@ class SwitchComponent {
     /**
      * Sets the size of the Switch.
      *
-     * @default "medium"
+     * @default undefined
      */
     set size(size) {
-        const newSize = size || DEFAULT_SIZE$e;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -2585,12 +2594,11 @@ class SwitchComponent {
     /**
      * Sets the border radius of the Switch.
      *
-     * @default "full"
+     * @default undefined
      */
     set thumbRounded(thumbRounded) {
-        const newThumbRounded = thumbRounded || DEFAULT_THUMB_ROUNDED;
-        this.handleThumbClasses(newThumbRounded);
-        this._thumbRounded = newThumbRounded;
+        this.handleThumbClasses(thumbRounded);
+        this._thumbRounded = thumbRounded;
     }
     get thumbRounded() {
         return this._thumbRounded;
@@ -2598,12 +2606,11 @@ class SwitchComponent {
     /**
      * Sets the border radius of the Switch track.
      *
-     * @default "full"
+     * @default undefined
      */
     set trackRounded(trackRounded) {
-        const newTrackRounded = trackRounded || DEFAULT_TRACK_ROUNDED;
-        this.handleTrackClasses(newTrackRounded);
-        this._trackRounded = newTrackRounded;
+        this.handleTrackClasses(trackRounded);
+        this._trackRounded = trackRounded;
     }
     get trackRounded() {
         return this._trackRounded;
@@ -2664,9 +2671,9 @@ class SwitchComponent {
     control;
     domSubscriptions = [];
     _checked = false;
-    _size = 'medium';
-    _trackRounded = 'full';
-    _thumbRounded = 'full';
+    _size;
+    _trackRounded;
+    _thumbRounded;
     constructor(renderer, hostElement, localizationService, injector, changeDetector, ngZone) {
         this.renderer = renderer;
         this.hostElement = hostElement;
@@ -3154,7 +3161,7 @@ class TextBoxDirective {
         this.listeners.forEach(listener => listener());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", 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.18", type: TextBoxDirective, isStandalone: true, selector: "input[kendoTextBox]", inputs: { value: "value" }, host: { properties: { "class.k-textbox": "this.hostClasses", "class.k-input": "this.hostClasses", "class.k-input-md": "this.hostClasses", "class.k-rounded-md": "this.hostClasses", "class.k-input-solid": "this.hostClasses" } }, providers: [{
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.18", type: TextBoxDirective, isStandalone: true, selector: "input[kendoTextBox]", inputs: { value: "value" }, host: { properties: { "class.k-textbox": "this.hostClasses", "class.k-input": "this.hostClasses" } }, providers: [{
                 provide: KendoInput,
                 useExisting: forwardRef(() => TextBoxDirective)
             }], ngImport: i0 });
@@ -3175,15 +3182,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
             }, {
                 type: HostBinding,
                 args: ['class.k-input']
-            }, {
-                type: HostBinding,
-                args: ['class.k-input-md']
-            }, {
-                type: HostBinding,
-                args: ['class.k-rounded-md']
-            }, {
-                type: HostBinding,
-                args: ['class.k-input-solid']
             }], value: [{
                 type: Input
             }] } });
@@ -3408,7 +3406,7 @@ class TextAreaDirective {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", 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.18", 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-input-md": "this.elementClasses", "class.k-rounded-md": "this.elementClasses", "class.k-input-solid": "this.elementClasses", "class.k-autofill": "this.autofillClass", "attr.dir": "this.direction" } }, providers: [{
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.18", 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: [{
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => TextAreaDirective),
                 multi: true
@@ -3442,15 +3440,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
             }, {
                 type: HostBinding,
                 args: ['class.k-input']
-            }, {
-                type: HostBinding,
-                args: ['class.k-input-md']
-            }, {
-                type: HostBinding,
-                args: ['class.k-rounded-md']
-            }, {
-                type: HostBinding,
-                args: ['class.k-input-solid']
             }], autofillClass: [{
                 type: HostBinding,
                 args: ['class.k-autofill']
@@ -3846,9 +3835,6 @@ const PARSABLE_DEFAULTS = {
     step: 1
 };
 const FOCUSED$4 = 'k-focus';
-const DEFAULT_SIZE$d = 'medium';
-const DEFAULT_ROUNDED$8 = 'medium';
-const DEFAULT_FILL_MODE$6 = 'solid';
 /**
  * Represents the [Kendo UI NumericTextBox component for Angular]({% slug overview_numerictextbox %}).
  *
@@ -3981,9 +3967,8 @@ class NumericTextBoxComponent {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size || DEFAULT_SIZE$d;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -3994,9 +3979,8 @@ class NumericTextBoxComponent {
      * @default 'medium'
      */
     set rounded(rounded) {
-        const newRounded = rounded || DEFAULT_ROUNDED$8;
-        this.handleClasses(newRounded, 'rounded');
-        this._rounded = newRounded;
+        this.handleClasses(rounded, 'rounded');
+        this._rounded = rounded;
     }
     get rounded() {
         return this._rounded;
@@ -4007,9 +3991,8 @@ class NumericTextBoxComponent {
      * @default 'solid'
      */
     set fillMode(fillMode) {
-        const newFillMode = fillMode || DEFAULT_FILL_MODE$6;
-        this.handleClasses(newFillMode, 'fillMode');
-        this._fillMode = newFillMode;
+        this.handleClasses(fillMode, 'fillMode');
+        this._fillMode = fillMode;
     }
     get fillMode() {
         return this._fillMode;
@@ -4097,9 +4080,9 @@ class NumericTextBoxComponent {
     control;
     isPasted = false;
     mouseDown = false;
-    _size = 'medium';
-    _rounded = 'medium';
-    _fillMode = 'solid';
+    _size = undefined;
+    _rounded = undefined;
+    _fillMode = undefined;
     ngChange = noop$1;
     ngTouched = noop$1;
     ngValidatorChange = noop$1;
@@ -4894,7 +4877,7 @@ class NumericTextBoxComponent {
                 [attr.aria-hidden]="true"
                 [attr.aria-label]="incrementTitle"
                 [title]="incrementTitle"
-                class="k-spinner-increase k-button k-button-md k-icon-button k-button-solid k-button-solid-base"
+                class="k-spinner-increase k-button k-icon-button"
                 [class.k-active]="arrowDirection === ArrowDirection.Up"
                 tabindex="-1"
                 >
@@ -4912,7 +4895,7 @@ class NumericTextBoxComponent {
                 [attr.aria-label]="decrementTitle"
                 [title]="decrementTitle"
                 [class.k-active]="arrowDirection === ArrowDirection.Down"
-                class="k-spinner-decrease k-button k-button-md k-icon-button k-button-solid k-button-solid-base"
+                class="k-spinner-decrease k-button k-icon-button"
                 tabindex="-1"
                 >
                 <kendo-icon-wrapper
@@ -5009,7 +4992,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                 [attr.aria-hidden]="true"
                 [attr.aria-label]="incrementTitle"
                 [title]="incrementTitle"
-                class="k-spinner-increase k-button k-button-md k-icon-button k-button-solid k-button-solid-base"
+                class="k-spinner-increase k-button k-icon-button"
                 [class.k-active]="arrowDirection === ArrowDirection.Up"
                 tabindex="-1"
                 >
@@ -5027,7 +5010,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                 [attr.aria-label]="decrementTitle"
                 [title]="decrementTitle"
                 [class.k-active]="arrowDirection === ArrowDirection.Down"
-                class="k-spinner-decrease k-button k-button-md k-icon-button k-button-solid k-button-solid-base"
+                class="k-spinner-decrease k-button k-icon-button"
                 tabindex="-1"
                 >
                 <kendo-icon-wrapper
@@ -5606,9 +5589,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
 
 const resolvedPromise = Promise.resolve(null);
 const FOCUSED$3 = 'k-focus';
-const DEFAULT_SIZE$c = 'medium';
-const DEFAULT_ROUNDED$7 = 'medium';
-const DEFAULT_FILL_MODE$5 = 'solid';
 /**
  * Represents the [Kendo UI MaskedTextBox component for Angular]({% slug overview_maskedtextbox %}).
  *
@@ -5662,9 +5642,8 @@ class MaskedTextBoxComponent {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size || DEFAULT_SIZE$c;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -5674,9 +5653,8 @@ class MaskedTextBoxComponent {
      * @default 'medium'
      */
     set rounded(rounded) {
-        const newRounded = rounded || DEFAULT_ROUNDED$7;
-        this.handleClasses(newRounded, 'rounded');
-        this._rounded = newRounded;
+        this.handleClasses(rounded, 'rounded');
+        this._rounded = rounded;
     }
     get rounded() {
         return this._rounded;
@@ -5686,9 +5664,8 @@ class MaskedTextBoxComponent {
      * @default 'solid'
      */
     set fillMode(fillMode) {
-        const newFillMode = fillMode || DEFAULT_FILL_MODE$5;
-        this.handleClasses(newFillMode, 'fillMode');
-        this._fillMode = newFillMode;
+        this.handleClasses(fillMode, 'fillMode');
+        this._fillMode = fillMode;
     }
     get fillMode() {
         return this._fillMode;
@@ -5849,9 +5826,9 @@ class MaskedTextBoxComponent {
     isPasted = false;
     selection = [0, 0];
     control;
-    _size = 'medium';
-    _rounded = 'medium';
-    _fillMode = 'solid';
+    _size = undefined;
+    _rounded = undefined;
+    _fillMode = undefined;
     _inputAttributes;
     parsedAttributes = {};
     constructor(service, renderer, hostElement, ngZone, injector, changeDetector, rtl) {
@@ -6464,7 +6441,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
             }] } });
 
 const FOCUSED$2 = 'k-focus';
-const DEFAULT_SIZE$b = 'medium';
 /**
  * @hidden
  */
@@ -6519,9 +6495,8 @@ class RadioCheckBoxBase {
      *
      */
     set size(size) {
-        const newSize = size ? size : DEFAULT_SIZE$b;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -6681,7 +6656,7 @@ class RadioCheckBoxBase {
     ngChange = (_) => { };
     ngTouched = () => { };
     _isFocused = false;
-    _size = DEFAULT_SIZE$b;
+    _size = undefined;
     constructor(componentType, hostElement, renderer, cdr, ngZone, injector) {
         this.componentType = componentType;
         this.hostElement = hostElement;
@@ -6750,7 +6725,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                 args: ['input', { static: true }]
             }] } });
 
-const DEFAULT_ROUNDED$6 = 'medium';
 /**
  * Represents the Kendo UI CheckBox component for Angular.
  * Use this component to create a styled checkbox with support for indeterminate state.
@@ -6791,9 +6765,8 @@ class CheckBoxComponent extends RadioCheckBoxBase {
      * @default 'medium'
      */
     set rounded(rounded) {
-        const newRounded = rounded || DEFAULT_ROUNDED$6;
-        this.handleClasses(newRounded, 'rounded');
-        this._rounded = newRounded;
+        this.handleClasses(rounded, 'rounded');
+        this._rounded = rounded;
     }
     get rounded() {
         return this._rounded;
@@ -6829,7 +6802,7 @@ class CheckBoxComponent extends RadioCheckBoxBase {
             'aria-invalid': this.isControlInvalid
         };
     }
-    _rounded = DEFAULT_ROUNDED$6;
+    _rounded = undefined;
     _checkedState = false;
     constructor(renderer, hostElement, cdr, ngZone, injector) {
         super('checkbox', hostElement, renderer, cdr, ngZone, injector);
@@ -6965,8 +6938,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                 type: Output
             }] } });
 
-const DEFAULT_SIZE$a = 'medium';
-const DEFAULT_ROUNDED$5 = 'medium';
 /**
  * Renders the [Kendo UI CheckBox]({% slug overview_checkbox %}) input component.
  * Apply this directive to `input type="checkbox"` HTML elements.
@@ -6990,9 +6961,8 @@ class CheckBoxDirective {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size ? size : DEFAULT_SIZE$a;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -7005,15 +6975,14 @@ class CheckBoxDirective {
      *
      */
     set rounded(rounded) {
-        const newRounded = rounded ? rounded : DEFAULT_ROUNDED$5;
-        this.handleClasses(newRounded, 'rounded');
-        this._rounded = newRounded;
+        this.handleClasses(rounded, 'rounded');
+        this._rounded = rounded;
     }
     get rounded() {
         return this._rounded;
     }
-    _size = 'medium';
-    _rounded = 'medium';
+    _size = undefined;
+    _rounded = undefined;
     constructor(renderer, hostElement) {
         this.renderer = renderer;
         this.hostElement = hostElement;
@@ -7576,9 +7545,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 const FOCUSED$1 = 'k-focus';
-const DEFAULT_SIZE$9 = 'medium';
-const DEFAULT_ROUNDED$4 = 'medium';
-const DEFAULT_FILL_MODE$4 = 'solid';
 const iconsMap$1 = { checkIcon, exclamationCircleIcon, xIcon };
 /**
  * Represents the Kendo UI TextBox component for Angular.
@@ -7682,9 +7648,8 @@ class TextBoxComponent {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size ? size : DEFAULT_SIZE$9;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -7694,9 +7659,8 @@ class TextBoxComponent {
      * @default 'medium'
      */
     set rounded(rounded) {
-        const newRounded = rounded ? rounded : DEFAULT_ROUNDED$4;
-        this.handleClasses(newRounded, 'rounded');
-        this._rounded = newRounded;
+        this.handleClasses(rounded, 'rounded');
+        this._rounded = rounded;
     }
     get rounded() {
         return this._rounded;
@@ -7706,9 +7670,8 @@ class TextBoxComponent {
      * @default 'solid'
      */
     set fillMode(fillMode) {
-        const newFillMode = fillMode ? fillMode : DEFAULT_FILL_MODE$4;
-        this.handleClasses(newFillMode, 'fillMode');
-        this._fillMode = newFillMode;
+        this.handleClasses(fillMode, 'fillMode');
+        this._fillMode = fillMode;
     }
     get fillMode() {
         return this._fillMode;
@@ -7815,9 +7778,9 @@ class TextBoxComponent {
     _isFocused = false;
     focusChangedProgrammatically = false;
     _inputAttributes;
-    _size = 'medium';
-    _rounded = 'medium';
-    _fillMode = 'solid';
+    _size = undefined;
+    _rounded = undefined;
+    _fillMode = undefined;
     parsedAttributes = {};
     get defaultAttributes() {
         return {
@@ -8513,7 +8476,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
             }] } });
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
-const DEFAULT_SIZE$8 = 'medium';
 /**
  * @hidden
  */
@@ -8535,7 +8497,7 @@ class ColorInputComponent {
      *
      * @default 'medium'
      */
-    size = DEFAULT_SIZE$8;
+    size = undefined;
     /**
      * Sets the `tabindex` of the inputs.
      * @default -1
@@ -9531,7 +9493,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 let serial$3 = 0;
-const DEFAULT_SIZE$7 = 'medium';
 /**
  * Represents the Kendo UI ColorGradient component.
  *
@@ -9621,9 +9582,8 @@ class ColorGradientComponent {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size || DEFAULT_SIZE$7;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -9768,7 +9728,7 @@ class ColorGradientComponent {
     listeners = [];
     hueSliderTouched = false;
     alphaSliderTouched = false;
-    _size = 'medium';
+    _size = undefined;
     updateValues = new Subject();
     changeRequestsSubscription;
     dynamicRTLSubscription;
@@ -10772,7 +10732,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
 const DEFAULT_COLUMNS_COUNT = 10;
 const DEFAULT_PRESET = 'office';
 const DEFAULT_ACCESSIBLE_PRESET = 'accessible';
-const DEFAULT_SIZE$6 = 'medium';
 let serial$2 = 0;
 /**
  * Represents the Kendo UI ColorPalette component.
@@ -10869,9 +10828,8 @@ class ColorPaletteComponent {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size || DEFAULT_SIZE$6;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -10969,7 +10927,7 @@ class ColorPaletteComponent {
      */
     uniqueId = guid();
     selection;
-    _size = 'medium';
+    _size = undefined;
     _value;
     _columns;
     _palette;
@@ -11826,7 +11784,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable no-unused-expressions */
-const DEFAULT_SIZE$5 = 'medium';
 /**
  * Represents the Kendo UI FlatColorPicker component for Angular.
  *
@@ -11997,9 +11954,8 @@ class FlatColorPickerComponent {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size || DEFAULT_SIZE$5;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -12051,7 +12007,7 @@ class FlatColorPickerComponent {
     dynamicRTLSubscription;
     subscriptions = new Subscription();
     internalNavigation = false;
-    _size = 'medium';
+    _size = undefined;
     control;
     /**
      * @hidden
@@ -13006,9 +12962,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 const DOM_FOCUS_EVENTS = ['focus', 'blur'];
-const DEFAULT_SIZE$4 = 'medium';
-const DEFAULT_ROUNDED$3 = 'medium';
-const DEFAULT_FILL_MODE$3 = 'solid';
 /**
  * @hidden
  */
@@ -13219,9 +13172,8 @@ class ColorPickerComponent {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size || DEFAULT_SIZE$4;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -13233,9 +13185,8 @@ class ColorPickerComponent {
      * @default 'medium'
      */
     set rounded(rounded) {
-        const newRounded = rounded || DEFAULT_ROUNDED$3;
-        this.handleClasses(newRounded, 'rounded');
-        this._rounded = newRounded;
+        this.handleClasses(rounded, 'rounded');
+        this._rounded = rounded;
     }
     get rounded() {
         return this._rounded;
@@ -13247,9 +13198,8 @@ class ColorPickerComponent {
      * @default 'solid'
      */
     set fillMode(fillMode) {
-        const newFillMode = fillMode || DEFAULT_FILL_MODE$3;
-        this.handleClasses(newFillMode, 'fillMode');
-        this._fillMode = newFillMode;
+        this.handleClasses(fillMode, 'fillMode');
+        this._fillMode = fillMode;
     }
     get fillMode() {
         return this._fillMode;
@@ -13383,9 +13333,9 @@ class ColorPickerComponent {
     _popupSettings = { animate: true };
     _paletteSettings = {};
     _gradientSettings = { opacity: true, delay: 0 };
-    _size = 'medium';
-    _rounded = 'medium';
-    _fillMode = 'solid';
+    _size = undefined;
+    _rounded = undefined;
+    _fillMode = undefined;
     dynamicRTLSubscription;
     subscriptions = new Subscription();
     popupSubs = new Subscription();
@@ -13966,7 +13916,6 @@ class ColorPickerComponent {
           [svgIcon]="arrowDownIcon"
           [fillMode]="fillMode"
           [disabled]="disabled"
-          rounded="none"
           class="k-input-button"
           [attr.aria-label]="messageFor('toggleButtonLabel')"
           >
@@ -14116,7 +14065,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
           [svgIcon]="arrowDownIcon"
           [fillMode]="fillMode"
           [disabled]="disabled"
-          rounded="none"
           class="k-input-button"
           [attr.aria-label]="messageFor('toggleButtonLabel')"
           >
@@ -15147,7 +15095,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                 type: Output
             }] } });
 
-const DEFAULT_SIZE$3 = 'medium';
 /**
  * Represents the directive that renders the Kendo UI RadioButton input component.
  * Place the directive on `input type="radio"` HTML elements.
@@ -15170,14 +15117,13 @@ class RadioButtonDirective {
      * @default "medium"
      */
     set size(size) {
-        const newSize = size ? size : DEFAULT_SIZE$3;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
     }
-    _size = 'medium';
+    _size = undefined;
     constructor(renderer, hostElement) {
         this.renderer = renderer;
         this.hostElement = hostElement;
@@ -16262,9 +16208,6 @@ const noop = () => { };
 let _id = 0;
 const nextId = () => 'k-signature-focusable-' + _id++;
 const FOCUSED_CLASS = 'k-focus';
-const DEFAULT_SIZE$2 = 'medium';
-const DEFAULT_ROUNDED$2 = 'medium';
-const DEFAULT_FILL_MODE$2 = 'solid';
 const DEFAULT_POPUP_SCALE = 3;
 const DEFAULT_EXPORT_SCALE = 2;
 const DEFAULT_COLOR = '#000000';
@@ -16364,23 +16307,23 @@ class SignatureComponent {
      * Sets the padding of the Signature internal controls
      * ([ee example]({% slug appearance_signature %}#toc-size)).
      *
-     * @default 'medium'
+     * @default undefined
      */
-    size = DEFAULT_SIZE$2;
+    size;
     /**
      * Sets the border radius of the Signature
      * ([see example](slug:appearance_signature#rounded-corners)).
      *
-     * @default 'medium'
+     * @default undefined
      */
-    rounded = DEFAULT_ROUNDED$2;
+    rounded;
     /**
      * Sets the background and border styles of the Signature
      * ([see example](slug:appearance_signature#toc-fill-mode)).
      *
-     * @default 'solid'
+     * @default undefined
      */
-    fillMode = DEFAULT_FILL_MODE$2;
+    fillMode;
     /**
      * Sets the stroke color of the Signature.
      *
@@ -16773,9 +16716,9 @@ class SignatureComponent {
         const classList = this.element.nativeElement.classList;
         this.hostClasses.forEach(([name]) => classList.remove(name));
         this.hostClasses = [
-            [`k-signature-${SIZE_MAP[this.size || DEFAULT_SIZE$2]}`, !isNone(this.size)],
-            [`k-input-${this.fillMode || DEFAULT_FILL_MODE$2}`, !isNone(this.fillMode)],
-            [`k-rounded-${ROUNDED_MAP[this.rounded || DEFAULT_ROUNDED$2]}`, !isNone(this.rounded)]
+            [`k-signature-${SIZE_MAP[this.size]}`, isPresent(this.size)],
+            [`k-input-${this.fillMode}`, isPresent(this.fillMode)],
+            [`k-rounded-${ROUNDED_MAP[this.rounded]}`, isPresent(this.rounded)],
         ];
         this.hostClasses.forEach(([name, enabled]) => classList.toggle(name, enabled));
     }
@@ -17561,9 +17504,6 @@ const resizeClasses = {
     'auto': 'k-resize-none'
 };
 const FOCUSED = 'k-focus';
-const DEFAULT_SIZE$1 = 'medium';
-const DEFAULT_ROUNDED$1 = 'medium';
-const DEFAULT_FILL_MODE$1 = 'solid';
 /**
  * Represents the Kendo UI TextArea component for Angular.
  *
@@ -17685,9 +17625,8 @@ class TextAreaComponent extends TextFieldsBase {
      * @default 'medium'
      */
     set size(size) {
-        const newSize = size ? size : DEFAULT_SIZE$1;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
+        this.handleClasses(size, 'size');
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -17697,9 +17636,8 @@ class TextAreaComponent extends TextFieldsBase {
      * @default 'medium'
      */
     set rounded(rounded) {
-        const newRounded = rounded ? rounded : DEFAULT_ROUNDED$1;
-        this.handleClasses(newRounded, 'rounded');
-        this._rounded = newRounded;
+        this.handleClasses(rounded, 'rounded');
+        this._rounded = rounded;
     }
     get rounded() {
         return this._rounded;
@@ -17709,9 +17647,8 @@ class TextAreaComponent extends TextFieldsBase {
      * @default 'solid'
      */
     set fillMode(fillMode) {
-        const newFillMode = fillMode ? fillMode : DEFAULT_FILL_MODE$1;
-        this.handleClasses(newFillMode, 'fillMode');
-        this._fillMode = newFillMode;
+        this.handleClasses(fillMode, 'fillMode');
+        this._fillMode = fillMode;
     }
     get fillMode() {
         return this._fillMode;
@@ -17752,9 +17689,9 @@ class TextAreaComponent extends TextFieldsBase {
     maxResizableHeight;
     resizeSubscription;
     resizeObserver;
-    _size = 'medium';
-    _rounded = 'medium';
-    _fillMode = 'solid';
+    _size = undefined;
+    _rounded = undefined;
+    _fillMode = undefined;
     _adornmentsOrientation = 'horizontal';
     _inputAttributes;
     parsedAttributes = {};
@@ -18451,9 +18388,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                 }]
         }], ctorParameters: () => [{ type: i1.LocalizationService }] });
 
-const DEFAULT_SIZE = 'medium';
-const DEFAULT_ROUNDED = 'medium';
-const DEFAULT_FILL_MODE = 'solid';
 const DEFAULT_OTPINPUT_LENGTH = 4;
 /**
  * Represents the Kendo UI OTP Input component for Angular.
@@ -18583,14 +18517,15 @@ class OTPInputComponent {
     /**
      * Sets the padding of the input fields.
      *
-     * @default 'medium'
+     * @default undefined
      */
     set size(size) {
-        const newSize = size || DEFAULT_SIZE;
         const elem = this.hostElement.nativeElement;
         this.renderer.removeClass(elem, `k-otp-${SIZE_MAP[this._size]}`);
-        this.renderer.addClass(elem, `k-otp-${SIZE_MAP[newSize]}`);
-        this._size = newSize;
+        if (size) {
+            this.renderer.addClass(elem, `k-otp-${SIZE_MAP[size]}`);
+        }
+        this._size = size;
     }
     get size() {
         return this._size;
@@ -18601,7 +18536,7 @@ class OTPInputComponent {
      * @default 'medium'
      */
     set rounded(rounded) {
-        this._rounded = rounded || DEFAULT_ROUNDED;
+        this._rounded = rounded;
     }
     get rounded() {
         return this._rounded;
@@ -18612,9 +18547,8 @@ class OTPInputComponent {
      * @default 'solid'
      */
     set fillMode(fillMode) {
-        const newFillMode = fillMode || DEFAULT_FILL_MODE;
-        this.setGroupFillMode(newFillMode, this._fillMode);
-        this._fillMode = newFillMode;
+        this.setGroupFillMode(fillMode, this._fillMode);
+        this._fillMode = fillMode;
     }
     get fillMode() {
         return this._fillMode;
@@ -18687,9 +18621,9 @@ class OTPInputComponent {
     _inputGroups;
     separatorPositions = new Set();
     _value = null;
-    _size = DEFAULT_SIZE;
-    _rounded = DEFAULT_ROUNDED;
-    _fillMode = DEFAULT_FILL_MODE;
+    _size = undefined;
+    _rounded = undefined;
+    _fillMode = undefined;
     _isFocused = false;
     focusChangedProgrammatically = false;
     inputFieldValueChanged = false;
@@ -18726,8 +18660,6 @@ class OTPInputComponent {
     ngAfterViewInit() {
         this.subscriptions.add(this.inputFields.changes.subscribe(this.handleInputChanges.bind(this)));
         this.handleInputChanges();
-        this.renderer.addClass(this.hostElement.nativeElement, `k-otp-${SIZE_MAP[this._size]}`);
-        this.setGroupFillMode(this.fillMode);
         this.zone.onStable.pipe(take(1)).subscribe(() => {
             this.fillInputs(this.value);
         });
@@ -19101,10 +19033,10 @@ class OTPInputComponent {
     }
     setGroupFillMode(fillMode, previousFillMode) {
         this.inputGroups?.forEach(element => {
-            if (previousFillMode !== 'none') {
+            if (previousFillMode) {
                 this.renderer.removeClass(element.nativeElement, `k-input-group-${previousFillMode}`);
             }
-            if (fillMode !== 'none') {
+            if (fillMode) {
                 this.renderer.addClass(element.nativeElement, `k-input-group-${fillMode}`);
             }
         });
@@ -19190,7 +19122,7 @@ class OTPInputComponent {
           (onFocus)="handleFocus()"
           >
           @if (spacing) {
-            @for (input of inputsArray; track input; let i = $index) {
+            @for (input of inputsArray; track $index; let i = $index) {
               <kendo-textbox
                 class="k-otp-input"
                 [class.k-invalid]="isControlInvalid"
@@ -19267,7 +19199,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
           (onFocus)="handleFocus()"
           >
           @if (spacing) {
-            @for (input of inputsArray; track input; let i = $index) {
+            @for (input of inputsArray; track $index; let i = $index) {
               <kendo-textbox
                 class="k-otp-input"
                 [class.k-invalid]="isControlInvalid"

package/otpinput/otpinput.component.d.ts

@@ -83,7 +83,7 @@ export declare class OTPInputComponent implements ControlValueAccessor, OnInit,
     /**
      * Sets the padding of the input fields.
      *
-     * @default 'medium'
+     * @default undefined
      */
     set size(size: InputSize);
     get size(): InputSize;

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1770055205,
-  "version": "22.1.0-develop.17",
+  "publishDate": 1770219736,
+  "version": "22.1.0-develop.19",
   "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-inputs",
-  "version": "22.1.0-develop.17",
+  "version": "22.1.0-develop.19",
   "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",
@@ -28,7 +28,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1770055205,
+      "publishDate": 1770219736,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
     }
   },
@@ -38,22 +38,22 @@
     "@angular/core": "19 - 21",
     "@angular/forms": "19 - 21",
     "@angular/platform-browser": "19 - 21",
-    "@progress/kendo-drawing": "^1.23.1",
+    "@progress/kendo-drawing": "^1.24.0",
     "@progress/kendo-licensing": "^1.10.0",
-    "@progress/kendo-angular-buttons": "22.1.0-develop.17",
-    "@progress/kendo-angular-common": "22.1.0-develop.17",
-    "@progress/kendo-angular-utils": "22.1.0-develop.17",
-    "@progress/kendo-angular-navigation": "22.1.0-develop.17",
-    "@progress/kendo-angular-dialog": "22.1.0-develop.17",
-    "@progress/kendo-angular-intl": "22.1.0-develop.17",
-    "@progress/kendo-angular-l10n": "22.1.0-develop.17",
-    "@progress/kendo-angular-popup": "22.1.0-develop.17",
-    "@progress/kendo-angular-icons": "22.1.0-develop.17",
+    "@progress/kendo-angular-buttons": "22.1.0-develop.19",
+    "@progress/kendo-angular-common": "22.1.0-develop.19",
+    "@progress/kendo-angular-utils": "22.1.0-develop.19",
+    "@progress/kendo-angular-navigation": "22.1.0-develop.19",
+    "@progress/kendo-angular-dialog": "22.1.0-develop.19",
+    "@progress/kendo-angular-intl": "22.1.0-develop.19",
+    "@progress/kendo-angular-l10n": "22.1.0-develop.19",
+    "@progress/kendo-angular-popup": "22.1.0-develop.19",
+    "@progress/kendo-angular-icons": "22.1.0-develop.19",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "22.1.0-develop.17",
+    "@progress/kendo-angular-schematics": "22.1.0-develop.19",
     "@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

@@ -86,21 +86,21 @@ export declare class SignatureComponent implements ControlValueAccessor {
      * Sets the padding of the Signature internal controls
      * ([ee example]({% slug appearance_signature %}#toc-size)).
      *
-     * @default 'medium'
+     * @default undefined
      */
     size: InputSize;
     /**
      * Sets the border radius of the Signature
      * ([see example](slug:appearance_signature#rounded-corners)).
      *
-     * @default 'medium'
+     * @default undefined
      */
     rounded: InputRounded;
     /**
      * Sets the background and border styles of the Signature
      * ([see example](slug:appearance_signature#toc-fill-mode)).
      *
-     * @default 'solid'
+     * @default undefined
      */
     fillMode: InputFillMode;
     /**

package/switch/switch.component.d.ts

@@ -70,21 +70,21 @@ export declare class SwitchComponent implements ControlValueAccessor, OnInit, On
     /**
      * Sets the size of the Switch.
      *
-     * @default "medium"
+     * @default undefined
      */
     set size(size: InputSize);
     get size(): InputSize;
     /**
      * Sets the border radius of the Switch.
      *
-     * @default "full"
+     * @default undefined
      */
     set thumbRounded(thumbRounded: InputRounded);
     get thumbRounded(): InputRounded;
     /**
      * Sets the border radius of the Switch track.
      *
-     * @default "full"
+     * @default undefined
      */
     set trackRounded(trackRounded: InputRounded);
     get trackRounded(): InputRounded;