@progress/kendo-angular-inputs 25.1.1-develop.1 → 25.1.1-develop.3

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

@@ -583,8 +583,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1788947649,
-    version: '25.1.1-develop.1',
+    publishDate: 1789045361,
+    version: '25.1.1-develop.3',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -6118,6 +6118,10 @@ class MaskedTextBoxComponent {
     get rules() {
         return this._rules || this.defaultRules;
     }
+    /**
+     * Sets the prompt character for the masked value.
+     * @default '_'
+     */
     set prompt(value) {
         this._prompt.set(value);
     }
@@ -14366,7 +14370,6 @@ class ColorPickerComponent {
     /**
      * Indicates whether the ColorPicker wrapper is focused.
      */
-    _isFocused = signal(false, ...(ngDevMode ? [{ debugName: "_isFocused" }] : []));
     get isFocused() {
         return this._isFocused();
     }
@@ -14475,6 +14478,7 @@ class ColorPickerComponent {
     _roundedSignal = signal(undefined, ...(ngDevMode ? [{ debugName: "_roundedSignal" }] : []));
     _fillModeSignal = signal(undefined, ...(ngDevMode ? [{ debugName: "_fillModeSignal" }] : []));
     _isOpen = signal(false, ...(ngDevMode ? [{ debugName: "_isOpen" }] : []));
+    _isFocused = signal(false, ...(ngDevMode ? [{ debugName: "_isFocused" }] : []));
     constructor(host, popupService, cdr, localizationService, ngZone, renderer, injector, adaptiveService) {
         this.host = host;
         this.popupService = popupService;
@@ -16534,6 +16538,10 @@ class RatingComponent {
     cdr;
     zone;
     injector;
+    /**
+     * @hidden
+     */
+    precisionComplements;
     itemTemplate;
     hoveredItemTemplate;
     selectedItemTemplate;
@@ -16682,6 +16690,10 @@ class RatingComponent {
      * @hidden
      */
     ratingItems = [];
+    /**
+     * @hidden
+     */
+    precisionElementDimensions = { width: 0, height: 0 };
     control;
     ngChange = (_) => { };
     ngTouched = () => { };
@@ -16723,6 +16735,12 @@ class RatingComponent {
         this.zone.runOutsideAngular(() => {
             items.forEach((item, index) => this.subscriptions.add(this.renderer.listen(item, 'mousemove', (event) => this.onMouseMove(index, event))));
         });
+        this.subscriptions.add(this.precisionComplements.changes.subscribe(() => {
+            if (this.precisionComplements.length && !this.precisionElementDimensions.width) {
+                this.measurePrecisionElements();
+            }
+        }));
+        this.measurePrecisionElements();
         const control = this.control?.control;
         if (control && control.events) {
             this.subscriptions.add(control.events.subscribe(e => {
@@ -16829,6 +16847,7 @@ class RatingComponent {
             item.hovered = false;
             item.half = this.isHalf(index, this.value);
         });
+        this.measurePrecisionElements();
     }
     /**
      * @hidden
@@ -16849,6 +16868,23 @@ class RatingComponent {
     registerOnTouched(fn) {
         this.ngTouched = fn;
     }
+    measurePrecisionElements() {
+        if (this.precision !== 'half') {
+            return;
+        }
+        afterNextRender(() => {
+            const precisionComplement = this.precisionComplements?.first?.nativeElement;
+            if (!precisionComplement) {
+                return;
+            }
+            const width = precisionComplement.offsetWidth;
+            const height = precisionComplement.offsetHeight;
+            if (width !== this.precisionElementDimensions.width || height !== this.precisionElementDimensions.height) {
+                this.precisionElementDimensions = { width, height };
+                this.cdr.markForCheck();
+            }
+        }, { injector: this.injector });
+    }
     isSelected(index, value) {
         return this.selection === 'single' ? index === Math.ceil(value - 1) : index <= Math.ceil(value - 1);
     }
@@ -16946,7 +16982,7 @@ class RatingComponent {
                 useExisting: forwardRef(() => RatingComponent)
             },
             provideComponentName('rating')
-        ], queries: [{ propertyName: "itemTemplate", first: true, predicate: RatingItemTemplateDirective, descendants: true }, { propertyName: "hoveredItemTemplate", first: true, predicate: RatingHoveredItemTemplateDirective, descendants: true }, { propertyName: "selectedItemTemplate", first: true, predicate: RatingSelectedItemTemplateDirective, descendants: true }], exportAs: ["kendoRating"], ngImport: i0, template: `
+        ], queries: [{ propertyName: "itemTemplate", first: true, predicate: RatingItemTemplateDirective, descendants: true }, { propertyName: "hoveredItemTemplate", first: true, predicate: RatingHoveredItemTemplateDirective, descendants: true }, { propertyName: "selectedItemTemplate", first: true, predicate: RatingSelectedItemTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "precisionComplements", predicate: ["precisionComplement"], descendants: true, read: ElementRef }], exportAs: ["kendoRating"], ngImport: i0, template: `
         <span class="k-rating-container">
           @for (item of ratingItems; track item; let i = $index) {
             <span
@@ -17002,7 +17038,7 @@ class RatingComponent {
               }
               @if (item.half) {
                 @if (!itemTemplate) {
-                  <span class="k-rating-precision-complement">
+                  <span class="k-rating-precision-complement" #precisionComplement>
                     @if (!icon) {
                       <kendo-icon-wrapper
                         size="xlarge"
@@ -17021,6 +17057,8 @@ class RatingComponent {
                   </span>
                   <span
                     class="k-rating-precision-part"
+                    [style.width.px]="precisionElementDimensions.width || 24"
+                    [style.height.px]="precisionElementDimensions.height || 24"
                     [ngStyle]="{'clipPath': direction === 'rtl' ? 'inset(0 0 0 50%)' : 'inset(0 50% 0 0)'}"
                     >
                     @if (!icon) {
@@ -17042,6 +17080,7 @@ class RatingComponent {
                 }
                 <span
                   class="k-rating-precision-complement"
+                  #precisionComplement
                   >
                   <ng-template
                     [ngTemplateOutlet]="itemTemplate?.templateRef"
@@ -17052,6 +17091,8 @@ class RatingComponent {
                 @if (hoveredItemTemplate && item.hovered) {
                   <span
                     class="k-rating-precision-part"
+                    [style.width.px]="precisionElementDimensions.width || 24"
+                    [style.height.px]="precisionElementDimensions.height || 24"
                     [ngStyle]="{'clipPath': direction === 'rtl' ? 'inset(0 0 0 50%)' : 'inset(0 50% 0 0)'}"
                     >
                     <ng-template
@@ -17064,6 +17105,8 @@ class RatingComponent {
                 @if (selectedItemTemplate && (item.selected && !item.hovered)) {
                   <span
                     class="k-rating-precision-part"
+                    [style.width.px]="precisionElementDimensions.width || 24"
+                    [style.height.px]="precisionElementDimensions.height || 24"
                     [ngStyle]="{'clipPath': direction === 'rtl' ? 'inset(0 0 0 50%)' : 'inset(0 50% 0 0)'}"
                     >
                     <ng-template
@@ -17073,7 +17116,11 @@ class RatingComponent {
                     </ng-template>
                   </span>
                 }
-                <span [style.width.px]="24" [style.height.px]="24" [style.display]="'block'"></span>
+                <span
+                    [style.width.px]="precisionElementDimensions.width || 24"
+                    [style.height.px]="precisionElementDimensions.height || 24"
+                    [style.display]="'block'"
+                ></span>
               }
             </span>
           }
@@ -17166,7 +17213,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
               }
               @if (item.half) {
                 @if (!itemTemplate) {
-                  <span class="k-rating-precision-complement">
+                  <span class="k-rating-precision-complement" #precisionComplement>
                     @if (!icon) {
                       <kendo-icon-wrapper
                         size="xlarge"
@@ -17185,6 +17232,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
                   </span>
                   <span
                     class="k-rating-precision-part"
+                    [style.width.px]="precisionElementDimensions.width || 24"
+                    [style.height.px]="precisionElementDimensions.height || 24"
                     [ngStyle]="{'clipPath': direction === 'rtl' ? 'inset(0 0 0 50%)' : 'inset(0 50% 0 0)'}"
                     >
                     @if (!icon) {
@@ -17206,6 +17255,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
                 }
                 <span
                   class="k-rating-precision-complement"
+                  #precisionComplement
                   >
                   <ng-template
                     [ngTemplateOutlet]="itemTemplate?.templateRef"
@@ -17216,6 +17266,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
                 @if (hoveredItemTemplate && item.hovered) {
                   <span
                     class="k-rating-precision-part"
+                    [style.width.px]="precisionElementDimensions.width || 24"
+                    [style.height.px]="precisionElementDimensions.height || 24"
                     [ngStyle]="{'clipPath': direction === 'rtl' ? 'inset(0 0 0 50%)' : 'inset(0 50% 0 0)'}"
                     >
                     <ng-template
@@ -17228,6 +17280,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
                 @if (selectedItemTemplate && (item.selected && !item.hovered)) {
                   <span
                     class="k-rating-precision-part"
+                    [style.width.px]="precisionElementDimensions.width || 24"
+                    [style.height.px]="precisionElementDimensions.height || 24"
                     [ngStyle]="{'clipPath': direction === 'rtl' ? 'inset(0 0 0 50%)' : 'inset(0 50% 0 0)'}"
                     >
                     <ng-template
@@ -17237,7 +17291,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
                     </ng-template>
                   </span>
                 }
-                <span [style.width.px]="24" [style.height.px]="24" [style.display]="'block'"></span>
+                <span
+                    [style.width.px]="precisionElementDimensions.width || 24"
+                    [style.height.px]="precisionElementDimensions.height || 24"
+                    [style.display]="'block'"
+                ></span>
               }
             </span>
           }
@@ -17252,7 +17310,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
                     standalone: true,
                     imports: [NgClass, IconWrapperComponent, NgTemplateOutlet, NgStyle]
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.Injector }], propDecorators: { itemTemplate: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.Injector }], propDecorators: { precisionComplements: [{
+                type: ViewChildren,
+                args: ['precisionComplement', { read: ElementRef }]
+            }], itemTemplate: [{
                 type: ContentChild,
                 args: [RatingItemTemplateDirective]
             }], hoveredItemTemplate: [{

package/index.d.ts

@@ -1585,6 +1585,10 @@ declare class MaskedTextBoxComponent implements ControlValueAccessor, Validator,
     get rules(): {
         [key: string]: RegExp;
     };
+    /**
+     * Sets the prompt character for the masked value.
+     * @default '_'
+     */
     set prompt(value: string);
     get prompt(): string;
     /**
@@ -3816,6 +3820,10 @@ declare class RatingComponent implements OnInit, AfterViewInit, OnDestroy, Contr
     private cdr;
     private zone;
     private injector;
+    /**
+     * @hidden
+     */
+    precisionComplements: QueryList<ElementRef<HTMLElement>>;
     itemTemplate: RatingItemTemplateDirective;
     hoveredItemTemplate: RatingHoveredItemTemplateDirective;
     selectedItemTemplate: RatingSelectedItemTemplateDirective;
@@ -3907,6 +3915,13 @@ declare class RatingComponent implements OnInit, AfterViewInit, OnDestroy, Contr
      * @hidden
      */
     ratingItems: RatingItem[];
+    /**
+     * @hidden
+     */
+    precisionElementDimensions: {
+        width: number;
+        height: number;
+    };
     private control;
     private ngChange;
     private ngTouched;
@@ -3979,6 +3994,7 @@ declare class RatingComponent implements OnInit, AfterViewInit, OnDestroy, Contr
      * @hidden
      */
     registerOnTouched(fn: () => any): void;
+    private measurePrecisionElements;
     private isSelected;
     private isHalf;
     private isFirstHalf;
@@ -4904,7 +4920,6 @@ declare class ColorPickerComponent implements OnInit, AfterViewInit, OnChanges,
     /**
      * Indicates whether the ColorPicker wrapper is focused.
      */
-    private _isFocused;
     get isFocused(): boolean;
     set isFocused(value: boolean);
     /**
@@ -4985,6 +5000,7 @@ declare class ColorPickerComponent implements OnInit, AfterViewInit, OnChanges,
     private _roundedSignal;
     private _fillModeSignal;
     private _isOpen;
+    private _isFocused;
     constructor(host: ElementRef, popupService: PopupService, cdr: ChangeDetectorRef, localizationService: LocalizationService, ngZone: NgZone, renderer: Renderer2, injector: Injector, adaptiveService: AdaptiveService);
     ngOnInit(): void;
     ngAfterViewInit(): void;

package/package-metadata.mjs

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

package/package.json

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