@baloise/ds-core 20.0.0-next.10 → 20.0.0-next.11

package/dist/esm/ds-step-panel.entry.js

@@ -1,11 +1,11 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
-import { R as Required } from './required-DIwBjh81.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { D as registerInstance, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
+import { R as Required } from './required-CSFFkdXm.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const stepPanelHostCss = () => `:host{--_step-panel-p:var(--step-panel-p, var(--mod-step-panel-p, var(--ds-step-panel-padding)));display:none}:host(.is-selected){display:block;padding:var(--_step-panel-p)}`;
 
@@ -29,7 +29,7 @@ const StepPanel = class {
      * ─────────────────────────────────────────────────────
      */
     render() {
-        return (h(Host, { key: '9e6ad3ab5506627398912a6abcc4ca1a87a64a3e', role: "tabpanel", class: { 'is-selected': this.selected }, "aria-hidden": this.selected ? null : 'true', tabIndex: this.selected ? 0 : -1 }, h("slot", { key: 'dae625d0eddd667694fafb88a15fa5d1f92c8ebb' })));
+        return (h(Host, { key: 'd82e675ebc900714682b4b888e6578011f7c7bb3', role: "tabpanel", class: { 'is-selected': this.selected }, "aria-hidden": this.selected ? null : 'true', tabIndex: this.selected ? 0 : -1 }, h("slot", { key: '3b897bb769da2a9b7ce36ded40c51f746c3c7797' })));
     }
     get el() { return getElement(this); }
 };

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

@@ -1,11 +1,11 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import { R as Required } from './required-DIwBjh81.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import { R as Required } from './required-CSFFkdXm.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const stepHostCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex:1;flex:1;min-width:0;position:relative;outline:none}:host(.is-hidden){display:none}.circle{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;position:relative;z-index:1;-ms-flex-negative:0;flex-shrink:0;width:var(--_steps-circle-size);height:var(--_steps-circle-size);border-radius:9999px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background-color:var(--_steps-circle-color-bg);color:var(--_steps-circle-color-text);font-family:var(--_steps-step-font-family);font-size:var(--_steps-step-font-size);font-weight:var(--_steps-step-font-weight);line-height:1;-webkit-transition:background-color 180ms ease,color 180ms ease;transition:background-color 180ms ease,color 180ms ease;cursor:pointer}:host(.is-disabled) .circle{cursor:not-allowed}.step-invalid{color:var(--_steps-circle-color-text-invalid);font-family:var(--_steps-step-font-family);font-size:var(--_steps-step-font-size);font-weight:var(--_steps-step-font-weight);line-height:1}:host(.is-selected) .circle{background-color:var(--_steps-circle-color-bg-selected);color:var(--_steps-circle-color-text-selected)}:host(.is-done) .circle{background-color:var(--_steps-circle-color-bg-done);color:var(--_steps-circle-color-text-done)}:host(.is-invalid) .circle{background-color:var(--_steps-circle-color-bg-invalid);color:var(--_steps-circle-color-text-invalid)}:host(.is-disabled) .circle{background-color:var(--_steps-circle-color-bg-disabled);color:var(--_steps-circle-color-text-disabled);opacity:.5}.step-label{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;margin-top:.5rem;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;color:var(--_steps-step-color);font-family:var(--_steps-step-font-family);font-size:var(--_steps-step-font-size);font-weight:var(--_steps-step-font-weight);line-height:var(--_steps-step-line-height);-webkit-transition:color 180ms ease;transition:color 180ms ease}:host(.is-selected) .step-label{color:var(--_steps-step-color-selected)}:host(.is-done) .step-label{color:var(--_steps-step-color-done)}:host(.is-disabled) .step-label{color:var(--_steps-step-color-disabled);opacity:.4}.connector{position:absolute;top:calc(var(--_steps-circle-size)/2);-webkit-transform:translateY(-50%);transform:translateY(-50%);left:calc(50% + var(--_steps-circle-size)/2 + 4px);right:calc(-50% + var(--_steps-circle-size)/2 + 4px);height:var(--_steps-connector-height);border-radius:9999px;background-color:var(--_steps-connector-color);z-index:0;-webkit-transition:background-color 180ms ease;transition:background-color 180ms ease}:host(.is-filled) .connector{background-color:var(--_steps-connector-color-filled)}:host(:last-of-type) .connector{display:none}@media screen and (max-width: 768px){.circle{width:var(--_steps-circle-size-sm);height:var(--_steps-circle-size-sm);font-size:var(--_steps-step-font-size-sm);--mod-icon-size:var(--ds-icon-size-sm);--mod-icon-inner-size:var(--ds-icon-size-sm)}.step-label{display:none}.connector{top:calc(var(--_steps-circle-size-sm)/2);left:calc(50% + var(--_steps-circle-size-sm)/2 + 4px);right:calc(-50% + var(--_steps-circle-size-sm)/2 + 4px)}}@media (hover: hover)and (pointer: fine){:host(:focus-visible:not(:active)) .circle{-webkit-box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_steps-step-color-focus) 0 0 0 5px !important;box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_steps-step-color-focus) 0 0 0 5px !important}}:host(.is-vertical){-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex:unset;flex:unset;width:100%;padding:.5rem 0}:host(.is-vertical) .circle{-ms-flex-negative:0;flex-shrink:0}:host(.is-vertical) .step-label{display:block;margin-top:0;margin-left:.75rem;text-align:left;white-space:normal}:host(.is-vertical) .connector{display:none}:host(.is-navigation){cursor:default}:host(.is-navigation) ::slotted(a){-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;display:block;margin-top:.5rem;text-align:center;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;color:var(--_steps-step-color);font-family:var(--_steps-step-font-family);font-size:var(--_steps-step-font-size);font-weight:var(--_steps-step-font-weight);line-height:var(--_steps-step-line-height);-webkit-transition:color 180ms ease;transition:color 180ms ease;outline:none}:host(.is-navigation.is-selected) ::slotted(a),:host(.is-navigation) ::slotted([aria-current]){color:var(--_steps-step-color-selected)}:host(.is-navigation.is-disabled) ::slotted(a){color:var(--_steps-step-color-disabled);opacity:.4}:host(.is-navigation) ::slotted(a:focus-visible){border-radius:var(--ds-alias-radius-base)}@media (hover: hover)and (pointer: fine){:host(.is-navigation) ::slotted(a:focus-visible){-webkit-box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_steps-step-color-focus) 0 0 0 5px !important;box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_steps-step-color-focus) 0 0 0 5px !important}}:host(.is-navigation.is-vertical) ::slotted(a){margin-top:0;margin-left:.75rem;text-align:left;white-space:normal}@media screen and (max-width: 768px){:host(.is-navigation) ::slotted(a){font-size:var(--_steps-step-font-size-sm)}}`;
 

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

@@ -1,12 +1,13 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
-import { s as stopEventBubbling } from './form-control-g2Cf81YC.js';
-import { O as OneOf } from './one-of-BExTRiXT.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
+import { d as directChildren, b as byTagName } from './dom-969JOO-P.js';
+import { s as stopEventBubbling } from './form-control-RKlnnjxO.js';
+import { O as OneOf } from './one-of-dTNN7cqg.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const STEPS_COLORS = ['purple', 'green', 'red', 'yellow'];
 
@@ -83,10 +84,10 @@ const Steps = class {
      * ─────────────────────────────────────────────────────
      */
     getSteps() {
-        return Array.from(this.el.querySelectorAll(':scope > ds-step'));
+        return directChildren(this.el, byTagName('DS-STEP'));
     }
     getPanels() {
-        return Array.from(this.el.querySelectorAll(':scope > ds-step-panel'));
+        return directChildren(this.el, byTagName('DS-STEP-PANEL'));
     }
     isNavigation() {
         return this.getPanels().length === 0;

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

@@ -1,11 +1,11 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
-import { R as Required } from './required-DIwBjh81.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { D as registerInstance, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
+import { R as Required } from './required-CSFFkdXm.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const tabPanelHostCss = () => `:host{--_tab-panel-p:var(--tab-panel-p, var(--mod-tab-panel-p, var(--ds-tab-panel-padding)));display:none}:host(.is-selected){display:block;padding:var(--_tab-panel-p)}`;
 
@@ -29,7 +29,7 @@ const TabPanel = class {
      * ─────────────────────────────────────────────────────
      */
     render() {
-        return (h(Host, { key: '5fc15689d3bf60b504686bf973448c836cc26815', role: "tabpanel", class: { 'is-selected': this.selected }, "aria-hidden": this.selected ? null : 'true', tabIndex: this.selected ? 0 : -1 }, h("slot", { key: 'bcd4f3c508cc8bb4cbd5d36894280fc7bf02250a' })));
+        return (h(Host, { key: 'd84dd1e1b26c6c106a08c6fad1178d4d178d1860', role: "tabpanel", class: { 'is-selected': this.selected }, "aria-hidden": this.selected ? null : 'true', tabIndex: this.selected ? 0 : -1 }, h("slot", { key: '1e1ff537ccb0b39837a992f185dd99c3b9ee5f72' })));
     }
     get el() { return getElement(this); }
 };

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

@@ -1,11 +1,11 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import { R as Required } from './required-DIwBjh81.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import { R as Required } from './required-CSFFkdXm.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const tabHostCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;outline:none}span,a{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;-ms-flex:1;flex:1;position:relative;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;gap:.5rem;padding:var(--_tabs-tab-py) var(--_tabs-tab-px);background:none;border:none;cursor:pointer;text-decoration:none;color:var(--_tabs-tab-unselected-color-base);font-family:var(--_tabs-tab-unselected-font-family);font-size:var(--_tabs-tab-unselected-font-size);font-weight:var(--_tabs-tab-unselected-font-weight);line-height:var(--_tabs-tab-unselected-line-height);outline:none;white-space:nowrap;-webkit-transition:color 120ms ease;transition:color 120ms ease}span::after,a::after{content:"";position:absolute;z-index:1;bottom:calc(-1*var(--ds-alias-border-width-base));left:0;right:0;height:0;border-radius:9999px;border-bottom:var(--_tabs-indicator-unselected-base);-webkit-transition:border-bottom-color 120ms ease;transition:border-bottom-color 120ms ease}@media (hover: hover)and (pointer: fine){span:hover,a:hover{color:var(--_tabs-tab-unselected-color-hover)}span:hover::after,a:hover::after{border-bottom:var(--_tabs-indicator-unselected-hover)}}span:active,a:active{color:var(--_tabs-tab-unselected-color-active)}span:active::after,a:active::after{border-bottom:var(--_tabs-indicator-unselected-hover)}:host(:focus-visible:not(:active)){border-radius:var(--_tabs-tab-radius)}@media (hover: hover)and (pointer: fine){:host(:focus-visible:not(:active)){-webkit-box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_tabs-tab-color-focus) 0 0 0 5px !important;box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_tabs-tab-color-focus) 0 0 0 5px !important}}span.is-selected,a.is-selected{color:var(--_tabs-tab-selected-color-base);font-family:var(--_tabs-tab-selected-font-family);font-size:var(--_tabs-tab-selected-font-size);font-weight:var(--_tabs-tab-selected-font-weight);line-height:var(--_tabs-tab-selected-line-height)}@media (hover: hover)and (pointer: fine){span.is-selected:hover,a.is-selected:hover{color:var(--_tabs-tab-selected-color-hover)}}span.is-selected:active,a.is-selected:active{color:var(--_tabs-tab-selected-color-active)}span ::slotted(ds-badge.is-sm),a ::slotted(ds-badge.is-sm){position:absolute;top:calc(var(--_tabs-tab-badge-size));right:0;-webkit-transform:translateY(-50%);transform:translateY(-50%)}span ::slotted(ds-icon.is-filled:not(.is-auto)),a ::slotted(ds-icon.is-filled:not(.is-auto)){--mod-icon-color:currentColor}:host(.is-fullwidth) span{width:100%;-ms-flex-pack:center;justify-content:center}:host(.is-vertical) span,:host(.is-vertical) a{white-space:normal;-ms-flex-pack:start;justify-content:flex-start;text-align:left}:host(.is-vertical) span::after,:host(.is-vertical) a::after{top:0;bottom:0;left:calc(-1*var(--ds-alias-border-width-base));right:auto;width:0;height:auto;border-bottom:none;border-left:var(--_tabs-indicator-unselected-base)}:host(.is-vertical) span:active::after,:host(.is-vertical) a:active::after{border-left:var(--_tabs-indicator-unselected-hover)}@media (hover: hover)and (pointer: fine){:host(.is-vertical) span:hover::after,:host(.is-vertical) a:hover::after{border-left:var(--_tabs-indicator-unselected-hover)}}:host(.is-inverted) span.is-selected,:host(.is-inverted) a.is-selected{font-family:var(--ds-alias-text-family-heading);font-weight:var(--_tabs-tab-selected-font-weight)}:host(.is-navigation){position:relative;display:-ms-inline-flexbox;display:inline-flex}:host(.is-navigation)::after{content:"";position:absolute;z-index:1;bottom:calc(-1*var(--ds-alias-border-width-base));left:0;right:0;height:0;border-radius:9999px;border-bottom:var(--_tabs-indicator-unselected-base);-webkit-transition:border-color 120ms ease;transition:border-color 120ms ease}:host(.is-navigation.is-selected)::after{border-bottom:var(--_tabs-indicator-selected-base)}:host(.is-navigation) ::slotted(a){display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;gap:.5rem;padding:var(--_tabs-tab-py) var(--_tabs-tab-px);color:var(--_tabs-tab-unselected-color-base);font-family:var(--_tabs-tab-unselected-font-family);font-size:var(--_tabs-tab-unselected-font-size);font-weight:var(--_tabs-tab-unselected-font-weight);line-height:var(--_tabs-tab-unselected-line-height);text-decoration:none;white-space:nowrap;-webkit-transition:color 120ms ease;transition:color 120ms ease;--mod-icon-color:currentColor}:host(.is-navigation) ::slotted(a:focus-visible:not(:active)){border-radius:var(--_tabs-tab-radius)}@media (hover: hover)and (pointer: fine){:host(.is-navigation) ::slotted(a:focus-visible:not(:active)){-webkit-box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_tabs-tab-color-focus) 0 0 0 5px !important;box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_tabs-tab-color-focus) 0 0 0 5px !important}}:host(.is-navigation.is-selected) ::slotted(a),:host(.is-navigation) ::slotted([aria-current]){color:var(--_tabs-tab-selected-color-base);font-family:var(--_tabs-tab-selected-font-family);font-size:var(--_tabs-tab-selected-font-size);font-weight:var(--_tabs-tab-selected-font-weight);line-height:var(--_tabs-tab-selected-line-height)}:host(.is-navigation.is-inverted.is-selected) ::slotted(a),:host(.is-navigation.is-inverted) ::slotted([aria-current]){font-family:var(--ds-alias-text-family-heading);font-weight:var(--_tabs-tab-selected-font-weight)}:host(.is-navigation.is-vertical)::after{top:0;bottom:0;left:calc(-1*var(--ds-alias-border-width-base));right:auto;width:0;height:auto;border-bottom:none;border-left:var(--_tabs-indicator-unselected-base)}:host(.is-navigation.is-vertical.is-selected)::after{border-left:var(--_tabs-indicator-selected-base)}`;
 

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

@@ -1,13 +1,14 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, x as defaultConfig, E as raf, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
-import { s as stopEventBubbling } from './form-control-g2Cf81YC.js';
-import { O as OneOf } from './one-of-BExTRiXT.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import { L as ListenToConfig } from './config.utils-CB-CXrKY.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { D as registerInstance, J as createEvent, x as defaultConfig, E as raf, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
+import { d as directChildren, b as byTagName } from './dom-969JOO-P.js';
+import { s as stopEventBubbling } from './form-control-RKlnnjxO.js';
+import { O as OneOf } from './one-of-dTNN7cqg.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import { L as ListenToConfig } from './config.utils-RtLdZ8k8.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const TABS_COLORS = ['purple', 'green', 'red', 'yellow'];
 const TABS_VERTICAL_COL_SIZES = [
@@ -184,10 +185,10 @@ const Tabs = class {
      * ─────────────────────────────────────────────────────
      */
     getTabs() {
-        return Array.from(this.el.querySelectorAll(':scope > ds-tab'));
+        return directChildren(this.el, byTagName('DS-TAB'));
     }
     getPanels() {
-        return Array.from(this.el.querySelectorAll(':scope > ds-tab-panel'));
+        return directChildren(this.el, byTagName('DS-TAB-PANEL'));
     }
     isNavigation() {
         return this.getPanels().length === 0;
@@ -291,14 +292,14 @@ const Tabs = class {
      */
     render() {
         const isNav = this.isNavigation();
-        const tablistDiv = (h("div", { key: 'ff342c8fae32d0dc3f5473e4f51a21749f6382c3', id: "tablist", part: "tablist", role: isNav ? undefined : 'tablist', "aria-orientation": !isNav && this.vertical ? 'vertical' : undefined, onKeyDown: this.handleKeyDown, ref: el => {
+        const tablistDiv = (h("div", { key: 'baac4b1e1010273dabedb2966f9e52df62be4459', id: "tablist", part: "tablist", role: isNav ? undefined : 'tablist', "aria-orientation": !isNav && this.vertical ? 'vertical' : undefined, onKeyDown: this.handleKeyDown, ref: el => {
                 this.tablistEl = el;
-            } }, h("slot", { key: 'd077682f77bc5fc36e86057d19c18690fa0d625a', name: "tab", onSlotchange: this.handleSlotChange }), h("div", { key: '2aced8681d6173d5ebf0a44a755d12b718e0b87c', class: "indicator", "aria-hidden": "true", ref: el => {
+            } }, h("slot", { key: 'c7d21ce3a0f7665325820a57869b0cb4d4669f35', name: "tab", onSlotchange: this.handleSlotChange }), h("div", { key: '312014969db67ef8ab614b7a1357b236cf3315d1', class: "indicator", "aria-hidden": "true", ref: el => {
                 this.indicatorEl = el;
             } })));
         const i18n = i18nDsTabs[this.language];
         const tablistContainer = this.vertical ? (tablistDiv) : (h("div", { class: "tablist-outer" }, h("button", { class: "scroll-btn scroll-btn--prev", "aria-label": i18n.scrollLeft, "aria-hidden": "true", tabIndex: -1, onClick: this.scrollPrev }, h("ds-icon", { name: "caret-left", size: "sm" })), h("div", { class: "tablist-track" }, tablistDiv), h("button", { class: "scroll-btn scroll-btn--next", "aria-label": i18n.scrollRight, "aria-hidden": "true", tabIndex: -1, onClick: this.scrollNext }, h("ds-icon", { name: "caret-right", size: "sm" }))));
-        return (h(Host, { key: '57fd1e9a78f2d6f67e349367b3786771882e94ff', class: {
+        return (h(Host, { key: 'b6d25f890ca8c96efc54be9c693cd7ee55be39b0', class: {
                 'is-fullwidth': this.fullwidth,
                 'is-inverted': this.inverted,
                 'is-purple': this.color === 'purple',
@@ -311,7 +312,7 @@ const Tabs = class {
                 'has-overflow': this.canScrollLeft || this.canScrollRight,
                 'can-scroll-left': this.canScrollLeft,
                 'can-scroll-right': this.canScrollRight,
-            } }, isNav ? h("nav", { "aria-label": this.label || undefined }, tablistContainer) : tablistContainer, h("slot", { key: 'c3a5e566288594a79d9b06cd12bbe109f02e0c2b', onSlotchange: this.handleSlotChange })));
+            } }, isNav ? h("nav", { "aria-label": this.label || undefined }, tablistContainer) : tablistContainer, h("slot", { key: 'c3de464795e5c0be01408d98c1aab3083e41c31f', onSlotchange: this.handleSlotChange })));
     }
     get el() { return getElement(this); }
 };

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

@@ -1,8 +1,8 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
+import { D as registerInstance, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
 
 const tagGroupHostCss = () => `:host{--_tags-m:var(--tags-m, var(--mod-tags-m, 0));--_tags-my:var(--tags-my, var(--mod-tags-my));--_tags-mx:var(--tags-mx, var(--mod-tags-mx));--_tags-ml:var(--tags-ml, var(--mod-tags-ml));--_tags-mr:var(--tags-mr, var(--mod-tags-mr));--_tags-mt:var(--tags-mt, var(--mod-tags-mt));--_tags-mb:var(--tags-mb, var(--mod-tags-mb));margin:var(--_tags-m);margin-inline:var(--_tags-mx);margin-block:var(--_tags-my);margin-left:var(--_tags-ml);margin-right:var(--_tags-mr);margin-top:var(--_tags-mt);margin-bottom:var(--_tags-mb);--_tags-gap:var(--tags-gap, var(--mod-tags-gap, 0.25rem));--_tags-display:var(--tags-display, var(--mod-tags-display, inline-flex));display:var(--_tags-display);gap:var(--_tags-gap);vertical-align:middle}`;
 
@@ -18,7 +18,7 @@ const TagGroup = class {
      * ------------------------------------------------------
      */
     render() {
-        return (h(Host, { key: '629f332dffa20f1f8ace83ba2b37480541544541' }, h("slot", { key: 'f5ae7c49108d60b4e2da4f67f4c6f9d24c7a9500' })));
+        return (h(Host, { key: '19045e9b8b8ce4e679c09a9982dc4c0705b9e6e4' }, h("slot", { key: '1cbe17431f6dc48f66605fe10de294399934ec96' })));
     }
     get el() { return getElement(this); }
 };

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

@@ -1,14 +1,14 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
+import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
 import { i as inheritAttributes } from './attributes-B62ocg4Q.js';
-import { h as hasValue } from './has-value-D7lYQNBK.js';
+import { h as hasValue } from './has-value-uy_-jH0L.js';
 import { n as normalizeDeprecatedTShirtSize } from './t-shirt-DR5LIaCn.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import { O as OneOf } from './one-of-BExTRiXT.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import { O as OneOf } from './one-of-dTNN7cqg.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const TAG_COLORS = [
     'primary',
@@ -73,13 +73,13 @@ const Tag = class {
      */
     render() {
         const size = normalizeDeprecatedTShirtSize(this.size) || '';
-        return (h(Host, { key: '952b3a28e0b09ec4fa4bcfedebed02139c9c4266', class: {
+        return (h(Host, { key: 'f1b9c7ebe88c9732b543354e83abe042ba355657', class: {
                 [`is-${this.color}`]: hasValue(this.color),
                 [`is-${size}`]: hasValue(this.size),
                 'is-closable': this.closable,
                 'is-disabled': this.disabled,
                 'is-invalid': this.invalid,
-            } }, h("span", { key: '508859887c33864e1de46471d1d026de03472d50', part: "label" }, h("slot", { key: '3f5421b74c6cfc2eeb7fdd146ee38cdf88b79f0a' })), this.closable && !this.disabled ? (h("ds-close", Object.assign({}, this.inheritedAttributesClose, { onClick: (ev) => this.dsCloseClick.emit(ev) }))) : ('')));
+            } }, h("span", { key: '3994a65180a6acf580d00443a9910c467e992035', part: "label" }, h("slot", { key: '34b3d1429dd3121591669c7825048af1414b6027' })), this.closable && !this.disabled ? (h("ds-close", Object.assign({}, this.inheritedAttributesClose, { onClick: (ev) => this.dsCloseClick.emit(ev) }))) : ('')));
     }
     get el() { return getElement(this); }
 };

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

@@ -1,12 +1,12 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
-import { h as hasValue } from './has-value-D7lYQNBK.js';
-import { O as OneOf } from './one-of-BExTRiXT.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { D as registerInstance, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
+import { h as hasValue } from './has-value-uy_-jH0L.js';
+import { O as OneOf } from './one-of-dTNN7cqg.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const TEXT_ALIGNS = ['left', 'right', 'center', 'justify'];
 const TEXT_SIZES = [
@@ -80,7 +80,7 @@ const Text = class {
      */
     render() {
         const Text = this.inline ? 'span' : 'p';
-        return (h(Host, { key: '0dbc8ea63ac9f1537953448856727706e14ba4c5', class: {
+        return (h(Host, { key: 'ef367d2789a893535794456dcfd2ac24e29bcaca', class: {
                 [`is-${this.color}`]: hasValue(this.color),
                 'is-invalid': this.invalid,
                 'is-disabled': this.disabled,
@@ -92,9 +92,9 @@ const Text = class {
                 'has-no-wrap': this.noWrap,
                 [`has-space-${this.space}`]: hasValue(this.space),
                 [`is-${this.size}`]: hasValue(this.size),
-            } }, h(Text, { key: '8d7de3d7d02ecd9ed29d40f42dbce9823f1b1dc0', id: "text", part: "text", class: {
+            } }, h(Text, { key: '45cde91b368ea64e69f62e8f6c480962462e86f5', id: "text", part: "text", class: {
                 [`is-${this.align}`]: hasValue(this.align),
-            } }, h("slot", { key: 'f42edaabe2f0247089306bd387cc0fd79c610817' }))));
+            } }, h("slot", { key: '8fdcb81ac18c669e65d2dd6f2846a778cb5c8363' }))));
     }
     get el() { return getElement(this); }
 };

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

@@ -1,19 +1,20 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, x as defaultConfig, M as debounceEvent, F as h, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
+import { D as registerInstance, J as createEvent, x as defaultConfig, M as debounceEvent, F as h, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
 import { i as inheritAttributes } from './attributes-B62ocg4Q.js';
-import { F as FormControl } from './form-control-g2Cf81YC.js';
-import { w as watchInvalidTextSlot } from './invalid-text-slot-Dcf7YMP0.js';
-import { F as Field } from './field.util-OTyuJ6iL.js';
+import { F as FormControl } from './form-control-RKlnnjxO.js';
+import { w as watchInvalidTextSlot } from './invalid-text-slot-DamnLE0v.js';
+import { F as Field } from './field.util-DmVa8E0M.js';
 import { a as INPUT_AUTOCOMPLETES, I as INPUT_COLORS, d as INPUT_INPUT_MODES } from './input.interfaces-BRYPu0SP.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import { O as OneOf } from './one-of-BExTRiXT.js';
-import { L as ListenToConfig } from './config.utils-CB-CXrKY.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import { O as OneOf } from './one-of-dTNN7cqg.js';
+import { L as ListenToConfig } from './config.utils-RtLdZ8k8.js';
+import './dom-969JOO-P.js';
 import './aria-DYfTMCkl.js';
 import './label.i18n-C7I7OlaM.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const TEXTAREA_WRAPS = ['hard', 'soft', 'off'];
 
@@ -201,7 +202,7 @@ const Textarea = class {
     render() {
         const isInvalid = this.invalid || this.hasInvalidTextSlotContent;
         const value = (this.value || '').toString();
-        return (h(Field, { key: 'a94ad46d6f2393d9ff41ce195afbd6f76994965d', inputId: 'textarea', disabled: this.disabled, color: this.color, invalid: isInvalid, label: this.label, description: this.description, invalidText: this.invalidText, required: this.required, language: this.language }, h("textarea", Object.assign({ key: 'ec8dc2465342a4bc2f257e9200674ed562f15d26', id: "textarea", part: "textarea", name: this.name, ref: el => (this.control.nativeEl = el), "aria-describedby": "description", "aria-invalid": isInvalid ? 'true' : 'false', disabled: this.disabled, autoCapitalize: this.autocapitalize, autocomplete: this.autocomplete, autofocus: this.autofocus, minLength: this.minLength, maxLength: this.maxLength, placeholder: this.placeholder || '', readonly: this.readonly, required: this.required, inputMode: this.inputmode, cols: this.cols, rows: this.rows, wrap: this.wrap ? this.wrap : undefined, value: value, onClick: ev => this.handleClick(ev), onFocus: ev => this.handleFocus(ev), onBlur: ev => this.handleBlur(ev), onInput: ev => this.handleInput(ev), onKeyPress: ev => this.dsKeyPress.emit(ev) }, this.inheritedAttributes))));
+        return (h(Field, { key: 'fd1cd9660085f71b5fb4b0612681ae5959c11e8c', inputId: 'textarea', disabled: this.disabled, color: this.color, invalid: isInvalid, label: this.label, description: this.description, invalidText: this.invalidText, required: this.required, language: this.language }, h("textarea", Object.assign({ key: 'b6dc1c614f277b02c618f499f020ab034e73ec95', id: "textarea", part: "textarea", name: this.name, ref: el => (this.control.nativeEl = el), "aria-describedby": "description", "aria-invalid": isInvalid ? 'true' : 'false', disabled: this.disabled, autoCapitalize: this.autocapitalize, autocomplete: this.autocomplete, autofocus: this.autofocus, minLength: this.minLength, maxLength: this.maxLength, placeholder: this.placeholder || '', readonly: this.readonly, required: this.required, inputMode: this.inputmode, cols: this.cols, rows: this.rows, wrap: this.wrap ? this.wrap : undefined, value: value, onClick: ev => this.handleClick(ev), onFocus: ev => this.handleFocus(ev), onBlur: ev => this.handleBlur(ev), onInput: ev => this.handleInput(ev), onKeyPress: ev => this.dsKeyPress.emit(ev) }, this.inheritedAttributes))));
     }
     static get formAssociated() { return true; }
     get el() { return getElement(this); }

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

@@ -1,16 +1,16 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, E as raf, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
-import { s as stopEventBubbling } from './form-control-g2Cf81YC.js';
-import { h as hasValue } from './has-value-D7lYQNBK.js';
-import { s as sanitizeSvg } from './svg-DTldskay.js';
-import { O as OneOf } from './one-of-BExTRiXT.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import { R as Required } from './required-DIwBjh81.js';
-import { L as ListenToConfig } from './config.utils-CB-CXrKY.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { D as registerInstance, J as createEvent, E as raf, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
+import { s as stopEventBubbling } from './form-control-RKlnnjxO.js';
+import { h as hasValue } from './has-value-uy_-jH0L.js';
+import { s as sanitizeSvg } from './svg-D7y4TSm5.js';
+import { O as OneOf } from './one-of-dTNN7cqg.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import { R as Required } from './required-CSFFkdXm.js';
+import { L as ListenToConfig } from './config.utils-RtLdZ8k8.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const TOAST_COLORS = ['primary', 'info', 'success', 'warning', 'danger'];
 const TOAST_TARGETS = ['_blank', '_parent', '_self', '_top'];
@@ -153,7 +153,7 @@ const Toast = class {
                 '--toast-progress-duration': `${this.duration}ms`,
             }
             : {};
-        return (h(Host, { key: '23ff9f9c92c4f759c70bab5ba57c986c81b7095a', role: "alert", "aria-live": "assertive", "aria-atomic": "true", class: {
+        return (h(Host, { key: 'bd461878bfc6491ee16d14f71758a49947e28445', role: "alert", "aria-live": "assertive", "aria-atomic": "true", class: {
                 [`is-ready`]: this.didLoad,
                 [`is-paused`]: this.didPause,
                 [`is-visible`]: this.visible,
@@ -167,19 +167,11 @@ const Toast = class {
             }, onMouseLeave: () => {
                 this.didPause = false;
                 this.dsDidResume.emit();
-            } }, !hasValue(svgContent) && (h("ds-icon", { key: '85e69a9a6f407a9792a4380e990a2f0593946ef0', id: "icon", part: "icon", name: iconName || this.color === 'warning'
-                ? 'alert'
-                : this.color === 'danger'
-                    ? 'alert'
-                    : this.color === 'success'
-                        ? 'check'
-                        : this.color === 'info'
-                            ? 'information'
-                            : 'bell', color: this.color, size: "md" })), hasValue(svgContent) && h("ds-icon", { key: '2f5c1860905cf86ec8a083159f00282b049edfcb', id: "icon", part: "icon", svg: svgContent }), h("span", { key: '388ffc970895cffd3c7dad3ee2c719eb11bedddc', part: "content", id: "content" }, this.heading && h("h2", { key: '47fa03a5fedf283a01bcf62b79577dc360dbfa70', part: "heading" }, this.heading), h("span", { key: 'cfb2e0e473d5e7bfb6a4e18a78cdb19d2ad3414f', part: "message" }, this.message, h("slot", { key: 'b78fba1d70d0a3352b6310e67a193909cdf090db' }))), hasValue(this.action) && (h("ds-button", { key: '73a53b42b5b63c95683ecc9450fac287c661300e', id: "action", color: "primary", size: "sm", part: "button", icon: this.actionIcon, target: this.actionTarget, href: this.actionHref, onClick: ev => {
+            } }, !hasValue(svgContent) && (h("ds-icon", { key: '560c83e28e574443ffdc70997b9501fe6c50b545', id: "icon", part: "icon", name: iconName, color: this.color, size: "md" })), hasValue(svgContent) && h("ds-icon", { key: '6910a70d901c083a4bf9ea13ba624187bf64d9f7', id: "icon", part: "icon", svg: svgContent }), h("span", { key: 'd97dfe64d5df76559f886025167c152d770d2f21', part: "content", id: "content" }, this.heading && h("h2", { key: '361114c03324b8a936945f36ddae64ff0e28474e', part: "heading" }, this.heading), h("span", { key: 'af03b084d0edfb07d3fb5ba6d098f0819d4bd143', part: "message" }, this.message, h("slot", { key: 'c32540bf5b2043204b2a78a5b1c43e2819492572' }))), hasValue(this.action) && (h("ds-button", { key: '411be3e0c9063224f1504504251d01fa0af4c8a5', id: "action", color: "primary", size: "sm", part: "button", icon: this.actionIcon, target: this.actionTarget, href: this.actionHref, onClick: ev => {
                 stopEventBubbling(ev);
                 this.dsActionClick.emit(ev);
                 this.actionHandler(this.alertId);
-            } }, this.action)), this.closable && (h("ds-close", { key: '5f84c236ae167d4a92e2ad7049a4dc5455d0da2c', part: "close", onClick: ev => {
+            } }, this.action)), this.closable && (h("ds-close", { key: 'a999725462c0593443a4aea45ea1f75231c59332', part: "close", onClick: ev => {
                 stopEventBubbling(ev);
                 this.close();
             } }))));

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

@@ -1,12 +1,13 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
+import { D as registerInstance, J as createEvent, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
 import { i as inheritAttributes } from './attributes-B62ocg4Q.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import { O as OneOf } from './one-of-BExTRiXT.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { a as setFormValue } from './form-control-RKlnnjxO.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import { O as OneOf } from './one-of-dTNN7cqg.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const TOGGLE_LABEL_POSITIONS = ['left', 'top', 'right'];
 // export interface ToggleGroupCustomEvent<T> extends CustomEvent<T> {
@@ -102,7 +103,7 @@ const Toggle = class {
         this.handleChange = (ev) => {
             this.checked = ev.target.checked;
             this.dsChange.emit(this.checked);
-            this.internals.setFormValue(this.checked ? this.value : null);
+            setFormValue(this.internals, this.checked ? this.value : null);
         };
         this.handleFocus = (ev) => {
             if (this.disabled || this.readonly)
@@ -120,10 +121,10 @@ const Toggle = class {
      */
     connectedCallback() {
         this.initialValue = this.checked;
-        this.internals.setFormValue(this.checked ? this.value : null);
+        setFormValue(this.internals, this.checked ? this.value : null);
     }
     componentWillLoad() {
-        this.internals.setFormValue(this.checked ? this.value : null);
+        setFormValue(this.internals, this.checked ? this.value : null);
         this.inheritAttributes = inheritAttributes(this.el, ['aria-label', 'tabindex', 'title']);
     }
     /**
@@ -141,14 +142,14 @@ const Toggle = class {
      * ─────────────────────────────────────────────────────
      */
     render() {
-        return (h(Host, { key: '279aa9914fa1e1f023dce06e3913158858a90f4f', "aria-disabled": this.disabled ? 'true' : null, "aria-checked": `${this.checked}`, "aria-invalid": this.invalid ? 'true' : null, class: {
+        return (h(Host, { key: '58dfe2f243c6d9535186a4227f1fec6a810868f0', "aria-disabled": this.disabled ? 'true' : null, "aria-checked": `${this.checked}`, "aria-invalid": this.invalid ? 'true' : null, class: {
                 'is-disabled': this.disabled || this.readonly,
                 'is-invalid': this.invalid,
                 'is-checked': this.checked,
                 'is-dense': this.dense,
                 'has-label-left': this.labelPosition === 'left',
                 'has-label-top': this.labelPosition === 'top',
-            } }, h("label", { key: '126ff8a8bf057b7bb838678c66e6cd2993f4fe38', id: "label", part: "label" }, h("input", Object.assign({ key: '70e8c99ce76ff11ea2760de681a56405e7fa9ee7', type: "checkbox", part: "input", id: this.inputId, name: this.name, value: this.value, checked: this.checked, disabled: this.disabled || this.readonly, required: this.required, "aria-invalid": this.invalid ? 'true' : null, onChange: ev => this.handleChange(ev), onFocus: this.handleFocus, onBlur: this.handleBlur, ref: inputEl => (this.nativeInput = inputEl) }, this.inheritAttributes)), h("div", { key: '8f451e64a165bea9a0af571aa3a7d246a0f7dd6f', id: "slot", part: "slot" }, h("slot", { key: '8cc3d4b02ac217eeec2b025dc41de3c62e022611' })))));
+            } }, h("label", { key: '3b0cd8b27cf8683365f1586da4fdb6bee232c7d9', id: "label", part: "label" }, h("input", Object.assign({ key: '621825857a1b20c67c6d426635a6fe3eb84468c5', type: "checkbox", part: "input", id: this.inputId, name: this.name, value: this.value, checked: this.checked, disabled: this.disabled || this.readonly, required: this.required, "aria-invalid": this.invalid ? 'true' : null, onChange: ev => this.handleChange(ev), onFocus: this.handleFocus, onBlur: this.handleBlur, ref: inputEl => (this.nativeInput = inputEl) }, this.inheritAttributes)), h("div", { key: 'c3689eaa1b8349da370d0cbc9276f8398b592781', id: "slot", part: "slot" }, h("slot", { key: '6960890a3c79bea992aa4a681ec8bf03e47c9279' })))));
     }
     static get formAssociated() { return true; }
     get el() { return getElement(this); }

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

@@ -1,16 +1,16 @@
 /*!
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
-import { D as registerInstance, J as createEvent, d as dsBrowser, F as h, G as Host, I as getElement } from './index-DYOV_tWc.js';
-import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-Byu4BzG4.js';
+import { D as registerInstance, J as createEvent, d as dsBrowser, F as h, G as Host, I as getElement } from './index-DxEN1zze.js';
+import { _ as __decorate, L as Logger, a as __metadata } from './tslib.es6-CoU9H0PW.js';
 import { a as autoUpdate, c as computePosition, s as shift, f as flip, o as offset } from './floating-ui.dom-BqY0KzJC.js';
-import { T as Type } from './type-CZBrLp5X.js';
-import { O as OneOf } from './one-of-BExTRiXT.js';
-import './create-validator-decorator-ZDmCDTEb.js';
+import { T as Type } from './type-3Im_fSnq.js';
+import { O as OneOf } from './one-of-dTNN7cqg.js';
+import './create-validator-decorator-Da-m3zPX.js';
 
 const TOOLTIP_PLACEMENTS = ['top', 'right', 'bottom', 'left'];
 
-const tooltipHostCss = () => `:host{--_tooltip-position:var(--tooltip-position, var(--mod-tooltip-position, static));--_tooltip-top:var(--tooltip-top, var(--mod-tooltip-top));--_tooltip-right:var(--tooltip-right, var(--mod-tooltip-right));--_tooltip-bottom:var(--tooltip-bottom, var(--mod-tooltip-bottom));--_tooltip-left:var(--tooltip-left, var(--mod-tooltip-left));position:var(--_tooltip-position);top:var(--_tooltip-top);right:var(--_tooltip-right);bottom:var(--_tooltip-bottom);left:var(--_tooltip-left);--_tooltip-m:var(--tooltip-m, var(--mod-tooltip-m, 0));--_tooltip-my:var(--tooltip-my, var(--mod-tooltip-my));--_tooltip-mx:var(--tooltip-mx, var(--mod-tooltip-mx));--_tooltip-ml:var(--tooltip-ml, var(--mod-tooltip-ml));--_tooltip-mr:var(--tooltip-mr, var(--mod-tooltip-mr));--_tooltip-mt:var(--tooltip-mt, var(--mod-tooltip-mt));--_tooltip-mb:var(--tooltip-mb, var(--mod-tooltip-mb));margin:var(--_tooltip-m);margin-inline:var(--_tooltip-mx);margin-block:var(--_tooltip-my);margin-left:var(--_tooltip-ml);margin-right:var(--_tooltip-mr);margin-top:var(--_tooltip-mt);margin-bottom:var(--_tooltip-mb);--_tooltip-color-background:var(--tooltip-color-background, var(--mod-tooltip-color-background, var(--ds-tooltip-color-background)));--_tooltip-color-text:var(--tooltip-color-text, var(--mod-tooltip-color-text, var(--ds-tooltip-color-text)));--_tooltip-max-width:var(--tooltip-max-width, var(--mod-tooltip-max-width, auto));--_tooltip-radius:var(--tooltip-radius, var(--mod-tooltip-radius, var(--ds-tooltip-radius)));--_tooltip-shadow:var(--tooltip-shadow, var(--mod-tooltip-shadow, var(--ds-tooltip-shadow)));--_tooltip-px:var(--tooltip-px, var(--mod-tooltip-px, var(--ds-tooltip-padding-x)));--_tooltip-py:var(--tooltip-py, var(--mod-tooltip-py, var(--ds-tooltip-padding-y)));--_tooltip-text-font-family:var(--tooltip-text-font-family, var(--mod-tooltip-text-font-family, var(--ds-tooltip-text-font-family)));--_tooltip-text-font-weight:var(--tooltip-text-font-weight, var(--mod-tooltip-text-font-weight, var(--ds-tooltip-text-font-weight)));--_tooltip-text-font-size:var(--tooltip-text-font-size, var(--mod-tooltip-text-font-size, var(--ds-tooltip-text-font-size)));--_tooltip-text-line-height:var(--tooltip-text-line-height, var(--mod-tooltip-text-line-height, var(--ds-tooltip-text-line-height)));--_tooltip-z-index:var(--tooltip-z-index, var(--mod-tooltip-z-index, var(--ds-tooltip-z-index)))}:host{position:static;display:inline;z-index:var(--_tooltip-z-index)}::slotted(*){all:initial}[part=container]{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;opacity:0;visibility:hidden;pointer-events:none;-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-transition:opacity 120ms cubic-bezier(0.4, 0, 1, 1),visibility 0ms linear 120ms,-webkit-transform 120ms cubic-bezier(0.4, 0, 1, 1);transition:opacity 120ms cubic-bezier(0.4, 0, 1, 1),visibility 0ms linear 120ms,-webkit-transform 120ms cubic-bezier(0.4, 0, 1, 1);transition:opacity 120ms cubic-bezier(0.4, 0, 1, 1),transform 120ms cubic-bezier(0.4, 0, 1, 1),visibility 0ms linear 120ms;transition:opacity 120ms cubic-bezier(0.4, 0, 1, 1),transform 120ms cubic-bezier(0.4, 0, 1, 1),visibility 0ms linear 120ms,-webkit-transform 120ms cubic-bezier(0.4, 0, 1, 1);will-change:opacity,transform;position:fixed;top:0;left:0;-webkit-box-sizing:border-box;box-sizing:border-box;width:-webkit-max-content;width:-moz-max-content;width:max-content;max-width:var(--_tooltip-max-width);background-color:var(--_tooltip-color-background);border-radius:var(--_tooltip-radius);-webkit-box-shadow:var(--_tooltip-shadow);box-shadow:var(--_tooltip-shadow);color:var(--_tooltip-color-text);font-family:var(--_tooltip-text-font-family);font-weight:var(--_tooltip-text-font-weight);font-size:var(--_tooltip-text-font-size);line-height:var(--_tooltip-text-line-height);z-index:var(--_tooltip-z-index)}:host([aria-hidden=false]) [part=container]{opacity:1;visibility:visible;pointer-events:auto;-webkit-transform:translate(0, 0);transform:translate(0, 0);-webkit-transition:opacity 200ms cubic-bezier(0, 0, 0.2, 1),visibility 0ms linear 0ms,-webkit-transform 200ms cubic-bezier(0, 0, 0.2, 1);transition:opacity 200ms cubic-bezier(0, 0, 0.2, 1),visibility 0ms linear 0ms,-webkit-transform 200ms cubic-bezier(0, 0, 0.2, 1);transition:opacity 200ms cubic-bezier(0, 0, 0.2, 1),transform 200ms cubic-bezier(0, 0, 0.2, 1),visibility 0ms linear 0ms;transition:opacity 200ms cubic-bezier(0, 0, 0.2, 1),transform 200ms cubic-bezier(0, 0, 0.2, 1),visibility 0ms linear 0ms,-webkit-transform 200ms cubic-bezier(0, 0, 0.2, 1)}[part=container][data-placement=top]{-webkit-transform:translateY(4px);transform:translateY(4px)}[part=container][data-placement=right]{-webkit-transform:translateX(-4px);transform:translateX(-4px)}[part=container][data-placement=left]{-webkit-transform:translateX(4px);transform:translateX(4px)}[part=content]{position:relative;padding-block:var(--_tooltip-py);padding-inline:var(--_tooltip-px);overflow-y:auto;max-height:calc(100svh - 8rem)}`;
+const tooltipHostCss = () => `:host{--_tooltip-position:var(--tooltip-position, var(--mod-tooltip-position, static));--_tooltip-top:var(--tooltip-top, var(--mod-tooltip-top));--_tooltip-right:var(--tooltip-right, var(--mod-tooltip-right));--_tooltip-bottom:var(--tooltip-bottom, var(--mod-tooltip-bottom));--_tooltip-left:var(--tooltip-left, var(--mod-tooltip-left));position:var(--_tooltip-position);top:var(--_tooltip-top);right:var(--_tooltip-right);bottom:var(--_tooltip-bottom);left:var(--_tooltip-left);--_tooltip-m:var(--tooltip-m, var(--mod-tooltip-m, 0));--_tooltip-my:var(--tooltip-my, var(--mod-tooltip-my));--_tooltip-mx:var(--tooltip-mx, var(--mod-tooltip-mx));--_tooltip-ml:var(--tooltip-ml, var(--mod-tooltip-ml));--_tooltip-mr:var(--tooltip-mr, var(--mod-tooltip-mr));--_tooltip-mt:var(--tooltip-mt, var(--mod-tooltip-mt));--_tooltip-mb:var(--tooltip-mb, var(--mod-tooltip-mb));margin:var(--_tooltip-m);margin-inline:var(--_tooltip-mx);margin-block:var(--_tooltip-my);margin-left:var(--_tooltip-ml);margin-right:var(--_tooltip-mr);margin-top:var(--_tooltip-mt);margin-bottom:var(--_tooltip-mb);--_tooltip-color-background:var(--tooltip-color-background, var(--mod-tooltip-color-background, var(--ds-tooltip-color-background)));--_tooltip-color-text:var(--tooltip-color-text, var(--mod-tooltip-color-text, var(--ds-tooltip-color-text)));--_tooltip-max-width:var(--tooltip-max-width, var(--mod-tooltip-max-width, auto));--_tooltip-radius:var(--tooltip-radius, var(--mod-tooltip-radius, var(--ds-tooltip-radius)));--_tooltip-shadow:var(--tooltip-shadow, var(--mod-tooltip-shadow, var(--ds-tooltip-shadow)));--_tooltip-px:var(--tooltip-px, var(--mod-tooltip-px, var(--ds-tooltip-padding-x)));--_tooltip-py:var(--tooltip-py, var(--mod-tooltip-py, var(--ds-tooltip-padding-y)));--_tooltip-text-font-family:var(--tooltip-text-font-family, var(--mod-tooltip-text-font-family, var(--ds-tooltip-text-font-family)));--_tooltip-text-font-weight:var(--tooltip-text-font-weight, var(--mod-tooltip-text-font-weight, var(--ds-tooltip-text-font-weight)));--_tooltip-text-font-size:var(--tooltip-text-font-size, var(--mod-tooltip-text-font-size, var(--ds-tooltip-text-font-size)));--_tooltip-text-line-height:var(--tooltip-text-line-height, var(--mod-tooltip-text-line-height, var(--ds-tooltip-text-line-height)));--_tooltip-z-index:var(--tooltip-z-index, var(--mod-tooltip-z-index, var(--ds-tooltip-z-index)))}:host{position:static;display:inline;z-index:var(--_tooltip-z-index)}::slotted(*){all:initial}[part=container]{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;opacity:0;visibility:hidden;pointer-events:none;-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-transition:opacity 120ms cubic-bezier(0.4, 0, 1, 1),visibility 0ms linear 120ms,-webkit-transform 120ms cubic-bezier(0.4, 0, 1, 1);transition:opacity 120ms cubic-bezier(0.4, 0, 1, 1),visibility 0ms linear 120ms,-webkit-transform 120ms cubic-bezier(0.4, 0, 1, 1);transition:opacity 120ms cubic-bezier(0.4, 0, 1, 1),transform 120ms cubic-bezier(0.4, 0, 1, 1),visibility 0ms linear 120ms;transition:opacity 120ms cubic-bezier(0.4, 0, 1, 1),transform 120ms cubic-bezier(0.4, 0, 1, 1),visibility 0ms linear 120ms,-webkit-transform 120ms cubic-bezier(0.4, 0, 1, 1);will-change:opacity,transform;position:fixed;top:0;left:0;-webkit-box-sizing:border-box;box-sizing:border-box;width:-webkit-max-content;width:-moz-max-content;width:max-content;max-width:var(--_tooltip-max-width);background-color:var(--_tooltip-color-background);border-radius:var(--_tooltip-radius);-webkit-box-shadow:var(--_tooltip-shadow);box-shadow:var(--_tooltip-shadow);z-index:var(--_tooltip-z-index)}:host([aria-hidden=false]) [part=container]{opacity:1;visibility:visible;pointer-events:auto;-webkit-transform:translate(0, 0);transform:translate(0, 0);-webkit-transition:opacity 200ms cubic-bezier(0, 0, 0.2, 1),visibility 0ms linear 0ms,-webkit-transform 200ms cubic-bezier(0, 0, 0.2, 1);transition:opacity 200ms cubic-bezier(0, 0, 0.2, 1),visibility 0ms linear 0ms,-webkit-transform 200ms cubic-bezier(0, 0, 0.2, 1);transition:opacity 200ms cubic-bezier(0, 0, 0.2, 1),transform 200ms cubic-bezier(0, 0, 0.2, 1),visibility 0ms linear 0ms;transition:opacity 200ms cubic-bezier(0, 0, 0.2, 1),transform 200ms cubic-bezier(0, 0, 0.2, 1),visibility 0ms linear 0ms,-webkit-transform 200ms cubic-bezier(0, 0, 0.2, 1)}[part=container][data-placement=top]{-webkit-transform:translateY(4px);transform:translateY(4px)}[part=container][data-placement=right]{-webkit-transform:translateX(-4px);transform:translateX(-4px)}[part=container][data-placement=left]{-webkit-transform:translateX(4px);transform:translateX(4px)}[part=content]{position:relative;padding-block:var(--_tooltip-py);padding-inline:var(--_tooltip-px);overflow-y:auto;max-height:calc(100svh - 8rem);color:var(--_tooltip-color-text);font-family:var(--_tooltip-text-font-family);font-weight:var(--_tooltip-text-font-weight);font-size:var(--_tooltip-text-font-size);line-height:var(--_tooltip-text-line-height)}::slotted(span),::slotted(p){color:inherit;font-family:inherit;font-weight:inherit;font-size:inherit;line-height:inherit}`;
 
 let tooltipIds = 0;
 const Tooltip = class {
@@ -157,7 +157,7 @@ const Tooltip = class {
      * ─────────────────────────────────────────────────────
      */
     render() {
-        return (h(Host, { key: 'ee1fa39b825b594dec6890e5317a7132ca3a3412', id: this.tooltipId, role: "tooltip", "aria-hidden": `${!this.presented}` }, h("div", { key: 'b86ae881d8f783abc381eeb0f8ff30e84e66e0e5', part: "container", ref: el => (this.containerEl = el) }, h("div", { key: 'a54a9a371dff7f1ca56ce7ca35c4c13171e6ed10', part: "content", "data-testid": "ds-tooltip-content" }, h("slot", { key: 'db111b89f8b12349c42bbf8c59675785f3fb77f0' })))));
+        return (h(Host, { key: '98d98b3c21a36b553866471d923ea5ff5e1ffbba', id: this.tooltipId, role: "tooltip", "aria-hidden": `${!this.presented}` }, h("div", { key: '3d87df3d592dd0dd93e479b48a7c461f0efd0a07', part: "container", ref: el => (this.containerEl = el) }, h("div", { key: 'ce982cbb10088794bc1c62f7df04b3063568a37f', part: "content", "data-testid": "ds-tooltip-content" }, h("slot", { key: '35ec3c9d7ab6bf80cbd25c3b7914ff084f87c5fa' })))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/field.util-DmVa8E0M.js

@@ -0,0 +1,17 @@
+/*!
+ * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
+ */
+import { F as h, G as Host } from './index-DxEN1zze.js';
+import { a as ariaBooleanToString } from './aria-DYfTMCkl.js';
+import { I as I18nDsLabel } from './label.i18n-C7I7OlaM.js';
+
+const Field = (props, children) => {
+    var _a;
+    const inputId = (_a = props.inputId) !== null && _a !== void 0 ? _a : 'input';
+    const role = props.role === 'fieldset' ? 'group' : undefined;
+    const RoleTag = props.role === 'fieldset' ? 'fieldset' : 'div';
+    return (h(Host, { class: Object.assign({ 'ds-field ': true, 'is-disabled': !!props.disabled, 'is-danger': props.color === 'danger' || !!props.invalid, 'is-success': props.color === 'success' && !props.invalid, 'is-warning': props.color === 'warning' && !props.invalid }, props.cssClasses) }, h(RoleTag, { id: "inner", part: "inner", role: role, "aria-disabled": ariaBooleanToString(props.disabled), "aria-invalid": ariaBooleanToString(props.invalid), "aria-labelledby": "label", "aria-describedby": "description", onClick: (ev) => { var _a; return (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, ev); } }, props.label &&
+        (props.role === 'fieldset' ? (h("legend", { part: "label", id: "label" }, h("slot", { name: "label" }, props.label), !props.required && h("span", null, I18nDsLabel[props.language].optional || ''))) : (h("label", { htmlFor: inputId, part: "label", id: "label" }, h("slot", { name: "label" }, props.label), !props.required && h("span", null, I18nDsLabel[props.language].optional || '')))), h("div", { id: "container", part: "control" }, h("slot", { name: "start" }), children, h("slot", { name: "end" }), props.loading === true && (h("ds-spinner", { size: "sm", variation: "circle", color: props.disabled ? 'inverted' : 'primary' }))), props.label && (h("span", { id: "description", part: "description", role: props.invalid && props.invalidText ? 'alert' : undefined }, props.invalid && props.invalidText && h("ds-icon", { name: "alert" }), props.invalid ? (h("slot", { name: "invalid-text" }, props.invalidText || props.description)) : (h("slot", { name: "description" }, props.description)))))));
+};
+
+export { Field as F };