@progress/kendo-angular-inputs 25.1.1-develop.2 → 25.1.1-develop.4

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

@@ -583,8 +583,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1789037509,
-    version: '25.1.1-develop.2',
+    publishDate: 1789370272,
+    version: '25.1.1-develop.4',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -16538,6 +16538,10 @@ class RatingComponent {
     cdr;
     zone;
     injector;
+    /**
+     * @hidden
+     */
+    precisionComplements;
     itemTemplate;
     hoveredItemTemplate;
     selectedItemTemplate;
@@ -16686,6 +16690,10 @@ class RatingComponent {
      * @hidden
      */
     ratingItems = [];
+    /**
+     * @hidden
+     */
+    precisionElementDimensions = { width: 0, height: 0 };
     control;
     ngChange = (_) => { };
     ngTouched = () => { };
@@ -16727,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 => {
@@ -16833,6 +16847,7 @@ class RatingComponent {
             item.hovered = false;
             item.half = this.isHalf(index, this.value);
         });
+        this.measurePrecisionElements();
     }
     /**
      * @hidden
@@ -16853,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);
     }
@@ -16950,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
@@ -17006,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"
@@ -17025,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) {
@@ -17046,6 +17080,7 @@ class RatingComponent {
                 }
                 <span
                   class="k-rating-precision-complement"
+                  #precisionComplement
                   >
                   <ng-template
                     [ngTemplateOutlet]="itemTemplate?.templateRef"
@@ -17056,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
@@ -17068,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
@@ -17077,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>
           }
@@ -17170,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"
@@ -17189,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) {
@@ -17210,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"
@@ -17220,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
@@ -17232,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
@@ -17241,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>
           }
@@ -17256,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

@@ -3820,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;
@@ -3911,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;
@@ -3983,6 +3994,7 @@ declare class RatingComponent implements OnInit, AfterViewInit, OnDestroy, Contr
      * @hidden
      */
     registerOnTouched(fn: () => any): void;
+    private measurePrecisionElements;
     private isSelected;
     private isHalf;
     private isFirstHalf;

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1789037509,
-  "version": "25.1.1-develop.2",
+  "publishDate": 1789370272,
+  "version": "25.1.1-develop.4",
   "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.2",
+  "version": "25.1.1-develop.4",
   "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": 1789037509,
+      "publishDate": 1789370272,
       "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.2",
-    "@progress/kendo-angular-common": "25.1.1-develop.2",
-    "@progress/kendo-angular-utils": "25.1.1-develop.2",
-    "@progress/kendo-angular-navigation": "25.1.1-develop.2",
-    "@progress/kendo-angular-dialog": "25.1.1-develop.2",
-    "@progress/kendo-angular-intl": "25.1.1-develop.2",
-    "@progress/kendo-angular-l10n": "25.1.1-develop.2",
-    "@progress/kendo-angular-popup": "25.1.1-develop.2",
-    "@progress/kendo-angular-icons": "25.1.1-develop.2",
+    "@progress/kendo-angular-buttons": "25.1.1-develop.4",
+    "@progress/kendo-angular-common": "25.1.1-develop.4",
+    "@progress/kendo-angular-utils": "25.1.1-develop.4",
+    "@progress/kendo-angular-navigation": "25.1.1-develop.4",
+    "@progress/kendo-angular-dialog": "25.1.1-develop.4",
+    "@progress/kendo-angular-intl": "25.1.1-develop.4",
+    "@progress/kendo-angular-l10n": "25.1.1-develop.4",
+    "@progress/kendo-angular-popup": "25.1.1-develop.4",
+    "@progress/kendo-angular-icons": "25.1.1-develop.4",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "25.1.1-develop.2",
+    "@progress/kendo-angular-schematics": "25.1.1-develop.4",
     "@progress/kendo-common": "^1.0.1",
     "@progress/kendo-draggable": "^3.0.0",
     "@progress/kendo-inputs-common": "^3.1.0"