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

package/dist/esm/ds-ribbon.entry.js

@@ -1,10 +1,10 @@
-import { h, r as registerInstance, c as createEvent, d as getElement } from './index-B4ZCBfpo.js';
+import { h, r as registerInstance, c as createEvent, e as getElement } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import { c as inheritSpecifiedAttributes, b as inheritAriaAttributes } from './attributes-DfbgRyXR.js';
 import { d as declareComponentDependencies, i as idGenerator, t as transformTagName } from './utils-J5Ghj1_T.js';
-import { c as cx } from './cx-hUnOoCpm.js';
-import { v as visuallyHiddenAssistiveText } from './linkUtils-BMdgqvM-.js';
-import { d as defaultLanguage, g as getLanguage, o as onChange } from './store-I792JNgf.js';
+import { c as cx } from './cx-jGcD6jB5.js';
+import { v as visuallyHiddenAssistiveText } from './linkUtils-Bh8gSuaY.js';
+import { d as defaultLanguage, g as getLanguage, o as onChange } from './store-CaI4gcSt.js';
 import { a as appData } from './data-gPkqWfeS.js';
 
 const convertToRibbonLinks = (links, ribbonData, lang = 'en') => {
@@ -43,13 +43,13 @@ class DataService {
     }
 }
 
-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 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__SPFJ1E{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);display:block}.ds-ribbon__SPFJ1E__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__SPFJ1E__container{grid-template-columns:auto auto}}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__container{grid-template-columns:145px auto;padding:0 var(--ds-spacing-large, 32px)}}@media (min-width: 75rem){.ds-ribbon__SPFJ1E__container{grid-template-columns:auto auto}}.ds-ribbon__SPFJ1E__branding{display:flex;align-items:center;flex-shrink:0}.ds-ribbon__SPFJ1E__mobile-toggle{display:block;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__mobile-toggle{display:none}}.ds-ribbon__SPFJ1E__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__SPFJ1E__drawer-backdrop{display:none}}.ds-ribbon__SPFJ1E--drawer-open .ds-ribbon__SPFJ1E__drawer-backdrop{cursor:pointer;pointer-events:auto}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-backdrop{pointer-events:auto;z-index:1}.ds-ribbon__SPFJ1E__drawer-backdrop,.ds-ribbon__SPFJ1E--drawer-open .ds-ribbon__SPFJ1E__container .ds-ribbon__SPFJ1E__drawer-backdrop{position:static;background-color:unset;backdrop-filter:unset;opacity:1;transition:none}}.ds-ribbon__SPFJ1E--drawer-clicked .ds-ribbon__SPFJ1E__drawer-backdrop{transition:background-color 0.3s, opacity 0s 0.3s}.ds-ribbon__SPFJ1E--drawer-open .ds-ribbon__SPFJ1E__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__SPFJ1E__desktop-nav{display:none;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__desktop-nav{display:block}}.ds-ribbon__SPFJ1E__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__SPFJ1E__desktop-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__SPFJ1E__desktop-link{font-size:var(--ds-fontSize-12);white-space:nowrap}.ds-ribbon__SPFJ1E__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__SPFJ1E__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__SPFJ1E__desktop-badge>* span{font-size:var(--ds-fontSize-12);line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}.ds-ribbon__SPFJ1E__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__SPFJ1E__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__SPFJ1E--drawer-open .ds-ribbon__SPFJ1E__drawer{transform:translateX(0%)}.ds-ribbon__SPFJ1E__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__SPFJ1E__drawer-header{display:none}}.ds-ribbon__SPFJ1E__drawer-branding{display:flex;align-items:center;flex-shrink:0;max-width:8rem}@media (min-width: 30rem){.ds-ribbon__SPFJ1E__drawer-branding{max-width:unset}}.ds-ribbon__SPFJ1E__drawer-close{flex-shrink:0;margin-left:var(--ds-spacing-small, 16px)}.ds-ribbon__SPFJ1E__drawer-nav{display:block;padding:var(--ds-spacing-medium, 24px);position:relative}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-nav{padding:0}}.ds-ribbon__SPFJ1E__top-scrim,.ds-ribbon__SPFJ1E__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__SPFJ1E__top-scrim{top:3rem;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-ribbon__SPFJ1E__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__SPFJ1E__top-scrim{display:block}.has-bottom-scrim .ds-ribbon__SPFJ1E__bottom-scrim{display:block}.ds-ribbon__SPFJ1E__drawer-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--ds-spacing-4xSmall, 2px)}.ds-ribbon__SPFJ1E__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__SPFJ1E__drawer-link-item:last-child{border-bottom:none}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-link-item{justify-content:flex-start;padding:0;border-bottom:none}.ds-ribbon__SPFJ1E__drawer-link-item:last-child{border-bottom:none}}.ds-ribbon__SPFJ1E__drawer-link{font-size:var(--ds-fontSize-14, 0.875rem);white-space:nowrap}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-link{font-size:var(--ds-fontSize-12, 0.75rem)}}.ds-ribbon__SPFJ1E__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__SPFJ1E__drawer-badge{position:absolute;top:0;right:100%}}.ds-ribbon__SPFJ1E__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__SPFJ1E__drawer-badge>* span{font-size:inherit;line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}:host(.ds-ribbon__SPFJ1E--drawer-open) .ds-ribbon__SPFJ1E__drawer-backdrop{display:block}@media (min-width: 60rem){:host(.ds-ribbon__SPFJ1E--drawer-open) .ds-ribbon__SPFJ1E__drawer-backdrop{display:block}}:host(.ds-ribbon__SPFJ1E--drawer-open) .ds-ribbon__SPFJ1E__drawer{transform:translateX(0)}@media (min-width: 60rem){:host(.ds-ribbon__SPFJ1E--drawer-open) .ds-ribbon__SPFJ1E__drawer{transform:none}}`;
 
 const fallbackRibbonData = appData.v1.ribbon;
 const DsRibbon = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.dsDrawerToggle = createEvent(this, "dsDrawerToggle");
+        this.dsDrawerToggle = createEvent(this, "dsDrawerToggle", 7);
     }
     inheritedAttributes = {};
     get el() { return getElement(this); }
@@ -395,15 +395,21 @@ const DsRibbon = class {
             [`${baseClass}--drawer-open`]: this.isMobileDrawerOpen,
             [`${baseClass}--drawer-clicked`]: this.isMobileDrawerClicked,
         });
-        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()));
+        return (h("div", { key: '083f9b57e28d8eecbfae7e2030d64a93b1d06c7c', class: ribbonClasses }, h("nav", { key: 'e27bb14d0158c3338a9cee617cadd6d7a939f4c4', "aria-label": this.localizedNavAriaLabel, ...(this.isMobileDrawerOpen ? { inert: true } : {}) }, h("div", { key: 'dd069ba6a40bbd9e8019f63de6cd6a8c76c07427', class: `${baseClass}__container`, ...this.inheritedAttributes }, this.renderBranding(), this.renderDesktopNavigation(), this.renderMobileToggle())), this.renderMobileNavigation()));
     }
     static get watchers() { return {
-        "dsIcon": ["dsIconObserver"],
-        "dsBrandingUrls": ["dsBrandingUrlsObserver"],
-        "isMobileDrawerOpen": ["isMobileDrawerOpenObserver"]
+        "dsIcon": [{
+                "dsIconObserver": 0
+            }],
+        "dsBrandingUrls": [{
+                "dsBrandingUrlsObserver": 0
+            }],
+        "isMobileDrawerOpen": [{
+                "isMobileDrawerOpenObserver": 0
+            }]
     }; }
 };
 declareComponentDependencies([h("ds-link-logo", { dsHref: "" }), h("ds-link", { dsText: "" }), h("ds-button", null), h("ds-tag", { dsText: "" }), h("ds-visually-hidden", null)]);
-DsRibbon.style = dsRibbonCss;
+DsRibbon.style = dsRibbonCss();
 
 export { DsRibbon as ds_ribbon };

package/dist/esm/ds-select-native.entry.js

@@ -1,21 +1,21 @@
-import { M as Mixin, r as registerInstance, c as createEvent, d as getElement, h } from './index-B4ZCBfpo.js';
+import { M as Mixin, r as registerInstance, c as createEvent, e as getElement, h } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import { t as transformTagName, d as declareComponentDependencies } from './utils-J5Ghj1_T.js';
 import { b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
-import { c as cx } from './cx-hUnOoCpm.js';
-import { a as ariaDeprecationFactory } from './ariaDeprecationFactory-DXsGmVd4.js';
-import { b as atLeastOneOption } from './controlUtils-DOb1adhF.js';
-import './store-I792JNgf.js';
+import { c as cx } from './cx-jGcD6jB5.js';
+import { a as ariaDeprecationFactory } from './ariaDeprecationFactory-DwC_l-Le.js';
+import { b as atLeastOneOption } from './controlUtils-BhYl_ia_.js';
+import './store-CaI4gcSt.js';
 
-const dsSelectNativeCss = ".sc-ds-select-native-h{display:inline-block;width:100%}@media (min-width: 30rem){:not(:has(.ds-select__oSBnIJ--full-width)).sc-ds-select-native-h{width:20rem}}.sc-ds-select-native-h>div.sc-ds-select-native{display:flex;flex-direction:column;position:relative}.ds-select__oSBnIJ-native.sc-ds-select-native,.ds-select__oSBnIJ-custom.sc-ds-select-native{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-native__dropdown-icon.sc-ds-select-native,.ds-select__oSBnIJ-custom__dropdown-icon.sc-ds-select-native{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-native{position:relative}.ds-select__oSBnIJ-custom.sc-ds-select-native .ds-options__oSBnIJ.sc-ds-select-native{display:block}.ds-select__oSBnIJ-custom-input-container.sc-ds-select-native{display:flex;position:relative}.ds-select__oSBnIJ-custom-input-container.sc-ds-select-native:has(.ds-select__oSBnIJ-custom__clear-button:hover) .ds-select__oSBnIJ-custom.sc-ds-select-native{background-color:var(--ds-bgColor-white-hover) !important}.ds-select__oSBnIJ-custom.sc-ds-select-native:not(.ds-select__oSBnIJ-custom--open,.ds-select__oSBnIJ-custom--invalid.sc-ds-select-native,.ds-select__oSBnIJ-custom--disabled).sc-ds-select-native:hover{background-color:var(--ds-bgColor-white-hover)}.ds-select__oSBnIJ-custom.sc-ds-select-native:active:not(.ds-select__oSBnIJ-custom--open,.ds-select__oSBnIJ-custom--invalid.sc-ds-select-native,.ds-select__oSBnIJ-custom--disabled).sc-ds-select-native{background-color:var(--ds-bgColor-white-active)}.ds-select__oSBnIJ-custom--open.sc-ds-select-native,.ds-select__oSBnIJ-custom.sc-ds-select-native: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-native:not(.ds-select__oSBnIJ-custom--open--invalid,.ds-select__oSBnIJ-custom.sc-ds-select-native:focus-visible--invalid),.ds-select__oSBnIJ-custom.sc-ds-select-native:focus-visible:not(.ds-select__oSBnIJ-custom--open--invalid,.ds-select__oSBnIJ-custom.sc-ds-select-native:focus-visible--invalid){border-color:var(--ds-borderColor-primary)}.ds-select__oSBnIJ-custom--disabled.sc-ds-select-native{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-native .ds-select__oSBnIJ-custom__dropdown-icon.sc-ds-select-native{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-native{background-color:var(--ds-bgColor-danger);border-color:var(--ds-borderColor-danger)}.ds-select__oSBnIJ-custom--invalid.sc-ds-select-native:not(.ds-select__oSBnIJ-custom--invalid--open,.ds-select__oSBnIJ-custom--invalid--disabled).sc-ds-select-native:active{background-color:var(--ds-bgColor-danger-active);border-color:var(--ds-borderColor-danger)}.ds-select__oSBnIJ-custom--invalid.sc-ds-select-native: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-native{margin-left:var(--badge-container-offset, calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px))}.ds-select__oSBnIJ-custom__selected-option.sc-ds-select-native{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-native .ds-select__oSBnIJ-custom__selected-option.sc-ds-select-native{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-native{font-size:var(--ds-fontSize-16)}.ds-select__oSBnIJ-custom__selected-option__text.sc-ds-select-native{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-native{color:var(--ds-textColor-secondary)}.ds-select__oSBnIJ-custom__selected-option__text--disabled.sc-ds-select-native{color:var(--ds-textColor-disabled-onLight)}.ds-select__oSBnIJ-custom.sc-ds-select-native input.sc-ds-select-native{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-native input.sc-ds-select-native::placeholder{color:var(--ds-textColor-secondary)}.ds-select__oSBnIJ-custom.sc-ds-select-native input.sc-ds-select-native:disabled{cursor:not-allowed;color:var(--ds-textColor-disabled-onLight)}.ds-select__oSBnIJ-custom.sc-ds-select-native input.sc-ds-select-native:disabled::placeholder{color:var(--ds-textColor-disabled-onLight)}.ds-select__oSBnIJ-custom.sc-ds-select-native input.sc-ds-select-native:focus{outline:none}.ds-select__oSBnIJ-custom__clear-button.sc-ds-select-native{position:absolute;right:calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px);cursor:pointer}.ds-select__oSBnIJ-custom__badge-container.sc-ds-select-native{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-native{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-native{display:block;box-shadow:var(--ds-shadow-overlay)}.ds-select__oSBnIJ-custom__options-container__options.sc-ds-select-native{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-native{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-native,.ds-select__oSBnIJ-custom__options-container__options__inner__bottom-scrim.sc-ds-select-native{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-native,.ds-select__oSBnIJ-custom__options-container__options__inner__bottom-scrim--visible.sc-ds-select-native{display:block}.ds-select__oSBnIJ-custom__options-container__options__inner__top-scrim.sc-ds-select-native{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-native{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-native{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-select__oSBnIJ-native.sc-ds-select-native:not(.ds-select__oSBnIJ-native--invalid,.ds-select__oSBnIJ-native--disabled).sc-ds-select-native:hover{background-color:var(--ds-bgColor-white-hover)}.ds-select__oSBnIJ-native.sc-ds-select-native:has(.ds-select__oSBnIJ-native__select:active):not(.ds-select__oSBnIJ-native--invalid,.ds-select__oSBnIJ-native--disabled).sc-ds-select-native{background-color:var(--ds-bgColor-white-active)}.ds-select__oSBnIJ-native.sc-ds-select-native:focus-within{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-native--disabled.sc-ds-select-native{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-native--disabled.sc-ds-select-native .ds-select__oSBnIJ-native__dropdown-icon.sc-ds-select-native{color:var(--ds-textColor-disabled-onLight);border-left-color:var(--ds-borderColor-disabled-onLight);cursor:not-allowed}.ds-select__oSBnIJ-native--invalid.sc-ds-select-native{background-color:var(--ds-bgColor-danger);border-color:var(--ds-borderColor-danger)}.ds-select__oSBnIJ-native--invalid.sc-ds-select-native:not(.ds-select__oSBnIJ-native--invalid--disabled):has(.ds-select__oSBnIJ-native__select:active){background-color:var(--ds-bgColor-danger-active);border-color:var(--ds-borderColor-danger)}.ds-select__oSBnIJ-native--invalid.sc-ds-select-native:not(.ds-select__oSBnIJ-native--invalid--disabled):hover{background-color:var(--ds-bgColor-danger-hover)}.ds-select__oSBnIJ-native__selected-text.sc-ds-select-native{flex:1;padding:0 var(--ds-spacing-xSmall);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-select__oSBnIJ-native__select.sc-ds-select-native{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1;appearance:none;border:none;outline:none;padding:0 var(--ds-spacing-2xSmall);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);background-color:transparent;color:inherit;flex:1}.ds-select__oSBnIJ-native__select.sc-ds-select-native::placeholder{color:var(--ds-textColor-secondary)}.ds-select__oSBnIJ-native__select.sc-ds-select-native:disabled{background-color:var(--ds-bgColor-disabled-onLight);color:var(--ds-textColor-disabled-onLight);cursor:not-allowed}";
+const dsSelectNativeCss = () => `.sc-ds-select-native-h{display:inline-block;width:100%}@media (min-width: 30rem){:not(:has(.ds-select__SPFJ1E--full-width)).sc-ds-select-native-h{width:20rem}}.sc-ds-select-native-h>div.sc-ds-select-native{display:flex;flex-direction:column;position:relative}.ds-select__SPFJ1E-native.sc-ds-select-native,.ds-select__SPFJ1E-custom.sc-ds-select-native{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__SPFJ1E-native__dropdown-icon.sc-ds-select-native,.ds-select__SPFJ1E-custom__dropdown-icon.sc-ds-select-native{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__SPFJ1E-custom-wrapper.sc-ds-select-native{position:relative}.ds-select__SPFJ1E-custom.sc-ds-select-native .ds-options__SPFJ1E.sc-ds-select-native{display:block}.ds-select__SPFJ1E-custom-input-container.sc-ds-select-native{display:flex;position:relative}.ds-select__SPFJ1E-custom-input-container.sc-ds-select-native:has(.ds-select__SPFJ1E-custom__clear-button:hover) .ds-select__SPFJ1E-custom.sc-ds-select-native{background-color:var(--ds-bgColor-white-hover) !important}.ds-select__SPFJ1E-custom.sc-ds-select-native:not(.ds-select__SPFJ1E-custom--open,.ds-select__SPFJ1E-custom--invalid.sc-ds-select-native,.ds-select__SPFJ1E-custom--disabled).sc-ds-select-native:hover{background-color:var(--ds-bgColor-white-hover)}.ds-select__SPFJ1E-custom.sc-ds-select-native:active:not(.ds-select__SPFJ1E-custom--open,.ds-select__SPFJ1E-custom--invalid.sc-ds-select-native,.ds-select__SPFJ1E-custom--disabled).sc-ds-select-native{background-color:var(--ds-bgColor-white-active)}.ds-select__SPFJ1E-custom--open.sc-ds-select-native,.ds-select__SPFJ1E-custom.sc-ds-select-native: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__SPFJ1E-custom--open.sc-ds-select-native:not(.ds-select__SPFJ1E-custom--open--invalid,.ds-select__SPFJ1E-custom.sc-ds-select-native:focus-visible--invalid),.ds-select__SPFJ1E-custom.sc-ds-select-native:focus-visible:not(.ds-select__SPFJ1E-custom--open--invalid,.ds-select__SPFJ1E-custom.sc-ds-select-native:focus-visible--invalid){border-color:var(--ds-borderColor-primary)}.ds-select__SPFJ1E-custom--disabled.sc-ds-select-native{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__SPFJ1E-custom--disabled.sc-ds-select-native .ds-select__SPFJ1E-custom__dropdown-icon.sc-ds-select-native{color:var(--ds-textColor-disabled-onLight);border-left-color:var(--ds-borderColor-disabled-onLight);cursor:not-allowed}.ds-select__SPFJ1E-custom--invalid.sc-ds-select-native{background-color:var(--ds-bgColor-danger);border-color:var(--ds-borderColor-danger)}.ds-select__SPFJ1E-custom--invalid.sc-ds-select-native:not(.ds-select__SPFJ1E-custom--invalid--open,.ds-select__SPFJ1E-custom--invalid--disabled).sc-ds-select-native:active{background-color:var(--ds-bgColor-danger-active);border-color:var(--ds-borderColor-danger)}.ds-select__SPFJ1E-custom--invalid.sc-ds-select-native:not(.ds-select__SPFJ1E-custom--invalid--disabled):hover{background-color:var(--ds-bgColor-danger-hover)}.ds-select__SPFJ1E-custom__dropdown-icon--has-clear-button.sc-ds-select-native{margin-left:var(--badge-container-offset, calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px))}.ds-select__SPFJ1E-custom__selected-option.sc-ds-select-native{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__SPFJ1E-custom--has-icon.sc-ds-select-native .ds-select__SPFJ1E-custom__selected-option.sc-ds-select-native{padding-left:var(--ds-select-selected-option-padding, calc(var(--ds-spacing-xSmall) - 2px));padding-right:var(--ds-spacing-2xSmall)}.ds-select__SPFJ1E-custom__selected-option__placeholder-icon.sc-ds-select-native{font-size:var(--ds-fontSize-16)}.ds-select__SPFJ1E-custom__selected-option__text.sc-ds-select-native{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:2px;color:var(--ds-textColor-default)}.ds-select__SPFJ1E-custom__selected-option__text--none-selected.sc-ds-select-native{color:var(--ds-textColor-secondary)}.ds-select__SPFJ1E-custom__selected-option__text--disabled.sc-ds-select-native{color:var(--ds-textColor-disabled-onLight)}.ds-select__SPFJ1E-custom.sc-ds-select-native input.sc-ds-select-native{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__SPFJ1E-custom.sc-ds-select-native input.sc-ds-select-native::placeholder{color:var(--ds-textColor-secondary)}.ds-select__SPFJ1E-custom.sc-ds-select-native input.sc-ds-select-native:disabled{cursor:not-allowed;color:var(--ds-textColor-disabled-onLight)}.ds-select__SPFJ1E-custom.sc-ds-select-native input.sc-ds-select-native:disabled::placeholder{color:var(--ds-textColor-disabled-onLight)}.ds-select__SPFJ1E-custom.sc-ds-select-native input.sc-ds-select-native:focus{outline:none}.ds-select__SPFJ1E-custom__clear-button.sc-ds-select-native{position:absolute;right:calc(24px + var(--ds-spacing-2xSmall) * 2 + 2px + 1px);cursor:pointer}.ds-select__SPFJ1E-custom__badge-container.sc-ds-select-native{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__SPFJ1E-custom__options-container.sc-ds-select-native{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__SPFJ1E-custom__options-container--open.sc-ds-select-native{display:block;box-shadow:var(--ds-shadow-overlay)}.ds-select__SPFJ1E-custom__options-container__options.sc-ds-select-native{position:relative;display:block;width:100%;padding:0;margin:0;z-index:0;overflow:auto}.ds-select__SPFJ1E-custom__options-container__options__inner.sc-ds-select-native{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__SPFJ1E-custom__options-container__options__inner__top-scrim.sc-ds-select-native,.ds-select__SPFJ1E-custom__options-container__options__inner__bottom-scrim.sc-ds-select-native{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__SPFJ1E-custom__options-container__options__inner__top-scrim--visible.sc-ds-select-native,.ds-select__SPFJ1E-custom__options-container__options__inner__bottom-scrim--visible.sc-ds-select-native{display:block}.ds-select__SPFJ1E-custom__options-container__options__inner__top-scrim.sc-ds-select-native{top:0;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-select__SPFJ1E-custom__options-container__options__inner__top-scrim--dark.sc-ds-select-native{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__SPFJ1E-custom__options-container__options__inner__bottom-scrim.sc-ds-select-native{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-select__SPFJ1E-native.sc-ds-select-native:not(.ds-select__SPFJ1E-native--invalid,.ds-select__SPFJ1E-native--disabled).sc-ds-select-native:hover{background-color:var(--ds-bgColor-white-hover)}.ds-select__SPFJ1E-native.sc-ds-select-native:has(.ds-select__SPFJ1E-native__select:active):not(.ds-select__SPFJ1E-native--invalid,.ds-select__SPFJ1E-native--disabled).sc-ds-select-native{background-color:var(--ds-bgColor-white-active)}.ds-select__SPFJ1E-native.sc-ds-select-native:focus-within{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__SPFJ1E-native--disabled.sc-ds-select-native{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__SPFJ1E-native--disabled.sc-ds-select-native .ds-select__SPFJ1E-native__dropdown-icon.sc-ds-select-native{color:var(--ds-textColor-disabled-onLight);border-left-color:var(--ds-borderColor-disabled-onLight);cursor:not-allowed}.ds-select__SPFJ1E-native--invalid.sc-ds-select-native{background-color:var(--ds-bgColor-danger);border-color:var(--ds-borderColor-danger)}.ds-select__SPFJ1E-native--invalid.sc-ds-select-native:not(.ds-select__SPFJ1E-native--invalid--disabled):has(.ds-select__SPFJ1E-native__select:active){background-color:var(--ds-bgColor-danger-active);border-color:var(--ds-borderColor-danger)}.ds-select__SPFJ1E-native--invalid.sc-ds-select-native:not(.ds-select__SPFJ1E-native--invalid--disabled):hover{background-color:var(--ds-bgColor-danger-hover)}.ds-select__SPFJ1E-native__selected-text.sc-ds-select-native{flex:1;padding:0 var(--ds-spacing-xSmall);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-select__SPFJ1E-native__select.sc-ds-select-native{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1;appearance:none;border:none;outline:none;padding:0 var(--ds-spacing-2xSmall);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);background-color:transparent;color:inherit;flex:1}.ds-select__SPFJ1E-native__select.sc-ds-select-native::placeholder{color:var(--ds-textColor-secondary)}.ds-select__SPFJ1E-native__select.sc-ds-select-native:disabled{background-color:var(--ds-bgColor-disabled-onLight);color:var(--ds-textColor-disabled-onLight);cursor:not-allowed}`;
 
 const DsSelectNative = class extends Mixin(ariaDeprecationFactory) {
     constructor(hostRef) {
         super();
         registerInstance(this, hostRef);
-        this.dsChange = createEvent(this, "dsChange");
-        this.dsValidity = createEvent(this, "dsValidity");
-        this.dsSubmitInvalid = createEvent(this, "dsSubmitInvalid");
+        this.dsChange = createEvent(this, "dsChange", 7);
+        this.dsValidity = createEvent(this, "dsValidity", 7);
+        this.dsSubmitInvalid = createEvent(this, "dsSubmitInvalid", 7);
     }
     dsAriaDescribedby;
     dsAriaControls;
@@ -104,11 +104,11 @@ const DsSelectNative = class extends Mixin(ariaDeprecationFactory) {
         const { ['aria-controls']: attrAriaControls, ['aria-describedby']: attrAriaDescribedby, ...restAttributes } = this.inheritedAttributes;
         const ariaDescribedby = this.dsAriaDescribedby ?? attrAriaDescribedby;
         const ariaControls = this.dsAriaControls ?? attrAriaControls ?? `${this.dsId}-listbox`;
-        return (h("div", { key: '4637c1eb5ab582681c3affe8040bc6b733cbc63b' }, h(DsControlLabel, { key: 'fc095058829c5170d6817c6052ca89fc6def102b', dsHtmlFor: this.dsId, dsLabel: this.dsLabel, dsRequired: this.dsRequired }, h("slot", { key: '6a3c47fbd90a3223329eb3d40f52235f41bec56c', name: "label" })), h("div", { key: '8e2cac7bd238e2a5d32f78acc03e33340162d395', class: classNames(`${nativeSelectClass}`, {
+        return (h("div", { key: 'a6151f2eb05db8596f5b2bf905bd3c86c6f037e2' }, h(DsControlLabel, { key: 'c7d3f6154dcefdb2bb6da5c1bf099b535aab047f', dsHtmlFor: this.dsId, dsLabel: this.dsLabel, dsRequired: this.dsRequired }, h("slot", { key: '3f23a69479ea9ecdb75779de2578c58ace1e0976', name: "label" })), h("div", { key: 'bde07705b0a3746c8651d1836ed3d1340eee5dc8', class: classNames(`${nativeSelectClass}`, {
                 [`${baseClass}--full-width`]: this.dsFullWidth,
                 [`${nativeSelectClass}--disabled`]: this.dsDisabled,
                 [`${nativeSelectClass}--invalid`]: !!this.dsErrorText,
-            }) }, h("div", { key: '873bcb57f1de28b382a556b0ed604fce5cd77966', class: `${nativeSelectClass}__selected-text`, "aria-hidden": "true" }, this.value ? this.nativeSelectRef?.selectedOptions[0]?.textContent || this.dsPlaceholder : this.dsPlaceholder), h("select", { key: '093f2fbd7b03b94dd6990a0f76438bf7f02b2c17', ref: el => {
+            }) }, h("div", { key: '9e0006fb87aee8a6d7137570262c1c23abbe2a4e', class: `${nativeSelectClass}__selected-text`, "aria-hidden": "true" }, this.value ? this.nativeSelectRef?.selectedOptions[0]?.textContent || this.dsPlaceholder : this.dsPlaceholder), h("select", { key: 'd9f2b83a5d31d2411af500955dd18af5ab242702', ref: el => {
                 this.nativeSelectRef = el;
                 if (el)
                     el.value = this.value;
@@ -116,15 +116,21 @@ const DsSelectNative = class extends Mixin(ariaDeprecationFactory) {
                 const target = event.target;
                 this.value = target.value;
                 this.dsChange.emit(target.value);
-            }, "aria-describedby": ariaDescribedby, "aria-controls": ariaControls, ...restAttributes }, h("option", { key: '6e26e0cf8129c40178eb53234fd77046ef896302', value: "", disabled: true, style: { display: this.dsRequired ? 'none' : undefined }, selected: !this.value }, this.dsPlaceholder), h("slot", { key: 'f56335457c6131faf6415cee729a7a5679763a02', name: "native" })), h(this.DsIconTag, { key: 'e744b4a109ff61203bda35fd58bf3d606a0566fb', class: `${nativeSelectClass}__dropdown-icon`, dsName: "keyboard_arrow_down" })), !!this.dsErrorText && h(this.DsInputValidityTag, { key: 'e297ed9573d0ba53ea599482edc1a3bc22515ce7', id: this.inputValidityId, dsText: this.dsErrorText, dsType: "error" })));
+            }, "aria-describedby": ariaDescribedby, "aria-controls": ariaControls, ...restAttributes }, h("option", { key: '9b1a4055f338a9c3640b0810c805afb21c48875b', value: "", disabled: true, style: { display: this.dsRequired ? 'none' : undefined }, selected: !this.value }, this.dsPlaceholder), h("slot", { key: 'fb773442e20b07260b3418aa714591bbf4df3875', name: "native" })), h(this.DsIconTag, { key: 'd9cdf30eae2de4eb38796a4f8ffeb0e4f770a614', class: `${nativeSelectClass}__dropdown-icon`, dsName: "keyboard_arrow_down" })), h(this.DsInputValidityTag, { key: '779101ea5d70873be46cde2d86a5e578224493e8', id: this.inputValidityId, dsText: this.dsErrorText, dsType: "error" })));
     }
     static get watchers() { return {
-        "aria-describedby": ["ariaAttributeObserver"],
-        "dsValue": ["dsValueObserver"],
-        "value": ["valueObserver"]
+        "aria-describedby": [{
+                "ariaAttributeObserver": 0
+            }],
+        "dsValue": [{
+                "dsValueObserver": 0
+            }],
+        "value": [{
+                "valueObserver": 0
+            }]
     }; }
 };
 declareComponentDependencies([h("ds-icon", { dsName: "" }), h("ds-control-label", null), h("ds-input-validity", null)]);
-DsSelectNative.style = dsSelectNativeCss;
+DsSelectNative.style = dsSelectNativeCss();
 
 export { DsSelectNative as ds_select_native };

package/dist/esm/ds-spinner.entry.js

@@ -1,10 +1,10 @@
-import { h, r as registerInstance, d as getElement } from './index-B4ZCBfpo.js';
+import { h, r as registerInstance, e as getElement } from './index-WKPTmD1Z.js';
 import { b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import { d as declareComponentDependencies, t as transformTagName } from './utils-J5Ghj1_T.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 
-const dsSpinnerCss = ".ds-font{}.ds-font-heading{font-family:var(--ds-fontFamily-heading)}.ds-font-body{font-family:var(--ds-fontFamily-body)}.ds-font{}.ds-font-regular{font-weight:var(--ds-fontWeight-regular)}.ds-font-semibold{font-weight:var(--ds-fontWeight-semibold)}.ds-font-semibold-plus{font-weight:var(--ds-fontWeight-semiboldPlus)}.ds-font-bold{font-weight:var(--ds-fontWeight-bold)}.ds-tracking-xs{letter-spacing:var(--ds-letterSpacing-xTight)}.ds-tracking-sm{letter-spacing:var(--ds-letterSpacing-tight)}.ds-tracking-md{letter-spacing:var(--ds-letterSpacing-normal)}.ds-tracking-lg{letter-spacing:var(--ds-letterSpacing-wide)}.ds-tracking-xl{letter-spacing:var(--ds-letterSpacing-xWide)}.ds-leading-sm{line-height:var(--ds-lineHeight-small)}.ds-leading-md{line-height:var(--ds-lineHeight-medium)}.ds-leading-lg{line-height:var(--ds-lineHeight-large)}.ds-leading-xl{line-height:var(--ds-lineHeight-xLarge)}.ds-width-md{font-stretch:var(--ds-fontWidth-normal)}.ds-width-sm{font-stretch:var(--ds-fontWidth-condense)}.ds-number-proportional{font-variant-numeric:var(--ds-number-style)}.ds-paragraph-16{margin-bottom:var(--ds-marginBottom, 16px)}.ds-paragraph-20{margin-bottom:var(--ds-marginBottom, 20px)}.ds-list-spacing{gap:4px}.ds-text-color-default{color:var(--ds-textColor-default)}.ds-text{}.ds-text-regular-2xl{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-xl{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-lg{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-md{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-sm{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-xs{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-regular)}.ds-text{}.ds-text-semibold-2xl{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-xl{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-lg{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-md{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-sm{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-xs{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-semibold)}.ds-text{}.ds-text-bold-2xl{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-xl{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-lg{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-md{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-sm{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-xs{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-bold)}.ds-spinner__oSBnIJ{display:inline-block}.ds-spinner__oSBnIJ:has(.ds-spinner__oSBnIJ__text){display:inline-flex;align-items:center;gap:calc(var(--spinner-size) / 2)}.ds-spinner__oSBnIJ{}.ds-spinner__oSBnIJ--small{padding:1.5px}.ds-spinner__oSBnIJ--medium{padding:3px}.ds-spinner__oSBnIJ--large{padding:3px}.ds-spinner__oSBnIJ--xLarge{padding:5.5px}.ds-spinner__oSBnIJ--2xLarge{padding:5.5px}.ds-spinner__oSBnIJ--custom{padding:calc(var(--spinner-size) / 8)}.ds-spinner__oSBnIJ{}.ds-spinner__oSBnIJ--below{flex-direction:column;align-items:center}.ds-spinner__oSBnIJ--right{flex-direction:row;align-items:center}.ds-spinner__oSBnIJ__spinner{width:var(--spinner-size, 24px);height:var(--spinner-size, 24px);border-radius:50%;border:calc(var(--spinner-size, 24px) / 6) solid var(--ds-borderColor-disabled-onLight);position:relative;display:flex;align-items:center;justify-content:center}.ds-spinner__oSBnIJ__text{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body)}.ds-spinner__oSBnIJ__text--white{color:var(--ds-textColor-white)}.ds-spinner__oSBnIJ__segment{display:block;position:absolute;width:var(--spinner-size, 24px);height:var(--spinner-size, 24px);border:calc(var(--spinner-size, 24px) / 6) solid var(--spinner-color, #005a94);border-radius:50%;animation:ds-spinner-rotate 1.1s cubic-bezier(0.7, 0.15, 0.3, 0.8) infinite;border-color:var(--spinner-color, #005a94) var(--spinner-border-color) var(--spinner-border-color) var(--spinner-border-color)}.ds-spinner__oSBnIJ__segment--1{animation-delay:-0.3s}.ds-spinner__oSBnIJ__segment--2{animation-delay:-0.2s}.ds-spinner__oSBnIJ__segment--3{animation-delay:-0.1s}@keyframes ds-spinner-rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.ds-spinner__oSBnIJ__segment{animation-duration:2.2s;animation-timing-function:linear;}.ds-spinner__oSBnIJ__segment--1{animation-delay:-0.6s}.ds-spinner__oSBnIJ__segment--2{animation-delay:-0.4s}.ds-spinner__oSBnIJ__segment--3{animation-delay:-0.2s}}";
+const dsSpinnerCss = () => `.ds-font{}.ds-font-heading{font-family:var(--ds-fontFamily-heading)}.ds-font-body{font-family:var(--ds-fontFamily-body)}.ds-font{}.ds-font-regular{font-weight:var(--ds-fontWeight-regular)}.ds-font-semibold{font-weight:var(--ds-fontWeight-semibold)}.ds-font-semibold-plus{font-weight:var(--ds-fontWeight-semiboldPlus)}.ds-font-bold{font-weight:var(--ds-fontWeight-bold)}.ds-tracking-xs{letter-spacing:var(--ds-letterSpacing-xTight)}.ds-tracking-sm{letter-spacing:var(--ds-letterSpacing-tight)}.ds-tracking-md{letter-spacing:var(--ds-letterSpacing-normal)}.ds-tracking-lg{letter-spacing:var(--ds-letterSpacing-wide)}.ds-tracking-xl{letter-spacing:var(--ds-letterSpacing-xWide)}.ds-leading-sm{line-height:var(--ds-lineHeight-small)}.ds-leading-md{line-height:var(--ds-lineHeight-medium)}.ds-leading-lg{line-height:var(--ds-lineHeight-large)}.ds-leading-xl{line-height:var(--ds-lineHeight-xLarge)}.ds-width-md{font-stretch:var(--ds-fontWidth-normal)}.ds-width-sm{font-stretch:var(--ds-fontWidth-condense)}.ds-number-proportional{font-variant-numeric:var(--ds-number-style)}.ds-paragraph-16{margin-bottom:var(--ds-marginBottom, 16px)}.ds-paragraph-20{margin-bottom:var(--ds-marginBottom, 20px)}.ds-list-spacing{gap:4px}.ds-text-color-default{color:var(--ds-textColor-default)}.ds-text{}.ds-text-regular-2xl{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-xl{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-lg{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-md{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-sm{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular)}.ds-text-regular-xs{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-regular)}.ds-text{}.ds-text-semibold-2xl{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-xl{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-lg{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-md{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-sm{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-semibold)}.ds-text-semibold-xs{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-semibold)}.ds-text{}.ds-text-bold-2xl{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-xl{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-lg{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-md{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-sm{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-bold)}.ds-text-bold-xs{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-bold)}.ds-spinner__SPFJ1E{display:inline-block}.ds-spinner__SPFJ1E:has(.ds-spinner__SPFJ1E__text){display:inline-flex;align-items:center;gap:calc(var(--spinner-size) / 2)}.ds-spinner__SPFJ1E{}.ds-spinner__SPFJ1E--small{padding:1.5px}.ds-spinner__SPFJ1E--medium{padding:3px}.ds-spinner__SPFJ1E--large{padding:3px}.ds-spinner__SPFJ1E--xLarge{padding:5.5px}.ds-spinner__SPFJ1E--2xLarge{padding:5.5px}.ds-spinner__SPFJ1E--custom{padding:calc(var(--spinner-size) / 8)}.ds-spinner__SPFJ1E{}.ds-spinner__SPFJ1E--below{flex-direction:column;align-items:center}.ds-spinner__SPFJ1E--right{flex-direction:row;align-items:center}.ds-spinner__SPFJ1E__spinner{width:var(--spinner-size, 24px);height:var(--spinner-size, 24px);border-radius:50%;border:calc(var(--spinner-size, 24px) / 6) solid var(--ds-borderColor-disabled-onLight);position:relative;display:flex;align-items:center;justify-content:center}.ds-spinner__SPFJ1E__text{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body)}.ds-spinner__SPFJ1E__text--white{color:var(--ds-textColor-white)}.ds-spinner__SPFJ1E__segment{display:block;position:absolute;width:var(--spinner-size, 24px);height:var(--spinner-size, 24px);border:calc(var(--spinner-size, 24px) / 6) solid var(--spinner-color, #005a94);border-radius:50%;animation:ds-spinner-rotate 1.1s cubic-bezier(0.7, 0.15, 0.3, 0.8) infinite;border-color:var(--spinner-color, #005a94) var(--spinner-border-color) var(--spinner-border-color) var(--spinner-border-color)}.ds-spinner__SPFJ1E__segment--1{animation-delay:-0.3s}.ds-spinner__SPFJ1E__segment--2{animation-delay:-0.2s}.ds-spinner__SPFJ1E__segment--3{animation-delay:-0.1s}@keyframes ds-spinner-rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.ds-spinner__SPFJ1E__segment{animation-duration:2.2s;animation-timing-function:linear;}.ds-spinner__SPFJ1E__segment--1{animation-delay:-0.6s}.ds-spinner__SPFJ1E__segment--2{animation-delay:-0.4s}.ds-spinner__SPFJ1E__segment--3{animation-delay:-0.2s}}`;
 
 const SPINNER_SIZES = {
     'small': 10,
@@ -61,14 +61,14 @@ const DsSpinner = class {
         const segmentClasses = (index) => classNames(`${baseClass}__segment`, `${baseClass}__segment--${index}`);
         const DsVisuallyHidden = transformTagName('ds-visually-hidden', 'ds-spinner', this.el);
         const spinnerSizeValue = this.dsCustomSize ? `calc(${this.dsCustomSize} / 1.5833333333)` : `${sizeInPixels}px`;
-        return (h("div", { key: 'a60e95698a071c75dd34474808a349640ffc6a72', role: this.dsUseRoleAlert ? 'alert' : null, "aria-live": this.dsUseAriaLive ? 'polite' : null, class: classes, style: {
+        return (h("div", { key: 'a5ab8628d31cd11157442ad55162b29d37816965', role: this.dsUseRoleAlert ? 'alert' : null, "aria-live": this.dsUseAriaLive ? 'polite' : null, class: classes, style: {
                 '--spinner-size': spinnerSizeValue,
                 '--spinner-color': `${spinnerColorVariable}`,
                 '--spinner-border-color': this.dsColour == 'white' ? 'var(--ds-overlay-white-15)' : 'transparent',
-            }, ...this.inheritedAttributes }, h("div", { key: 'e3e6ad995481b0fb08518572edb50029e92d89a8', class: `${baseClass}__spinner` }, h("div", { key: 'c12e11a8d5601027e74a493fce294da673cdc9af', class: segmentClasses(1) }), h("div", { key: 'dfc8e7860a421cd41356bff73ac1a647709b3eda', class: segmentClasses(2) }), h("div", { key: '2c1207b2bb431baff9048d914ddd111dbf185f57', class: segmentClasses(3) })), this.dsHiddenAssistiveText && (h(DsVisuallyHidden, { key: 'f47bd62847a965e05f56da222292467f3cbc3fd6' }, h("span", { key: '2fb3efd756d10f80a1aab99b52bab9b0f95f416a' }, this.dsHiddenAssistiveText))), this.dsText && (h("span", { key: '5c5aa10a7650d9a67d2ed45464162e7467f041a0', class: textClasses, style: { fontSize: this.dsCustomTextSize } }, this.dsText))));
+            }, ...this.inheritedAttributes }, h("div", { key: '25ed96e729bb88c416b32d0f21880c5f2ab3951b', class: `${baseClass}__spinner` }, h("div", { key: 'b13b4a14ecc2c8c4c641eb86e4fdd74ebffad129', class: segmentClasses(1) }), h("div", { key: '318d9bb4f5a5d3f9fffba1becaee1e26e69b2be3', class: segmentClasses(2) }), h("div", { key: 'a30386defb94ac94812a7af7a997b0cd152282bc', class: segmentClasses(3) })), this.dsHiddenAssistiveText && (h(DsVisuallyHidden, { key: '3527ed4476c41989409a1b8211ae24e2a0b47094' }, h("span", { key: 'a04b0e8b08d801b76795989b0c65172e58935dd7' }, this.dsHiddenAssistiveText))), this.dsText && (h("span", { key: '408add07c149d808d2907810fc10e0e8d5a43838', class: textClasses, style: { fontSize: this.dsCustomTextSize } }, this.dsText))));
     }
 };
 declareComponentDependencies([h("ds-visually-hidden", null)]);
-DsSpinner.style = dsSpinnerCss;
+DsSpinner.style = dsSpinnerCss();
 
 export { DsSpinner as ds_spinner };

package/dist/esm/ds-store.entry.js

@@ -1,10 +1,10 @@
-import { r as registerInstance, c as createEvent } from './index-B4ZCBfpo.js';
-import { d as defaultLanguage, i as initialize, s as setLanguage, g as getLanguage } from './store-I792JNgf.js';
+import { r as registerInstance, c as createEvent } from './index-WKPTmD1Z.js';
+import { d as defaultLanguage, i as initialize, s as setLanguage, g as getLanguage } from './store-CaI4gcSt.js';
 
 const DsStore = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.dsLanguageChange = createEvent(this, "dsLanguageChange");
+        this.dsLanguageChange = createEvent(this, "dsLanguageChange", 7);
     }
     dsLanguage = defaultLanguage;
     dsLanguageChange;
@@ -25,7 +25,9 @@ const DsStore = class {
         return getLanguage();
     }
     static get watchers() { return {
-        "dsLanguage": ["dsLanguageObserver"]
+        "dsLanguage": [{
+                "dsLanguageObserver": 0
+            }]
     }; }
 };
 

package/dist/esm/ds-tab.entry.js

@@ -1,30 +1,19 @@
-import { M as Mixin, r as registerInstance, c as createEvent, d as getElement, h } from './index-B4ZCBfpo.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { M as Mixin, r as registerInstance, c as createEvent, e as getElement, h } from './index-WKPTmD1Z.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import { t as transformTagName, d as declareComponentDependencies } from './utils-J5Ghj1_T.js';
-import { t as tabsFactory } from './tabsFactory-B3QdivwA.js';
+import { t as tabsFactory } from './tabsFactory-D6bx4WWK.js';
+import { g as getIconColourVariable } from './iconList-BeuglwyX.js';
 import './tabsContext-9ZMZNA_E.js';
 
-const colourNames = ['default', 'neutral', 'white', 'primary', 'info', 'danger', 'success', 'attention'];
-const iconStates = ['hover', 'active'];
-const getIconColourVariable = (name, state) => `ds-iconColor-${name}${state ? `-${state}` : ''}`;
-const baseIconColours = colourNames.map(name => getIconColourVariable(name));
-baseIconColours.reduce((acc, curr) => {
-    acc.push(curr);
-    iconStates.forEach(state => {
-        acc.push(getIconColourVariable(curr, state));
-    });
-    return acc;
-}, []);
-
-const dsTabCss = ".ds-no-style-leak.sc-ds-tab *.sc-ds-tab{all:unset;box-sizing:border-box;display:block}.sc-ds-tab-h{display:contents}.ds-tab__oSBnIJ.sc-ds-tab{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);position:relative;display:inline-flex;flex-direction:row;flex-shrink:0;min-width:44px;min-height:44px;padding:var(--ds-spacing-xSmall);background-color:var(--ds-bgColor-transparent-onLight);color:var(--ds-textColor-secondary);font-variant-numeric:lining-nums proportional-nums;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-style:normal;font-weight:var(--ds-fontWeight-semibold);line-height:var(--ds-lineHeight-large);letter-spacing:var(--ds-letterSpacing-wide);cursor:default}@media (min-width: 60rem){.ds-tab__oSBnIJ.sc-ds-tab{font-size:var(--ds-fontSize-18)}}.ds-tab__oSBnIJ--selected.sc-ds-tab,.ds-tab__oSBnIJ.sc-ds-tab:hover:not(.ds-tab__oSBnIJ--selected),.ds-tab__oSBnIJ.sc-ds-tab:active:not(.ds-tab__oSBnIJ--selected){color:var(--ds-textColor-default)}.ds-tab__oSBnIJ--container.sc-ds-tab:focus-visible{box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.ds-tab__oSBnIJ--container.ds-tab__oSBnIJ--selected.sc-ds-tab{background-color:var(--ds-bgColor-white)}.ds-tab__oSBnIJ--container.ds-tab__oSBnIJ--selected.sc-ds-tab::after{content:\"\";position:absolute;top:0;left:0;right:0;border-block-start:var(--ds-borderWidth-thick) solid var(--ds-borderColor-primary)}.ds-tab__oSBnIJ--container.ds-tab__oSBnIJ--selected.sc-ds-tab:not(:focus-visible)::before{content:\"\";position:absolute;inset:0;border-inline:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-default)}.ds-tab__oSBnIJ--container.sc-ds-tab:hover:not(.ds-tab__oSBnIJ--selected){background-color:var(--ds-bgColor-transparent-onLight-hover)}.ds-tab__oSBnIJ--container.sc-ds-tab:active:not(.ds-tab__oSBnIJ--selected){background-color:var(--ds-bgColor-transparent-onLight-active)}.ds-tab__oSBnIJ--line.sc-ds-tab:focus-visible .ds-tab__oSBnIJ__content.sc-ds-tab{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-tab__oSBnIJ--line.ds-tab__oSBnIJ--selected.sc-ds-tab::after{content:\"\";position:absolute;bottom:0;left:0;right:0;border-block-end:var(--ds-borderWidth-thick) solid var(--ds-borderColor-primary)}.ds-tab__oSBnIJ--line.sc-ds-tab:hover:not(.ds-tab__oSBnIJ--selected)::after{content:\"\";position:absolute;bottom:0;left:0;right:0;border-block-end:var(--ds-borderWidth-thick) solid var(--ds-borderColor-default)}.ds-tab__oSBnIJ--line.sc-ds-tab:active:not(.ds-tab__oSBnIJ--selected)::after{content:\"\";position:absolute;bottom:0;left:0;right:0;border-block-end:var(--ds-borderWidth-thick) solid var(--ds-borderColor-black)}.ds-tab__oSBnIJ.sc-ds-tab .ds-tab__oSBnIJ__content.sc-ds-tab{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:var(--ds-spacing-2xSmall)}";
+const dsTabCss = () => `.ds-no-style-leak.sc-ds-tab *.sc-ds-tab{all:unset;box-sizing:border-box;display:block}.sc-ds-tab-h{display:contents}.ds-tab__SPFJ1E.sc-ds-tab{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);position:relative;display:inline-flex;flex-direction:row;flex-shrink:0;min-width:44px;min-height:44px;padding:var(--ds-spacing-xSmall);background-color:var(--ds-bgColor-transparent-onLight);color:var(--ds-textColor-secondary);font-variant-numeric:lining-nums proportional-nums;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-style:normal;font-weight:var(--ds-fontWeight-semibold);line-height:var(--ds-lineHeight-large);letter-spacing:var(--ds-letterSpacing-wide);cursor:default}@media (min-width: 60rem){.ds-tab__SPFJ1E.sc-ds-tab{font-size:var(--ds-fontSize-18)}}.ds-tab__SPFJ1E--selected.sc-ds-tab,.ds-tab__SPFJ1E.sc-ds-tab:hover:not(.ds-tab__SPFJ1E--selected),.ds-tab__SPFJ1E.sc-ds-tab:active:not(.ds-tab__SPFJ1E--selected){color:var(--ds-textColor-default)}.ds-tab__SPFJ1E--container.sc-ds-tab:focus-visible{box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.ds-tab__SPFJ1E--container.ds-tab__SPFJ1E--selected.sc-ds-tab{background-color:var(--ds-bgColor-white)}.ds-tab__SPFJ1E--container.ds-tab__SPFJ1E--selected.sc-ds-tab::after{content:"";position:absolute;top:0;left:0;right:0;border-block-start:var(--ds-borderWidth-thick) solid var(--ds-borderColor-primary)}.ds-tab__SPFJ1E--container.ds-tab__SPFJ1E--selected.sc-ds-tab:not(:focus-visible)::before{content:"";position:absolute;inset:0;border-inline:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-default)}.ds-tab__SPFJ1E--container.sc-ds-tab:hover:not(.ds-tab__SPFJ1E--selected){background-color:var(--ds-bgColor-transparent-onLight-hover)}.ds-tab__SPFJ1E--container.sc-ds-tab:active:not(.ds-tab__SPFJ1E--selected){background-color:var(--ds-bgColor-transparent-onLight-active)}.ds-tab__SPFJ1E--line.sc-ds-tab:focus-visible .ds-tab__SPFJ1E__content.sc-ds-tab{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-tab__SPFJ1E--line.ds-tab__SPFJ1E--selected.sc-ds-tab::after{content:"";position:absolute;bottom:0;left:0;right:0;border-block-end:var(--ds-borderWidth-thick) solid var(--ds-borderColor-primary)}.ds-tab__SPFJ1E--line.sc-ds-tab:hover:not(.ds-tab__SPFJ1E--selected)::after{content:"";position:absolute;bottom:0;left:0;right:0;border-block-end:var(--ds-borderWidth-thick) solid var(--ds-borderColor-default)}.ds-tab__SPFJ1E--line.sc-ds-tab:active:not(.ds-tab__SPFJ1E--selected)::after{content:"";position:absolute;bottom:0;left:0;right:0;border-block-end:var(--ds-borderWidth-thick) solid var(--ds-borderColor-black)}.ds-tab__SPFJ1E.sc-ds-tab .ds-tab__SPFJ1E__content.sc-ds-tab{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:var(--ds-spacing-2xSmall)}`;
 
 const DsTab = class extends Mixin(tabsFactory) {
     constructor(hostRef) {
         super();
         registerInstance(this, hostRef);
-        this.dsTabClick = createEvent(this, "dsTabClick");
-        this.dsTabFocus = createEvent(this, "dsTabFocus");
+        this.dsTabClick = createEvent(this, "dsTabClick", 7);
+        this.dsTabFocus = createEvent(this, "dsTabFocus", 7);
     }
     get el() { return getElement(this); }
     tablist = null;
@@ -115,10 +104,10 @@ const DsTab = class extends Mixin(tabsFactory) {
             [`${baseClass}--line`]: this.context?.variant === 'line',
             [`${baseClass}--selected`]: isSelected,
         });
-        return (h("div", { key: '1fbc41f2d6654c367ec02206e550fd749d6794b8', ref: elem => (this.tabElement = elem), class: classes, role: "tab", "aria-controls": this.dsTabPanelId, "aria-selected": String(isSelected), tabIndex: isSelected ? 0 : -1 }, h("div", { key: '5bb747568c268122a7bc86ae4ae8a01191441b88', class: `${baseClass}__content` }, h("slot", { key: 'd9229905e2578d66c25ddd782288982d8945779c', name: "prefix", onSlotchange: this.checkPrefixSlot }, !this.hasPrefixSlot && this.dsIconStart && h(this.DsIcon, { key: 'a84247bb0f42bf41b724baa0fda285d2afc80356', dsName: this.dsIconStart })), h("slot", { key: 'b27957b33646cc050f3d155cd0ef92d80ce41dab', name: "content", onSlotchange: this.checkContentSlot }, !this.hasContentSlot && h("span", { key: 'efbc2f4c46ace18ff104978097ac893045e40cd5' }, this.dsText)), h("slot", { key: '5daa646e7d12b185f9d55d04889f717a5556bcc5', name: "suffix", onSlotchange: this.checkSuffixSlot }, !this.hasSuffixSlot && this.dsIconEnd && h(this.DsIcon, { key: 'c7fe446b2fce539f08f1409c674f714992e5f36e', dsName: this.dsIconEnd, dsColour: this.iconColour })))));
+        return (h("div", { key: 'd7ef3232e57989ba8ec756637533fa722cf31d8d', ref: elem => (this.tabElement = elem), class: classes, role: "tab", "aria-controls": this.dsTabPanelId, "aria-selected": String(isSelected), tabIndex: isSelected ? 0 : -1 }, h("div", { key: 'c70877273bfaa80e3b747ee58506576c8b07db38', class: `${baseClass}__content` }, h("slot", { key: '3f9c84ac04013e048dad762ddcc5141f1e7913ae', name: "prefix", onSlotchange: this.checkPrefixSlot }, !this.hasPrefixSlot && this.dsIconStart && h(this.DsIcon, { key: '25fbae6d6864367c96b37d428a9a1f5292463c0f', dsName: this.dsIconStart })), h("slot", { key: '45c2fa3aa5f032d8e714d4d1feb9dea8d4a3c587', name: "content", onSlotchange: this.checkContentSlot }, !this.hasContentSlot && h("span", { key: 'a1fe345038d9e8ad270de3bed08e63999adda089' }, this.dsText)), h("slot", { key: 'c21c209255e904434d11f62a197c0e3d71379567', name: "suffix", onSlotchange: this.checkSuffixSlot }, !this.hasSuffixSlot && this.dsIconEnd && h(this.DsIcon, { key: '5de4042af5178dc4d0442e303391f7a9622bf400', dsName: this.dsIconEnd, dsColour: this.iconColour })))));
     }
 };
 declareComponentDependencies([h("ds-icon", { dsName: "" })]);
-DsTab.style = dsTabCss;
+DsTab.style = dsTabCss();
 
 export { DsTab as ds_tab };

package/dist/esm/ds-tablist.entry.js

@@ -1,17 +1,17 @@
-import { M as Mixin, r as registerInstance, c as createEvent, d as getElement, h } from './index-B4ZCBfpo.js';
+import { M as Mixin, r as registerInstance, c as createEvent, e as getElement, h } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { t as transformTagName, e as throttle, a as ifDefined, d as declareComponentDependencies } from './utils-J5Ghj1_T.js';
-import { t as tabsFactory } from './tabsFactory-B3QdivwA.js';
+import { t as tabsFactory } from './tabsFactory-D6bx4WWK.js';
 import './tabsContext-9ZMZNA_E.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 dsTablistCss = () => `.ds-no-style-leak.sc-ds-tablist *.sc-ds-tablist{all:unset;box-sizing:border-box;display:block}.ds-tablist__SPFJ1E.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__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__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__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__scrollable.sc-ds-tablist:focus,.ds-tablist__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__scrollable.sc-ds-tablist:focus-visible,.ds-tablist__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__scrollable.sc-ds-tablist:-moz-focusring{outline:none;box-shadow:none}.ds-tablist__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__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__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__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__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__button.sc-ds-tablist{position:absolute;top:0;bottom:0;display:flex;aspect-ratio:1;justify-content:center;align-items:center}.ds-tablist__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__button--backward.sc-ds-tablist{left:0}.ds-tablist__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__button--forward.sc-ds-tablist{right:0}.ds-tablist__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__button--container.sc-ds-tablist{border:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-default);background-color:var(--ds-bgColor-neutralLight)}.ds-tablist__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__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__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__button--container.ds-tablist__SPFJ1E__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__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__button--container.ds-tablist__SPFJ1E__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__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__button[hidden].sc-ds-tablist{display:none}.ds-tablist__SPFJ1E.sc-ds-tablist .ds-tablist__SPFJ1E__button__ds-button.sc-ds-tablist{width:100%;height:100%}`;
 
 const DsTablist = class extends Mixin(tabsFactory) {
     constructor(hostRef) {
         super();
         registerInstance(this, hostRef);
-        this.dsTabChange = createEvent(this, "dsTabChange");
+        this.dsTabChange = createEvent(this, "dsTabChange", 7);
     }
     get el() { return getElement(this); }
     RESIZE_THROTTLE_TIMEOUT = 100;
@@ -146,19 +146,19 @@ const DsTablist = class extends Mixin(tabsFactory) {
         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, {
+        return (h("div", { key: '0b8939092cebd964f1d059c39e96356c9667b30b', class: baseClass }, h("div", { key: '95df4f0c08c9d7683b7ad33c619f6316a01645bd', 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`, {
+            }), role: "tablist", ...ifDefined('aria-label', this.dsAriaLabel), ...ifDefined('aria-labelledby', this.dsAriaLabelledby), onScroll: this.handleScroll }, h("slot", { key: '4f8a069e168c9de0387347d08c618abd0b6167a6' })), h("div", { key: '53fb3cbeca8828a5e8cb29252b62458902b2d292', 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`, {
+            }), "aria-hidden": "true", hidden: !this.showBackwardButton }, this.renderButton('backward')), h("div", { key: '4a4b57eb33f521de240bb884252b0c557c03e7be', 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'))));
     }
 };
 declareComponentDependencies([h("ds-tab", { dsId: "", dsTabPanelId: "" }), h("ds-button", null)]);
-DsTablist.style = dsTablistCss;
+DsTablist.style = dsTablistCss();
 
 export { DsTablist as ds_tablist };

package/dist/esm/ds-tabpanel.entry.js

@@ -1,11 +1,11 @@
-import { M as Mixin, r as registerInstance, d as getElement, h } from './index-B4ZCBfpo.js';
-import { c as cx } from './cx-hUnOoCpm.js';
-import { t as tabsFactory } from './tabsFactory-B3QdivwA.js';
+import { M as Mixin, r as registerInstance, e as getElement, h } from './index-WKPTmD1Z.js';
+import { c as cx } from './cx-jGcD6jB5.js';
+import { t as tabsFactory } from './tabsFactory-D6bx4WWK.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import './tabsContext-9ZMZNA_E.js';
 import './utils-J5Ghj1_T.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 dsTabpanelCss = () => `.ds-no-style-leak.sc-ds-tabpanel *.sc-ds-tabpanel{all:unset;box-sizing:border-box;display:block}.ds-tabpanel__SPFJ1E.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__SPFJ1E--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__SPFJ1E--padded.sc-ds-tabpanel{padding-block-start:var(--ds-spacing-small)}@media (min-width: 60rem){.ds-tabpanel__SPFJ1E--padded.sc-ds-tabpanel{padding-block-start:var(--ds-spacing-medium)}}.ds-tabpanel__SPFJ1E--container.ds-tabpanel__SPFJ1E--padded.sc-ds-tabpanel{padding:var(--ds-spacing-small)}@media (min-width: 60rem){.ds-tabpanel__SPFJ1E--container.ds-tabpanel__SPFJ1E--padded.sc-ds-tabpanel{padding:var(--ds-spacing-medium)}}.ds-tabpanel__SPFJ1E[hidden].sc-ds-tabpanel{display:none}`;
 
 const DsTabpanel = class extends Mixin(tabsFactory) {
     constructor(hostRef) {
@@ -18,12 +18,12 @@ const DsTabpanel = class extends Mixin(tabsFactory) {
     dsPadded = true;
     render() {
         const baseClass = cx('ds-tabpanel');
-        return (h("div", { key: 'a652b9384924c3b603dddcab5e7c2e37d7b5e9d7', id: this.dsId, class: classNames(baseClass, {
+        return (h("div", { key: '02cfe60faa9a5482863fd37c36fe8280065c63c2', 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' })));
+            }), role: "tabpanel", hidden: this.context?.currentTabPanel !== this.dsId, "aria-labelledby": this.dsTabId }, h("slot", { key: '180822110e02fc238cc144ca5028eb64d2b365dc' })));
     }
 };
-DsTabpanel.style = dsTabpanelCss;
+DsTabpanel.style = dsTabpanelCss();
 
 export { DsTabpanel as ds_tabpanel };

package/dist/esm/ds-tabs.entry.js

@@ -1,9 +1,9 @@
-import { r as registerInstance, d as getElement, h } from './index-B4ZCBfpo.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { r as registerInstance, e as getElement, h } from './index-WKPTmD1Z.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { s as storeTabsContext, p as provideTabsContext } from './tabsContext-9ZMZNA_E.js';
 import './utils-J5Ghj1_T.js';
 
-const dsTabsCss = ".ds-no-style-leak.sc-ds-tabs *.sc-ds-tabs{all:unset;box-sizing:border-box;display:block}.ds-tabs__oSBnIJ.sc-ds-tabs{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16)}";
+const dsTabsCss = () => `.ds-no-style-leak.sc-ds-tabs *.sc-ds-tabs{all:unset;box-sizing:border-box;display:block}.ds-tabs__SPFJ1E.sc-ds-tabs{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16)}`;
 
 const DsTabs = class {
     constructor(hostRef) {
@@ -39,9 +39,9 @@ const DsTabs = class {
     }
     render() {
         const baseClass = cx('ds-tabs');
-        return (h("div", { key: '38636c60ba2cd1122bbe70b1b25e99af2122b2d9', class: baseClass }, h("slot", { key: '252cc12020e9777cd61f72db136c25d932f176e8' })));
+        return (h("div", { key: '8d1dd34db51da0c57559334cc3702ac2f8874eb4', class: baseClass }, h("slot", { key: '33780bd8adb124f21410b823712bff55c2c6ff2d' })));
     }
 };
-DsTabs.style = dsTabsCss;
+DsTabs.style = dsTabsCss();
 
 export { DsTabs as ds_tabs };

package/dist/esm/ds-tag-group.entry.js

@@ -1,9 +1,9 @@
-import { h, r as registerInstance, d as getElement } from './index-B4ZCBfpo.js';
+import { h, r as registerInstance, e as getElement } from './index-WKPTmD1Z.js';
 import { i as idGenerator, d as declareComponentDependencies, t as transformTagName, a as ifDefined } from './utils-J5Ghj1_T.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
 
-const dsTagGroupCss = ".ds-tag-group__oSBnIJ__tags.sc-ds-tag-group{display:inline-flex;flex-flow:row wrap;gap:var(--ds-spacing-xSmall) var(--ds-spacing-2xSmall);margin-top:var(--ds-spacing-xSmall);margin-bottom:var(--ds-spacing-xSmall);list-style:none;padding:0}";
+const dsTagGroupCss = () => `.ds-tag-group__SPFJ1E__tags.sc-ds-tag-group{display:inline-flex;flex-flow:row wrap;gap:var(--ds-spacing-xSmall) var(--ds-spacing-2xSmall);margin-top:var(--ds-spacing-xSmall);margin-bottom:var(--ds-spacing-xSmall);list-style:none;padding:0}`;
 
 const tagGroupIdGenerator = idGenerator('ds-tag-group');
 const DsTagGroup = class {
@@ -29,10 +29,10 @@ const DsTagGroup = class {
         const { ['aria-label']: attrAriaLabel, ...restAttributes } = this.inheritedAttributes;
         const ariaDescribedBy = [!!this.dsAssistiveText && this.assistiveTextId].filter(Boolean).join(' ');
         const ariaLabel = this.dsAriaLabel || attrAriaLabel || this.dsLabel;
-        return (h("div", { key: '84a23f69a82a6e636ecdb9344383708f367f1290', class: baseClass, role: "group", ...ifDefined('aria-label', ariaLabel), ...ifDefined('aria-describedby', ariaDescribedBy), ...restAttributes }, h(DsGroupLabel, { key: 'a34005c9c50bc0dd9419857297ffe0bf0964f34d', dsLabel: this.dsLabel, dsAssistiveText: this.dsAssistiveText, dsAssistiveTextId: this.assistiveTextId }, h("slot", { key: '64e6e95287c2b56e339c658bd280dac82b57b587', name: "label" }), h("slot", { key: 'd87ebcb6cbe9c1bc5a0807f3c041fcacbb79d693', name: "assistiveText" })), h("div", { key: '72350ed04210fdc3e47b190bd6700a029980fbab', role: "list", class: `${baseClass}__tags` }, h("slot", { key: 'c70dea6040754dfa32465cecbd8d2e8e828b35ac' }))));
+        return (h("div", { key: '506cb8b9335b5cdbf8dcd67e1ac09b523dbc7c71', class: baseClass, role: "group", ...ifDefined('aria-label', ariaLabel), ...ifDefined('aria-describedby', ariaDescribedBy), ...restAttributes }, h(DsGroupLabel, { key: 'cfbd992d2f91d68192e511d61dbfd88cf1fc5cb5', dsLabel: this.dsLabel, dsAssistiveText: this.dsAssistiveText, dsAssistiveTextId: this.assistiveTextId }, h("slot", { key: '00fdecc8b0e2fbe3b57b9dd59803bb8e84c604c1', name: "label" }), h("slot", { key: '209aa3a2a855dfa78e2f776d01472c9bb08d049d', name: "assistiveText" })), h("div", { key: '0bfdd460d007fc112e931770e41c593b874692dc', role: "list", class: `${baseClass}__tags` }, h("slot", { key: '87b3169b5eb8eb25f83889f533005c738fadee7e' }))));
     }
 };
 declareComponentDependencies([h("ds-group-label", null)]);
-DsTagGroup.style = dsTagGroupCss;
+DsTagGroup.style = dsTagGroupCss();
 
 export { DsTagGroup as ds_tag_group };