@otto-de/b2b-core-components 1.10.0 → 1.11.0

package/dist/components/b2b-icon-50.js

@@ -0,0 +1,119 @@
+import { proxyCustomElement, HTMLElement, h, Host, Build } from '@stencil/core/internal/client';
+import { b as buildPath, i as iconContent, f as fetchIcon } from './request.js';
+
+/* eslint-disable prettier/prettier */
+const iconTypes = [
+    "b2b_icon-arrow-down",
+    "b2b_icon-arrow-left",
+    "b2b_icon-arrow-right",
+    "b2b_icon-arrow-up",
+    "b2b_icon-basket",
+    "b2b_icon-check",
+    "b2b_icon-close",
+    "b2b_icon-delete",
+    "b2b_icon-error-hint",
+    "b2b_icon-filter",
+    "b2b_icon-info-hint",
+    "b2b_icon-info",
+    "b2b_icon-leaving-page",
+    "b2b_icon-minus",
+    "b2b_icon-pin",
+    "b2b_icon-plus",
+    "b2b_icon-question-hint",
+    "b2b_icon-question",
+    "b2b_icon-rating-empty",
+    "b2b_icon-rating-filled",
+    "b2b_icon-rating-half",
+    "b2b_icon-refresh",
+    "b2b_icon-reply",
+    "b2b_icon-smiley-positive",
+    "b2b_icon-sort-ascending",
+    "b2b_icon-sort-descending",
+    "b2b_icon-sort",
+    "b2b_icon-success-hint",
+    "b2b_icon-trend-down",
+    "b2b_icon-trend-up",
+    "b2b_icon-warning-hint",
+    "b2b_icon-wishlist-active",
+    "b2b_icon-wishlist"
+];
+
+const icon50Css = ":root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-table-hover:#e6f4ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host{--b2b-icon-line-height:inherit;--b2b-icon-cursor:default}:host .b2b-icon-50{display:inline-flex;vertical-align:middle;line-height:var(--b2b-icon-line-height);cursor:var(--b2b-icon-cursor);height:var(--b2b-size-30);width:var(--b2b-size-30)}:host .b2b-icon-50--clickable{cursor:pointer}:host .b2b-icon-50.b2b-icon-50--primary{fill:var(--b2b-color-black-100)}:host .b2b-icon-50.b2b-icon-50--secondary{fill:var(--b2b-color-grey-200)}:host .b2b-icon-50.b2b-icon-50--inverse{fill:var(--b2b-color-white-100)}:host .b2b-icon-50.b2b-icon-50--inherit{fill:currentcolor}";
+const B2bIcon50Style0 = icon50Css;
+
+const B2bIcon = /*@__PURE__*/ proxyCustomElement(class B2bIcon extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.isIconSupported = () => {
+            return iconTypes.includes(this.icon);
+        };
+        this.icon = undefined;
+        this.color = 'inherit';
+        this.clickable = false;
+        this.focusable = false;
+        this.pathData = null;
+    }
+    connectedCallback() {
+        this.loadIconPathData();
+    }
+    render() {
+        if (!this.isIconSupported())
+            return null;
+        return (h(Host, null, h("div", { tabIndex: this.focusable ? 0 : null, class: {
+                'b2b-icon-50': true,
+                [`b2b-icon-50--${this.color}`]: true,
+                'b2b-icon-50--clickable': this.clickable,
+            }, innerHTML: this.pathData })));
+    }
+    loadIconPathData() {
+        if (!this.isIconSupported()) {
+            console.warn('icon name: ' + this.icon + ' is not supported or might have a typo.');
+            return;
+        }
+        const icon = buildPath(this.icon, 'icons-50');
+        if (Build.isBrowser) {
+            if (iconContent.has(icon)) {
+                this.pathData = iconContent.get(icon);
+            }
+            else {
+                fetchIcon(icon).then(() => (this.pathData = iconContent.get(icon)));
+            }
+        }
+        else {
+            return;
+        }
+    }
+    static get assetsDirs() { return ["icons-50"]; }
+    static get watchers() { return {
+        "icon": ["loadIconPathData"]
+    }; }
+    static get style() { return B2bIcon50Style0; }
+}, [1, "b2b-icon-50", {
+        "icon": [1],
+        "color": [1],
+        "clickable": [4],
+        "focusable": [4],
+        "pathData": [32]
+    }, undefined, {
+        "icon": ["loadIconPathData"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["b2b-icon-50"];
+    components.forEach(tagName => { switch (tagName) {
+        case "b2b-icon-50":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, B2bIcon);
+            }
+            break;
+    } });
+}
+
+const B2bIcon50 = B2bIcon;
+const defineCustomElement = defineCustomElement$1;
+
+export { B2bIcon50, defineCustomElement };

package/dist/components/b2b-label.js

@@ -11,10 +11,10 @@ const LabelComponent = /*@__PURE__*/ proxyCustomElement(class LabelComponent ext
         this.type = 'neutral';
     }
     render() {
-        return (h("span", { key: '39cc0904be1a2ef596fd9689a4766910a9fc34e8', class: {
+        return (h("span", { key: 'a3c0cc8abed4982328f177460cecc93f4ec8ff71', class: {
                 'b2b-label': true,
                 [`b2b-label--${this.type}`]: true,
-            } }, h("slot", { key: '51d1169295837004718e68dae480df4a5415ed6f' })));
+            } }, h("slot", { key: 'a42ee69ab239b15001e220a334aa693aff0118c7' })));
     }
     static get style() { return B2bLabelStyle0; }
 }, [1, "b2b-label", {

package/dist/components/b2b-modal.js

@@ -210,10 +210,10 @@ const ModalComponent = /*@__PURE__*/ proxyCustomElement(class ModalComponent ext
         this.attemptFocus(this.getFirstFocusableElement());
     }
     render() {
-        return (h(Host, { key: 'cf595eff0dbf9c8dc64b3ea59162bdb22e360c05' }, h("div", { key: 'a37aed1991400c2edddfba890ccaa9f911f2bc23', class: { 'b2b-modal': true, 'b2b-modal--open': this.opened } }, h("div", { key: 'e7dd0c793f0f96b7d3d7800f413ff905906aa901', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabIndex: 0 }), h("div", { key: '124a652a8595965664fdb9e9553f38624f7b41da', class: {
+        return (h(Host, { key: '1e3ae2d0db3df6fd7fb249181560471102f81ad4' }, h("div", { key: 'b6a9ce0bc06ca54cba7885b3094f448df6440194', class: { 'b2b-modal': true, 'b2b-modal--open': this.opened } }, h("div", { key: 'a114fc4834406ac93c554fa5c2058500c229ecfe', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabIndex: 0 }), h("div", { key: '49ce79940badc68db9a6469f96bbe43b5803ced2', class: {
                 'b2b-modal__dialog': true,
                 [`b2b-modal__dialog--${this.variant}`]: true,
-            } }, h("div", { key: '5ffa9b863cae63bb15676f436eef48d87612950f', class: "b2b-modal__dialog__header" }, h("b2b-headline", { key: 'd61c84b09cc56a07952bbe7ac5268bb401410cf8', align: "center", size: "200", noMargin: true }, this.heading), h("button", { key: 'f192f9bb57f9c76ff0db171a0fda3bab6cbe1d99', type: "button", class: "b2b-modal__dialog__close", onMouseEnter: this.toggleIconHover, onMouseLeave: this.toggleIconHover, onClick: this.handleClickDismiss, ref: el => (this.closeButton = el) }, h("b2b-icon", { key: 'eb5104084731932b280a723d13fd66e829cf87ee', clickable: true, icon: "b2b_icon-close", color: this.iconHover ? 'primary' : 'secondary' }))), h("div", { key: '40cf975800b48f87835247c4822d2231e1f904e1', class: "b2b-modal__dialog__body" }, h("slot", { key: '1be31545480d4835d88bb2c87dd8f37930a1410c' })), h("div", { key: '923f36a1de98c30c0493375e976b928e70a7670b', class: "b2b-modal__dialog__footer" }, h("div", { key: '892537a57cb64977dbfe420593d3396ef693e6bb', class: "b2b-modal__dialog__footer-left" }, h("slot", { key: '53973995e6e8e94d7abd409fa1bb3d9c9f27e04b', name: "footer-left" })), h("div", { key: '02799b049346f9957d267d2a541ed7d4df6cd197', class: "b2b-modal__dialog__footer-right" }, h("slot", { key: '67a84d094edfdb6c635dc3cce49ba053832fa715', name: "footer-right" })))), h("div", { key: 'a17b435389631b97b868ce310c3f29384b02894e', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabIndex: 0 }), h("div", { key: '0b6f907c3f0d9997411b2b77226b4a324a72bda3', class: "b2b-modal__backdrop", onClick: this.handleBackdropDismiss }))));
+            } }, h("div", { key: 'e1542497ec46e553b5883a8bec9fb97bc8e41bb8', class: "b2b-modal__dialog__header" }, h("b2b-headline", { key: '29fdd8544ab096acac7fb567e12db5209b65fadc', align: "center", size: "200", noMargin: true }, this.heading), h("button", { key: '19d556190a35343e71e041cb7647fc71e43bd110', type: "button", class: "b2b-modal__dialog__close", onMouseEnter: this.toggleIconHover, onMouseLeave: this.toggleIconHover, onClick: this.handleClickDismiss, ref: el => (this.closeButton = el) }, h("b2b-icon", { key: 'ec66472357c70f7591a0851ceae4f1263ba32b31', clickable: true, icon: "b2b_icon-close", color: this.iconHover ? 'primary' : 'secondary' }))), h("div", { key: '4cc41712957fcdbefa2263730422b4dcc59b01e8', class: "b2b-modal__dialog__body" }, h("slot", { key: 'c6810b8c835f0099472fbe29a895945387098319' })), h("div", { key: 'd26b872b6cbef52e0d0088f792616c0f3c2872b0', class: "b2b-modal__dialog__footer" }, h("div", { key: '363ab2250e580cb5ee99c53abaf5acc930a1aec5', class: "b2b-modal__dialog__footer-left" }, h("slot", { key: '95f725635933d5dc8a60de63aed3f7a2d82f2ef5', name: "footer-left" })), h("div", { key: 'e6d1776ad02740eedac8b893bae6f28519c55e49', class: "b2b-modal__dialog__footer-right" }, h("slot", { key: '6b310747f42518cc6a4f7631a1bbb7b59cf3e9cb', name: "footer-right" })))), h("div", { key: '83158d3f234936df43c5d7ad5976215acf374c7b', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabIndex: 0 }), h("div", { key: 'e5d6898b325a6560d30c65b62b27b1ad0402dac0', class: "b2b-modal__backdrop", onClick: this.handleBackdropDismiss }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/b2b-multiselect-dropdown.js

@@ -150,13 +150,13 @@ const B2bMultiSelectDropdown = /*@__PURE__*/ proxyCustomElement(class B2bMultiSe
         this.updateSelectAll(options);
     }
     render() {
-        return (h(Host, { key: 'a01e7a1db6fe845102241a1a14f8b7b42daa1126', onFocus: this.setElementOnFocus, onBlur: this.setElementOnBlur, onClick: this.handleMouseDown, onKeyDown: this.handleKeyDown }, h("b2b-input-label", { key: '0f66b87fb86ba9f8ce7beb7815b7f833a1d8b47a' }, this.label), h("div", { key: '73afbf22d4144a84d2240b4669ecf88535909a2e', class: {
+        return (h(Host, { key: 'cbbdb945dffb739b2c6c8169dc6ae1255c9973ed', onFocus: this.setElementOnFocus, onBlur: this.setElementOnBlur, onClick: this.handleMouseDown, onKeyDown: this.handleKeyDown }, h("b2b-input-label", { key: 'a71be7e938a7521065e1b7b37d49b07b583befb3' }, this.label), h("div", { key: '20c556fa0cdc2865aceba7b2727123dbfdcc9421', class: {
                 'b2b-multiselect-dropdown': true,
                 'b2b-multiselect-dropdown--open': this.isElementFocused,
-            }, tabindex: 0, role: "combobox", "aria-expanded": this.isElementFocused }, this.selectedValues.length === 0 ? (h("span", { class: "b2b-multiselect-dropdown__placeholder" }, this.placeholder)) : (h("div", { class: "b2b-multiselect-dropdown__chip-container" }, this.renderChips())), h("b2b-icon", { key: '973d9487ef8f3a746f657c08ff602e1dd733bf08', icon: "b2b_icon-arrow-down" })), h("div", { key: 'f2f8a4a5daf4695d31b7939c645fe86bda08a3fb', class: {
+            }, tabindex: 0, role: "combobox", "aria-expanded": this.isElementFocused }, this.selectedValues.length === 0 ? (h("span", { class: "b2b-multiselect-dropdown__placeholder" }, this.placeholder)) : (h("div", { class: "b2b-multiselect-dropdown__chip-container" }, this.renderChips())), h("b2b-icon", { key: 'd85fb652335ecf99e8ee48126593ecd99105f29c', icon: "b2b_icon-arrow-down" })), h("div", { key: '0adc8f117cf037d3416b80ba6192afcea055cea4', class: {
                 'b2b-multiselect-dropdown__options-container': true,
                 'b2b-multiselect-dropdown__options-container--visible': this.isElementFocused,
-            } }, h("div", { key: 'c3bbbb71e2ee3d300ed73d952c648efffa85464c', class: "b2b-multiselect-dropdown__options", role: "listbox", "aria-label": this.label, tabIndex: -1 }, h("div", { key: '2f7ce035dff0657e306ac34f4bc6b81df7c05493', class: "b2b-multiselect-dropdown__option__search" }, h("input", { key: '8b9e9427f8304545645d5b39ba0c8bde8afb8422', type: "text", onInput: this.handleInput, class: "b2b-multiselect-dropdown__option__search__input", placeholder: this.searchPlaceholder })), h("b2b-multiselect-option", { key: '2a1a39302b3a7e1576d19fcffd47d7a3fffb6031', class: "b2b-multiselect-dropdown__option__select-all", option: this.selectAllLabel, id: "select-all", "onB2b-option-selected": this.handleSelectAll }), this.hasOptionList &&
+            } }, h("div", { key: '7b175e22e92f60656470aaa914b9b0ff5edb9728', class: "b2b-multiselect-dropdown__options", role: "listbox", "aria-label": this.label, tabIndex: -1 }, h("div", { key: '232d88bc64fc03ed6484ee6c1af5ea3a79fbf380', class: "b2b-multiselect-dropdown__option__search" }, h("input", { key: '4440e347e3e53a910d74c38017abaa18cd3e9479', type: "text", onInput: this.handleInput, class: "b2b-multiselect-dropdown__option__search__input", placeholder: this.searchPlaceholder })), h("b2b-multiselect-option", { key: 'a5e7f37b2f02023e1191f09a7f7bc3b25ac6e520', class: "b2b-multiselect-dropdown__option__select-all", option: this.selectAllLabel, id: "select-all", "onB2b-option-selected": this.handleSelectAll }), this.hasOptionList &&
             this.currentList.map(option => (h("b2b-multiselect-option", { "onB2b-option-selected": this.handleSelectedChange, option: option })))))));
     }
     get hostElement() { return this; }

package/dist/components/b2b-pagination.js

@@ -108,7 +108,7 @@ const PaginationComponent = /*@__PURE__*/ proxyCustomElement(class PaginationCom
         };
     }
     render() {
-        return (h("nav", { key: 'de40499e150172d754eb174c6d4327f7ce1485ca' }, h("ol", { key: 'e02d17e5c9815360517ba5889c311227d5214eb3', class: "b2b-pagination" }, this.activePage !== 1 && (h("li", { class: "b2b-pagination--previous" }, h("b2b-button", { onClick: this.selectPreviousPage, size: "50", variant: "secondary", "aria-label": this.ariaLabelPreviousPage }, PaginationConstants.BACK))), this.navItems.map((navItem, index) => {
+        return (h("nav", { key: '8fddf2f36e6b3bb9067a55abe37896a341d7d04c' }, h("ol", { key: '1d34552bd23a4263d809213f5e6debbd920ce6e3', class: "b2b-pagination" }, this.activePage !== 1 && (h("li", { class: "b2b-pagination--previous" }, h("b2b-button", { onClick: this.selectPreviousPage, size: "50", variant: "secondary", "aria-label": this.ariaLabelPreviousPage }, PaginationConstants.BACK))), this.navItems.map((navItem, index) => {
             const isItemActive = this.activePage === navItem;
             return (h("li", { class: this.getItemClass(navItem) }, h("b2b-button", { onClick: () => this.setSelectedPage(navItem, index), active: isItemActive, disabled: isItemActive, size: "50", variant: "secondary" }, navItem)));
         }), this.activePage !== this.totalPages && (h("li", { class: "b2b-pagination--next" }, h("b2b-button", { onClick: this.selectNextPage, size: "50", variant: "secondary", "aria-label": this.ariaLabelNextPage }, PaginationConstants.NEXT))))));

package/dist/components/b2b-paragraph.js

@@ -13,12 +13,12 @@ const ParagraphComponent = /*@__PURE__*/ proxyCustomElement(class ParagraphCompo
         this.align = 'left';
     }
     render() {
-        return (h("p", { key: '8186c1f1f1c07b6d2b25723b946a37fce4ad53c8', class: {
+        return (h("p", { key: 'e864682f09f3cabdf50b2201cb7f25c6f00ab499', class: {
                 'b2b-paragraph': true,
                 ['b2b-paragraph--size-' + this.size]: true,
                 ['b2b-paragraph--weight-' + this.weight]: true,
                 ['b2b-paragraph--align-' + this.align]: true,
-            } }, h("slot", { key: '79419ce24e7420fdceaa62b900376050f396752e' })));
+            } }, h("slot", { key: 'e9600fb127829d08c586a1c225b7c9402d2a71d6' })));
     }
     static get style() { return B2bParagraphStyle0; }
 }, [1, "b2b-paragraph", {

package/dist/components/b2b-progress-bar.js

@@ -24,11 +24,11 @@ const ProgressBarComponent = /*@__PURE__*/ proxyCustomElement(class ProgressBarC
     }
     render() {
         const labelExists = this.label !== undefined && this.label !== '';
-        return (h(Host, { key: 'c851e1cd31926e7aa47cbb0dd70d130940a57ff3' }, h("div", { key: 'fbb70ba96750f3a4f44de5d552c5be475d58c67e', class: {
+        return (h(Host, { key: 'eba41d453db7f7c7e6c4676c9a8accbfc3545024' }, h("div", { key: '788a583e5f03f187d9d7f36eb5b84d76e6a0384c', class: {
                 [`b2b-progress-bar__${this.labelPosition}-${this.labelType}`]: true,
-            } }, h("div", { key: 'bce6a3e48043543922ab6716ba7aa232c794be24', class: "b2b-progress-bar__wrapper" }, h("div", { key: 'd2d81c1f92563369b13ef5b7e4284666a3258885', class: "b2b-progress-bar__progress", style: {
+            } }, h("div", { key: '6fe01b899839a19ef6f32f709fffe1837cc311df', class: "b2b-progress-bar__wrapper" }, h("div", { key: '708abc424bd46b4a5ab8b617af254b8f8186cd0b', class: "b2b-progress-bar__progress", style: {
                 width: `${this.getProgress()}%`,
-            } })), h("div", { key: 'c8c12cb24172509f9afbd4a7c8a1848f9d8eaaa5', class: {
+            } })), h("div", { key: '33f3f13217dc6be084438cadd1dd3f6b03eb4d52', class: {
                 'b2b-progress-bar__label': labelExists,
                 'b2b-progress-bar__label-none': !labelExists,
                 [`b2b-progress-bar__label__${this.labelPosition}-${this.labelType}`]: labelExists,

package/dist/components/b2b-radio-button.js

@@ -64,11 +64,11 @@ const B2bRadioButtonComponent = /*@__PURE__*/ proxyCustomElement(class B2bRadioB
         return Array.from(document.querySelectorAll(`b2b-radio-button[name="${this.name}"]`)).filter((radio) => radio.value !== this.value);
     }
     render() {
-        return (h(Host, { key: '6540e086fcfc834e9309034f4e4e50197e874982', onClick: this.onClick }, h("div", { key: '033905a09aa1e85af39bc91299c70175cf22160f', class: {
+        return (h(Host, { key: '88075326af9c340bef7db152eac07f8e6f9a44a2', onClick: this.onClick }, h("div", { key: '581916ce84cf61518661b0576d3351b962b2d91a', class: {
                 'b2b-radio': true,
                 'b2b-radio--error': this.invalid && !this.disabled,
                 'b2b-radio--disabled': this.disabled,
-            } }, h("div", { key: '80f09dbd1c4e0a62d4946fe35d9b5410d1e6839f', class: "b2b-radio-items" }, h("input", { key: 'effc47fb60f42abd4f9bbf025c2447b28db96291', class: "b2b-radio-input", "aria-labelledby": this.name, type: "radio", checked: this.checked, disabled: this.disabled, name: this.name, onBlur: this.onBlur, onFocus: this.onFocus, value: this.value }), h("b2b-input-label", { key: '16d52e59a1638e9ed027ed7804ed7a3f4b638914', id: this.name, required: this.required, disabled: this.disabled }, this.label)), (this.hint !== undefined && !this.invalid) ||
+            } }, h("div", { key: 'e473bc87194e5023dca904970ad8af3079e8d517', class: "b2b-radio-items" }, h("input", { key: 'b99434879eae76aeb63a0e2085707456f12765bf', class: "b2b-radio-input", "aria-labelledby": this.name, type: "radio", checked: this.checked, disabled: this.disabled, name: this.name, onBlur: this.onBlur, onFocus: this.onFocus, value: this.value }), h("b2b-input-label", { key: 'e1a7eac512b4da7d8a87773cc2c928258f32be8b', id: this.name, required: this.required, disabled: this.disabled }, this.label)), (this.hint !== undefined && !this.invalid) ||
             (this.hint !== undefined && this.disabled) ? (h("span", null, this.hint)) : (''), this.error !== undefined && this.invalid && !this.disabled ? (h("span", null, this.error)) : (''))));
     }
     get host() { return this; }

package/dist/components/b2b-radio-group.js

@@ -75,11 +75,11 @@ const RadioButtonGroupComponent = /*@__PURE__*/ proxyCustomElement(class RadioBu
         this.removeChildText();
     }
     render() {
-        return (h(Host, { key: '1227202b9b4dbea6eccdcd30a1bd6e77957ebe92' }, h("div", { key: '477cfebb0c8f7dd3facd378280edf1bcf5db836f', class: {
+        return (h(Host, { key: '9af9e4cc3f922d51335b08747385d61fe30f6fff' }, h("div", { key: 'a258d462eae3b01193eff095f7ccc817230bae86', class: {
                 'b2b-radio-group': true,
                 'b2b-radio-group--error': this.invalid && !this.disabled,
                 [`b2b-radio-group--${this.alignment}`]: true,
-            } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("fieldset", { key: 'fb374a0464cee1d190d1f5aa9b22d46daaa83738' }, h("div", { key: 'b134cf5438850cd805511ab6cddfb392182b860e', class: "b2b-radio-group-options" }, h("slot", { key: 'bdd987dca5a28e2c28a2715fcc2b5128e77a7b9d' }))), (this.hint !== undefined && !this.invalid) ||
+            } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("fieldset", { key: '96a4840624fe0e1bab24480f13bd12e0c31185c3' }, h("div", { key: '6100d2c539e00138429c96ef0d5f87ecd05993a8', class: "b2b-radio-group-options" }, h("slot", { key: '661621f3383738c465545e249b7bd3bda18f3b86' }))), (this.hint !== undefined && !this.invalid) ||
             (this.hint !== undefined && this.disabled) ? (h("span", null, this.hint)) : (''), this.error !== undefined && this.invalid && !this.disabled ? (h("span", null, this.error)) : (''))));
     }
     get host() { return this; }

package/dist/components/b2b-required-separator.js

@@ -12,7 +12,7 @@ const B2BRequiredSeparator = /*@__PURE__*/ proxyCustomElement(class B2BRequiredS
         this.label = 'Pflichtfeld';
     }
     render() {
-        return (h(Host, { key: '806ea7a07d11e3b791702d187bb3bbb66738f6f6' }, h("div", { key: 'e1654b40f5f247bc1a24b38ffae2c61394ec6bfe', class: "b2b-required-separator__label" }, h("span", { key: '6109f94d7fea7bcbb9cebd1b0ebb8e193205d5bd', class: "b2b-required-separator__asterisk" }, "* "), h("span", { key: '7831bd53da18b99d45ff0fff3ede279ef09c8774' }, this.label)), h("b2b-separator", { key: '71458008aa52bfbfa533fc773b492f2f49883899' })));
+        return (h(Host, { key: '989e81600d0748d74b57f59df342bdb8ea1646ef' }, h("div", { key: '558b14f88f32f0b21c423554290fbe72c4fa9696', class: "b2b-required-separator__label" }, h("span", { key: '65a8ed5c4af4d0e3aee00785727aad0a74eb0323', class: "b2b-required-separator__asterisk" }, "* "), h("span", { key: 'e170084c3b0d4447a9d151b17422479f78a3f6b7' }, this.label)), h("b2b-separator", { key: '42b320e566f4f7594d87f930438b3b0ba8662b7f' })));
     }
     static get style() { return B2bRequiredSeparatorStyle0; }
 }, [1, "b2b-required-separator", {

package/dist/components/b2b-scrollable-container.js

@@ -10,7 +10,7 @@ const ScrollableContainerComponent = /*@__PURE__*/ proxyCustomElement(class Scro
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: '9bccd81de179f10ca6968a147a941955a253b472' }, h("slot", { key: 'dca1166a0e7dcca148aaa8094ba38ddaefeacef4' })));
+        return (h(Host, { key: '234c8e341e9dc85b7c8d7fc742445f61045b9cf6' }, h("slot", { key: 'd67a95c9c3a1a9f7ac75924d639c095578fcb2f1' })));
     }
     get host() { return this; }
     static get style() { return B2bScrollableContainerStyle0; }

package/dist/components/b2b-search.js

@@ -35,7 +35,7 @@ const SearchComponent = /*@__PURE__*/ proxyCustomElement(class SearchComponent e
         }
     }
     render() {
-        return (h(Host, { key: '7e99171d47bd69694223275a0e54d61d2b44516e' }, h("b2b-input-group", { key: '60fd2a81394d6e7408d1ee2972d33557b2cc9feb', disabled: this.disabled }, h("b2b-input-list", { key: '33386a3ac5d58513741f4a466e9691d508c83957', slot: "start", value: this.value, placeholder: this.placeholder, optionsList: this.optionsList, "onb2b-input": this.onInput, "onb2b-option-selected": this.onOptionSelected }, h("slot", { key: '3db98cdec46ad947049b737f5660123785da9338' })), h("b2b-button", { key: 'dd0e508bb3ad5afbc406b8ea028b8b455a0ba314', slot: "end", variant: "primary", onClick: this.onSearchClicked }, h("b2b-icon", { key: '3df6281860cf677bad22bd3fc6b2299cc67cee37', icon: "b2b_icon-search", clickable: true })))));
+        return (h(Host, { key: '08be0d3238571d8a4e268d7a54d382114cd05ab4' }, h("b2b-input-group", { key: 'dbba9867d3b05f80edbf79973ca51cd9d7c9ec73', disabled: this.disabled }, h("b2b-input-list", { key: 'fec8bfb0012836b4ff458569130a016d36bbef2b', slot: "start", value: this.value, placeholder: this.placeholder, optionsList: this.optionsList, "onb2b-input": this.onInput, "onb2b-option-selected": this.onOptionSelected }, h("slot", { key: '04bdd57ddbbde6f5f41f4704a2bbfa048df32aed' })), h("b2b-button", { key: '7e4d662ed1fd9423e77ee8e89beda95367f0a4a2', slot: "end", variant: "primary", onClick: this.onSearchClicked }, h("b2b-icon", { key: '71cdddf774b0e58efc0976e7d3505aad4d8da88b', icon: "b2b_icon-search", clickable: true })))));
     }
     get hostElement() { return this; }
 }, [1, "b2b-search", {

package/dist/components/b2b-tab-group.js

@@ -127,7 +127,7 @@ const B2bTabGroupComponent = /*@__PURE__*/ proxyCustomElement(class B2bTabGroupC
         });
     }
     render() {
-        return (h(Host, { key: '933bcea64a5507f37cfbd8cbdb5c47500159c70a' }, h("slot", { key: '04b8ee288e4e054a33a7679da0842b95479f167a', name: "tab" }), h("b2b-separator", { key: 'e1acc79d62692b0750a1b99d85bfe65826ec0f43' }), h("slot", { key: '1a96d84a0f0c75ae0ae8a6bb3fab45a3945f5854', name: "panel" })));
+        return (h(Host, { key: '78f75532d4293cde9bb93f4351b3796482b72215' }, h("slot", { key: 'e2ddc95c558c4bd3d6c20b6e486af19c9d329885', name: "tab" }), h("b2b-separator", { key: 'a36eacb8a0261dbf6e246d71fd8466382a9ee05b' }), h("slot", { key: 'e248f04a007332dbb1e85f611bcd99ed27b80005', name: "panel" })));
     }
     get hostElement() { return this; }
 }, [1, "b2b-tab-group", {

package/dist/components/b2b-tab-panel.js

@@ -12,7 +12,7 @@ const B2bTabPanelComponent = /*@__PURE__*/ proxyCustomElement(class B2bTabPanelC
         this.generatedId = i++;
     }
     render() {
-        return (h(Host, { key: '1f91fb3718078b3e4101743f78b20f130c374ba3', id: `b2b-tab-panel-${this.generatedId}`, role: "tabpanel" }, h("div", { key: '85cc7c57e466ed59de2b58bc0284fb32070ae082', class: "b2b-tab-panel" }, h("slot", { key: '00a1733847e49493334dc46c20993094d614f80d' }))));
+        return (h(Host, { key: '21c1a2f24c9ee1f0babba93fa74c3ab3c5988fed', id: `b2b-tab-panel-${this.generatedId}`, role: "tabpanel" }, h("div", { key: '914b83997c2ba52d736c2877d282cb7d5fb1069a', class: "b2b-tab-panel" }, h("slot", { key: '7d1d9a06f59db5155b43ca96bfcfd0b9a69efd31' }))));
     }
     static get style() { return B2bTabPanelStyle0; }
 }, [1, "b2b-tab-panel"]);

package/dist/components/b2b-tab.js

@@ -25,12 +25,12 @@ const B2bTabComponent = /*@__PURE__*/ proxyCustomElement(class B2bTabComponent e
         }
     }
     render() {
-        return (h(Host, { key: '91e0c3afbd205a56b28cc2c8ac8eca2171cb8f21', id: `b2b-tab-${this.generatedId}`, "aria-role": "tab", "aria-selected": this.selected, role: this.disabled ? false : 'tab', disabled: this.disabled, tabindex: this.disabled ? false : this.selected ? '0' : '-1' }, h("span", { key: '4d97529bfe04a9d623462f1868cc8699552d4df9', class: {
+        return (h(Host, { key: '6d5be8814e75d606b3f8385de1cea8e6b9d21f63', id: `b2b-tab-${this.generatedId}`, "aria-role": "tab", "aria-selected": this.selected, role: this.disabled ? false : 'tab', disabled: this.disabled, tabindex: this.disabled ? false : this.selected ? '0' : '-1' }, h("span", { key: 'b265042eb5f07e061bf2356d9597a93e8ca06272', class: {
                 'b2b-tab': true,
                 'b2b-tab--selected': this.selected,
                 'b2b-tab--disabled': this.disabled,
                 'b2b-tab--error': this.invalid,
-            } }, h("slot", { key: '29d8dce4fe21a1c41fdfebd586c0deab230e7943' }))));
+            } }, h("slot", { key: '4b152f8b681d68d14be67da8c0f9729d4a3fb161' }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/b2b-table-row.js

@@ -105,12 +105,12 @@ const TableRowComponent = /*@__PURE__*/ proxyCustomElement(class TableRowCompone
         }
     }
     render() {
-        return (h(Host, { key: '7be9768502313aebf891e7f0f456a84694299dc2', class: {
+        return (h(Host, { key: 'd9b494cbf3558330f029597c1d616a0e26d2bb97', class: {
                 'b2b-table-row': true,
                 ['b2b-table-row--colspan']: this.size === TableSizes.COLSPAN,
                 ['b2b-table-row--highlight']: this.highlight,
                 [`b2b-table-row--color-${this.getRowColor()}`]: true,
-            }, role: "row" }, this.getAccordionColumns(), this.getCheckbox(), h("slot", { key: '99a3752c844f555d64fe0ff0ffe88468f128a8c5' })));
+            }, role: "row" }, this.getAccordionColumns(), this.getCheckbox(), h("slot", { key: '5346366cdf15aa6e902dcbc1c21c30c16c6fe4c7' })));
     }
     get hostElement() { return this; }
     static get style() { return B2bTableRowStyle0; }

package/dist/components/b2b-table-rowgroup.js

@@ -136,11 +136,11 @@ const TableRowgroupComponent = /*@__PURE__*/ proxyCustomElement(class TableRowgr
         this.makeHeaderRowNotSelectable();
     }
     render() {
-        return (h(Host, { key: '94b4dbff47db5ededca59cd1e04bedae7b5e0828', class: {
+        return (h(Host, { key: '1db8d4122419118da177ec9fa4bfb6ef3f5ab208', class: {
                 ['b2b-table-rowgroup__' + this.type]: true,
                 'b2b-table-rowgroup--fixed': this.fixed,
                 'b2b-table-rowgroup--colspan': this.size === TableSizes.COLSPAN,
-            }, role: "rowgroup" }, h("slot", { key: 'f61ad2c12ae8bacdae7b9195e73e5b516c4dd654' })));
+            }, role: "rowgroup" }, h("slot", { key: '12addc92d491239e9a4d916e9247d3196932de2d' })));
     }
     get host() { return this; }
     static get style() { return B2bTableRowgroupStyle0; }

package/dist/components/b2b-table.js

@@ -67,9 +67,9 @@ const TableComponent = /*@__PURE__*/ proxyCustomElement(class TableComponent ext
         }
     }
     render() {
-        return (h(Host, { key: '52ce367d80180e424810106de182954196c90336', class: {
+        return (h(Host, { key: '63fda13b56915f2f50c4730e9aeb672afc4ff1b2', class: {
                 ['b2b-table--' + this.size]: true,
-            }, role: "table" }, h("slot", { key: '4b79f415965b976f9920a9ac4db0931523a33c12' })));
+            }, role: "table" }, h("slot", { key: '81b9e3c648efaef9f023f4d50d6fb7e2b3362c38' })));
     }
     get host() { return this; }
     static get style() { return B2bTableStyle0; }

package/dist/components/b2b-textarea.js

@@ -53,10 +53,10 @@ const B2BTextareaComponent = /*@__PURE__*/ proxyCustomElement(class B2BTextareaC
         }
     }
     render() {
-        return (h(Host, { key: 'faef67d2dfa4603bf41ae1da6212134bfbb91181', class: {
+        return (h(Host, { key: '1e76ad3f97c6c64c8d26080ba5e4c07e3ca8882a', class: {
                 'b2b-textarea': true,
                 'b2b-textarea--error': this.invalid && !this.disabled,
-            } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("textarea", { key: 'd849b0e5a9a6f032c4a1704414aedf0972a6834c', class: "textarea-input", "aria-labelledby": this.name, style: Object.assign({ height: this.height }, (Boolean(this.resize) && { resize: this.resize })), value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, autoFocus: this.autofocus, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, maxLength: this.maxLength }), (this.hint !== undefined && !this.invalid) ||
+            } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("textarea", { key: 'e38d89af185e99596026f4154f70b79bb13ea297', class: "textarea-input", "aria-labelledby": this.name, style: Object.assign({ height: this.height }, (Boolean(this.resize) && { resize: this.resize })), value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, autoFocus: this.autofocus, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, maxLength: this.maxLength }), (this.hint !== undefined && !this.invalid) ||
             (this.hint !== undefined && this.disabled) ? (h("span", null, this.hint)) : (''), this.error !== undefined && this.invalid && !this.disabled ? (h("span", null, this.error)) : ('')));
     }
     get hostElement() { return this; }

package/dist/components/b2b-toggle-button.js

@@ -39,13 +39,13 @@ const B2bToggleButtonComponent = /*@__PURE__*/ proxyCustomElement(class B2bToggl
         return Array.from(document.querySelectorAll(`b2b-toggle-button[name="${this.name}"]`)).filter((toggle) => toggle.value !== this.value);
     }
     render() {
-        return (h(Host, { key: '60305b81694fbaa31e59a81956d7959821f8dc7c', onClick: this.onClick }, h("span", { key: '040e9bc28fdd8a651937f5f89026b36c32e2ce42', class: {
+        return (h(Host, { key: '7c4689eb1d136fab0d60449e17c50b08c771238a', onClick: this.onClick }, h("span", { key: '24e7aee537540207027a9f97577b4e1e68d063b3', class: {
                 'b2b-toggle-button': true,
                 'b2b-toggle-button--disabled': this.disabled,
-            } }, h("input", { key: 'c4beb8228a213a8693856a1b2c03d1c26a03648a', tabindex: 0, class: {
+            } }, h("input", { key: '285374be7c7aa9573f4225e9fee1bbce60f91083', tabindex: 0, class: {
                 'b2b-toggle-button__input': true,
                 'b2b-toggle-button__input--disabled': this.disabled,
-            }, "aria-labelledby": this.name, type: "radio", checked: this.checked && !this.disabled, disabled: this.disabled, name: this.name, value: this.value }), h("label", { key: '7acde1b03fadbcd83c6f5308369535bd402c29da', id: this.name, tabindex: -1, class: {
+            }, "aria-labelledby": this.name, type: "radio", checked: this.checked && !this.disabled, disabled: this.disabled, name: this.name, value: this.value }), h("label", { key: '521a636d93e6069acc39b55a7e22bb59d636d0d5', id: this.name, tabindex: -1, class: {
                 'b2b-toggle-button__label': true,
                 'b2b-toggle-button__label--disabled': this.disabled,
                 'b2b-toggle-button__label--checked': this.checked && !this.disabled,

package/dist/components/b2b-toggle-chip.js

@@ -41,11 +41,11 @@ const B2BToggleChipComponent = /*@__PURE__*/ proxyCustomElement(class B2BToggleC
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: '3c5a81a73592d4f7457fa577eddde873657cbb31' }, h("span", { key: 'a7fc60c891a440929f55df25135215014a0ca159', onClick: this.onClick, onKeyDown: this.onKeyDown, class: {
+        return (h(Host, { key: '492dfe33bc4b2c36881ffb0f741b3854a2a62ffd' }, h("span", { key: 'eb6cd8abbefd8b585e96c6fd8e13c2f623a02836', onClick: this.onClick, onKeyDown: this.onKeyDown, class: {
                 'b2b-toggle-chip': true,
-            } }, h("input", { key: 'ad10fdac699786776fd2c63fd163318e45c45f87', "aria-labelledby": this.name, tabindex: this.disabled ? -1 : 0, class: {
+            } }, h("input", { key: '4ecc3eb881e0f9099bf98ec97de9b375ed0cc9e7', "aria-labelledby": this.name, tabindex: this.disabled ? -1 : 0, class: {
                 'b2b-toggle-chip__input': true,
-            }, type: "checkbox", checked: this.active && !this.disabled, disabled: this.disabled, name: this.name, value: this.value }), h("label", { key: 'bc04d03929863a5d9b9da37bf951e091d6810c15', id: this.name, tabIndex: -1, class: {
+            }, type: "checkbox", checked: this.active && !this.disabled, disabled: this.disabled, name: this.name, value: this.value }), h("label", { key: 'a745d88d73ca422e2f50a85f8eaafe262bfc06f3', id: this.name, tabIndex: -1, class: {
                 'b2b-toggle-chip__label': true,
                 [`b2b-toggle-chip__label--${this.variant}`]: true,
                 'b2b-toggle-chip__label--active': this.active,

package/dist/components/b2b-toggle-group.js

@@ -53,10 +53,10 @@ const B2BToggleGroup = /*@__PURE__*/ proxyCustomElement(class B2BToggleGroup ext
         }
     }
     render() {
-        return (h(Host, { key: '060b5ec1a81cae6721dec955bbe544caefc31b3b' }, h("div", { key: '19798125a66d074eb2d4e02ac46d017281674fcb', class: {
+        return (h(Host, { key: '05c8ab9da929d603f2ce68211d279c5a2a197a0e' }, h("div", { key: '3c461e63dff416a9e3b9385529ab8310dce3cb6e', class: {
                 'b2b-toggle-group': true,
                 'b2b-toggle-group--disabled': this.disabled,
-            } }, h("fieldset", { key: '2df884ec51dc1162461cc63be63b3781d048a073' }, h("slot", { key: 'edf814302c35d6e485a796bdc5bc91f665c40a2c' })))));
+            } }, h("fieldset", { key: 'f36f7568b736883cf46606ee9983691f51618e43' }, h("slot", { key: '458e4eef59ff318777162fa69485c24e128e4d06' })))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/b2b-toggle-switch.js

@@ -46,17 +46,17 @@ const B2bToggleSwitchComponent = /*@__PURE__*/ proxyCustomElement(class B2bToggl
     render() {
         // workaround for purgecss as safelist doesn't work
         const isLeft = this.labelPosition === 'left';
-        return (h(Host, { key: '492af45bc2e18076699774c38a2380ce613d0f20' }, h("div", { key: '1bbdd7b22a228f1a99064d74cc1a06730f59165d', class: {
+        return (h(Host, { key: 'f95e5df14bf703ab6397ecbe2495f5f4006a5f91' }, h("div", { key: '0afbb317b062e4a89af215a68906de318a640e36', class: {
                 'b2b-toggle': true,
                 'b2b-toggle--disabled': this.disabled,
                 'b2b-toggle--checked': this.state,
-            } }, h("div", { key: '8776fbd74c5c4a55b6f3ce26f6b9052143825dff', class: {
+            } }, h("div", { key: 'e66fabcf76cc170c0ddf284682828bcbd712430c', class: {
                 'b2b-toggle__label': true,
                 'b2b-toggle__label--left': isLeft,
-            } }, h("span", { key: '636cbbe665b9110fba74a22b4883ed532d32bbc7', class: "b2b-toggle__switch", role: "switch", tabIndex: 0, onKeyDown: this.onKeyDown, onClick: this.onClick }, h("svg", { key: 'ea1ab53257132ea21af3fbb8747cce467bdabc8a', class: {
+            } }, h("span", { key: '0a8764c780ca22d51e434d0fa984da93938875c6', class: "b2b-toggle__switch", role: "switch", tabIndex: 0, onKeyDown: this.onKeyDown, onClick: this.onClick }, h("svg", { key: '55edce536bb60d37056444f3715dc53d18466c3d', class: {
                 'b2b-toggle__icon': true,
                 'b2b-toggle__icon--show': this.state,
-            }, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 30 30" }, h("path", { key: '21177e7f309265aabcc97e23d604bfedb024e700', d: "M11.798 25.082c-.341 0-.681-.13-.942-.389l-7.132-7.115a1.334 1.334 0 0 1 1.884-1.888l6.19 6.175L26.391 7.307a1.334 1.334 0 0 1 1.884 1.888L12.74 24.693c-.26.259-.601.389-.942.389z" }))), this.label && (h("span", { class: {
+            }, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 30 30" }, h("path", { key: '15ca8b03f31d56dd5399c0c7cef8348a15e9a01c', d: "M11.798 25.082c-.341 0-.681-.13-.942-.389l-7.132-7.115a1.334 1.334 0 0 1 1.884-1.888l6.19 6.175L26.391 7.307a1.334 1.334 0 0 1 1.884 1.888L12.74 24.693c-.26.259-.601.389-.942.389z" }))), this.label && (h("span", { class: {
                 'b2b-toggle__text': true,
                 'b2b-toggle__text--left': isLeft,
             } }, this.label))))));

package/dist/components/b2b-tooltip.js

@@ -60,13 +60,13 @@ const B2BTooltipComponent = /*@__PURE__*/ proxyCustomElement(class B2BTooltipCom
         }
     }
     render() {
-        return (h(Host, { key: '3525a1f35b6c893a9b081148caaa70729766f961', onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave }, h("span", { key: 'f1d57dcc6b16b83c78c2c272a04e1931d003875e', class: {
+        return (h(Host, { key: '3987a2a1e01ad71a5411c45090b52ac8ad0206e8', onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave }, h("span", { key: 'd468b38485e230ca966401cabec0f77bda69bd6e', class: {
                 [`b2b-tooltip--${this.position}`]: true,
                 'b2b-tooltip__trigger': true,
-            } }, h("slot", { key: '991c1a8b7ac03d2f9e234e459aa1039ed74f7987' }), h("div", { key: '33bc79132f7d49886cb630b39356e8a86377200d', class: {
+            } }, h("slot", { key: '8e44ab8ede77f8e564148a3fc0dbfb69e8c920ce' }), h("div", { key: '78e418f298e23ab8c852d8d69fdc7abd866cc76c', class: {
                 'b2b-tooltip__content': true,
                 'b2b-tooltip--visible': this.opened,
-            } }, h("slot", { key: 'bca7fe909dcf718e1487195cf16f42c410db89a5', name: "content" }, this.content)))));
+            } }, h("slot", { key: 'acc1467002af74a11b265062d9bcd617be660221', name: "content" }, this.content)))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/b2b-wizard-step.js

@@ -17,10 +17,10 @@ const WizardStepComponent = /*@__PURE__*/ proxyCustomElement(class WizardStepCom
         this.checkIcon = true;
     }
     render() {
-        return (h(Host, { key: '56088cd425f8298cd6e58e1b990d6510d60e99f7' }, h("div", { key: '9fc88db4ac7fa2b92151a7893645c143f2b755b4', class: "b2b_wizard__step" }, h("b2b-wizard-icon", { key: '947ca746eec28c4d17352b26e9c4e2936dd65bfb', step: this.step, state: this.state, checkIcon: this.checkIcon }), h("div", { key: '45b67dcde467ab6baa16152d1fee94912bd62d65', class: {
+        return (h(Host, { key: 'da999cffd5571ecbbafafa81f12ce2b439466c1b' }, h("div", { key: '4ee271067a9ef5bbcf8326fe2e4739b30633863e', class: "b2b_wizard__step" }, h("b2b-wizard-icon", { key: 'd7db34a4a510d2e92c4ec6af5db6cf96bcb03860', step: this.step, state: this.state, checkIcon: this.checkIcon }), h("div", { key: '44b07dca7864ac45122cd85625b8bbdb816dafef', class: {
                 'b2b_wizard__step__label': true,
                 'b2b_wizard__step__label--default': this.state === WizardStatus.DEFAULT,
-            } }, h("slot", { key: '5a7677a795553bd4507db62644582b42d383c131' })))));
+            } }, h("slot", { key: 'c5e22aec456a8ca9a55f9ef65294ba8a12b2ac1b' })))));
     }
     static get style() { return B2bWizardStepStyle0; }
 }, [1, "b2b-wizard-step", {

package/dist/components/b2b-wizard.js

@@ -51,7 +51,7 @@ const WizardComponent = /*@__PURE__*/ proxyCustomElement(class WizardComponent e
             this.setStepsState();
     }
     render() {
-        return (h(Host, { key: 'b34b2ade1c6450e723574a4b64282a8f5f44328a' }, h("div", { key: 'c8f88291313570c18bf417059e3b3276bfc016c8', class: "b2b_wizard" }, h("slot", { key: 'ddee7cc165dc603ec8e5781e2ae3977c038748a2' }))));
+        return (h(Host, { key: '7ef581ef2713b31ce1b16836e5981c6414f5a9ea' }, h("div", { key: 'd54084b28e3429be8f6ef77f04c551d39aa62bd4', class: "b2b_wizard" }, h("slot", { key: '8535e40678334b5851f573f39f96a8790157116f' }))));
     }
     get host() { return this; }
     static get style() { return B2bWizardStyle0; }

package/dist/components/calendar-days-header.js

@@ -0,0 +1,40 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { W as Weekdays } from './calendar.types.js';
+
+const calendarDaysHeaderCss = ":root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-table-hover:#e6f4ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:root .b2b-calendar-days-header,:host .b2b-calendar-days-header{display:grid;grid-template-columns:repeat(7, 1fr);padding:0 var(--b2b-size-40) 0 var(--b2b-size-40)}:root .b2b-calendar-days-header .b2b-calendar-day,:host .b2b-calendar-days-header .b2b-calendar-day{width:var(--b2b-size-90);height:var(--b2b-size-55);border-radius:5px;text-align:center;font-weight:var(--b2b-font-weight-normal);color:var(--b2b-color-black-100);font-size:var(--b2b-size-35)}";
+const B2bCalendarDaysHeaderStyle0 = calendarDaysHeaderCss;
+
+const B2bCalendarDaysHeader = /*@__PURE__*/ proxyCustomElement(class B2bCalendarDaysHeader extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.displayWeekDays = () => {
+            let renderWeekDays = [];
+            Weekdays.forEach(day => {
+                renderWeekDays.push(h("div", { class: "b2b-calendar-day" }, day));
+            });
+            return renderWeekDays;
+        };
+    }
+    render() {
+        return (h(Host, { key: '4b12d34730847e4f5a0fae83a1f84fa41ff99368' }, h("div", { key: '309b8278b7748debd036d303ff6f003940085114', class: "b2b-calendar-days-header" }, this.displayWeekDays())));
+    }
+    get host() { return this; }
+    static get style() { return B2bCalendarDaysHeaderStyle0; }
+}, [1, "b2b-calendar-days-header"]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["b2b-calendar-days-header"];
+    components.forEach(tagName => { switch (tagName) {
+        case "b2b-calendar-days-header":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, B2bCalendarDaysHeader);
+            }
+            break;
+    } });
+}
+
+export { B2bCalendarDaysHeader as B, defineCustomElement as d };