igniteui-webcomponents 7.1.0 → 7.1.2

package/components/rating/rating.d.ts

@@ -1,17 +1,47 @@
 import { LitElement } from 'lit';
 import type { Constructor } from '../common/mixins/constructor.js';
-import IgcRatingSymbolComponent from './rating-symbol.js';
 export interface IgcRatingComponentEventMap {
     igcChange: CustomEvent<number>;
     igcHover: CustomEvent<number>;
 }
 declare const IgcRatingComponent_base: Constructor<import("../common/mixins/forms/types.js").FormAssociatedElementInterface> & Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcRatingComponentEventMap>> & Constructor<LitElement>;
 /**
- * Rating provides insight regarding others' opinions and experiences,
- * and can allow the user to submit a rating of their own
+ * A rating component that allows users to view and provide ratings using customizable symbols.
+ * It supports fractional values, hover previews, keyboard navigation, single-selection mode,
+ * and integrates with forms as a number input.
+ *
+ * @example
+ * ```html
+ * <!-- Basic rating -->
+ * <igc-rating value="3" max="5" label="Rate this product"></igc-rating>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- Half-star rating with hover preview -->
+ * <igc-rating step="0.5" hover-preview value-format="{0} out of {1} stars"></igc-rating>
+ * ```
+ *
+ * @example
+ * ```html
+ * <!-- Custom symbols via projected rating symbols -->
+ * <igc-rating>
+ *   <igc-rating-symbol>
+ *     <igc-icon name="heart_filled" collection="default"></igc-icon>
+ *     <igc-icon name="heart_outlined" collection="default" slot="empty"></igc-icon>
+ *   </igc-rating-symbol>
+ *   <igc-rating-symbol>
+ *     <igc-icon name="heart_filled" collection="default"></igc-icon>
+ *     <igc-icon name="heart_outlined" collection="default" slot="empty"></igc-icon>
+ *   </igc-rating-symbol>
+ * </igc-rating>
+ * ```
  *
  * @element igc-rating
  *
+ * @slot symbol - Slot for projecting custom `igc-rating-symbol` elements. When used, the number of symbols determines the `max` value.
+ * @slot value-label - Slot for custom content displayed alongside the rating value.
+ *
  * @fires igcChange - Emitted when the value of the control changes.
  * @fires igcHover - Emitted when hover is enabled and the user mouses over a symbol of the rating.
  *
@@ -33,18 +63,18 @@ export default class IgcRatingComponent extends IgcRatingComponent_base {
     static readonly tagName = "igc-rating";
     static styles: import("lit").CSSResult[];
     static register(): void;
+    protected readonly _slots: import("../common/controllers/slot.js").SlotController<"symbol" | "[default]" | "value-label">;
     protected readonly _formValue: import("../common/mixins/forms/form-value.js").FormValue<number>;
     private _max;
     private _step;
     private _single;
-    protected ratingSymbols: IgcRatingSymbolComponent[];
-    protected container: HTMLElement;
-    protected valueLabel: Node[];
-    protected hoverValue: number;
-    protected hoverState: boolean;
-    protected get isInteractive(): boolean;
-    protected get hasProjectedSymbols(): boolean;
-    protected get valueText(): string;
+    private _symbols;
+    private _container?;
+    private _hoverValue;
+    private _hoverState;
+    private get _isInteractive();
+    private get _hasProjectedSymbols();
+    private get _valueText();
     /**
      * The maximum value for the rating.
      *
@@ -68,7 +98,7 @@ export default class IgcRatingComponent extends IgcRatingComponent_base {
      * The label of the control.
      * @attr label
      */
-    label: string;
+    label?: string;
     /**
      * A format string which sets aria-valuetext. Instances of '{0}' will be replaced
      * with the current value of the control and instances of '{1}' with the maximum value for the control.
@@ -76,7 +106,7 @@ export default class IgcRatingComponent extends IgcRatingComponent_base {
      * Important for screen-readers and useful for localization.
      * @attr value-format
      */
-    valueFormat: string;
+    valueFormat?: string;
     /**
      * The current value of the component
      * @attr value
@@ -104,22 +134,22 @@ export default class IgcRatingComponent extends IgcRatingComponent_base {
     /**
      * Whether to reset the rating when the user selects the same value.
      * @attr allow-reset
+     * @default false
      */
     allowReset: boolean;
     constructor();
-    protected firstUpdated(): Promise<void>;
-    protected handleClick({ clientX }: PointerEvent): void;
-    protected handlePointerMove({ clientX }: PointerEvent): void;
-    protected emitValueUpdate(value: number): void;
-    protected handleSlotChange(): void;
-    protected handleHoverEnabled(): void;
-    protected handleHoverDisabled(): void;
-    protected calcNewValue(x: number): number;
-    protected round(value: number): number;
-    protected clipSymbol(index: number, isLTR?: boolean): {
-        backward: string;
-        forward: string;
-    };
+    protected firstUpdated(): void;
+    protected updated(): void;
+    private _handleClick;
+    private _handlePointerMove;
+    private _handleSlotChange;
+    private _handleHoverEnabled;
+    private _handleHoverDisabled;
+    private _emitValueUpdate;
+    private _calcNewValue;
+    private _round;
+    private _updateProjectedSymbols;
+    private _clipSymbol;
     /**
      * Increments the value of the control by `n` steps multiplied by the
      * step factor.
@@ -130,8 +160,7 @@ export default class IgcRatingComponent extends IgcRatingComponent_base {
      * the step factor.
      */
     stepDown(n?: number): void;
-    protected renderSymbols(): Generator<import("lit-html").TemplateResult<1>, void, unknown>;
-    protected clipProjected(): void;
+    private _renderSymbols;
     protected render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/components/rating/rating.js

@@ -5,44 +5,46 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { html, LitElement, nothing } from 'lit';
-import { property, query, queryAssignedElements, queryAssignedNodes, state, } from 'lit/decorators.js';
-import { guard } from 'lit/directives/guard.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
+import { property, query, state } from 'lit/decorators.js';
+import { range } from 'lit/directives/range.js';
+import { repeat } from 'lit/directives/repeat.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { addThemingController } from '../../theming/theming-controller.js';
 import { addKeybindings, arrowDown, arrowLeft, arrowRight, arrowUp, endKey, homeKey, } from '../common/controllers/key-bindings.js';
+import { addSlotController, setSlots, } from '../common/controllers/slot.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
 import { FormAssociatedMixin } from '../common/mixins/forms/associated.js';
 import { FormValueNumberTransformers } from '../common/mixins/forms/form-transformers.js';
 import { createFormValueState } from '../common/mixins/forms/form-value.js';
-import { asNumber, clamp, formatString, isEmpty, isLTR, numberOfDecimals, roundPrecise, } from '../common/util.js';
+import { asNumber, bindIf, clamp, formatString, isLTR, numberOfDecimals, roundPrecise, } from '../common/util.js';
 import IgcIconComponent from '../icon/icon.js';
 import IgcRatingSymbolComponent from './rating-symbol.js';
 import { styles } from './themes/rating.base.css.js';
 import { styles as shared } from './themes/shared/rating.common.css.js';
 import { all } from './themes/themes.js';
+const Slots = setSlots('symbol', 'value-label');
 export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitterMixin(LitElement)) {
     static { this.tagName = 'igc-rating'; }
     static { this.styles = [styles, shared]; }
     static register() {
         registerComponent(IgcRatingComponent, IgcIconComponent, IgcRatingSymbolComponent);
     }
-    get isInteractive() {
+    get _isInteractive() {
         return !(this.readOnly || this.disabled);
     }
-    get hasProjectedSymbols() {
-        return this.ratingSymbols.length > 0;
+    get _hasProjectedSymbols() {
+        return this._symbols.length > 0;
     }
-    get valueText() {
-        const value = this.round(this.value);
+    get _valueText() {
+        const value = this._round(this.value);
         return this.valueFormat
             ? formatString(this.valueFormat, value, this.max)
             : `${value} of ${this.max}`;
     }
     set max(value) {
-        this._max = this.hasProjectedSymbols
-            ? this.ratingSymbols.length
+        this._max = this._hasProjectedSymbols
+            ? this._symbols.length
             : Math.max(0, value);
         if (this._max < this.value) {
             this.value = this._max;
@@ -78,6 +80,10 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
     }
     constructor() {
         super();
+        this._slots = addSlotController(this, {
+            slots: Slots,
+            onChange: this._handleSlotChange,
+        });
         this._formValue = createFormValueState(this, {
             initialValue: 0,
             transformers: FormValueNumberTransformers,
@@ -85,76 +91,103 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
         this._max = 5;
         this._step = 1;
         this._single = false;
-        this.hoverValue = -1;
-        this.hoverState = false;
+        this._symbols = [];
+        this._hoverValue = -1;
+        this._hoverState = false;
         this.hoverPreview = false;
         this.readOnly = false;
         this.allowReset = false;
         addThemingController(this, all);
         addKeybindings(this, {
-            skip: () => !this.isInteractive,
+            skip: () => !this._isInteractive,
+            bindingDefaults: { repeat: true },
         })
-            .set(arrowUp, () => this.emitValueUpdate(this.value + this.step))
-            .set(arrowRight, () => this.emitValueUpdate(isLTR(this) ? this.value + this.step : this.value - this.step))
-            .set(arrowDown, () => this.emitValueUpdate(this.value - this.step))
-            .set(arrowLeft, () => this.emitValueUpdate(isLTR(this) ? this.value - this.step : this.value + this.step))
-            .set(homeKey, () => this.emitValueUpdate(this.step))
-            .set(endKey, () => this.emitValueUpdate(this.max));
+            .set(arrowUp, () => this._emitValueUpdate(this.value + this.step))
+            .set(arrowRight, () => this._emitValueUpdate(isLTR(this) ? this.value + this.step : this.value - this.step))
+            .set(arrowDown, () => this._emitValueUpdate(this.value - this.step))
+            .set(arrowLeft, () => this._emitValueUpdate(isLTR(this) ? this.value - this.step : this.value + this.step))
+            .set(homeKey, () => this._emitValueUpdate(this.step))
+            .set(endKey, () => this._emitValueUpdate(this.max));
     }
-    async firstUpdated() {
-        await this.updateComplete;
+    firstUpdated() {
         this._formValue.setValueAndFormState(clamp(this.value, 0, this.max));
         this._pristine = true;
     }
-    handleClick({ clientX }) {
-        const value = this.calcNewValue(clientX);
+    updated() {
+        if (this._hasProjectedSymbols) {
+            this._updateProjectedSymbols();
+        }
+    }
+    _handleClick({ clientX }) {
+        const value = this._calcNewValue(clientX);
         const sameValue = this.value === value;
         if (this.allowReset && sameValue) {
-            this.emitValueUpdate(0);
+            this._emitValueUpdate(0);
         }
         else if (!sameValue) {
-            this.emitValueUpdate(value);
+            this._emitValueUpdate(value);
         }
     }
-    handlePointerMove({ clientX }) {
-        const value = this.calcNewValue(clientX);
-        if (this.hoverValue !== value) {
-            this.hoverValue = value;
-            this.emitEvent('igcHover', { detail: this.hoverValue });
+    _handlePointerMove({ clientX }) {
+        const value = this._calcNewValue(clientX);
+        if (this._hoverValue !== value) {
+            this._hoverValue = value;
+            this.emitEvent('igcHover', { detail: this._hoverValue });
         }
     }
-    emitValueUpdate(value) {
-        this._setTouchedState();
-        this.value = clamp(value, 0, this.max);
-        if (value === this.value) {
-            this.emitEvent('igcChange', { detail: this.value });
+    _handleSlotChange({ slot, }) {
+        if (slot === 'symbol') {
+            this._symbols = this._slots.getAssignedElements('symbol', {
+                selector: IgcRatingSymbolComponent.tagName,
+            });
+            if (this._hasProjectedSymbols) {
+                this.max = this._symbols.length;
+            }
         }
     }
-    handleSlotChange() {
-        if (this.hasProjectedSymbols) {
-            this.max = this.ratingSymbols.length;
-            this.requestUpdate();
-        }
+    _handleHoverEnabled() {
+        this._hoverState = true;
     }
-    handleHoverEnabled() {
-        this.hoverState = true;
+    _handleHoverDisabled() {
+        this._hoverState = false;
     }
-    handleHoverDisabled() {
-        this.hoverState = false;
+    _emitValueUpdate(next) {
+        this._setTouchedState();
+        const clamped = clamp(next, 0, this.max);
+        if (clamped !== this.value) {
+            this.value = clamped;
+            this.emitEvent('igcChange', { detail: this.value });
+        }
     }
-    calcNewValue(x) {
-        const { width, left, right } = this.container.getBoundingClientRect();
+    _calcNewValue(x) {
+        const { width, left, right } = this._container?.getBoundingClientRect() ?? new DOMRect(1, 1, 1, 1);
         const percent = isLTR(this) ? (x - left) / width : (right - x) / width;
-        const value = this.round(this.max * percent);
+        const value = this._round(this.max * percent);
         return clamp(value, this.step, this.max);
     }
-    round(value) {
+    _round(value) {
         return roundPrecise(Math.ceil(value / this.step) * this.step, numberOfDecimals(this.step));
     }
-    clipSymbol(index, isLTR = true) {
-        const value = this.hoverState ? this.hoverValue : this.value;
+    _updateProjectedSymbols() {
+        const ltr = isLTR(this);
+        const partFull = '[part="symbol full"]';
+        const partEmpty = '[part="symbol empty"]';
+        for (const [i, symbol] of this._symbols.entries()) {
+            const full = symbol.renderRoot.querySelector(partFull);
+            const empty = symbol.renderRoot.querySelector(partEmpty);
+            const { forward, backward } = this._clipSymbol(i, ltr);
+            if (full) {
+                full.style.clipPath = forward;
+            }
+            if (empty) {
+                empty.style.clipPath = backward;
+            }
+        }
+    }
+    _clipSymbol(index, isLTR = true) {
+        const value = this._hoverState ? this._hoverValue : this.value;
         const progress = index + 1 - value;
-        const exclusive = progress === 0 || this.value === index + 1 ? 0 : 1;
+        const exclusive = progress === 0 || value === index + 1 ? 0 : 1;
         const selection = this.single ? exclusive : progress;
         const activate = (p) => clamp(p * 100, 0, 100);
         const forward = `inset(0 ${activate(isLTR ? selection : 1 - selection)}% 0 0)`;
@@ -165,57 +198,37 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
         };
     }
     stepUp(n = 1) {
-        this.value += this.round(n * this.step);
+        this.value += this._round(n * this.step);
     }
     stepDown(n = 1) {
-        this.value -= this.round(n * this.step);
-    }
-    *renderSymbols() {
-        const ltr = isLTR(this);
-        for (let i = 0; i < this.max; i++) {
-            const { forward, backward } = this.clipSymbol(i, ltr);
-            yield html `<igc-rating-symbol exportparts="symbol, full, empty">
-        <igc-icon
-          collection="default"
-          name="star_filled"
-          style=${styleMap({ clipPath: forward })}
-        ></igc-icon>
-        <igc-icon
-          collection="default"
-          name="star_outlined"
-          style=${styleMap({ clipPath: backward })}
-          slot="empty"
-        ></igc-icon>
-      </igc-rating-symbol>`;
-        }
+        this.value -= this._round(n * this.step);
     }
-    clipProjected() {
+    _renderSymbols() {
         const ltr = isLTR(this);
-        const partFull = '[part="symbol full"]';
-        const partEmpty = '[part="symbol empty"]';
-        for (const [i, symbol] of this.ratingSymbols.entries()) {
-            const full = symbol.renderRoot.querySelector(partFull);
-            const empty = symbol.renderRoot.querySelector(partEmpty);
-            const { forward, backward } = this.clipSymbol(i, ltr);
-            if (full) {
-                full.style.clipPath = forward;
-            }
-            if (empty) {
-                empty.style.clipPath = backward;
-            }
-        }
+        return html `
+      ${repeat(range(this.max), (i) => i, (i) => {
+            const { forward, backward } = this._clipSymbol(i, ltr);
+            return html `
+            <igc-rating-symbol exportparts="symbol, full, empty">
+              <igc-icon
+                collection="default"
+                name="star_filled"
+                style=${styleMap({ clipPath: forward })}
+              ></igc-icon>
+              <igc-icon
+                collection="default"
+                name="star_outlined"
+                style=${styleMap({ clipPath: backward })}
+                slot="empty"
+              ></igc-icon>
+            </igc-rating-symbol>
+          `;
+        })}
+    `;
     }
     render() {
-        const props = [
-            this.value,
-            this.hoverValue,
-            this.max,
-            this.step,
-            this.single,
-            this.hoverState,
-            this.ratingSymbols,
-        ];
-        const hoverActive = this.hoverPreview && this.isInteractive;
+        const hoverActive = this.hoverPreview && this._isInteractive;
+        const valueLabelHidden = !this._slots.hasAssignedNodes('value-label', true);
         return html `
       <label part="label" id="rating-label" ?hidden=${!this.label}
         >${this.label}</label
@@ -223,52 +236,42 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
       <div
         part="base"
         role="slider"
-        tabindex=${ifDefined(this.disabled ? undefined : 0)}
+        tabindex=${this.disabled ? -1 : 0}
         aria-labelledby="rating-label"
         aria-valuemin="0"
         aria-valuenow=${this.value}
         aria-valuemax=${this.max}
-        aria-valuetext=${this.valueText}
+        aria-valuetext=${this._valueText}
       >
         <div
           aria-hidden="true"
           part="symbols"
-          @click=${this.isInteractive ? this.handleClick : nothing}
-          @pointerenter=${hoverActive ? this.handleHoverEnabled : nothing}
-          @pointerleave=${hoverActive ? this.handleHoverDisabled : nothing}
-          @pointermove=${hoverActive ? this.handlePointerMove : nothing}
+          @click=${bindIf(this._isInteractive, this._handleClick)}
+          @pointerenter=${bindIf(hoverActive, this._handleHoverEnabled)}
+          @pointerleave=${bindIf(hoverActive, this._handleHoverDisabled)}
+          @pointercancel=${bindIf(hoverActive, this._handleHoverDisabled)}
+          @pointermove=${bindIf(hoverActive, this._handlePointerMove)}
         >
-          <slot name="symbol" @slotchange=${this.handleSlotChange}>
-            ${guard(props, () => this.hasProjectedSymbols
-            ? this.clipProjected()
-            : this.renderSymbols())}
+          <slot name="symbol">
+            ${this._hasProjectedSymbols ? nothing : this._renderSymbols()}
           </slot>
         </div>
-        <label part="value-label" ?hidden=${isEmpty(this.valueLabel)}>
+        <label part="value-label" ?hidden=${valueLabelHidden}>
           <slot name="value-label"></slot>
         </label>
       </div>
     `;
     }
 }
-__decorate([
-    queryAssignedElements({
-        selector: IgcRatingSymbolComponent.tagName,
-        slot: 'symbol',
-    })
-], IgcRatingComponent.prototype, "ratingSymbols", void 0);
 __decorate([
     query('[part="symbols"]', true)
-], IgcRatingComponent.prototype, "container", void 0);
-__decorate([
-    queryAssignedNodes({ slot: 'value-label', flatten: true })
-], IgcRatingComponent.prototype, "valueLabel", void 0);
+], IgcRatingComponent.prototype, "_container", void 0);
 __decorate([
     state()
-], IgcRatingComponent.prototype, "hoverValue", void 0);
+], IgcRatingComponent.prototype, "_hoverValue", void 0);
 __decorate([
     state()
-], IgcRatingComponent.prototype, "hoverState", void 0);
+], IgcRatingComponent.prototype, "_hoverState", void 0);
 __decorate([
     property({ type: Number })
 ], IgcRatingComponent.prototype, "max", null);

package/components/rating/rating.js.map

@@ -1 +1 @@
-{"version":3,"file":"rating.js","sourceRoot":"","sources":["../../../src/components/rating/rating.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport {\n  property,\n  query,\n  queryAssignedElements,\n  queryAssignedNodes,\n  state,\n} from 'lit/decorators.js';\nimport { guard } from 'lit/directives/guard.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styleMap } from 'lit/directives/style-map.js';\n\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport {\n  addKeybindings,\n  arrowDown,\n  arrowLeft,\n  arrowRight,\n  arrowUp,\n  endKey,\n  homeKey,\n} from '../common/controllers/key-bindings.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormAssociatedMixin } from '../common/mixins/forms/associated.js';\nimport { FormValueNumberTransformers } from '../common/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '../common/mixins/forms/form-value.js';\nimport {\n  asNumber,\n  clamp,\n  formatString,\n  isEmpty,\n  isLTR,\n  numberOfDecimals,\n  roundPrecise,\n} from '../common/util.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport IgcRatingSymbolComponent from './rating-symbol.js';\nimport { styles } from './themes/rating.base.css.js';\nimport { styles as shared } from './themes/shared/rating.common.css.js';\nimport { all } from './themes/themes.js';\n\nexport interface IgcRatingComponentEventMap {\n  igcChange: CustomEvent<number>;\n  igcHover: CustomEvent<number>;\n}\n\n/**\n * Rating provides insight regarding others' opinions and experiences,\n * and can allow the user to submit a rating of their own\n *\n * @element igc-rating\n *\n * @fires igcChange - Emitted when the value of the control changes.\n * @fires igcHover - Emitted when hover is enabled and the user mouses over a symbol of the rating.\n *\n * @csspart base - The main wrapper which holds all of the rating elements.\n * @csspart label - The label part.\n * @csspart value-label - The value label part.\n * @csspart symbols - A wrapper for all rating symbols.\n * @csspart symbol - The part of the encapsulated default symbol.\n * @csspart full - The part of the encapsulated full symbols.\n * @csspart empty - The part of the encapsulated empty symbols.\n *\n * @cssproperty --symbol-size - The size of the symbols.\n * @cssproperty --symbol-full-color - The color of the filled symbol.\n * @cssproperty --symbol-empty-color - The color of the empty symbol.\n * @cssproperty --symbol-full-filter - The filter(s) used for the filled symbol.\n * @cssproperty --symbol-empty-filter - The filter(s) used for the empty symbol.\n */\nexport default class IgcRatingComponent extends FormAssociatedMixin(\n  EventEmitterMixin<IgcRatingComponentEventMap, Constructor<LitElement>>(\n    LitElement\n  )\n) {\n  public static readonly tagName = 'igc-rating';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(\n      IgcRatingComponent,\n      IgcIconComponent,\n      IgcRatingSymbolComponent\n    );\n  }\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: 0,\n    transformers: FormValueNumberTransformers,\n  });\n\n  private _max = 5;\n  private _step = 1;\n  private _single = false;\n\n  @queryAssignedElements({\n    selector: IgcRatingSymbolComponent.tagName,\n    slot: 'symbol',\n  })\n  protected ratingSymbols!: IgcRatingSymbolComponent[];\n\n  @query('[part=\"symbols\"]', true)\n  protected container!: HTMLElement;\n\n  @queryAssignedNodes({ slot: 'value-label', flatten: true })\n  protected valueLabel!: Node[];\n\n  @state()\n  protected hoverValue = -1;\n\n  @state()\n  protected hoverState = false;\n\n  protected get isInteractive() {\n    return !(this.readOnly || this.disabled);\n  }\n\n  protected get hasProjectedSymbols() {\n    return this.ratingSymbols.length > 0;\n  }\n\n  protected get valueText() {\n    // Skip IEEE 754 representation for screen readers\n    const value = this.round(this.value);\n    return this.valueFormat\n      ? formatString(this.valueFormat, value, this.max)\n      : `${value} of ${this.max}`;\n  }\n\n  /**\n   * The maximum value for the rating.\n   *\n   * If there are projected symbols, the maximum value will be resolved\n   * based on the number of symbols.\n   * @attr max\n   * @default 5\n   */\n  @property({ type: Number })\n  public set max(value: number) {\n    this._max = this.hasProjectedSymbols\n      ? this.ratingSymbols.length\n      : Math.max(0, value);\n\n    if (this._max < this.value) {\n      this.value = this._max;\n    }\n  }\n\n  public get max(): number {\n    return this._max;\n  }\n\n  /**\n   * The minimum value change allowed.\n   *\n   * Valid values are in the interval between 0 and 1 inclusive.\n   * @attr step\n   * @default 1\n   */\n  @property({ type: Number })\n  public set step(value: number) {\n    this._step = this.single ? 1 : clamp(value, 0.001, 1);\n  }\n\n  public get step(): number {\n    return this._step;\n  }\n\n  /**\n   * The label of the control.\n   * @attr label\n   */\n  @property()\n  public label!: string;\n\n  /**\n   * A format string which sets aria-valuetext. Instances of '{0}' will be replaced\n   * with the current value of the control and instances of '{1}' with the maximum value for the control.\n   *\n   * Important for screen-readers and useful for localization.\n   * @attr value-format\n   */\n  @property({ attribute: 'value-format' })\n  public valueFormat!: string;\n\n  /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n  /**\n   * The current value of the component\n   * @attr value\n   * @default 0\n   */\n  @property({ type: Number })\n  public set value(number: number) {\n    const value = this.hasUpdated\n      ? clamp(asNumber(number), 0, this.max)\n      : Math.max(asNumber(number), 0);\n    this._formValue.setValueAndFormState(value);\n  }\n\n  public get value(): number {\n    return this._formValue.value;\n  }\n\n  /**\n   * Sets hover preview behavior for the component\n   * @attr hover-preview\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hover-preview' })\n  public hoverPreview = false;\n\n  /**\n   * Makes the control a readonly field.\n   * @attr readonly\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'readonly' })\n  public readOnly = false;\n\n  /**\n   * Toggles single selection visual mode.\n   * @attr single\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public set single(value: boolean) {\n    this._single = Boolean(value);\n\n    if (this._single) {\n      this.step = 1;\n      this.value = Math.ceil(this.value);\n    }\n  }\n\n  public get single(): boolean {\n    return this._single;\n  }\n\n  /**\n   * Whether to reset the rating when the user selects the same value.\n   * @attr allow-reset\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'allow-reset' })\n  public allowReset = false;\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n\n    addKeybindings(this, {\n      skip: () => !this.isInteractive,\n    })\n      .set(arrowUp, () => this.emitValueUpdate(this.value + this.step))\n      .set(arrowRight, () =>\n        this.emitValueUpdate(\n          isLTR(this) ? this.value + this.step : this.value - this.step\n        )\n      )\n      .set(arrowDown, () => this.emitValueUpdate(this.value - this.step))\n      .set(arrowLeft, () =>\n        this.emitValueUpdate(\n          isLTR(this) ? this.value - this.step : this.value + this.step\n        )\n      )\n      .set(homeKey, () => this.emitValueUpdate(this.step))\n      .set(endKey, () => this.emitValueUpdate(this.max));\n  }\n\n  protected override async firstUpdated() {\n    await this.updateComplete;\n    this._formValue.setValueAndFormState(clamp(this.value, 0, this.max));\n    this._pristine = true;\n  }\n\n  protected handleClick({ clientX }: PointerEvent) {\n    const value = this.calcNewValue(clientX);\n    const sameValue = this.value === value;\n\n    if (this.allowReset && sameValue) {\n      this.emitValueUpdate(0);\n    } else if (!sameValue) {\n      this.emitValueUpdate(value);\n    }\n  }\n\n  protected handlePointerMove({ clientX }: PointerEvent) {\n    const value = this.calcNewValue(clientX);\n\n    if (this.hoverValue !== value) {\n      // Since pointermove spams a lot, only emit on a value change\n      this.hoverValue = value;\n      this.emitEvent('igcHover', { detail: this.hoverValue });\n    }\n  }\n\n  protected emitValueUpdate(value: number) {\n    this._setTouchedState();\n    this.value = clamp(value, 0, this.max);\n    if (value === this.value) {\n      this.emitEvent('igcChange', { detail: this.value });\n    }\n  }\n\n  protected handleSlotChange() {\n    if (this.hasProjectedSymbols) {\n      this.max = this.ratingSymbols.length;\n      this.requestUpdate();\n    }\n  }\n\n  protected handleHoverEnabled() {\n    this.hoverState = true;\n  }\n\n  protected handleHoverDisabled() {\n    this.hoverState = false;\n  }\n\n  protected calcNewValue(x: number) {\n    const { width, left, right } = this.container.getBoundingClientRect();\n    const percent = isLTR(this) ? (x - left) / width : (right - x) / width;\n    const value = this.round(this.max * percent);\n\n    return clamp(value, this.step, this.max);\n  }\n\n  protected round(value: number) {\n    return roundPrecise(\n      Math.ceil(value / this.step) * this.step,\n      numberOfDecimals(this.step)\n    );\n  }\n\n  protected clipSymbol(index: number, isLTR = true) {\n    const value = this.hoverState ? this.hoverValue : this.value;\n    const progress = index + 1 - value;\n    const exclusive = progress === 0 || this.value === index + 1 ? 0 : 1;\n    const selection = this.single ? exclusive : progress;\n    const activate = (p: number) => clamp(p * 100, 0, 100);\n\n    const forward = `inset(0 ${activate(\n      isLTR ? selection : 1 - selection\n    )}% 0 0)`;\n    const backward = `inset(0 0 0 ${activate(\n      isLTR ? 1 - selection : selection\n    )}%)`;\n\n    return {\n      backward: isLTR ? backward : forward,\n      forward: isLTR ? forward : backward,\n    };\n  }\n\n  /**\n   * Increments the value of the control by `n` steps multiplied by the\n   * step factor.\n   */\n  public stepUp(n = 1) {\n    this.value += this.round(n * this.step);\n  }\n\n  /**\n   * Decrements the value of the control by `n` steps multiplied by\n   * the step factor.\n   */\n  public stepDown(n = 1) {\n    this.value -= this.round(n * this.step);\n  }\n\n  protected *renderSymbols() {\n    const ltr = isLTR(this);\n    for (let i = 0; i < this.max; i++) {\n      const { forward, backward } = this.clipSymbol(i, ltr);\n      yield html`<igc-rating-symbol exportparts=\"symbol, full, empty\">\n        <igc-icon\n          collection=\"default\"\n          name=\"star_filled\"\n          style=${styleMap({ clipPath: forward })}\n        ></igc-icon>\n        <igc-icon\n          collection=\"default\"\n          name=\"star_outlined\"\n          style=${styleMap({ clipPath: backward })}\n          slot=\"empty\"\n        ></igc-icon>\n      </igc-rating-symbol>`;\n    }\n  }\n\n  protected clipProjected() {\n    const ltr = isLTR(this);\n    const partFull = '[part=\"symbol full\"]';\n    const partEmpty = '[part=\"symbol empty\"]';\n\n    for (const [i, symbol] of this.ratingSymbols.entries()) {\n      const full = symbol.renderRoot.querySelector<HTMLElement>(partFull);\n      const empty = symbol.renderRoot.querySelector<HTMLElement>(partEmpty);\n      const { forward, backward } = this.clipSymbol(i, ltr);\n\n      if (full) {\n        full.style.clipPath = forward;\n      }\n\n      if (empty) {\n        empty.style.clipPath = backward;\n      }\n    }\n  }\n\n  protected override render() {\n    const props = [\n      this.value,\n      this.hoverValue,\n      this.max,\n      this.step,\n      this.single,\n      this.hoverState,\n      this.ratingSymbols,\n    ];\n\n    const hoverActive = this.hoverPreview && this.isInteractive;\n\n    return html`\n      <label part=\"label\" id=\"rating-label\" ?hidden=${!this.label}\n        >${this.label}</label\n      >\n      <div\n        part=\"base\"\n        role=\"slider\"\n        tabindex=${ifDefined(this.disabled ? undefined : 0)}\n        aria-labelledby=\"rating-label\"\n        aria-valuemin=\"0\"\n        aria-valuenow=${this.value}\n        aria-valuemax=${this.max}\n        aria-valuetext=${this.valueText}\n      >\n        <div\n          aria-hidden=\"true\"\n          part=\"symbols\"\n          @click=${this.isInteractive ? this.handleClick : nothing}\n          @pointerenter=${hoverActive ? this.handleHoverEnabled : nothing}\n          @pointerleave=${hoverActive ? this.handleHoverDisabled : nothing}\n          @pointermove=${hoverActive ? this.handlePointerMove : nothing}\n        >\n          <slot name=\"symbol\" @slotchange=${this.handleSlotChange}>\n            ${guard(props, () =>\n              this.hasProjectedSymbols\n                ? this.clipProjected()\n                : this.renderSymbols()\n            )}\n          </slot>\n        </div>\n        <label part=\"value-label\" ?hidden=${isEmpty(this.valueLabel)}>\n          <slot name=\"value-label\"></slot>\n        </label>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-rating': IgcRatingComponent;\n  }\n}\n"]}
+{"version":3,"file":"rating.js","sourceRoot":"","sources":["../../../src/components/rating/rating.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { range } from 'lit/directives/range.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport {\n  addKeybindings,\n  arrowDown,\n  arrowLeft,\n  arrowRight,\n  arrowUp,\n  endKey,\n  homeKey,\n} from '../common/controllers/key-bindings.js';\nimport {\n  addSlotController,\n  type InferSlotNames,\n  type SlotChangeCallbackParameters,\n  setSlots,\n} from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormAssociatedMixin } from '../common/mixins/forms/associated.js';\nimport { FormValueNumberTransformers } from '../common/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '../common/mixins/forms/form-value.js';\nimport {\n  asNumber,\n  bindIf,\n  clamp,\n  formatString,\n  isLTR,\n  numberOfDecimals,\n  roundPrecise,\n} from '../common/util.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport IgcRatingSymbolComponent from './rating-symbol.js';\nimport { styles } from './themes/rating.base.css.js';\nimport { styles as shared } from './themes/shared/rating.common.css.js';\nimport { all } from './themes/themes.js';\n\nexport interface IgcRatingComponentEventMap {\n  igcChange: CustomEvent<number>;\n  igcHover: CustomEvent<number>;\n}\n\nconst Slots = setSlots('symbol', 'value-label');\n\n/**\n * A rating component that allows users to view and provide ratings using customizable symbols.\n * It supports fractional values, hover previews, keyboard navigation, single-selection mode,\n * and integrates with forms as a number input.\n *\n * @example\n * ```html\n * <!-- Basic rating -->\n * <igc-rating value=\"3\" max=\"5\" label=\"Rate this product\"></igc-rating>\n * ```\n *\n * @example\n * ```html\n * <!-- Half-star rating with hover preview -->\n * <igc-rating step=\"0.5\" hover-preview value-format=\"{0} out of {1} stars\"></igc-rating>\n * ```\n *\n * @example\n * ```html\n * <!-- Custom symbols via projected rating symbols -->\n * <igc-rating>\n *   <igc-rating-symbol>\n *     <igc-icon name=\"heart_filled\" collection=\"default\"></igc-icon>\n *     <igc-icon name=\"heart_outlined\" collection=\"default\" slot=\"empty\"></igc-icon>\n *   </igc-rating-symbol>\n *   <igc-rating-symbol>\n *     <igc-icon name=\"heart_filled\" collection=\"default\"></igc-icon>\n *     <igc-icon name=\"heart_outlined\" collection=\"default\" slot=\"empty\"></igc-icon>\n *   </igc-rating-symbol>\n * </igc-rating>\n * ```\n *\n * @element igc-rating\n *\n * @slot symbol - Slot for projecting custom `igc-rating-symbol` elements. When used, the number of symbols determines the `max` value.\n * @slot value-label - Slot for custom content displayed alongside the rating value.\n *\n * @fires igcChange - Emitted when the value of the control changes.\n * @fires igcHover - Emitted when hover is enabled and the user mouses over a symbol of the rating.\n *\n * @csspart base - The main wrapper which holds all of the rating elements.\n * @csspart label - The label part.\n * @csspart value-label - The value label part.\n * @csspart symbols - A wrapper for all rating symbols.\n * @csspart symbol - The part of the encapsulated default symbol.\n * @csspart full - The part of the encapsulated full symbols.\n * @csspart empty - The part of the encapsulated empty symbols.\n *\n * @cssproperty --symbol-size - The size of the symbols.\n * @cssproperty --symbol-full-color - The color of the filled symbol.\n * @cssproperty --symbol-empty-color - The color of the empty symbol.\n * @cssproperty --symbol-full-filter - The filter(s) used for the filled symbol.\n * @cssproperty --symbol-empty-filter - The filter(s) used for the empty symbol.\n */\nexport default class IgcRatingComponent extends FormAssociatedMixin(\n  EventEmitterMixin<IgcRatingComponentEventMap, Constructor<LitElement>>(\n    LitElement\n  )\n) {\n  public static readonly tagName = 'igc-rating';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcRatingComponent,\n      IgcIconComponent,\n      IgcRatingSymbolComponent\n    );\n  }\n\n  //#region Internal state and properties\n\n  protected readonly _slots = addSlotController(this, {\n    slots: Slots,\n    onChange: this._handleSlotChange,\n  });\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: 0,\n    transformers: FormValueNumberTransformers,\n  });\n\n  private _max = 5;\n  private _step = 1;\n  private _single = false;\n  private _symbols: IgcRatingSymbolComponent[] = [];\n\n  @query('[part=\"symbols\"]', true)\n  private _container?: HTMLElement;\n\n  @state()\n  private _hoverValue = -1;\n\n  @state()\n  private _hoverState = false;\n\n  private get _isInteractive(): boolean {\n    return !(this.readOnly || this.disabled);\n  }\n\n  private get _hasProjectedSymbols(): boolean {\n    return this._symbols.length > 0;\n  }\n\n  private get _valueText(): string {\n    // Skip IEEE 754 representation for screen readers\n    const value = this._round(this.value);\n    return this.valueFormat\n      ? formatString(this.valueFormat, value, this.max)\n      : `${value} of ${this.max}`;\n  }\n\n  //#endregion\n\n  //#region Public attributes and properties\n\n  /**\n   * The maximum value for the rating.\n   *\n   * If there are projected symbols, the maximum value will be resolved\n   * based on the number of symbols.\n   * @attr max\n   * @default 5\n   */\n  @property({ type: Number })\n  public set max(value: number) {\n    this._max = this._hasProjectedSymbols\n      ? this._symbols.length\n      : Math.max(0, value);\n\n    if (this._max < this.value) {\n      this.value = this._max;\n    }\n  }\n\n  public get max(): number {\n    return this._max;\n  }\n\n  /**\n   * The minimum value change allowed.\n   *\n   * Valid values are in the interval between 0 and 1 inclusive.\n   * @attr step\n   * @default 1\n   */\n  @property({ type: Number })\n  public set step(value: number) {\n    this._step = this.single ? 1 : clamp(value, 0.001, 1);\n  }\n\n  public get step(): number {\n    return this._step;\n  }\n\n  /**\n   * The label of the control.\n   * @attr label\n   */\n  @property()\n  public label?: string;\n\n  /**\n   * A format string which sets aria-valuetext. Instances of '{0}' will be replaced\n   * with the current value of the control and instances of '{1}' with the maximum value for the control.\n   *\n   * Important for screen-readers and useful for localization.\n   * @attr value-format\n   */\n  @property({ attribute: 'value-format' })\n  public valueFormat?: string;\n\n  /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n  /**\n   * The current value of the component\n   * @attr value\n   * @default 0\n   */\n  @property({ type: Number })\n  public set value(number: number) {\n    const value = this.hasUpdated\n      ? clamp(asNumber(number), 0, this.max)\n      : Math.max(asNumber(number), 0);\n    this._formValue.setValueAndFormState(value);\n  }\n\n  public get value(): number {\n    return this._formValue.value;\n  }\n\n  /**\n   * Sets hover preview behavior for the component\n   * @attr hover-preview\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hover-preview' })\n  public hoverPreview = false;\n\n  /**\n   * Makes the control a readonly field.\n   * @attr readonly\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'readonly' })\n  public readOnly = false;\n\n  /**\n   * Toggles single selection visual mode.\n   * @attr single\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public set single(value: boolean) {\n    this._single = Boolean(value);\n\n    if (this._single) {\n      this.step = 1;\n      this.value = Math.ceil(this.value);\n    }\n  }\n\n  public get single(): boolean {\n    return this._single;\n  }\n\n  /**\n   * Whether to reset the rating when the user selects the same value.\n   * @attr allow-reset\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'allow-reset' })\n  public allowReset = false;\n\n  //#endregion\n\n  //#region Lit lifecycle hooks\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n\n    addKeybindings(this, {\n      skip: () => !this._isInteractive,\n      bindingDefaults: { repeat: true },\n    })\n      .set(arrowUp, () => this._emitValueUpdate(this.value + this.step))\n      .set(arrowRight, () =>\n        this._emitValueUpdate(\n          isLTR(this) ? this.value + this.step : this.value - this.step\n        )\n      )\n      .set(arrowDown, () => this._emitValueUpdate(this.value - this.step))\n      .set(arrowLeft, () =>\n        this._emitValueUpdate(\n          isLTR(this) ? this.value - this.step : this.value + this.step\n        )\n      )\n      .set(homeKey, () => this._emitValueUpdate(this.step))\n      .set(endKey, () => this._emitValueUpdate(this.max));\n  }\n\n  protected override firstUpdated(): void {\n    this._formValue.setValueAndFormState(clamp(this.value, 0, this.max));\n    this._pristine = true;\n  }\n\n  protected override updated(): void {\n    if (this._hasProjectedSymbols) {\n      this._updateProjectedSymbols();\n    }\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  private _handleClick({ clientX }: PointerEvent): void {\n    const value = this._calcNewValue(clientX);\n    const sameValue = this.value === value;\n\n    if (this.allowReset && sameValue) {\n      this._emitValueUpdate(0);\n    } else if (!sameValue) {\n      this._emitValueUpdate(value);\n    }\n  }\n\n  private _handlePointerMove({ clientX }: PointerEvent): void {\n    const value = this._calcNewValue(clientX);\n\n    if (this._hoverValue !== value) {\n      // Since pointermove spams a lot, only emit on a value change\n      this._hoverValue = value;\n      this.emitEvent('igcHover', { detail: this._hoverValue });\n    }\n  }\n\n  private _handleSlotChange({\n    slot,\n  }: SlotChangeCallbackParameters<InferSlotNames<typeof Slots>>): void {\n    if (slot === 'symbol') {\n      this._symbols = this._slots.getAssignedElements('symbol', {\n        selector: IgcRatingSymbolComponent.tagName,\n      });\n\n      if (this._hasProjectedSymbols) {\n        this.max = this._symbols.length;\n      }\n    }\n  }\n\n  private _handleHoverEnabled(): void {\n    this._hoverState = true;\n  }\n\n  private _handleHoverDisabled(): void {\n    this._hoverState = false;\n  }\n\n  //#endregion\n\n  //#region Private methods\n\n  private _emitValueUpdate(next: number): void {\n    this._setTouchedState();\n\n    const clamped = clamp(next, 0, this.max);\n    if (clamped !== this.value) {\n      this.value = clamped;\n      this.emitEvent('igcChange', { detail: this.value });\n    }\n  }\n\n  private _calcNewValue(x: number): number {\n    const { width, left, right } =\n      this._container?.getBoundingClientRect() ?? new DOMRect(1, 1, 1, 1);\n    const percent = isLTR(this) ? (x - left) / width : (right - x) / width;\n    const value = this._round(this.max * percent);\n\n    return clamp(value, this.step, this.max);\n  }\n\n  private _round(value: number): number {\n    return roundPrecise(\n      Math.ceil(value / this.step) * this.step,\n      numberOfDecimals(this.step)\n    );\n  }\n\n  private _updateProjectedSymbols(): void {\n    const ltr = isLTR(this);\n    const partFull = '[part=\"symbol full\"]';\n    const partEmpty = '[part=\"symbol empty\"]';\n\n    for (const [i, symbol] of this._symbols.entries()) {\n      const full = symbol.renderRoot.querySelector<HTMLElement>(partFull);\n      const empty = symbol.renderRoot.querySelector<HTMLElement>(partEmpty);\n      const { forward, backward } = this._clipSymbol(i, ltr);\n\n      if (full) {\n        full.style.clipPath = forward;\n      }\n\n      if (empty) {\n        empty.style.clipPath = backward;\n      }\n    }\n  }\n\n  private _clipSymbol(index: number, isLTR = true) {\n    const value = this._hoverState ? this._hoverValue : this.value;\n    const progress = index + 1 - value;\n    const exclusive = progress === 0 || value === index + 1 ? 0 : 1;\n    const selection = this.single ? exclusive : progress;\n    const activate = (p: number) => clamp(p * 100, 0, 100);\n\n    const forward = `inset(0 ${activate(\n      isLTR ? selection : 1 - selection\n    )}% 0 0)`;\n    const backward = `inset(0 0 0 ${activate(\n      isLTR ? 1 - selection : selection\n    )}%)`;\n\n    return {\n      backward: isLTR ? backward : forward,\n      forward: isLTR ? forward : backward,\n    };\n  }\n\n  //#endregion\n\n  //#region Public methods\n\n  /**\n   * Increments the value of the control by `n` steps multiplied by the\n   * step factor.\n   */\n  public stepUp(n = 1): void {\n    this.value += this._round(n * this.step);\n  }\n\n  /**\n   * Decrements the value of the control by `n` steps multiplied by\n   * the step factor.\n   */\n  public stepDown(n = 1): void {\n    this.value -= this._round(n * this.step);\n  }\n\n  //#endregion\n\n  private _renderSymbols() {\n    const ltr = isLTR(this);\n\n    return html`\n      ${repeat(\n        range(this.max),\n        (i) => i,\n        (i) => {\n          const { forward, backward } = this._clipSymbol(i, ltr);\n          return html`\n            <igc-rating-symbol exportparts=\"symbol, full, empty\">\n              <igc-icon\n                collection=\"default\"\n                name=\"star_filled\"\n                style=${styleMap({ clipPath: forward })}\n              ></igc-icon>\n              <igc-icon\n                collection=\"default\"\n                name=\"star_outlined\"\n                style=${styleMap({ clipPath: backward })}\n                slot=\"empty\"\n              ></igc-icon>\n            </igc-rating-symbol>\n          `;\n        }\n      )}\n    `;\n  }\n\n  protected override render() {\n    const hoverActive = this.hoverPreview && this._isInteractive;\n    const valueLabelHidden = !this._slots.hasAssignedNodes('value-label', true);\n\n    return html`\n      <label part=\"label\" id=\"rating-label\" ?hidden=${!this.label}\n        >${this.label}</label\n      >\n      <div\n        part=\"base\"\n        role=\"slider\"\n        tabindex=${this.disabled ? -1 : 0}\n        aria-labelledby=\"rating-label\"\n        aria-valuemin=\"0\"\n        aria-valuenow=${this.value}\n        aria-valuemax=${this.max}\n        aria-valuetext=${this._valueText}\n      >\n        <div\n          aria-hidden=\"true\"\n          part=\"symbols\"\n          @click=${bindIf(this._isInteractive, this._handleClick)}\n          @pointerenter=${bindIf(hoverActive, this._handleHoverEnabled)}\n          @pointerleave=${bindIf(hoverActive, this._handleHoverDisabled)}\n          @pointercancel=${bindIf(hoverActive, this._handleHoverDisabled)}\n          @pointermove=${bindIf(hoverActive, this._handlePointerMove)}\n        >\n          <slot name=\"symbol\">\n            ${this._hasProjectedSymbols ? nothing : this._renderSymbols()}\n          </slot>\n        </div>\n        <label part=\"value-label\" ?hidden=${valueLabelHidden}>\n          <slot name=\"value-label\"></slot>\n        </label>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-rating': IgcRatingComponent;\n  }\n}\n"]}

package/components/resize-container/resize-controller.js

@@ -1,5 +1,5 @@
 import { createAbortHandle } from '../common/abort-handler.js';
-import { findElementFromEventPath } from '../common/util.js';
+import { getElementFromPath } from '../common/util.js';
 import { createDefaultGhostElement, getDefaultLayer } from './default-ghost.js';
 const additionalEvents = [
     'pointermove',
@@ -134,7 +134,7 @@ class ResizeController {
     _setActiveRef(event) {
         const refs = this._options.ref?.map(({ value }) => value) ?? [this._host];
         this._activeRef =
-            findElementFromEventPath((e) => refs.includes(e), event) ?? null;
+            getElementFromPath((e) => refs.includes(e), event) ?? null;
     }
     _setResizeState(enabled = true) {
         this._hasPointerCapture = enabled;