Merge branch 'master' into didimmova/input-hint-paddings

CHANGELOG.md

@@ -4,11 +4,17 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
-## Unreleased
+## [5.2.1] - 2025-01-23
 ### Added
 - #### Dialog
   - A new `message` slot that renders text content inside the dialog component has been added. The enhancement was introduced to align the design behavior between Ignite UI for WC and Ignite UI for Angular, ensuring a consistent user experience across products. The newly added `message' slot comes with additional styling with a max-width of 40 characters. The default slot is also still available for rendering content inside the dialog without limiting the component's width.
 
+### Fixed
+- #### List
+  - CSS variables are correctly consumed from internal schemas [#1538](https://github.com/IgniteUI/igniteui-webcomponents/pull/1538)
+- #### Rating
+  - Inaccurate value calculation on selection when step is set to 1 [#1548](https://github.com/IgniteUI/igniteui-webcomponents/issues/1548)
+
 ## [5.2.0] - 2025-01-09
 ### Added
 - Form-associated elements now have a `defaultValue` property (`defaultChecked` for radio buttons, checkboxes, and switches). When a form is reset, components will use this property’s value as their new value or checked state.
@@ -666,6 +672,7 @@ Initial release of Ignite UI Web Components
 - Ripple component
 - Switch component
 
+[5.2.1]: https://github.com/IgniteUI/igniteui-webcomponents/compare/5.2.0...5.2.1
 [5.2.0]: https://github.com/IgniteUI/igniteui-webcomponents/compare/5.1.2...5.2.0
 [5.1.2]: https://github.com/IgniteUI/igniteui-webcomponents/compare/5.1.1...5.1.2
 [5.1.1]: https://github.com/IgniteUI/igniteui-webcomponents/compare/5.1.0...5.1.1

src/components/combo/combo.spec.ts

@@ -1431,6 +1431,45 @@ describe('Combo', () => {
       });
     });
 
+    describe('Form integration with delayed data', () => {
+      const spec = createFormAssociatedTestBed<IgcComboComponent<City>>(html`
+        <igc-combo name="combo" value-key="id" display-key="name"></igc-combo>
+      `);
+
+      function initDataDefaultValue(single = false) {
+        spec.element.singleSelect = single;
+        // assign data after init to simulate async data
+        spec.element.data = cities;
+        spec.element.defaultValue = value;
+      }
+
+      beforeEach(async () => {
+        await spec.setup(IgcComboComponent.tagName);
+      });
+
+      it('correct initial state (single)', () => {
+        initDataDefaultValue(true);
+        spec.assertIsPristine();
+        expect(spec.element.value).to.eql([first(value)]);
+      });
+
+      it('correct initial state (multiple)', () => {
+        initDataDefaultValue();
+        spec.assertIsPristine();
+        expect(spec.element.value).to.eql(value);
+      });
+
+      it('is correctly submitted (single)', () => {
+        initDataDefaultValue(true);
+        spec.assertSubmitHasValue(first(value));
+      });
+
+      it('is correctly submitted (multiple)', () => {
+        initDataDefaultValue();
+        spec.assertSubmitHasValues(value);
+      });
+    });
+
     describe('Validation', () => {
       const spec = createFormAssociatedTestBed<IgcComboComponent<City>>(html`
         <igc-combo

src/components/combo/combo.ts

@@ -181,8 +181,13 @@ export default class IgcComboComponent<
   /* treatAsRef */
   @property({ attribute: false })
   public set data(value: T[]) {
+    if (this._data === value) {
+      return;
+    }
     this._data = asArray(value);
+    const pristine = this._pristine;
     this.value = asArray(this.value);
+    this._pristine = pristine;
     this._state.runPipeline();
   }
 

src/components/common/util.ts

@@ -16,7 +16,7 @@ export const clamp = (number: number, min: number, max: number) =>
   Math.max(min, Math.min(number, max));
 
 export function numberOfDecimals(number: number): number {
-  const decimals = last(number.toString().split('.'));
+  const [_, decimals] = number.toString().split('.');
   return decimals ? decimals.length : 0;
 }
 

src/components/rating/rating.spec.ts

@@ -306,6 +306,18 @@ describe('Rating component', () => {
       expect(el.value).to.equal(2.5);
     });
 
+    it('issue-1548 - Inaccurate value calculation when precision == 1', async () => {
+      const eventSpy = spy(el, 'emitEvent');
+
+      const symbol = getRatingSymbols(el).item(2);
+      const { x, width } = getBoundingRect(symbol);
+      // Simulate offset click when precision == 1
+      simulateClick(symbol, { clientX: x + width / 4 });
+
+      expect(eventSpy).calledOnceWithExactly('igcChange', { detail: 3 });
+      expect(el.value).to.equal(3);
+    });
+
     it('correctly reflects hover state', async () => {
       const eventSpy = spy(el, 'emitEvent');
       el.value = 2;