npm - @uh-design-system/component-library - Versions diffs - 1.4.0-rc.1 → 1.4.0-rc.2 - Mend

@uh-design-system/component-library 1.4.0-rc.1 → 1.4.0-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2332) hide show

package/dist/components/ds-ribbon.js CHANGED Viewed

@@ -1,18 +1,18 @@
-import { p as proxyCustomElement, H, c as createEvent, h } from './p-DaqCt6bT.js';
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-GalXVdFP.js';
 import { c as classNames } from './p-BfTCfPZ1.js';
 import { b as inheritSpecifiedAttributes, i as inheritAriaAttributes } from './p-BecId8t2.js';
 import { i as idGenerator, t as transformTagName, d as declareComponentDependencies } from './p-J5Ghj1_T.js';
-import { c as cx } from './p-nu9LDvw9.js';
-import { v as visuallyHiddenAssistiveText } from './p-CMxsLaxm.js';
-import { d as defaultLanguage, g as getLanguage, o as onChange } from './p-BiwrhYeU.js';
+import { c as cx } from './p-C34PGDVY.js';
+import { v as visuallyHiddenAssistiveText } from './p-CFr-8gB_.js';
+import { d as defaultLanguage, g as getLanguage, o as onChange } from './p-B71giUZh.js';
 import { a as appData } from './p-gPkqWfeS.js';
-import { d as defineCustomElement$8 } from './p-Cx_QVu9h.js';
-import { d as defineCustomElement$7 } from './p-C0tiltnd.js';
-import { d as defineCustomElement$6 } from './p-BpKGj6FM.js';
-import { d as defineCustomElement$5 } from './p-BMI089hh.js';
-import { d as defineCustomElement$4 } from './p-KU9nm6J4.js';
-import { d as defineCustomElement$3 } from './p-BqwR7_jH.js';
-import { d as defineCustomElement$2 } from './p-dwuHGzKc.js';
+import { d as defineCustomElement$8 } from './p-CBTcmEBq.js';
+import { d as defineCustomElement$7 } from './p-DIxFOW85.js';
+import { d as defineCustomElement$6 } from './p-47OG_OLT.js';
+import { d as defineCustomElement$5 } from './p-qN7q9daC.js';
+import { d as defineCustomElement$4 } from './p-Dq55XDgV.js';
+import { d as defineCustomElement$3 } from './p-DcrTglyg.js';
+import { d as defineCustomElement$2 } from './p-Cq_RwLX7.js';
 const convertToRibbonLinks = (links, ribbonData, lang = 'en') => {
     return links.map(link => ({
@@ -50,7 +50,7 @@ class DataService {
     }
 }
-const dsRibbonCss = ".ds-no-style-leak *,.ds-ribbon__MGLLcm,.ds-ribbon__MGLLcm :where([class*=__MGLLcm]){all:unset;box-sizing:border-box}.ds-no-style-leak *{display:block}:host{display:block;width:100%;border-bottom:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light, #ccc);background-color:var(--ds-bgColor-white, #fff);position:relative;z-index:1000}.ds-ribbon__MGLLcm{display:block}.ds-ribbon__MGLLcm__container{display:grid;grid-template-columns:8rem auto;align-items:center;justify-content:space-between;padding:0 var(--ds-spacing-small, 16px);max-width:120rem;margin:0 auto;height:3rem}@media (min-width: 30rem){.ds-ribbon__MGLLcm__container{grid-template-columns:auto auto}}@media (min-width: 60rem){.ds-ribbon__MGLLcm__container{grid-template-columns:145px auto;padding:0 var(--ds-spacing-large, 32px)}}@media (min-width: 75rem){.ds-ribbon__MGLLcm__container{grid-template-columns:auto auto}}.ds-ribbon__MGLLcm__branding{display:flex;align-items:center;flex-shrink:0}.ds-ribbon__MGLLcm__mobile-toggle{display:block;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__MGLLcm__mobile-toggle{display:none}}.ds-ribbon__MGLLcm__drawer-backdrop{position:fixed;inset:0;background-color:var(--ds-overlay-black-00);grid-column-end:-1;opacity:0;z-index:-1;pointer-events:none}@media (min-width: 60rem){.ds-ribbon__MGLLcm__drawer-backdrop{display:none}}.ds-ribbon__MGLLcm--drawer-open .ds-ribbon__MGLLcm__drawer-backdrop{cursor:pointer;pointer-events:auto}@media (min-width: 60rem){.ds-ribbon__MGLLcm__drawer-backdrop{pointer-events:auto;z-index:1}.ds-ribbon__MGLLcm__drawer-backdrop,.ds-ribbon__MGLLcm--drawer-open .ds-ribbon__MGLLcm__container .ds-ribbon__MGLLcm__drawer-backdrop{position:static;background-color:unset;backdrop-filter:unset;opacity:1;transition:none}}.ds-ribbon__MGLLcm--drawer-clicked .ds-ribbon__MGLLcm__drawer-backdrop{transition:background-color 0.3s, opacity 0s 0.3s}.ds-ribbon__MGLLcm--drawer-open .ds-ribbon__MGLLcm__drawer-backdrop{background-color:var(--ds-overlay-black-50);opacity:1;transition:background-color 0.1s 0.3s, opacity 0s 0s;z-index:999}.ds-ribbon__MGLLcm__desktop-nav{display:none;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__MGLLcm__desktop-nav{display:block}}.ds-ribbon__MGLLcm__desktop-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;gap:var(--ds-spacing-medium, 24px);align-items:center}.ds-ribbon__MGLLcm__desktop-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__MGLLcm__desktop-link{font-size:var(--ds-fontSize-12, 0.75rem);white-space:nowrap}.ds-ribbon__MGLLcm__desktop-badge{font-size:var(--ds-font-size-small, 12px);letter-spacing:var(--ds-letterSpacing-wide, 0);margin-left:var(--ds-spacing-2xSmall, 8px);text-transform:none;position:absolute;top:0;right:100%}.ds-ribbon__MGLLcm__desktop-badge>*{display:flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;border-radius:1.25rem;padding:0 var(--ds-spacing-2xSmall, 0.5rem)}.ds-ribbon__MGLLcm__desktop-badge>* span{font-size:inherit;line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}.ds-ribbon__MGLLcm__drawer{position:absolute;top:0;right:0;bottom:0;width:calc(100% - var(--ds-spacing-small, 16px));background-color:var(--ds-bgColor-white, #fff);box-shadow:var(--ds-shadow-medium);padding-top:0;transform:translateX(100%);transition:transform 0.3s ease;overflow-y:auto;cursor:default}@media (min-width: 60rem){.ds-ribbon__MGLLcm__drawer{position:static;width:auto;max-width:none;background-color:transparent;box-shadow:none;padding-top:0;transform:none;transition:none;overflow-y:visible}}.ds-ribbon__MGLLcm--drawer-open .ds-ribbon__MGLLcm__drawer{transform:translateX(0%)}.ds-ribbon__MGLLcm__drawer-header{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;height:3rem;z-index:1;padding:var(--ds-spacing-small, 16px) var(--ds-spacing-medium, 24px);border-bottom:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light, #ccc);background-color:var(--ds-bgColor-white, #fff)}@media (min-width: 60rem){.ds-ribbon__MGLLcm__drawer-header{display:none}}.ds-ribbon__MGLLcm__drawer-branding{display:flex;align-items:center;flex-shrink:0;max-width:8rem}@media (min-width: 30rem){.ds-ribbon__MGLLcm__drawer-branding{max-width:unset}}.ds-ribbon__MGLLcm__drawer-close{flex-shrink:0;margin-left:var(--ds-spacing-small, 16px)}.ds-ribbon__MGLLcm__drawer-nav{display:block;padding:var(--ds-spacing-medium, 24px);position:relative}@media (min-width: 60rem){.ds-ribbon__MGLLcm__drawer-nav{padding:0}}.ds-ribbon__MGLLcm__top-scrim,.ds-ribbon__MGLLcm__bottom-scrim{pointer-events:none;width:100%;height:2.75rem;margin-top:-2.75rem;flex:0 0 auto;min-height:0;position:sticky;z-index:1;display:none}.ds-ribbon__MGLLcm__top-scrim{top:3rem;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-ribbon__MGLLcm__bottom-scrim{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.has-top-scrim .ds-ribbon__MGLLcm__top-scrim{display:block}.has-bottom-scrim .ds-ribbon__MGLLcm__bottom-scrim{display:block}.ds-ribbon__MGLLcm__drawer-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--ds-spacing-4xSmall, 2px)}.ds-ribbon__MGLLcm__drawer-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;border-bottom:var(--ds-borderWidth-hairline) solid var(--ds-color-border-subtle);height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__MGLLcm__drawer-link-item:last-child{border-bottom:none}@media (min-width: 60rem){.ds-ribbon__MGLLcm__drawer-link-item{justify-content:flex-start;padding:0;border-bottom:none}.ds-ribbon__MGLLcm__drawer-link-item:last-child{border-bottom:none}}.ds-ribbon__MGLLcm__drawer-link{font-size:var(--ds-fontSize-14, 0.875rem);white-space:nowrap}@media (min-width: 60rem){.ds-ribbon__MGLLcm__drawer-link{font-size:var(--ds-fontSize-12, 0.75rem)}}.ds-ribbon__MGLLcm__drawer-badge{font-size:var(--ds-font-size-small, 12px);letter-spacing:var(--ds-letterSpacing-wide, 0);margin-left:var(--ds-spacing-2xSmall, 8px);text-transform:none}@media (min-width: 60rem){.ds-ribbon__MGLLcm__drawer-badge{position:absolute;top:0;right:100%}}.ds-ribbon__MGLLcm__drawer-badge>*{display:flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;border-radius:1.25rem;padding:0 var(--ds-spacing-2xSmall, 0.5rem)}.ds-ribbon__MGLLcm__drawer-badge>* span{font-size:inherit;line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}:host(.ds-ribbon__MGLLcm--drawer-open) .ds-ribbon__MGLLcm__drawer-backdrop{display:block}@media (min-width: 60rem){:host(.ds-ribbon__MGLLcm--drawer-open) .ds-ribbon__MGLLcm__drawer-backdrop{display:block}}:host(.ds-ribbon__MGLLcm--drawer-open) .ds-ribbon__MGLLcm__drawer{transform:translateX(0)}@media (min-width: 60rem){:host(.ds-ribbon__MGLLcm--drawer-open) .ds-ribbon__MGLLcm__drawer{transform:none}}";
+const dsRibbonCss = ".ds-no-style-leak *{all:unset;box-sizing:border-box;display:block}:host{display:block;width:100%;border-bottom:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light, #ccc);background-color:var(--ds-bgColor-white, #fff);position:relative;z-index:1000}.ds-ribbon__oSBnIJ{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);display:block}.ds-ribbon__oSBnIJ__container{display:grid;grid-template-columns:8rem auto;align-items:center;justify-content:space-between;padding:0 var(--ds-spacing-small, 16px);max-width:120rem;margin:0 auto;height:3rem}@media (min-width: 30rem){.ds-ribbon__oSBnIJ__container{grid-template-columns:auto auto}}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__container{grid-template-columns:145px auto;padding:0 var(--ds-spacing-large, 32px)}}@media (min-width: 75rem){.ds-ribbon__oSBnIJ__container{grid-template-columns:auto auto}}.ds-ribbon__oSBnIJ__branding{display:flex;align-items:center;flex-shrink:0}.ds-ribbon__oSBnIJ__mobile-toggle{display:block;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__mobile-toggle{display:none}}.ds-ribbon__oSBnIJ__drawer-backdrop{position:fixed;inset:0;background-color:var(--ds-overlay-black-00);grid-column-end:-1;opacity:0;z-index:-1;pointer-events:none}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-backdrop{display:none}}.ds-ribbon__oSBnIJ--drawer-open .ds-ribbon__oSBnIJ__drawer-backdrop{cursor:pointer;pointer-events:auto}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-backdrop{pointer-events:auto;z-index:1}.ds-ribbon__oSBnIJ__drawer-backdrop,.ds-ribbon__oSBnIJ--drawer-open .ds-ribbon__oSBnIJ__container .ds-ribbon__oSBnIJ__drawer-backdrop{position:static;background-color:unset;backdrop-filter:unset;opacity:1;transition:none}}.ds-ribbon__oSBnIJ--drawer-clicked .ds-ribbon__oSBnIJ__drawer-backdrop{transition:background-color 0.3s, opacity 0s 0.3s}.ds-ribbon__oSBnIJ--drawer-open .ds-ribbon__oSBnIJ__drawer-backdrop{background-color:var(--ds-overlay-black-50);opacity:1;transition:background-color 0.1s 0.3s, opacity 0s 0s;z-index:999}.ds-ribbon__oSBnIJ__desktop-nav{display:none;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__desktop-nav{display:block}}.ds-ribbon__oSBnIJ__desktop-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;gap:var(--ds-spacing-medium, 24px);align-items:center}.ds-ribbon__oSBnIJ__desktop-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__oSBnIJ__desktop-link{font-size:var(--ds-fontSize-12);white-space:nowrap}.ds-ribbon__oSBnIJ__desktop-badge{font-size:var(--ds-fontSize-12);letter-spacing:var(--ds-letterSpacing-wide, 0);margin-left:var(--ds-spacing-2xSmall, 8px);text-transform:none;position:absolute;top:0;right:100%}.ds-ribbon__oSBnIJ__desktop-badge>*{display:flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;border-radius:1.25rem;padding:0 var(--ds-spacing-2xSmall, 0.5rem)}.ds-ribbon__oSBnIJ__desktop-badge>* span{font-size:var(--ds-fontSize-12);line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}.ds-ribbon__oSBnIJ__drawer{position:absolute;top:0;right:0;bottom:0;width:calc(100% - var(--ds-spacing-small, 16px));background-color:var(--ds-bgColor-white, #fff);box-shadow:var(--ds-shadow-medium);padding-top:0;transform:translateX(100%);transition:transform 0.3s ease;overflow-y:auto;cursor:default}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer{position:static;width:auto;max-width:none;background-color:transparent;box-shadow:none;padding-top:0;transform:none;transition:none;overflow-y:visible}}.ds-ribbon__oSBnIJ--drawer-open .ds-ribbon__oSBnIJ__drawer{transform:translateX(0%)}.ds-ribbon__oSBnIJ__drawer-header{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;height:3rem;z-index:1;padding:var(--ds-spacing-small, 16px) var(--ds-spacing-medium, 24px);border-bottom:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light, #ccc);background-color:var(--ds-bgColor-white, #fff)}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-header{display:none}}.ds-ribbon__oSBnIJ__drawer-branding{display:flex;align-items:center;flex-shrink:0;max-width:8rem}@media (min-width: 30rem){.ds-ribbon__oSBnIJ__drawer-branding{max-width:unset}}.ds-ribbon__oSBnIJ__drawer-close{flex-shrink:0;margin-left:var(--ds-spacing-small, 16px)}.ds-ribbon__oSBnIJ__drawer-nav{display:block;padding:var(--ds-spacing-medium, 24px);position:relative}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-nav{padding:0}}.ds-ribbon__oSBnIJ__top-scrim,.ds-ribbon__oSBnIJ__bottom-scrim{pointer-events:none;width:100%;height:2.75rem;margin-top:-2.75rem;flex:0 0 auto;min-height:0;position:sticky;z-index:1;display:none}.ds-ribbon__oSBnIJ__top-scrim{top:3rem;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-ribbon__oSBnIJ__bottom-scrim{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.has-top-scrim .ds-ribbon__oSBnIJ__top-scrim{display:block}.has-bottom-scrim .ds-ribbon__oSBnIJ__bottom-scrim{display:block}.ds-ribbon__oSBnIJ__drawer-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--ds-spacing-4xSmall, 2px)}.ds-ribbon__oSBnIJ__drawer-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;border-bottom:var(--ds-borderWidth-hairline) solid var(--ds-color-border-subtle);height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__oSBnIJ__drawer-link-item:last-child{border-bottom:none}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-link-item{justify-content:flex-start;padding:0;border-bottom:none}.ds-ribbon__oSBnIJ__drawer-link-item:last-child{border-bottom:none}}.ds-ribbon__oSBnIJ__drawer-link{font-size:var(--ds-fontSize-14, 0.875rem);white-space:nowrap}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-link{font-size:var(--ds-fontSize-12, 0.75rem)}}.ds-ribbon__oSBnIJ__drawer-badge{font-size:var(--ds-fontSize-12);letter-spacing:var(--ds-letterSpacing-wide, 0);margin-left:var(--ds-spacing-2xSmall, 8px);text-transform:none}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-badge{position:absolute;top:0;right:100%}}.ds-ribbon__oSBnIJ__drawer-badge>*{display:flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;border-radius:1.25rem;padding:0 var(--ds-spacing-2xSmall, 0.5rem)}.ds-ribbon__oSBnIJ__drawer-badge>* span{font-size:inherit;line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}:host(.ds-ribbon__oSBnIJ--drawer-open) .ds-ribbon__oSBnIJ__drawer-backdrop{display:block}@media (min-width: 60rem){:host(.ds-ribbon__oSBnIJ--drawer-open) .ds-ribbon__oSBnIJ__drawer-backdrop{display:block}}:host(.ds-ribbon__oSBnIJ--drawer-open) .ds-ribbon__oSBnIJ__drawer{transform:translateX(0)}@media (min-width: 60rem){:host(.ds-ribbon__oSBnIJ--drawer-open) .ds-ribbon__oSBnIJ__drawer{transform:none}}";
 const fallbackRibbonData = appData.v1.ribbon;
 const DsRibbon$1 = proxyCustomElement(class DsRibbon extends H {
@@ -406,7 +406,7 @@ const DsRibbon$1 = proxyCustomElement(class DsRibbon extends H {
             [`${baseClass}--drawer-open`]: this.isMobileDrawerOpen,
             [`${baseClass}--drawer-clicked`]: this.isMobileDrawerClicked,
         });
-        return (h("div", { key: 'aca91198910a470bb2a022b72a1988f24dfe11bf', class: ribbonClasses }, h("nav", { key: '44262e40790d77063eb9be74a8636886e7bc7ed5', "aria-label": this.localizedNavAriaLabel, ...(this.isMobileDrawerOpen ? { inert: true } : {}) }, h("div", { key: 'dd808d534c01a8224173e77ffb83f3d58bb08f1c', class: `${baseClass}__container`, ...this.inheritedAttributes }, this.renderBranding(), this.renderDesktopNavigation(), this.renderMobileToggle())), this.renderMobileNavigation()));
+        return (h("div", { key: '87e9bae7c9e635fb51e618d1027829725bf9701f', class: ribbonClasses }, h("nav", { key: '66425f1bbea02075de67220e9faead1d04cf36c0', "aria-label": this.localizedNavAriaLabel, ...(this.isMobileDrawerOpen ? { inert: true } : {}) }, h("div", { key: 'e19044437b0739fe43d9f22e5e9f0e528e214902', class: `${baseClass}__container`, ...this.inheritedAttributes }, this.renderBranding(), this.renderDesktopNavigation(), this.renderMobileToggle())), this.renderMobileNavigation()));
     }
     static get watchers() { return {
         "dsIcon": ["dsIconObserver"],

package/dist/components/ds-select-native.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { D as DsSelectNative$1, d as defineCustomElement$1 } from './p-D_czFJ5S.js';
+import { D as DsSelectNative$1, d as defineCustomElement$1 } from './p-DFoE5OTe.js';
 const DsSelectNative = DsSelectNative$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ds-select.js CHANGED Viewed

@@ -1,24 +1,24 @@
-import { p as proxyCustomElement, M as Mixin, c as createEvent, f as forceUpdate, h, d as Host } from './p-DaqCt6bT.js';
+import { p as proxyCustomElement, M as Mixin, c as createEvent, f as forceUpdate, h, d as Host } from './p-GalXVdFP.js';
 import { c as classNames } from './p-BfTCfPZ1.js';
 import { i as idGenerator, t as transformTagName, c as componentOnReady, b as debounce, a as ifDefined, d as declareComponentDependencies } from './p-J5Ghj1_T.js';
-import { k as selectAnOption, c as atLeastOneOption, f as thereAreOptionsToBrowse, l as loadingOptions, w as weCouldNotLoadOptions, b as tryAgainOrIfTheProblemPersists, r as removeSelection, h as selections } from './p-BnNKl24s.js';
-import { c as cx } from './p-nu9LDvw9.js';
+import { k as selectAnOption, c as atLeastOneOption, f as thereAreOptionsToBrowse, l as loadingOptions, w as weCouldNotLoadOptions, b as tryAgainOrIfTheProblemPersists, r as removeSelection, h as selections } from './p-BGV-ubOj.js';
+import { c as cx } from './p-C34PGDVY.js';
 import { i as inheritAriaAttributes, a as inheritAttributes } from './p-BecId8t2.js';
 import { F as FEEDBACK_RESET_TIMEOUT } from './p-BT1Kxodd.js';
-import { m as multipleValueFactory } from './p-Bnm8qs-U.js';
+import { m as multipleValueFactory } from './p-Cl9h0hQc.js';
 import { d as disableEventsFactory } from './p-B3JeAI4k.js';
-import { d as defineCustomElement$b } from './p-BBeZy2di.js';
-import { d as defineCustomElement$a } from './p-Cx_QVu9h.js';
-import { d as defineCustomElement$9 } from './p-DZtdqGZv.js';
-import { d as defineCustomElement$8 } from './p-qpKlR6YQ.js';
-import { d as defineCustomElement$7 } from './p-C0tiltnd.js';
-import { d as defineCustomElement$6 } from './p-QWTtFnF3.js';
-import { d as defineCustomElement$5 } from './p-DGEKSNo2.js';
-import { d as defineCustomElement$4 } from './p-D_czFJ5S.js';
-import { d as defineCustomElement$3 } from './p-KU9nm6J4.js';
-import { d as defineCustomElement$2 } from './p-dwuHGzKc.js';
+import { d as defineCustomElement$b } from './p-BtwuVYMk.js';
+import { d as defineCustomElement$a } from './p-CBTcmEBq.js';
+import { d as defineCustomElement$9 } from './p-cVo5wigC.js';
+import { d as defineCustomElement$8 } from './p-3TYR8XT2.js';
+import { d as defineCustomElement$7 } from './p-DIxFOW85.js';
+import { d as defineCustomElement$6 } from './p-BVcTj6fF.js';
+import { d as defineCustomElement$5 } from './p-CtRrVwoy.js';
+import { d as defineCustomElement$4 } from './p-DFoE5OTe.js';
+import { d as defineCustomElement$3 } from './p-Dq55XDgV.js';
+import { d as defineCustomElement$2 } from './p-Cq_RwLX7.js';
-const dsSelectCss = ".sc-ds-select-h{display:inline-block;width:100%}@media (min-width: 30rem){:not(:has(.ds-select__MGLLcm--full-width)).sc-ds-select-h{width:20rem}}.sc-ds-select-h>div.sc-ds-select{display:flex;flex-direction:column;position:relative}.ds-select__MGLLcm-custom.sc-ds-select{position:relative;display:flex;align-items:center;border:var(--ds-borderWidth-thin) solid var(--ds-borderColor-default);background-color:var(--ds-bgColor-white);color:var(--ds-textColor-secondary);cursor:pointer;box-sizing:border-box;height:2.75rem;width:100%}.ds-select__MGLLcm-custom__dropdown-icon.sc-ds-select{cursor:pointer;align-items:center;align-self:stretch;border-left:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-disabled-onLight);color:var(--ds-textColor-secondary);z-index:2;pointer-events:none;padding:0 var(--ds-spacing-2xSmall)}.ds-select__MGLLcm-custom-wrapper.sc-ds-select{position:relative}.ds-select__MGLLcm-custom.sc-ds-select .ds-options__MGLLcm.sc-ds-select{display:block}.ds-select__MGLLcm-custom-input-container.sc-ds-select{display:flex;position:relative}.ds-select__MGLLcm-custom-input-container.sc-ds-select:has(.ds-select__MGLLcm-custom__clear-button:hover) .ds-select__MGLLcm-custom.sc-ds-select{background-color:var(--ds-bgColor-white-hover) !important}.ds-select__MGLLcm-custom.sc-ds-select:not(.ds-select__MGLLcm-custom--open,.ds-select__MGLLcm-custom--invalid.sc-ds-select,.ds-select__MGLLcm-custom--disabled).sc-ds-select:hover{background-color:var(--ds-bgColor-white-hover)}.ds-select__MGLLcm-custom.sc-ds-select:active:not(.ds-select__MGLLcm-custom--open,.ds-select__MGLLcm-custom--invalid.sc-ds-select,.ds-select__MGLLcm-custom--disabled).sc-ds-select{background-color:var(--ds-bgColor-white-active)}.ds-select__MGLLcm-custom--open.sc-ds-select,.ds-select__MGLLcm-custom.sc-ds-select:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-select__MGLLcm-custom--open.sc-ds-select:not(.ds-select__MGLLcm-custom--open--invalid,.ds-select__MGLLcm-custom.sc-ds-select:focus-visible--invalid),.ds-select__MGLLcm-custom.sc-ds-select:focus-visible:not(.ds-select__MGLLcm-custom--open--invalid,.ds-select__MGLLcm-custom.sc-ds-select:focus-visible--invalid){border-color:var(--ds-borderColor-primary)}.ds-select__MGLLcm-custom--disabled.sc-ds-select{background-color:var(--ds-bgColor-disabled-onLight);border-color:var(--ds-borderColor-disabled-onLight);color:var(--ds-textColor-disabled-onLight);cursor:not-allowed}.ds-select__MGLLcm-custom--disabled.sc-ds-select .ds-select__MGLLcm-custom__dropdown-icon.sc-ds-select{color:var(--ds-textColor-disabled-onLight);border-left-color:var(--ds-borderColor-disabled-onLight);cursor:not-allowed}.ds-select__MGLLcm-custom--invalid.sc-ds-select{background-color:var(--ds-bgColor-danger);border-color:var(--ds-borderColor-danger)}.ds-select__MGLLcm-custom--invalid.sc-ds-select:not(.ds-select__MGLLcm-custom--invalid--open,.ds-select__MGLLcm-custom--invalid--disabled).sc-ds-select:active{background-color:var(--ds-bgColor-danger-active);border-color:var(--ds-borderColor-danger)}.ds-select__MGLLcm-custom--invalid.sc-ds-select:not(.ds-select__MGLLcm-custom--invalid--disabled):hover{background-color:var(--ds-bgColor-danger-hover)}.ds-select__MGLLcm-custom__dropdown-icon--has-clear-button.sc-ds-select{margin-left:var(--badge-container-offset, calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px))}.ds-select__MGLLcm-custom__selected-option.sc-ds-select{display:flex;align-items:center;gap:var(--ds-spacing-2xSmall);flex:1;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:var(--ds-select-selected-option-padding, calc(var(--ds-spacing-xSmall) - 2px));padding-right:var(--ds-spacing-xSmall)}.ds-select__MGLLcm-custom--has-icon.sc-ds-select .ds-select__MGLLcm-custom__selected-option.sc-ds-select{padding-left:var(--ds-select-selected-option-padding, calc(var(--ds-spacing-xSmall) - 2px));padding-right:var(--ds-spacing-2xSmall)}.ds-select__MGLLcm-custom__selected-option__placeholder-icon.sc-ds-select{font-size:var(--ds-fontSize-16)}.ds-select__MGLLcm-custom__selected-option__text.sc-ds-select{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:2px;color:var(--ds-textColor-default)}.ds-select__MGLLcm-custom__selected-option__text--none-selected.sc-ds-select{color:var(--ds-textColor-secondary)}.ds-select__MGLLcm-custom__selected-option__text--disabled.sc-ds-select{color:var(--ds-textColor-disabled-onLight)}.ds-select__MGLLcm-custom.sc-ds-select input.sc-ds-select{width:100%;height:100%;border:0;background:none;color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);line-height:var(--ds-lineHeight-large);padding-left:var(--ds-spacing-xSmall);padding-right:var(--ds-spacing-xSmall);text-overflow:ellipsis}.ds-select__MGLLcm-custom.sc-ds-select input.sc-ds-select::placeholder{color:var(--ds-textColor-secondary)}.ds-select__MGLLcm-custom.sc-ds-select input.sc-ds-select:disabled{cursor:not-allowed;color:var(--ds-textColor-disabled-onLight)}.ds-select__MGLLcm-custom.sc-ds-select input.sc-ds-select:disabled::placeholder{color:var(--ds-textColor-disabled-onLight)}.ds-select__MGLLcm-custom.sc-ds-select input.sc-ds-select:focus{outline:none}.ds-select__MGLLcm-custom__clear-button.sc-ds-select{position:absolute;right:calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px);cursor:pointer}.ds-select__MGLLcm-custom__badge-container.sc-ds-select{position:absolute;z-index:2;pointer-events:none;right:calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px + 40px + var(--ds-spacing-4xSmall) * 2);padding:10px 0}.ds-select__MGLLcm-custom__options-container.sc-ds-select{display:none;position:absolute;top:100%;left:0;right:0;z-index:10;border:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-light);background-color:var(--ds-bgColor-white)}.ds-select__MGLLcm-custom__options-container--open.sc-ds-select{display:block;box-shadow:var(--ds-shadow-overlay)}.ds-select__MGLLcm-custom__options-container__options.sc-ds-select{position:relative;display:block;width:100%;padding:0;margin:0;z-index:0;overflow:auto}.ds-select__MGLLcm-custom__options-container__options__inner.sc-ds-select{position:relative;width:100%;max-height:20rem;display:flex;flex-direction:column;box-sizing:border-box;overflow-y:auto;padding:0;margin:0}.ds-select__MGLLcm-custom__options-container__options__inner__top-scrim.sc-ds-select,.ds-select__MGLLcm-custom__options-container__options__inner__bottom-scrim.sc-ds-select{pointer-events:none;width:100%;height:2.75rem;margin-top:-2.75rem;flex:0 0 auto;position:sticky;z-index:1;display:none}.ds-select__MGLLcm-custom__options-container__options__inner__top-scrim--visible.sc-ds-select,.ds-select__MGLLcm-custom__options-container__options__inner__bottom-scrim--visible.sc-ds-select{display:block}.ds-select__MGLLcm-custom__options-container__options__inner__top-scrim.sc-ds-select{top:0;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-select__MGLLcm-custom__options-container__options__inner__top-scrim--dark.sc-ds-select{height:calc(var(--ds-fontSize-14) * var(--ds-lineHeight-large) + 2 * var(--ds-spacing-2xSmall));background:none;margin-top:calc(-1 * (var(--ds-fontSize-14) * var(--ds-lineHeight-large) + 2 * var(--ds-spacing-2xSmall)));box-shadow:0 -2px 7px var(--ds-overlay-black-50)}.ds-select__MGLLcm-custom__options-container__options__inner__bottom-scrim.sc-ds-select{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}";
+const dsSelectCss = ".sc-ds-select-h{display:inline-block;width:100%}@media (min-width: 30rem){:not(:has(.ds-select__oSBnIJ--full-width)).sc-ds-select-h{width:20rem}}.sc-ds-select-h>div.sc-ds-select{display:flex;flex-direction:column;position:relative}.ds-select__oSBnIJ-custom.sc-ds-select{position:relative;display:flex;align-items:center;border:var(--ds-borderWidth-thin) solid var(--ds-borderColor-default);background-color:var(--ds-bgColor-white);color:var(--ds-textColor-secondary);cursor:pointer;box-sizing:border-box;height:2.75rem;width:100%}.ds-select__oSBnIJ-custom__dropdown-icon.sc-ds-select{cursor:pointer;align-items:center;align-self:stretch;border-left:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-disabled-onLight);color:var(--ds-textColor-secondary);z-index:2;pointer-events:none;padding:0 var(--ds-spacing-2xSmall)}.ds-select__oSBnIJ-custom-wrapper.sc-ds-select{position:relative}.ds-select__oSBnIJ-custom.sc-ds-select .ds-options__oSBnIJ.sc-ds-select{display:block}.ds-select__oSBnIJ-custom-input-container.sc-ds-select{display:flex;position:relative}.ds-select__oSBnIJ-custom-input-container.sc-ds-select:has(.ds-select__oSBnIJ-custom__clear-button:hover) .ds-select__oSBnIJ-custom.sc-ds-select{background-color:var(--ds-bgColor-white-hover) !important}.ds-select__oSBnIJ-custom.sc-ds-select:not(.ds-select__oSBnIJ-custom--open,.ds-select__oSBnIJ-custom--invalid.sc-ds-select,.ds-select__oSBnIJ-custom--disabled).sc-ds-select:hover{background-color:var(--ds-bgColor-white-hover)}.ds-select__oSBnIJ-custom.sc-ds-select:active:not(.ds-select__oSBnIJ-custom--open,.ds-select__oSBnIJ-custom--invalid.sc-ds-select,.ds-select__oSBnIJ-custom--disabled).sc-ds-select{background-color:var(--ds-bgColor-white-active)}.ds-select__oSBnIJ-custom--open.sc-ds-select,.ds-select__oSBnIJ-custom.sc-ds-select:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-select__oSBnIJ-custom--open.sc-ds-select:not(.ds-select__oSBnIJ-custom--open--invalid,.ds-select__oSBnIJ-custom.sc-ds-select:focus-visible--invalid),.ds-select__oSBnIJ-custom.sc-ds-select:focus-visible:not(.ds-select__oSBnIJ-custom--open--invalid,.ds-select__oSBnIJ-custom.sc-ds-select:focus-visible--invalid){border-color:var(--ds-borderColor-primary)}.ds-select__oSBnIJ-custom--disabled.sc-ds-select{background-color:var(--ds-bgColor-disabled-onLight);border-color:var(--ds-borderColor-disabled-onLight);color:var(--ds-textColor-disabled-onLight);cursor:not-allowed}.ds-select__oSBnIJ-custom--disabled.sc-ds-select .ds-select__oSBnIJ-custom__dropdown-icon.sc-ds-select{color:var(--ds-textColor-disabled-onLight);border-left-color:var(--ds-borderColor-disabled-onLight);cursor:not-allowed}.ds-select__oSBnIJ-custom--invalid.sc-ds-select{background-color:var(--ds-bgColor-danger);border-color:var(--ds-borderColor-danger)}.ds-select__oSBnIJ-custom--invalid.sc-ds-select:not(.ds-select__oSBnIJ-custom--invalid--open,.ds-select__oSBnIJ-custom--invalid--disabled).sc-ds-select:active{background-color:var(--ds-bgColor-danger-active);border-color:var(--ds-borderColor-danger)}.ds-select__oSBnIJ-custom--invalid.sc-ds-select:not(.ds-select__oSBnIJ-custom--invalid--disabled):hover{background-color:var(--ds-bgColor-danger-hover)}.ds-select__oSBnIJ-custom__dropdown-icon--has-clear-button.sc-ds-select{margin-left:var(--badge-container-offset, calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px))}.ds-select__oSBnIJ-custom__selected-option.sc-ds-select{display:flex;align-items:center;gap:var(--ds-spacing-2xSmall);flex:1;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:var(--ds-select-selected-option-padding, calc(var(--ds-spacing-xSmall) - 2px));padding-right:var(--ds-spacing-xSmall)}.ds-select__oSBnIJ-custom--has-icon.sc-ds-select .ds-select__oSBnIJ-custom__selected-option.sc-ds-select{padding-left:var(--ds-select-selected-option-padding, calc(var(--ds-spacing-xSmall) - 2px));padding-right:var(--ds-spacing-2xSmall)}.ds-select__oSBnIJ-custom__selected-option__placeholder-icon.sc-ds-select{font-size:var(--ds-fontSize-16)}.ds-select__oSBnIJ-custom__selected-option__text.sc-ds-select{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:2px;color:var(--ds-textColor-default)}.ds-select__oSBnIJ-custom__selected-option__text--none-selected.sc-ds-select{color:var(--ds-textColor-secondary)}.ds-select__oSBnIJ-custom__selected-option__text--disabled.sc-ds-select{color:var(--ds-textColor-disabled-onLight)}.ds-select__oSBnIJ-custom.sc-ds-select input.sc-ds-select{width:100%;height:100%;border:0;background:none;color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);line-height:var(--ds-lineHeight-large);padding-left:var(--ds-spacing-xSmall);padding-right:var(--ds-spacing-xSmall);text-overflow:ellipsis}.ds-select__oSBnIJ-custom.sc-ds-select input.sc-ds-select::placeholder{color:var(--ds-textColor-secondary)}.ds-select__oSBnIJ-custom.sc-ds-select input.sc-ds-select:disabled{cursor:not-allowed;color:var(--ds-textColor-disabled-onLight)}.ds-select__oSBnIJ-custom.sc-ds-select input.sc-ds-select:disabled::placeholder{color:var(--ds-textColor-disabled-onLight)}.ds-select__oSBnIJ-custom.sc-ds-select input.sc-ds-select:focus{outline:none}.ds-select__oSBnIJ-custom__clear-button.sc-ds-select{position:absolute;right:calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px);cursor:pointer}.ds-select__oSBnIJ-custom__badge-container.sc-ds-select{position:absolute;z-index:2;pointer-events:none;right:calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px + 40px + var(--ds-spacing-4xSmall) * 2);padding:10px 0}.ds-select__oSBnIJ-custom__options-container.sc-ds-select{display:none;position:absolute;top:100%;left:0;right:0;z-index:10;border:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-light);background-color:var(--ds-bgColor-white)}.ds-select__oSBnIJ-custom__options-container--open.sc-ds-select{display:block;box-shadow:var(--ds-shadow-overlay)}.ds-select__oSBnIJ-custom__options-container__options.sc-ds-select{position:relative;display:block;width:100%;padding:0;margin:0;z-index:0;overflow:auto}.ds-select__oSBnIJ-custom__options-container__options__inner.sc-ds-select{position:relative;width:100%;max-height:20rem;display:flex;flex-direction:column;box-sizing:border-box;overflow-y:auto;padding:0;margin:0}.ds-select__oSBnIJ-custom__options-container__options__inner__top-scrim.sc-ds-select,.ds-select__oSBnIJ-custom__options-container__options__inner__bottom-scrim.sc-ds-select{pointer-events:none;width:100%;height:2.75rem;margin-top:-2.75rem;flex:0 0 auto;position:sticky;z-index:1;display:none}.ds-select__oSBnIJ-custom__options-container__options__inner__top-scrim--visible.sc-ds-select,.ds-select__oSBnIJ-custom__options-container__options__inner__bottom-scrim--visible.sc-ds-select{display:block}.ds-select__oSBnIJ-custom__options-container__options__inner__top-scrim.sc-ds-select{top:0;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-select__oSBnIJ-custom__options-container__options__inner__top-scrim--dark.sc-ds-select{height:calc(var(--ds-fontSize-14) * var(--ds-lineHeight-large) + 2 * var(--ds-spacing-2xSmall));background:none;margin-top:calc(-1 * (var(--ds-fontSize-14) * var(--ds-lineHeight-large) + 2 * var(--ds-spacing-2xSmall)));box-shadow:0 -2px 7px var(--ds-overlay-black-50)}.ds-select__oSBnIJ-custom__options-container__options__inner__bottom-scrim.sc-ds-select{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}";
 const selectIdGenerator = idGenerator('ds-select');
 const defaultTextFns = {
@@ -127,6 +127,7 @@ const DsSelect$1 = proxyCustomElement(class DsSelect extends Mixin(multipleValue
         }
     }
     componentWillLoad() {
+        this.setDisableEventEmits(true);
         this.setTexts();
         this.inheritedAttributes = {
             ...inheritAttributes(this, this.el),
@@ -142,9 +143,7 @@ const DsSelect$1 = proxyCustomElement(class DsSelect extends Mixin(multipleValue
         else {
             this.internals?.setValidity({ valueMissing: this.dsRequired && (!this.dsValue || (Array.isArray(this.dsValue) && this.dsValue.length === 0)) }, atLeastOneOption());
         }
-        this.setDisableEventEmits(true);
         this.value = this.toValue(this.dsValue);
-        this.setDisableEventEmits();
     }
     disconnectedCallback() {
         if (this.internals?.form && !this.isNative) {
@@ -198,6 +197,7 @@ const DsSelect$1 = proxyCustomElement(class DsSelect extends Mixin(multipleValue
     async handleOptionClick(option) {
         if (!option || option.dsDisabled)
             return;
+        this.setDisableEventEmits(false);
         if (this.inValue(option.dsValue) && this.isMultiple) {
             this.value = this.withoutValue(option.dsValue);
         }
@@ -223,19 +223,9 @@ const DsSelect$1 = proxyCustomElement(class DsSelect extends Mixin(multipleValue
         if (this.dsDisabled)
             return;
         this.activeIndex = null;
-        this.setDisableEventEmits(true);
-        this.selectedOptions = [];
-        const removedValues = [...this.value];
+        this.setDisableEventEmits(false);
         this.value = this.toValue(null);
         this.isOpen = false;
-        this.dsMultipleChange.emit({ values: [], added: null, removed: removedValues });
-        this.dsChange.emit(null);
-        if (this.dsRequired) {
-            this.dsValidity.emit({
-                flag: 'customError',
-                message: this.internals?.validationMessage,
-            });
-        }
         (this.customSelectRef || this.nativeSelectRef)?.focus();
     }
     handleKeyDown(event) {
@@ -309,19 +299,12 @@ const DsSelect$1 = proxyCustomElement(class DsSelect extends Mixin(multipleValue
         };
     }
     valueObserver(newValue) {
-        if (!this.isNative) {
-            this.setSelectedOptionsFromValue(newValue);
-        }
+        if (this.isNative)
+            return;
+        this.setSelectedOptionsFromValue(newValue);
     }
     dsValueObserver(newValue) {
-        const newNormalized = this.toValue(newValue);
-        const currentValues = this.value ?? [];
-        const newValues = newNormalized ?? [];
-        const isSameValue = currentValues.length === newValues.length && currentValues.every((v, i) => v === newValues[i]);
-        if (!isSameValue) {
-            this.setDisableEventEmits(true);
-        }
-        this.value = newNormalized;
+        this.value = this.toValue(newValue);
     }
     selectedOptionsObserver(newValue, oldValue) {
         const newValues = newValue.map(opt => opt.dsValue);
@@ -332,15 +315,15 @@ const DsSelect$1 = proxyCustomElement(class DsSelect extends Mixin(multipleValue
         oldValue?.forEach(opt => (opt.dsSelected = false));
         newValue.forEach(opt => (opt.dsSelected = true));
         const shouldEmit = this.getShouldEmit([hasChanged]);
-        this.setDisableEventEmits();
+        this.setDisableEventEmits(true);
         if (shouldEmit) {
             this.dsMultipleChange.emit({ values: newValues, added: addedValues, removed: removedValues });
             this.dsChange.emit(newValues[0] || null);
-            this.dsValidity.emit({
-                flag: this.internals?.validity.valid ? 'valid' : 'customError',
-                message: this.internals?.validationMessage,
-            });
         }
+        this.dsValidity.emit({
+            flag: this.internals?.validity.valid ? 'valid' : 'customError',
+            message: this.internals?.validationMessage,
+        });
     }
     hasFocusObserver(newValue) {
         if (newValue) {
@@ -482,7 +465,7 @@ const DsSelect$1 = proxyCustomElement(class DsSelect extends Mixin(multipleValue
     }
     render() {
         const baseClass = cx('ds-select');
-        return (h(Host, { key: 'de87b2da5ef596bb473da6086347f3657336a24f', ...ifDefined('name', this.isNative ? undefined : this.dsName) }, h("div", { key: '0c022d4a3716fa479ad146c92b51396c0b7bdb1c', tabIndex: -1 }, this.isNative ? this.renderNativeSelect() : this.renderCustomSelect(baseClass))));
+        return (h(Host, { key: '9fcca0b6884e5e3af688877d5cd922cd63da2e0a', ...ifDefined('name', this.isNative ? undefined : this.dsName) }, h("div", { key: 'f412bab458ed1029a85133848f0117ffca0ff304', tabIndex: -1 }, this.isNative ? this.renderNativeSelect() : this.renderCustomSelect(baseClass))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/components/ds-spinner.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { D as DsSpinner$1, d as defineCustomElement$1 } from './p-KU9nm6J4.js';
+import { D as DsSpinner$1, d as defineCustomElement$1 } from './p-Dq55XDgV.js';
 const DsSpinner = DsSpinner$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ds-store.js CHANGED Viewed

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, c as createEvent } from './p-DaqCt6bT.js';
-import { d as defaultLanguage, i as initialize, s as setLanguage, g as getLanguage } from './p-BiwrhYeU.js';
+import { p as proxyCustomElement, H, c as createEvent } from './p-GalXVdFP.js';
+import { d as defaultLanguage, i as initialize, s as setLanguage, g as getLanguage } from './p-B71giUZh.js';
 const DsStore$1 = proxyCustomElement(class DsStore extends H {
     constructor(registerHost) {

package/dist/components/ds-tab.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+interface DsTab extends Components.DsTab, HTMLElement {}
+export const DsTab: {
+    prototype: DsTab;
+    new (): DsTab;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ds-tab.js ADDED Viewed

@@ -0,0 +1,6 @@
+import { D as DsTab$1, d as defineCustomElement$1 } from './p-C3xcmSbZ.js';
+const DsTab = DsTab$1;
+const defineCustomElement = defineCustomElement$1;
+export { DsTab, defineCustomElement };

package/dist/components/ds-tablist.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+interface DsTablist extends Components.DsTablist, HTMLElement {}
+export const DsTablist: {
+    prototype: DsTablist;
+    new (): DsTablist;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ds-tablist.js ADDED Viewed

@@ -0,0 +1,219 @@
+import { p as proxyCustomElement, M as Mixin, c as createEvent, h } from './p-GalXVdFP.js';
+import { c as classNames } from './p-BfTCfPZ1.js';
+import { c as cx } from './p-C34PGDVY.js';
+import { t as transformTagName, e as throttle, a as ifDefined, d as declareComponentDependencies } from './p-J5Ghj1_T.js';
+import { t as tabsFactory } from './p-D1DYiRu4.js';
+import { d as defineCustomElement$6 } from './p-CBTcmEBq.js';
+import { d as defineCustomElement$5 } from './p-DIxFOW85.js';
+import { d as defineCustomElement$4 } from './p-Dq55XDgV.js';
+import { d as defineCustomElement$3 } from './p-C3xcmSbZ.js';
+import { d as defineCustomElement$2 } from './p-Cq_RwLX7.js';
+const dsTablistCss = ".ds-no-style-leak.sc-ds-tablist *.sc-ds-tablist{all:unset;box-sizing:border-box;display:block}.ds-tablist__oSBnIJ.sc-ds-tablist{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);position:relative}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__scrollable.sc-ds-tablist{display:flex;gap:var(--ds-spacing-2xSmall);overflow-x:auto;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:none}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__scrollable.sc-ds-tablist:focus,.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__scrollable.sc-ds-tablist:focus-visible,.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__scrollable.sc-ds-tablist:-moz-focusring{outline:none;box-shadow:none}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__scrollable--container.sc-ds-tablist{background:linear-gradient(var(--ds-borderColor-default), var(--ds-borderColor-default)) left/var(--ds-borderWidth-hairline) 100% no-repeat, linear-gradient(var(--ds-borderColor-default), var(--ds-borderColor-default)) right/var(--ds-borderWidth-hairline) 100% no-repeat, linear-gradient(var(--ds-borderColor-default), var(--ds-borderColor-default)) top/100% var(--ds-borderWidth-hairline) no-repeat, linear-gradient(var(--ds-bgColor-neutralLight), var(--ds-bgColor-neutralLight)) top/100% calc(100% - var(--ds-borderWidth-hairline)) no-repeat, linear-gradient(var(--ds-borderColor-default), var(--ds-borderColor-default)) bottom/100% var(--ds-borderWidth-hairline) no-repeat}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__scrollable--line.sc-ds-tablist{background:linear-gradient(var(--ds-bgColor-transparent-onLight), var(--ds-bgColor-transparent-onLight)) top/100% calc(100% - 1 * var(--ds-borderWidth-hairline)) no-repeat, linear-gradient(var(--ds-borderColor-default), var(--ds-borderColor-default)) bottom/100% var(--ds-borderWidth-hairline) no-repeat}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button.sc-ds-tablist{position:absolute;top:0;bottom:0;display:flex;aspect-ratio:1;justify-content:center;align-items:center}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button--backward.sc-ds-tablist{left:0}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button--forward.sc-ds-tablist{right:0}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button--container.sc-ds-tablist{border:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-default);background-color:var(--ds-bgColor-neutralLight)}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button--line.sc-ds-tablist{border-block-end:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-default);background-color:var(--ds-bgColor-white)}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button--container.ds-tablist__oSBnIJ__button--backward.sc-ds-tablist::after{content:\"\";position:absolute;inset:0;pointer-events:none;box-shadow:var(--ds-shadow-overlay);clip-path:inset(0 calc(-1 * var(--ds-spacing-small)) 0 0)}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button--container.ds-tablist__oSBnIJ__button--forward.sc-ds-tablist::after{content:\"\";position:absolute;inset:0;pointer-events:none;box-shadow:var(--ds-shadow-overlay);clip-path:inset(0 0 0 calc(-1 * var(--ds-spacing-small)))}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button[hidden].sc-ds-tablist{display:none}.ds-tablist__oSBnIJ.sc-ds-tablist .ds-tablist__oSBnIJ__button__ds-button.sc-ds-tablist{width:100%;height:100%}";
+const DsTablist$1 = proxyCustomElement(class DsTablist extends Mixin(tabsFactory) {
+    constructor(registerHost) {
+        super(false);
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.dsTabChange = createEvent(this, "dsTabChange");
+    }
+    get el() { return this; }
+    RESIZE_THROTTLE_TIMEOUT = 100;
+    scrollableElement;
+    backwardButtonElement;
+    forwardButtonElement;
+    dsTabChange;
+    dsAriaLabel;
+    dsAriaLabelledby;
+    showBackwardButton = false;
+    showForwardButton = false;
+    get DsTab() {
+        return transformTagName('ds-tab', 'ds-tablist', this.el);
+    }
+    get DsButton() {
+        return transformTagName('ds-button', 'ds-tablist', this.el);
+    }
+    setButtonsVisibility = (target) => {
+        if (!target)
+            return;
+        const { scrollLeft, scrollWidth, clientWidth } = target;
+        this.showBackwardButton = scrollLeft > 0;
+        this.showForwardButton = Math.round(scrollLeft + clientWidth) < scrollWidth;
+    };
+    throttledSetButtonsVisibility = throttle(this.setButtonsVisibility, this.RESIZE_THROTTLE_TIMEOUT);
+    async tabConnected() {
+        this.setButtonsVisibility(this.scrollableElement);
+    }
+    async tabDisconnected() {
+        this.setButtonsVisibility(this.scrollableElement);
+    }
+    handleResize() {
+        this.throttledSetButtonsVisibility(this.scrollableElement);
+    }
+    handleTabClick(event) {
+        event.stopPropagation();
+        if (event.detail.tabId === this.context?.currentTab)
+            return;
+        this.dsTabChange.emit(event.detail);
+    }
+    scrollTabIntoView = (tab) => {
+        if (!this.scrollableElement)
+            return;
+        const tabNode = tab.querySelector('[role="tab"]');
+        if (!tabNode)
+            return;
+        const leftCover = this.backwardButtonElement && !this.backwardButtonElement.hidden ? this.backwardButtonElement.offsetWidth : 0;
+        const rightCover = this.forwardButtonElement && !this.forwardButtonElement.hidden ? this.forwardButtonElement.offsetWidth : 0;
+        const { left, right } = this.scrollableElement.getBoundingClientRect();
+        const { left: tabLeft, right: tabRight } = tabNode.getBoundingClientRect();
+        const visibilityBuffer = 16;
+        let next = this.scrollableElement.scrollLeft;
+        if (tabLeft < left + leftCover + visibilityBuffer) {
+            next -= left + leftCover + visibilityBuffer - tabLeft;
+        }
+        else if (tabRight > right - rightCover - visibilityBuffer) {
+            next += tabRight - (right - rightCover - visibilityBuffer);
+        }
+        const max = this.scrollableElement.scrollWidth - this.scrollableElement.clientWidth;
+        this.scrollableElement.scrollTo({ left: Math.max(0, Math.min(next, max)), behavior: 'auto' });
+    };
+    handleTabFocus(event) {
+        event.stopPropagation();
+        this.scrollTabIntoView(event.target);
+    }
+    handleKeyDown = (event) => {
+        event.stopPropagation();
+        const activeTab = event.target.closest(this.DsTab);
+        const tabs = Array.from(this.el.querySelectorAll(this.DsTab));
+        const activeTabIndex = tabs.indexOf(activeTab);
+        if (activeTabIndex === -1)
+            return;
+        let nextIndex = 0;
+        switch (event.key) {
+            case 'Enter':
+            case ' ': {
+                if (this.context?.currentTab === tabs[activeTabIndex].dsId)
+                    return;
+                this.dsTabChange.emit({ tabId: tabs[activeTabIndex].dsId, tabPanelId: tabs[activeTabIndex].dsTabPanelId });
+                return;
+            }
+            case 'ArrowRight': {
+                nextIndex = (activeTabIndex + 1) % tabs.length;
+                break;
+            }
+            case 'ArrowLeft': {
+                nextIndex = (activeTabIndex - 1 + tabs.length) % tabs.length;
+                break;
+            }
+            case 'Home': {
+                nextIndex = 0;
+                break;
+            }
+            case 'End': {
+                nextIndex = tabs.length - 1;
+                break;
+            }
+            default:
+                return;
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        tabs[nextIndex].setFocus();
+    };
+    handleScroll = (event) => {
+        const target = event.target;
+        this.setButtonsVisibility(target);
+    };
+    handleButtonClick = (direction) => {
+        if (!this.scrollableElement)
+            return;
+        const scrollAmount = this.scrollableElement.clientWidth * 0.8;
+        const left = direction === 'backward' ? this.scrollableElement.scrollLeft - scrollAmount : this.scrollableElement.scrollLeft + scrollAmount;
+        this.scrollableElement.scrollTo({ left, behavior: 'smooth' });
+    };
+    connectedCallback() {
+        this.el.addEventListener('keydown', this.handleKeyDown);
+    }
+    componentDidLoad() {
+        this.setButtonsVisibility(this.scrollableElement);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.el.removeEventListener('keydown', this.handleKeyDown);
+    }
+    renderButton = (direction) => {
+        const baseClass = cx('ds-tablist');
+        const iconName = direction === 'backward' ? 'chevron_backward' : 'chevron_forward';
+        return (h(this.DsButton, { class: `${baseClass}__button__ds-button`, onClick: () => this.handleButtonClick(direction), dsAriaHidden: true, dsTabIndex: -1, dsVariant: "supplementary", dsColour: "black", dsIcon: iconName }));
+    };
+    render() {
+        const baseClass = cx('ds-tablist');
+        const scrollableClass = `${baseClass}__scrollable`;
+        const buttonClass = `${baseClass}__button`;
+        return (h("div", { key: '4b8dd6949171369541110b01c52acd043981d4a9', class: baseClass }, h("div", { key: '3327ec21ece39c85a83990dc25b717ed7c528f3e', ref: el => (this.scrollableElement = el), class: classNames(scrollableClass, {
+                [`${scrollableClass}--container`]: this.context?.variant === 'container',
+                [`${scrollableClass}--line`]: this.context?.variant === 'line',
+            }), role: "tablist", ...ifDefined('aria-label', this.dsAriaLabel), ...ifDefined('aria-labelledby', this.dsAriaLabelledby), onScroll: this.handleScroll }, h("slot", { key: 'a762574f9666d851041e085f16a0b7e0cd1371eb' })), h("div", { key: 'bfbd4760e1276d7db4fc5dd7707321dc4ea53870', ref: el => (this.backwardButtonElement = el), class: classNames(buttonClass, `${buttonClass}--backward`, {
+                [`${buttonClass}--container`]: this.context?.variant === 'container',
+                [`${buttonClass}--line`]: this.context?.variant === 'line',
+            }), "aria-hidden": "true", hidden: !this.showBackwardButton }, this.renderButton('backward')), h("div", { key: '3f435da4ecb5bf45ebebac651b0419a62f3fb5be', ref: el => (this.forwardButtonElement = el), class: classNames(buttonClass, `${buttonClass}--forward`, {
+                [`${buttonClass}--container`]: this.context?.variant === 'container',
+                [`${buttonClass}--line`]: this.context?.variant === 'line',
+            }), "aria-hidden": "true", hidden: !this.showForwardButton }, this.renderButton('forward'))));
+    }
+    static get style() { return dsTablistCss; }
+}, [262, "ds-tablist", {
+        "dsAriaLabel": [1, "ds-aria-label"],
+        "dsAriaLabelledby": [1, "ds-aria-labelledby"],
+        "context": [32],
+        "showBackwardButton": [32],
+        "showForwardButton": [32],
+        "tabConnected": [64],
+        "tabDisconnected": [64]
+    }, [[9, "resize", "handleResize"], [0, "dsTabClick", "handleTabClick"], [0, "dsTabFocus", "handleTabFocus"]]]);
+declareComponentDependencies([h("ds-tab", { dsId: "", dsTabPanelId: "" }), h("ds-button", null)]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ds-tablist", "ds-button", "ds-icon", "ds-spinner", "ds-tab", "ds-visually-hidden"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ds-tablist":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, DsTablist$1);
+            }
+            break;
+        case "ds-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "ds-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "ds-spinner":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "ds-tab":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "ds-visually-hidden":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+const DsTablist = DsTablist$1;
+const defineCustomElement = defineCustomElement$1;
+export { DsTablist, defineCustomElement };

package/dist/components/ds-tabpanel.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+interface DsTabpanel extends Components.DsTabpanel, HTMLElement {}
+export const DsTabpanel: {
+    prototype: DsTabpanel;
+    new (): DsTabpanel;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ds-tabpanel.js ADDED Viewed

@@ -0,0 +1,50 @@
+import { p as proxyCustomElement, M as Mixin, h } from './p-GalXVdFP.js';
+import { c as cx } from './p-C34PGDVY.js';
+import { t as tabsFactory } from './p-D1DYiRu4.js';
+import { c as classNames } from './p-BfTCfPZ1.js';
+const dsTabpanelCss = ".ds-no-style-leak.sc-ds-tabpanel *.sc-ds-tabpanel{all:unset;box-sizing:border-box;display:block}.ds-tabpanel__oSBnIJ.sc-ds-tabpanel{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);display:block}.ds-tabpanel__oSBnIJ--container.sc-ds-tabpanel{border-inline:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-default);border-block-end:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-default)}.ds-tabpanel__oSBnIJ--padded.sc-ds-tabpanel{padding-block-start:var(--ds-spacing-small)}@media (min-width: 60rem){.ds-tabpanel__oSBnIJ--padded.sc-ds-tabpanel{padding-block-start:var(--ds-spacing-medium)}}.ds-tabpanel__oSBnIJ--container.ds-tabpanel__oSBnIJ--padded.sc-ds-tabpanel{padding:var(--ds-spacing-small)}@media (min-width: 60rem){.ds-tabpanel__oSBnIJ--container.ds-tabpanel__oSBnIJ--padded.sc-ds-tabpanel{padding:var(--ds-spacing-medium)}}.ds-tabpanel__oSBnIJ[hidden].sc-ds-tabpanel{display:none}";
+const DsTabpanel$1 = proxyCustomElement(class DsTabpanel extends Mixin(tabsFactory) {
+    constructor(registerHost) {
+        super(false);
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+    }
+    get el() { return this; }
+    dsId;
+    dsTabId;
+    dsPadded = true;
+    render() {
+        const baseClass = cx('ds-tabpanel');
+        return (h("div", { key: 'a652b9384924c3b603dddcab5e7c2e37d7b5e9d7', id: this.dsId, class: classNames(baseClass, {
+                [`${baseClass}--container`]: this.context?.variant === 'container',
+                [`${baseClass}--padded`]: this.dsPadded,
+            }), role: "tabpanel", hidden: this.context?.currentTabPanel !== this.dsId, "aria-labelledby": this.dsTabId }, h("slot", { key: '72972372dcdec5183419aa01726a39c680e4aba8' })));
+    }
+    static get style() { return dsTabpanelCss; }
+}, [262, "ds-tabpanel", {
+        "dsId": [1, "ds-id"],
+        "dsTabId": [1, "ds-tab-id"],
+        "dsPadded": [4, "ds-padded"],
+        "context": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ds-tabpanel"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ds-tabpanel":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, DsTabpanel$1);
+            }
+            break;
+    } });
+}
+const DsTabpanel = DsTabpanel$1;
+const defineCustomElement = defineCustomElement$1;
+export { DsTabpanel, defineCustomElement };

package/dist/components/ds-tabs.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+interface DsTabs extends Components.DsTabs, HTMLElement {}
+export const DsTabs: {
+    prototype: DsTabs;
+    new (): DsTabs;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;