@ds-autonomie/web-components 2.19.0 → 2.20.0

package/dist/chunks/{chunk.HRZVG552.js → chunk.PPNCOBIW.js}

@@ -6,13 +6,13 @@ import {
 } from "./chunk.BASV2VAI.js";
 import {
   pagination_styles_default
-} from "./chunk.KAG2EIKO.js";
+} from "./chunk.EH2DQIPN.js";
 import {
   DSAPaginationButton
-} from "./chunk.O65OOIT6.js";
+} from "./chunk.BZFZTT6Z.js";
 import {
   DSAInput
-} from "./chunk.QUEYKUIS.js";
+} from "./chunk.IRBKALXJ.js";
 import {
   DSAVisuallyHidden
 } from "./chunk.JIN6PGAK.js";
@@ -27,7 +27,10 @@ import {
 } from "./chunk.34HS7ICN.js";
 import {
   DSAIcon
-} from "./chunk.CKJJ4MSU.js";
+} from "./chunk.NJQ6BFQQ.js";
+import {
+  setAttributeIfDifferent
+} from "./chunk.PSYTLBRK.js";
 import {
   watch
 } from "./chunk.QB2NJE2Y.js";
@@ -53,11 +56,17 @@ var DSAPagination = class extends LoadingStateElement {
     this.compact = false;
     this.mobile = false;
   }
-  handlePageButtonClick(event) {
-    if (event.currentTarget.value !== -1 && !event.currentTarget.selected) {
+  getPaginationButtonFromEvent(event) {
+    return event.composedPath().find((node) => {
+      return node instanceof DSAPaginationButton;
+    });
+  }
+  handleNavigationClick(event) {
+    const button = this.getPaginationButtonFromEvent(event);
+    if (button && button.value !== -1 && !button.selected) {
       this.emit("dsa-page-change", {
         detail: {
-          page: `${event.currentTarget.value}`
+          page: `${button.value}`
         }
       });
     }
@@ -68,13 +77,15 @@ var DSAPagination = class extends LoadingStateElement {
     });
   }
   handleDefaultSlotChange() {
-    var _a;
-    const select = this.querySelector("dsa-select");
-    select == null ? void 0 : select.setAttribute("size", "small");
-    select == null ? void 0 : select.setAttribute(
-      "accessible-name",
-      (_a = this.itemsPerPageLabel) != null ? _a : this.localize.term("linesPerPage")
-    );
+    var _a, _b;
+    const select = (_a = this.itemsPerPageSelect) != null ? _a : this.querySelector("dsa-select");
+    if (!select) {
+      return;
+    }
+    this.itemsPerPageSelect = select;
+    setAttributeIfDifferent(select, "size", "small");
+    const accessibleName = (_b = this.itemsPerPageLabel) != null ? _b : this.localize.term("linesPerPage");
+    setAttributeIfDifferent(select, "accessible-name", accessibleName);
   }
   updateTotalPages() {
     this.totalPages = Math.ceil(this.totalItems / this.itemsPerPage);
@@ -89,7 +100,6 @@ var DSAPagination = class extends LoadingStateElement {
           ?compact=${this.compact}
           value=${pageNumber}
           ?selected=${this.currentPage === pageNumber}
-          @click=${this.handlePageButtonClick}
         ></dsa-pagination-button>
       `;
     });
@@ -207,6 +217,7 @@ var DSAPagination = class extends LoadingStateElement {
           role="navigation"
           class="pagination__navigation"
           aria-label=${(_a = this.navAriaLabel) != null ? _a : this.localize.term("pagination")}
+          @click=${this.handleNavigationClick}
         >
           ${this.mobile && !this.compact ? html`
                 <dsa-pagination-button
@@ -214,7 +225,6 @@ var DSAPagination = class extends LoadingStateElement {
                   value="${this.currentPage - 1}"
                   ?disabled=${this.currentPage < 2}
                   class="pagination__navigation__button--mobile previous-button"
-                  @click=${this.handlePageButtonClick}
                 >
                   <dsa-icon
                     name="chevron_left"
@@ -244,7 +254,6 @@ var DSAPagination = class extends LoadingStateElement {
                   value="${this.currentPage + 1}"
                   ?disabled=${this.currentPage > this.totalPages - 1}
                   class="pagination__navigation__button--mobile next-button"
-                  @click=${this.handlePageButtonClick}
                 >
                   ${this.localize.term("nextPage")}
                   <dsa-icon
@@ -262,7 +271,6 @@ var DSAPagination = class extends LoadingStateElement {
                     value="${this.currentPage - 1}"
                     ?disabled=${this.currentPage < 2}
                     class="first-button previous-button"
-                    @click=${this.handlePageButtonClick}
                   >
                     <dsa-icon
                       name="chevron_left"
@@ -285,7 +293,6 @@ var DSAPagination = class extends LoadingStateElement {
                     value="${this.currentPage + 1}"
                     ?disabled=${this.currentPage > this.totalPages - 1}
                     class="last-button next-button"
-                    @click=${this.handlePageButtonClick}
                   >
                     ${this.compact ? html`<dsa-visually-hidden
                           >${this.localize.term(

package/dist/chunks/{chunk.EMPEBDHH.js → chunk.Q76VY2W2.js}

@@ -75,6 +75,7 @@ var input_otp_styles_default = css`
       var(--dsa-wc-transition-fast) border,
       var(--dsa-wc-transition-fast) box-shadow,
       var(--dsa-wc-transition-fast) background-color;
+    border: solid var(--dsa-wc-input-border-width) transparent;
     border-radius: var(--dsa-wc-input-border-radius);
     cursor: text;
   }
@@ -107,8 +108,7 @@ var input_otp_styles_default = css`
   /* On Layer inputs */
   .input--on-layer .single-field {
     background-color: var(--dsa-wc-input-on-layer-background-color);
-    border: solid var(--dsa-wc-input-border-width)
-      var(--dsa-wc-input-on-layer-border-color);
+    border-color: var(--dsa-wc-input-on-layer-border-color);
     color: var(--dsa-wc-input-on-layer-text-field-input-color);
   }
 
@@ -138,16 +138,10 @@ var input_otp_styles_default = css`
     border-color: var(--dsa-wc-input-on-layer-border-color-error-hover);
   }
 
-  .input--success.input--on-layer .single-field {
-    background-color: var(--dsa-wc-input-success-background-color);
-    border-color: var(--dsa-wc-input-success-border-color);
-  }
-
   /* On Base inputs */
 
   .input--on-base .single-field {
-    border: solid var(--dsa-wc-input-border-width)
-      var(--dsa-wc-input-on-base-border-color);
+    border-color: var(--dsa-wc-input-on-base-border-color);
     background-color: var(--dsa-wc-input-on-base-background-color);
     color: var(--dsa-wc-input-on-base-text-field-input-color);
   }
@@ -176,6 +170,10 @@ var input_otp_styles_default = css`
     border-color: var(--dsa-wc-input-on-base-border-color-error-hover);
   }
 
+  /*
+  * Success
+  */
+  .input--success.input--on-layer .single-field,
   .input--success.input--on-base .single-field {
     background-color: var(--dsa-wc-input-success-background-color);
     border-color: var(--dsa-wc-input-success-border-color);

package/dist/chunks/{chunk.GTO6NACR.js → chunk.QAA45XK3.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk.34HS7ICN.js";
 import {
   DSAIcon
-} from "./chunk.CKJJ4MSU.js";
+} from "./chunk.NJQ6BFQQ.js";
 import {
   watch
 } from "./chunk.QB2NJE2Y.js";

package/dist/chunks/{chunk.ODOHKR6J.js → chunk.QHEMM3XC.js}

@@ -1,24 +1,26 @@
 // src/components/input-amount/input-amount.utils.ts
 import Big from "big.js";
+var VALID_CHAR_PATTERN = /^[0-9,-]$/;
+var NAVIGATION_KEYS = /* @__PURE__ */ new Set([
+  "Escape",
+  "Backspace",
+  "Tab",
+  "ArrowLeft",
+  "ArrowRight",
+  "ArrowUp",
+  "ArrowDown",
+  "Delete",
+  "Enter",
+  "PageDown",
+  "PageUp",
+  "Home",
+  "End"
+]);
 function isInvalidAmountKey(event) {
   const hasModifier = event.metaKey || event.ctrlKey;
-  const isValidCharacter = /^[0-9,-]$/.test(event.key);
+  const isValidCharacter = VALID_CHAR_PATTERN.test(event.key);
   const isInvalidInput = !hasModifier && !isValidCharacter;
-  const isNavigationKey = [
-    "Escape",
-    "Backspace",
-    "Tab",
-    "ArrowLeft",
-    "ArrowRight",
-    "ArrowUp",
-    "ArrowDown",
-    "Delete",
-    "Enter",
-    "PageDown",
-    "PageUp",
-    "Home",
-    "End"
-  ].includes(event.key);
+  const isNavigationKey = NAVIGATION_KEYS.has(event.key);
   if (!isNavigationKey && isInvalidInput) {
     return true;
   }

package/dist/chunks/{chunk.64EGGLHL.js → chunk.QWPEXQZX.js}

@@ -35,9 +35,8 @@ var menu_item_styles_default = css`
   .menu-item--highlight::after {
     content: '';
     position: absolute;
-    top: 0;
-    left: 0;
-    bottom: 0;
+    inset-block: 0;
+    inset-inline-start: 0;
     width: 4px;
     background-color: var(--dsa-wc-menu-navigation-item-current-color);
   }
@@ -82,31 +81,26 @@ var menu_item_styles_default = css`
     cursor: not-allowed;
   }
 
-  .menu-item .menu-item__label {
+  .menu-item__label {
     flex: 1 1 auto;
     display: inline-flex;
   }
 
-  .menu-item .menu-item__prefix {
+  .menu-item__prefix,
+  .menu-item__suffix {
     flex: 0 0 auto;
     display: flex;
     align-items: center;
   }
 
-  .menu-item .menu-item__prefix::slotted(*) {
+  .menu-item__prefix::slotted(*) {
     margin-inline-end: var(--dsa-wc-menu-item-margin-inline-end);
     display: inherit;
     height: 1.25em;
     width: 1.25em;
   }
 
-  .menu-item .menu-item__suffix {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-  }
-
-  .menu-item .menu-item__suffix::slotted(*) {
+  .menu-item__suffix::slotted(*) {
     margin-inline-start: var(--dsa-wc-menu-item-margin-inline-start);
     display: inherit;
   }

package/dist/chunks/{chunk.SGPAUD26.js → chunk.RPOIITDC.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.JIN6PGAK.js";
 import {
   DSAErrorText
-} from "./chunk.5NSAEDEE.js";
+} from "./chunk.M2QIFDAP.js";
 import {
   renderFormElementErrors
 } from "./chunk.6QDM5FUA.js";

package/dist/chunks/{chunk.JATRBE3H.js → chunk.RRR5BCCP.js}

@@ -3,28 +3,28 @@ import {
 } from "./chunk.2LB4AUIL.js";
 import {
   DSAInput
-} from "./chunk.QUEYKUIS.js";
+} from "./chunk.IRBKALXJ.js";
 import {
   FilterBase
-} from "./chunk.4VSGAJJL.js";
+} from "./chunk.IRPNCLE5.js";
 import {
   scrollIntoView
 } from "./chunk.EMIT7S33.js";
 import {
   DSAOption
-} from "./chunk.SAQFLKP7.js";
-import {
-  normalizeStr
-} from "./chunk.PSYTLBRK.js";
+} from "./chunk.NPMNFNR7.js";
 import {
   DSAVisuallyHidden
 } from "./chunk.JIN6PGAK.js";
 import {
   DSAButton
-} from "./chunk.SXFVCR7O.js";
+} from "./chunk.B6XSS23Y.js";
 import {
   DSAIcon
-} from "./chunk.CKJJ4MSU.js";
+} from "./chunk.NJQ6BFQQ.js";
+import {
+  normalizeStr
+} from "./chunk.PSYTLBRK.js";
 import {
   watch
 } from "./chunk.QB2NJE2Y.js";
@@ -50,6 +50,8 @@ var DSAFilterSelect = class extends FilterBase {
     this.nbOptions = 0;
     this.seeAll = false;
     this.debounceTimerId = null;
+    this.optionsByValue = /* @__PURE__ */ new Map();
+    this.normalizedLabelsByValue = /* @__PURE__ */ new Map();
     this.value = "";
     this.multiple = false;
     this.maxVisibleListLength = 5;
@@ -64,6 +66,13 @@ var DSAFilterSelect = class extends FilterBase {
     this.nbOptions = this.allOptions.length;
     this.filterOptions();
   }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    if (this.debounceTimerId !== null) {
+      clearTimeout(this.debounceTimerId);
+      this.debounceTimerId = null;
+    }
+  }
   handleKeyDown(event) {
     super.handleKeyDown(event);
     const path = event.composedPath();
@@ -142,16 +151,16 @@ var DSAFilterSelect = class extends FilterBase {
           () => this.filterTrigger.focus({ preventScroll: true })
         );
         this.hide();
-        this.filterTrigger.focus({ preventScroll: true });
       }
     }
   }
   filterOptions() {
     if (this.searchValue.length > 0) {
+      const normalizedSearchValue = normalizeStr(this.searchValue);
       this.displayedOptions = this.allOptions.filter((option) => {
-        return normalizeStr(option.innerText).includes(
-          normalizeStr(this.searchValue)
-        );
+        var _a;
+        const normalizedLabel = (_a = this.normalizedLabelsByValue.get(option.value)) != null ? _a : normalizeStr(option.innerText);
+        return normalizedLabel.includes(normalizedSearchValue);
       });
     } else if (!this.seeAll && this.maxVisibleListLength > 0) {
       this.displayedOptions = this.allOptions.slice(
@@ -198,6 +207,8 @@ var DSAFilterSelect = class extends FilterBase {
   getAllOptions() {
     const optionsNodeList = this.querySelectorAll(OPTION_TAG);
     const allOptions = [];
+    this.optionsByValue.clear();
+    this.normalizedLabelsByValue.clear();
     optionsNodeList.forEach((option) => {
       option.role = this.multiple ? "checkbox" : "radio";
       const clonedOption = option.cloneNode(true);
@@ -207,6 +218,11 @@ var DSAFilterSelect = class extends FilterBase {
       clonedOption.classList.add("filter-select__option");
       clonedOption.onfocus = this.handleOptionFocus.bind(this);
       allOptions.push(clonedOption);
+      this.optionsByValue.set(option.value, option);
+      this.normalizedLabelsByValue.set(
+        option.value,
+        normalizeStr(clonedOption.innerText)
+      );
     });
     return allOptions;
   }
@@ -231,17 +247,22 @@ var DSAFilterSelect = class extends FilterBase {
     this.allOptions.forEach((el) => el.selected = false);
     if (newSelectedOptions.length) {
       newSelectedOptions.forEach((el) => {
+        const rootOption = this.optionsByValue.get(el.value);
+        if (!rootOption) {
+          return;
+        }
         el.selected = true;
-        this.allOptions.find(
-          (rootOption) => rootOption.value === el.value
-        ).selected = true;
+        rootOption.selected = true;
       });
     }
     this.selectionChanged();
   }
   // Toggles an option's selected state
   toggleOptionSelection(option, force) {
-    const rootOption = this.allOptions.find((el) => el.value === option.value);
+    const rootOption = this.optionsByValue.get(option.value);
+    if (!rootOption) {
+      return;
+    }
     if (force === true || force === false) {
       rootOption.selected = force;
     } else {
@@ -254,8 +275,9 @@ var DSAFilterSelect = class extends FilterBase {
     var _a, _b;
     this.selectedOptions = this.allOptions.filter((el) => el.selected);
     this.filterOptions();
+    const selectedValues = new Set(this.selectedOptions.map((el) => el.value));
     this.displayedOptions.forEach((option) => {
-      option.selected = this.selectedOptions.map((el) => el.value).includes(option.value);
+      option.selected = selectedValues.has(option.value);
     });
     if (this.multiple) {
       this.value = this.selectedOptions.map((el) => el.value);

package/dist/chunks/{chunk.FBY2IM6R.js → chunk.SC6ST3JE.js}

@@ -151,6 +151,7 @@ var DSAInternalDateField = class extends ShoelaceElement {
     this.lastPressedKey = "";
     this.internalValueChange = false;
     this.previousTentativeDate = "";
+    this.previousSpinbuttonValue = /* @__PURE__ */ new WeakMap();
     this.parentName = "";
     this.description = "";
     this.name = "";
@@ -237,10 +238,11 @@ var DSAInternalDateField = class extends ShoelaceElement {
     const tentativeDate = `${tempSelectedYear}-${tempSelectedMonth}-${tempSelectedDay}`;
     const allFilled = tempSelectedDay !== "" && tempSelectedMonth !== "" && tempSelectedYear !== "";
     const allEmpty = tempSelectedDay === "" && tempSelectedMonth === "" && tempSelectedYear === "";
+    const isTentativeDateValid = isValidDate(tentativeDate);
     if (allEmpty) {
       this.setCustomValidity("");
       this.value = "";
-    } else if (!isValidDate(tentativeDate)) {
+    } else if (!isTentativeDateValid) {
       this.setCustomValidity(this.localize.term("invalidDate"));
       this.value = "";
     } else {
@@ -249,7 +251,7 @@ var DSAInternalDateField = class extends ShoelaceElement {
     }
     this.internalValueChange = true;
     this.formControlController.updateValidity();
-    if (!isValidDate(tentativeDate)) {
+    if (!isTentativeDateValid) {
       this.formControlController.emitInvalidEvent(event);
     }
     if (this.value !== previousValue || tentativeDate !== this.previousTentativeDate && (allFilled || allEmpty)) {
@@ -274,6 +276,7 @@ var DSAInternalDateField = class extends ShoelaceElement {
   }
   handleSpinbuttonKeydown(event2) {
     const currentInput = event2.currentTarget;
+    this.previousSpinbuttonValue.set(currentInput, currentInput.value);
     this.lastPressedKey = event2.key;
     if (event2.key === "Dead") {
       currentInput.blur();
@@ -298,12 +301,17 @@ var DSAInternalDateField = class extends ShoelaceElement {
     }
   }
   handleSpinbuttonInput(event2) {
+    var _a;
     event2.stopPropagation();
     const currentTarget = event2.currentTarget;
+    const previousSpinbuttonValue = (_a = this.previousSpinbuttonValue.get(currentTarget)) != null ? _a : "";
     if (Number(currentTarget.value) > Number(currentTarget.max)) {
-      currentTarget.value = currentTarget.value.slice(-1);
+      const shouldKeepPreviousValue = currentTarget === this.yearInput && previousSpinbuttonValue !== "";
+      currentTarget.value = shouldKeepPreviousValue ? previousSpinbuttonValue : currentTarget.value.slice(-1);
       event2.preventDefault();
-      this.focusNextSpinbutton(currentTarget);
+      if (!shouldKeepPreviousValue) {
+        this.focusNextSpinbutton(currentTarget);
+      }
     }
     if (currentTarget.value !== "") {
       currentTarget.value = parseInt(currentTarget.value).toString();
@@ -323,7 +331,8 @@ var DSAInternalDateField = class extends ShoelaceElement {
         this.selectedYear = currentTarget.value;
         break;
     }
-    if (!["ArrowUp", "ArrowDown"].includes(this.lastPressedKey) && Number(`${currentTarget.value}0`) > Number(currentTarget.max)) {
+    const shouldMoveToNextBecauseLeadingZero = currentTarget !== this.yearInput && previousSpinbuttonValue === "00" && currentTarget.value !== "00" && currentTarget.value.startsWith("0");
+    if (!["ArrowUp", "ArrowDown"].includes(this.lastPressedKey) && (shouldMoveToNextBecauseLeadingZero || Number(`${currentTarget.value}0`) > Number(currentTarget.max))) {
       this.focusNextSpinbutton(currentTarget);
     }
     this.setCustomValidity("");
@@ -370,14 +379,10 @@ var DSAInternalDateField = class extends ShoelaceElement {
       this.selectedMonth = "";
       this.selectedYear = "";
     } else {
-      this.selectedDay = `${getDateFromISO(this.value).getDate()}`.padStart(
-        2,
-        "0"
-      );
-      this.selectedMonth = `${getDateFromISO(this.value).getMonth() + 1}`.padStart(2, "0");
-      this.selectedYear = `${getDateFromISO(
-        this.value
-      ).getFullYear()}`.padStart(4, "0");
+      const parsedDate = getDateFromISO(this.value);
+      this.selectedDay = `${parsedDate.getDate()}`.padStart(2, "0");
+      this.selectedMonth = `${parsedDate.getMonth() + 1}`.padStart(2, "0");
+      this.selectedYear = `${parsedDate.getFullYear()}`.padStart(4, "0");
     }
     await this.updateComplete;
     this.setCustomValidity("");

package/dist/chunks/{chunk.CFBX4SXO.js → chunk.SEMHY47B.js}

@@ -1,6 +1,6 @@
 import {
   footer_mandatory_mentions_styles_default
-} from "./chunk.K27SKJCO.js";
+} from "./chunk.74CLWWSO.js";
 import {
   DSADivider
 } from "./chunk.QGI766JC.js";

package/dist/chunks/{chunk.E6D32GY2.js → chunk.SUX4XQKB.js}

@@ -1,9 +1,9 @@
 import {
   DSATableRow
-} from "./chunk.LH65ZIEN.js";
+} from "./chunk.5WXGUCD2.js";
 import {
   DSATableHeaderCell
-} from "./chunk.TURUUPFG.js";
+} from "./chunk.EDEPWRFC.js";
 import {
   table_header_row_styles_default
 } from "./chunk.VO73SGIU.js";

package/dist/chunks/{chunk.QKT5LLDM.js → chunk.T4XADGK3.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.ZQJVCRB2.js";
 import {
   DSAIcon
-} from "./chunk.CKJJ4MSU.js";
+} from "./chunk.NJQ6BFQQ.js";
 import {
   watch
 } from "./chunk.QB2NJE2Y.js";

package/dist/chunks/{chunk.J476JEKY.js → chunk.T7O6NKFH.js}

@@ -42,7 +42,7 @@ var DSANavbarLink = class extends ShoelaceElement {
       "navbar-link--desktop": !this.mobile
     })}
         href=${this.href}
-        target="${ifDefined(this.target)}"
+        target=${ifDefined(this.target)}
         rel=${ifDefined(this.rel)}
         aria-current=${ifDefinedAndNotEmpty(this.current)}
         @focus=${this.handleFocus}

package/dist/chunks/{chunk.YI6BUIUL.js → chunk.TGQQJI2E.js}

@@ -1,12 +1,12 @@
 import {
   input_date_styles_default
-} from "./chunk.UHF3BDIM.js";
+} from "./chunk.M2RDCDKZ.js";
 import {
   InputBase
-} from "./chunk.WMFEJDPX.js";
+} from "./chunk.DE3HY2DW.js";
 import {
   DSAInternalDateField
-} from "./chunk.FBY2IM6R.js";
+} from "./chunk.SC6ST3JE.js";
 import {
   DSAPopup
 } from "./chunk.GYWU4AAB.js";
@@ -21,7 +21,7 @@ import {
 } from "./chunk.OYVF3HNG.js";
 import {
   DSAIconButton
-} from "./chunk.WNESPUKK.js";
+} from "./chunk.MWPOWC6N.js";
 import {
   waitForEvent
 } from "./chunk.B4BZKR24.js";
@@ -36,6 +36,9 @@ import {
 import {
   LocalizeController
 } from "./chunk.34HS7ICN.js";
+import {
+  setAttributeIfDifferent
+} from "./chunk.PSYTLBRK.js";
 import {
   watch
 } from "./chunk.QB2NJE2Y.js";
@@ -125,9 +128,14 @@ var DSAInputDate = class extends InputBase {
     this.shouldDisableDate = this.shouldDisableDate.bind(this);
   }
   async firstUpdated() {
-    var _a;
     await this.updateComplete;
-    (_a = this.datepickerButton) == null ? void 0 : _a.button.setAttribute("aria-expanded", "false");
+    if (this.datepickerButton) {
+      setAttributeIfDifferent(
+        this.datepickerButton.button,
+        "aria-expanded",
+        "false"
+      );
+    }
     this.formControlController.updateValidity();
   }
   addOpenListeners() {
@@ -298,7 +306,11 @@ var DSAInputDate = class extends InputBase {
       this.addOpenListeners();
       await stopAnimations(this);
       this.popup.active = true;
-      this.datepickerButton.button.setAttribute("aria-expanded", "true");
+      setAttributeIfDifferent(
+        this.datepickerButton.button,
+        "aria-expanded",
+        "true"
+      );
       const { keyframes, options } = getAnimation(this, "date-popup.show", {
         dir: this.localize.dir()
       });
@@ -309,7 +321,11 @@ var DSAInputDate = class extends InputBase {
       this.removeOpenListeners();
       await stopAnimations(this);
       this.popup.active = false;
-      this.datepickerButton.button.setAttribute("aria-expanded", "false");
+      setAttributeIfDifferent(
+        this.datepickerButton.button,
+        "aria-expanded",
+        "false"
+      );
       this.datepickerButton.focus({ preventScroll: true });
       const { keyframes, options } = getAnimation(this, "date-popup.hide", {
         dir: this.localize.dir()

package/dist/chunks/{chunk.KIN7BJ2S.js → chunk.TILFUJJ2.js}

@@ -17,7 +17,6 @@ var progress_ring_styles_default = css`
     gap: var(--dsa-wc-progress-bar-small-gap);
     height: var(--size);
   }
-
   .progress-ring.progress-ring--medium {
     --size: var(--dsa-wc-progress-bar-size);
     --track-width: var(--dsa-wc-progress-bar-track-width);
@@ -39,6 +38,7 @@ var progress_ring_styles_default = css`
     rotate: -90deg;
     transform-origin: 50% 50%;
     flex-shrink: 0;
+    will-change: transform;
   }
 
   .progress-ring__track,
@@ -57,18 +57,17 @@ var progress_ring_styles_default = css`
     stroke: var(--dsa-wc-progress-ring-track-color);
     stroke-width: var(--track-width);
   }
-
   .progress-ring__indicator {
     stroke: var(--dsa-wc-progress-ring-content-color);
     stroke-width: var(--indicator-width);
     stroke-linecap: round;
-    transition-property: stroke-dashoffset;
-    transition-duration: var(--indicator-transition-duration);
+    transition: stroke-dashoffset var(--indicator-transition-duration);
     stroke-dasharray: var(--circumference) var(--circumference);
     /* stylelint-disable-next-line */
     stroke-dashoffset: calc(
       var(--circumference) - var(--percentage) * var(--circumference)
     );
+    will-change: stroke-dashoffset;
   }
 
   .progress-ring__label {