@otto-de/b2b-core-components 1.21.0 → 1.22.0

package/dist/esm/b2b-dropdown.entry.js

@@ -51,11 +51,11 @@ const DropdownComponent = class {
         selectElement.append(...options);
     }
     render() {
-        return (h(Host, { key: '5ab2b6da866b7dfa16a70986b930c4ab6c498820', class: {
+        return (h(Host, { key: 'e4eb8019f2b434acde4f3adbe597bb255e0cf872', class: {
                 'b2b-dropdown': true,
                 'b2b-dropdown--error': this.invalid && !this.disabled,
                 'b2b-dropdown--disabled': this.disabled,
-            } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("select", { key: 'e086977e610c986f0d6f3539ed31fdee0d7229e7', class: "b2b-dropdown__select", "aria-labelledby": this.name, name: this.name, disabled: this.disabled, onChange: this.onSelect, onFocus: this.onFocus, onBlur: this.onBlur }), (this.hint !== undefined && !this.invalid) ||
+            } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("select", { key: '3a780ca3f170a59ef73f3e72d3668f9941812e9c', class: "b2b-dropdown__select", "aria-labelledby": this.name, name: this.name, disabled: this.disabled, onChange: this.onSelect, onFocus: this.onFocus, onBlur: this.onBlur }), (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 getElement(this); }

package/dist/esm/b2b-flyout-menu-option.entry.js

@@ -22,7 +22,7 @@ const FlyoutMenuOptionComponent = class {
         }
     }
     render() {
-        return (h(Host, { key: '549433cce616c4ecaaa63f78a9d28f5c1d90a0d1', class: {
+        return (h(Host, { key: '3dc359231f65e0d900c87a90fb16917dec1cef05', class: {
                 'b2b-flyout-menu__option': true,
                 'b2b-flyout-menu__option--disabled': this.disabled,
                 'b2b-flyout-menu__option--separator': this.separator,

package/dist/esm/b2b-flyout-menu.entry.js

@@ -167,12 +167,12 @@ const FlyoutMenuComponent = class {
         options[index].focus();
     }
     render() {
-        return (h(Host, { key: '0221c24624055988ea4d3e7e711279fd934f9167' }, h("div", { key: '78215ad3f534393a7a705164f0c3c3cc199a9ce7', class: {
+        return (h(Host, { key: '44ec3f9b4e574a3327717361bd6c09c5f1958d41' }, h("div", { key: '9ea8f1494bfede3a0853a0e74a5d5854e0bdf082', class: {
                 'b2b-flyout-menu': true,
-            } }, h("div", { key: '2b262f0fe4a9290bcf4e6bff5a7e35cb00a52612', class: "b2b-flyout-menu__trigger" }, h("slot", { key: '27c068e13c042e0535742f2320f751d4935807f1', name: "trigger" })), h("div", { key: '38bb17d6acaa9c4abde9c7ca26d5746fa8a84269', onFocusout: this.blurMenu, class: {
+            } }, h("div", { key: 'c48765324a3ca6ef0b885d23405269e9351c14c6', class: "b2b-flyout-menu__trigger" }, h("slot", { key: '756bdb0f2adbf262397bc5207cb5e6add87e4ef2', name: "trigger" })), h("div", { key: 'ef57778748783ffb269f5023b67eabd681cfb37d', onFocusout: this.blurMenu, class: {
                 'b2b-flyout-menu__options__container': true,
                 'b2b-flyout-menu__options__container--on': this.opened,
-            } }, h("div", { key: 'bbbac10e84d9274ba9084608d8912f8460063a3d', class: "b2b-flyout-menu__arrow" }), h("slot", { key: 'e9050bf99684d849acde201ab4b63f84b5a196db', name: "option" })))));
+            } }, h("div", { key: '9ae1550fb14f6bbe584935169796375f58916891', class: "b2b-flyout-menu__arrow" }), h("slot", { key: '10ff787b762245d5457cdb4f70f8affa9f0375e8', name: "option" })))));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/b2b-grid-col.entry.js

@@ -26,7 +26,7 @@ const B2bGridColumnComponent = class {
         this.textAlign = 'left';
     }
     render() {
-        return (h(Host, { key: '923650dc316312d49a010748a44b65a59c62f545', style: Object.assign(Object.assign({}, this.calculateGrowDimension(this.span)), { ['text-align']: `${this.textAlign}` }) }, h("slot", { key: '8dedf08da9c3953b285856309e36e27086598757' })));
+        return (h(Host, { key: 'f83b2c034afd37db56dd216e61b17718c96fc3ec', style: Object.assign(Object.assign({}, this.calculateGrowDimension(this.span)), { ['text-align']: `${this.textAlign}` }) }, h("slot", { key: 'ddf44e8dab7ed9267c2be3e4a2a1ff6ba13bb53b' })));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/b2b-grid-row.entry.js

@@ -9,7 +9,7 @@ const B2bGridRowComponent = class {
         this.justify = 'start';
     }
     render() {
-        return (h(Host, { key: '891dbdd92aef674a5d1e1a7ce42abf4da97c9895', style: {
+        return (h(Host, { key: 'cea79124fea736c6276b0f60c8ba983d3085dbdb', style: {
                 ['justify-content']: `${this.justify}`,
                 ['gap']: `${this.columnGap}px`,
                 ['margin']: `${this.rowGap}px 0`,
@@ -17,7 +17,7 @@ const B2bGridRowComponent = class {
                 ['display']: 'flex',
                 ['flex-wrap']: 'wrap',
                 ['box-sizing']: 'border-box',
-            } }, h("slot", { key: '4f50c8feefcae58bdbfb8c28836a3f8345c74b86' })));
+            } }, h("slot", { key: '218cf8da76adc6f58983f90fb808629a4785f6a6' })));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/b2b-grid.entry.js

@@ -9,7 +9,7 @@ const B2bGridComponent = class {
         this.margin = 24;
     }
     render() {
-        return (h(Host, { key: '2f681d61d4000a20f28d8a6949190228413503e3', style: { ['padding']: `${this.margin}px` }, class: "b2b-grid" }, h("slot", { key: 'c72d3a5881a65e0c57a34572e5380550db57931c' })));
+        return (h(Host, { key: 'd969835eaef0a092de761496f817e3aeb9fe9da3', style: { ['padding']: `${this.margin}px` }, class: "b2b-grid" }, h("slot", { key: '457acba45d11bb8ed33008c1158f89d33f5222f6' })));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/b2b-icon-100.entry.js

@@ -33,6 +33,7 @@ const iconTypes = [
     "b2b_icon-browser-click",
     "b2b_icon-browser-content",
     "b2b_icon-browser-psm",
+    "b2b_icon-bullet-list",
     "b2b_icon-burger",
     "b2b_icon-bus",
     "b2b_icon-callback",
@@ -178,6 +179,7 @@ const iconTypes = [
     "b2b_icon-order-state-unknown",
     "b2b_icon-order-stored",
     "b2b_icon-order",
+    "b2b_icon-ordered-list",
     "b2b_icon-otto-app",
     "b2b_icon-otto-campus",
     "b2b_icon-otto-company",

package/dist/esm/b2b-input-group_2.entry.js

@@ -61,7 +61,7 @@ const B2BInputGroup = class {
         }
     }
     render() {
-        return (h(Host, { key: 'b8b1b8ca1e2bac0974250a4463080b460a836b82' }, h("div", { key: 'db2150667982e6849c1d0f7f6de2463a4493b268', class: { 'b2b-input-wrapper': true } }, h("slot", { key: '559d5d1113c44d1495dcca04d83da188440a62e8', name: "start" }), h("slot", { key: 'ed5cea7b3670339bd5c762974a10b072c6ed00c8' }), h("slot", { key: '88b19361e0b0755d745481aa4013a055ae30f620', name: "end" })), (this.hint || (this.invalid && !this.disabled)) && (h("span", { class: {
+        return (h(Host, { key: '43603b7006f229a5ee288cc9c86c5509dc3d074f' }, h("div", { key: '268bd1737a9390c53f1294eb0a45ad3b041ad5bb', class: { 'b2b-input-wrapper': true } }, h("slot", { key: '9c3c5fc67ce75fba846aacf456660760c00a4aa9', name: "start" }), h("slot", { key: 'd8db016be6494540aa73fca778b77a49dc1211e8' }), h("slot", { key: 'be32b1d7e14e8beaa2149c1ccc6cc8cf92e735d9', name: "end" })), (this.hint || (this.invalid && !this.disabled)) && (h("span", { class: {
                 'b2b-input-wrapper__hint': true,
                 'b2b-input-wrapper__hint--error': this.invalid && !this.disabled,
             } }, this.invalid && !this.disabled ? this.error : this.hint))));
@@ -217,13 +217,13 @@ const InputListComponent = class {
     */
     render() {
         const groupOrderClass = this.getGroupOrderClassName() || '';
-        return (h(Host, { key: '7fe53e255c889f50b4eab26b92530f83e8753980', onBlur: this.setElementOnBlur, onFocus: this.setElementOnFocus }, h("div", { key: 'd7500b4d7907880f1ec63732550c1fbf59023a50', class: {
+        return (h(Host, { key: 'cee8194b1c04e5d7c125d6fbef762a6256b522a6', onBlur: this.setElementOnBlur, onFocus: this.setElementOnFocus }, h("div", { key: '075f5137c650bec5608b07bc834c36bd0be8dd83', class: {
                 'b2b-input-list': true,
                 'b2b-input-list__options-on': this.hasOptionList &&
                     this.isElementFocused &&
                     Boolean(this.value),
                 [groupOrderClass]: true,
-            } }, h("b2b-input", { key: '57bbb5aea84e6bb803e9fe1f1c8264c2258ece9c', type: "text", label: this.label, value: this.value, disabled: this.disabled || this.groupDisabled, "onb2b-input": this.handleInput, placeholder: this.placeholder, required: this.required }, !(this.disabled || this.groupDisabled) && Boolean(this.value) && (h("b2b-icon", { icon: "b2b_icon-close", "aria-label": "reset", slot: "end", tabIndex: 0, onMouseDown: this.resetInput, onKeyDown: this.resetInput }))), this.isElementFocused && Boolean(this.value) ? (h("div", { class: "b2b-input-list__options-container" }, this.hasOptionList ? (h("div", { class: "b2b-input-list__options", role: "listbox" }, this.optionsList.map(option => (h("b2b-input-list-option", { option: option, tabIndex: -1, "onb2b-option-selected": this.onOptionSelected }))))) : (h("slot", null)))) : null)));
+            } }, h("b2b-input", { key: 'd2d23370cc4e430e68a4e75014ea31d19802557f', type: "text", label: this.label, value: this.value, disabled: this.disabled || this.groupDisabled, "onb2b-input": this.handleInput, placeholder: this.placeholder, required: this.required }, !(this.disabled || this.groupDisabled) && Boolean(this.value) && (h("b2b-icon", { icon: "b2b_icon-close", "aria-label": "reset", slot: "end", tabIndex: 0, onMouseDown: this.resetInput, onKeyDown: this.resetInput }))), this.isElementFocused && Boolean(this.value) ? (h("div", { class: "b2b-input-list__options-container" }, this.hasOptionList ? (h("div", { class: "b2b-input-list__options", role: "listbox" }, this.optionsList.map(option => (h("b2b-input-list-option", { option: option, tabIndex: -1, "onb2b-option-selected": this.onOptionSelected }))))) : (h("slot", null)))) : null)));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/b2b-input-label.entry.js

@@ -10,11 +10,11 @@ const InputLabelComponent = class {
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: '7ecad3b66de20150248867f6f88af8d85f565b32' }, h("label", { key: '932ad343e8287bf8e51f0a8efabd2a42badc5cdc', class: {
+        return (h(Host, { key: '126328bc7fd56d56e2a57559707cbba2a482dbd7' }, h("label", { key: 'c8b6cedbd7f453c6ef5c42c7e9d373b5c8bcd648', class: {
                 'b2b-input-label': true,
                 'b2b-input-label--required': this.required,
                 'b2b-input-label--disabled': this.disabled,
-            } }, h("slot", { key: '6750bd4ac12f4fa2bcd4c93f5883e4db3da24302' }))));
+            } }, h("slot", { key: '3ae21cf9871d0033febc12445c525f21a343f4e5' }))));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/b2b-input_2.entry.js

@@ -81,18 +81,18 @@ const InputComponent = class {
         this.getSlottedText();
     }
     render() {
-        return (h(Host, { key: '73f78ae344c8a82c27d4541e11844c80c75905bb', class: {
+        return (h(Host, { key: '54b702bf7a3f164b6458cd02f6430c89e32a0dc1', class: {
                 'b2b-input': true,
                 'b2b-input--error': this.invalid && !this.disabled,
-            } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("div", { key: 'de40911c1ce5f136db6cba71630435c57d1ec274', class: {
+            } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("div", { key: 'ed3f54f0c1bc643647db180cd81d3a8184ae58e0', class: {
                 'b2b-input__wrapper': true,
                 'b2b-input__wrapper--focused': this.hasFocus,
                 'b2b-input__wrapper--disabled': this.disabled || this.groupDisabled,
-            } }, h("slot", { key: 'aa8dcd487628e4d3aae3a1c962562b9180f015fd', name: "start" }), this.hasTextPrefix && h("div", { class: "border" }), h("input", { key: '8a01f065e0716451b22ac33dc2c3e75b4e9ae54f', class: {
+            } }, h("slot", { key: '5e5e6bfacd84ad4dca5b6540a791f9f2348c69da', name: "start" }), this.hasTextPrefix && h("div", { class: "border" }), h("input", { key: '3bb7a970f7cbabf0c543676746096c8b33ca35c4', class: {
                 'b2b-input__native-input': true,
                 ['b2b-input__native-input--align-' + this.inputTextAlign]: true,
                 'b2b-input__native-input--disabled': this.disabled,
-            }, "aria-labelledby": this.name, type: this.type, placeholder: this.placeholder, value: this.value, name: this.name, disabled: this.disabled || this.groupDisabled, autoFocus: this.autofocus, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, ref: el => (this.focusableElement = el) }), this.hasTextSuffix && h("div", { class: "border" }), h("slot", { key: 'b1c50810df68b16f88e5268eb542491a891fabc3', name: "end" })), (this.hint !== undefined && !this.invalid) ||
+            }, "aria-labelledby": this.name, type: this.type, placeholder: this.placeholder, value: this.value, name: this.name, disabled: this.disabled || this.groupDisabled, autoFocus: this.autofocus, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, ref: el => (this.focusableElement = el) }), this.hasTextSuffix && h("div", { class: "border" }), h("slot", { key: '75a283d3128b6abbc5289ca8fbe7ff65ba60c6d5', name: "end" })), (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 getElement(this); }
@@ -117,7 +117,7 @@ const InputListOptionComponent = class {
         }
     }
     render() {
-        return (h(Host, { key: 'f83b743d32f09766bd7258b093128a249eb80ca5', class: "b2b-input-list__option", onClick: this.handleClick, role: "option" }, this.option));
+        return (h(Host, { key: '2bd67457a721cf4a0c05335a70897c1377e02a14', class: "b2b-input-list__option", onClick: this.handleClick, role: "option" }, this.option));
     }
 };
 InputListOptionComponent.style = B2bInputListOptionStyle0;

package/dist/esm/b2b-label.entry.js

@@ -9,10 +9,10 @@ const LabelComponent = class {
         this.type = 'neutral';
     }
     render() {
-        return (h("span", { key: '00cdae31f74e594dc4d13a122d7b55bcd45284c8', class: {
+        return (h("span", { key: '18b846e1287dcc46de3b719285f548dc2dda3591', class: {
                 'b2b-label': true,
                 [`b2b-label--${this.type}`]: true,
-            } }, h("slot", { key: 'cd1c95c44ceef43337fb5142c2004c8136131755' })));
+            } }, h("slot", { key: '3b2ec04870ce83e0bfe8910cf2224ce44df31706' })));
     }
 };
 LabelComponent.style = B2bLabelStyle0;

package/dist/esm/b2b-modal.entry.js

@@ -206,10 +206,10 @@ const ModalComponent = class {
         this.attemptFocus(this.getFirstFocusableElement());
     }
     render() {
-        return (h(Host, { key: '26c534a73dc45383ee8420de1fc45644fae221c4' }, h("div", { key: 'a82dff4a2193cab229f6a9a20ad95cc46b371bc3', class: { 'b2b-modal': true, 'b2b-modal--open': this.opened } }, h("div", { key: '9116aac091d277ec31a08834dcd3c745bc77ef73', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabIndex: 0 }), h("div", { key: '6e3f2284408e2e5a7c90b4e64cbc6e9db1c7df83', class: {
+        return (h(Host, { key: '05b9d293228c39dd82ad3b27c2dbba6432f63686' }, h("div", { key: 'efff47d3cdcf4e692687f326238b7e05f4262dc9', class: { 'b2b-modal': true, 'b2b-modal--open': this.opened } }, h("div", { key: 'bb2bd023ecfdf7a25975d04630f6b8d91c4c4238', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabIndex: 0 }), h("div", { key: 'ea87924e8112672d9d76173509107ef820e1eaba', class: {
                 'b2b-modal__dialog': true,
                 [`b2b-modal__dialog--${this.variant}`]: true,
-            } }, h("div", { key: '2dc54886555233e1368122c95c7244b4aa47fb49', class: "b2b-modal__dialog__header" }, h("div", { key: 'b75c1300025054c455170eb5e69c7c38fc9eb9b0', class: "b2b-modal__dialog__header-left" }, h("b2b-headline", { key: 'e5cc2a12f707c9faa4c6f97bf36e4dc622fa0f10', align: "center", size: "200", noMargin: true }, this.heading), h("slot", { key: '2e9b562c52ab1ac32795fce91d21687adc3d49a9', name: "header-icon" })), h("div", { key: '1d57c1d299494bd348617156017ab1f5c58b8d88', class: "b2b-modal__dialog__header-right" }, h("button", { key: 'b3808844a2c13c9624f86597d69e97c2924eba8a', 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: '300c1aad8a590e0943e006e88d221fbf6ac5c254', clickable: true, icon: "b2b_icon-close", color: this.iconHover ? 'primary' : 'secondary' })))), h("div", { key: 'e109dbbecc3679e5ce3848eea26a678fcb45b823', class: "b2b-modal__dialog__body" }, h("slot", { key: 'feb7c4672ec60eb7f8adb43b26730f3a5660d331' })), h("div", { key: 'c9cce54143969b42749fb5d4959e87dc01c7dedf', class: "b2b-modal__dialog__footer" }, h("div", { key: '63777edafa1f9c9889e62374becaded55bdd9e1b', class: "b2b-modal__dialog__footer-left" }, h("slot", { key: 'c4dd516a2239c339798bc9400f62fb49f6ff44b3', name: "footer-left" })), h("div", { key: 'efc3456a4ecdad6d6d1ad459f8fa08b9e1fb3332', class: "b2b-modal__dialog__footer-right" }, h("slot", { key: 'c9fd956127b120c272a67a1adc63ae2b62825f14', name: "footer-right" })))), h("div", { key: 'e51102b7631759a33663a22c79a499aff7c8709c', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabIndex: 0 }), h("div", { key: '820955f1df4115e803e2ad4222925e36cd5fd526', class: "b2b-modal__backdrop", onClick: this.handleBackdropDismiss }))));
+            } }, h("div", { key: '367bfc5a0dde6ec1f91a9461bec1af6833446c26', class: "b2b-modal__dialog__header" }, h("div", { key: '22bfcbcc0bd2056a60e4b9fe8ee76263a5aaf60b', class: "b2b-modal__dialog__header-left" }, h("b2b-headline", { key: 'f1ecab2113e756f8a37e9e136608bf44e74491ca', align: "center", size: "200", noMargin: true }, this.heading), h("slot", { key: '42d151db80bdfe6ce662a878fb100d943e461cc4', name: "header-icon" })), h("div", { key: '765aef597c08d2ae6133fb7e00f37f7882808ec1', class: "b2b-modal__dialog__header-right" }, h("button", { key: '6c27b0802cbc80519ce47e63af63b235f9b15170', 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: '4e7ba249cedbcf6312d716d1031133870845b6cb', clickable: true, icon: "b2b_icon-close", color: this.iconHover ? 'primary' : 'secondary' })))), h("div", { key: '3f9fd1e166f3e0382d98fa00eedfbcaed9f70bbb', class: "b2b-modal__dialog__body" }, h("slot", { key: '145b3a0dbd8ee9251114a5f5d53a97d3a2bc7fbe' })), h("div", { key: '52a105ca1acb27d5b7ccf6dffa7f15a11f8baa94', class: "b2b-modal__dialog__footer" }, h("div", { key: 'ae006150cf95ea7b7ffd6ddcb5492e625bc805b8', class: "b2b-modal__dialog__footer-left" }, h("slot", { key: '09e5f13b1a3dcb49e937924a7542fc5656ae1418', name: "footer-left" })), h("div", { key: 'cee8f2a29c60dfb12d99e270164098506ac14b11', class: "b2b-modal__dialog__footer-right" }, h("slot", { key: 'ab2c62d156b5476b4036d8ee362587f4ed19c8c2', name: "footer-right" })))), h("div", { key: 'a7eee41356ac61e86e8034c1a2c7b00ef5841a08', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabIndex: 0 }), h("div", { key: 'e94d87a4553ddf37cbe12955ad6ed00c5a5ea1f9', class: "b2b-modal__backdrop", onClick: this.handleBackdropDismiss }))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/b2b-multiselect-dropdown.entry.js

@@ -151,7 +151,7 @@ const B2bMultiSelectDropdown = class {
         }
     }
     parseStringToArray(value) {
-        return JSON.parse(value.replace(/'/g, '"'));
+        return JSON.parse(value);
     }
     componentDidUpdate() {
         const options = this.getOptions();
@@ -159,13 +159,13 @@ const B2bMultiSelectDropdown = class {
         this.updateSelectAll(options);
     }
     render() {
-        return (h(Host, { key: '78a4b5a6c75288e7d009e040e9885da2cf6f4f02', onFocus: this.setElementOnFocus, onBlur: this.setElementOnBlur, onClick: this.handleMouseDown, onKeyDown: this.handleKeyDown }, h("b2b-input-label", { key: 'ff95015ecdd660bdfac396c2669e50d41e85ff82' }, this.label), h("div", { key: '479cf3758d82775832ef1c530762f89a486cc028', class: {
+        return (h(Host, { key: 'ae0810d77f48d5aed5fb7d97e1b3a800a4a057b0', onFocus: this.setElementOnFocus, onBlur: this.setElementOnBlur, onClick: this.handleMouseDown, onKeyDown: this.handleKeyDown }, h("b2b-input-label", { key: 'e9e67e9c02c8885919740f97c3c52f12991cff66' }, this.label), h("div", { key: '43e41efade0b8d761f1d8edf11415a43c461e804', class: {
                 'b2b-multiselect-dropdown': true,
                 'b2b-multiselect-dropdown--open': this.isElementFocused,
-            }, tabindex: 0, role: "combobox", "aria-expanded": this.isElementFocused }, this.currentSelectedValues.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: '2bdceaeed0f5107d6c26cbdb4fc2718e4b32a77a', icon: "b2b_icon-arrow-down" })), h("div", { key: 'b5ed97c14ea1138cf5be5c28f7531f45dcdb0e28', class: {
+            }, tabindex: 0, role: "combobox", "aria-expanded": this.isElementFocused }, this.currentSelectedValues.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: '1c89e8e3bd29103d53f57d09729a50d4a572cb83', icon: "b2b_icon-arrow-down" })), h("div", { key: '6bea389b47af4c68930ca8b9929d5306851c3e07', class: {
                 'b2b-multiselect-dropdown__options-container': true,
                 'b2b-multiselect-dropdown__options-container--visible': this.isElementFocused,
-            } }, h("div", { key: 'c5637e174624e04ab0bd346e648559b6a1b1301d', class: "b2b-multiselect-dropdown__options", role: "listbox", "aria-label": this.label, tabIndex: -1 }, h("div", { key: 'db310f71fe7b9e8e51ff975b135a2c90c6cd2d87', class: "b2b-multiselect-dropdown__option__search" }, h("input", { key: '5a0042c6dc0d01fa38ea0ac9ce3005fb91704df0', type: "text", onInput: this.handleInput, class: "b2b-multiselect-dropdown__option__search__input", placeholder: this.searchPlaceholder })), h("b2b-multiselect-option", { key: '98bc2d69cdac70fb726b64945344baf4af44121b', class: "b2b-multiselect-dropdown__option__select-all", option: this.selectAllLabel, id: "select-all", "onB2b-option-selected": this.handleSelectAll }), this.hasOptionList &&
+            } }, h("div", { key: '2ce84f01cd609c3086d0bc882d03120ce910d79e', class: "b2b-multiselect-dropdown__options", role: "listbox", "aria-label": this.label, tabIndex: -1 }, h("div", { key: '6acc6a4f6a96208e82eb04d5f7a59aa49fbd7c62', class: "b2b-multiselect-dropdown__option__search" }, h("input", { key: 'b55e0c46ff96afbbb069d0406bf2e5c15beb13e5', type: "text", onInput: this.handleInput, class: "b2b-multiselect-dropdown__option__search__input", placeholder: this.searchPlaceholder })), h("b2b-multiselect-option", { key: '4be2a1d6433bad06d85b3e4765e9d65e483223b0', 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 getElement(this); }

package/dist/esm/b2b-pagination.entry.js

@@ -104,7 +104,7 @@ const PaginationComponent = class {
         };
     }
     render() {
-        return (h("nav", { key: '5b21b9fc90454d5733d5a95db08d57fbf7c7099d' }, h("ol", { key: '8322f26d437809e21912edb81a6da363bf36ff4c', 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: '7a5f0a7ad756286b1fb9aa08af4b0818bff96717' }, h("ol", { key: 'e2c4e68f3581843f4f8445942eb590229fab1637', 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/esm/b2b-paragraph.entry.js

@@ -14,7 +14,7 @@ const ParagraphComponent = class {
         this.display = 'block';
     }
     render() {
-        return (h("p", { key: '38b1e631c19a20c18e88dc3024553151181b2b32', style: {
+        return (h("p", { key: '410bec2bfaa21c973ecb2c8a40238ca8e858b95f', style: {
                 display: this.display,
             }, class: {
                 'b2b-paragraph': true,
@@ -23,7 +23,7 @@ const ParagraphComponent = class {
                 ['b2b-paragraph--align-' + this.align]: true,
                 ['b2b-paragraph--no-margin']: !this.margin,
                 ['b2b-paragraph--variant-' + this.variant]: true,
-            } }, h("slot", { key: '04cb89ee733a6f45a674586311fcc8484aca4ac8' })));
+            } }, h("slot", { key: 'c2dae90e21ff14bdea080f007eb35d36ade59bad' })));
     }
 };
 ParagraphComponent.style = B2bParagraphStyle0;

package/dist/esm/b2b-progress-bar.entry.js

@@ -22,11 +22,11 @@ const ProgressBarComponent = class {
     }
     render() {
         const labelExists = this.label !== undefined && this.label !== '';
-        return (h(Host, { key: '15d28a38e73694c291cc3f30a46c293340f783b5' }, h("div", { key: 'da403857480473acba95970d121f2d182298ad17', class: {
+        return (h(Host, { key: '2466d3c474ca6240247bb397426f060698d97186' }, h("div", { key: '6d0e5633c0f01952a52aba45c43b39654fc3b3ea', class: {
                 [`b2b-progress-bar__${this.labelPosition}-${this.labelType}`]: true,
-            } }, h("div", { key: 'b9bc673095e7ccb81b16eb220c91e8cc5801ad90', class: "b2b-progress-bar__wrapper" }, h("div", { key: '851108cac7b1af71d8ca8176aa03c90281b7bf54', class: "b2b-progress-bar__progress", style: {
+            } }, h("div", { key: 'ee25b17b43f6204cb370c2046cdee20790193f89', class: "b2b-progress-bar__wrapper" }, h("div", { key: '78050a17a169f50a5a5784ac48a7a58152ea2e6b', class: "b2b-progress-bar__progress", style: {
                 width: `${this.getProgress()}%`,
-            } })), h("div", { key: '49f60349dde0c498fd30f77711168e6a8c2fab30', class: {
+            } })), h("div", { key: '44c633adccf2736adf8d0cc462c269d83f0c31c5', class: {
                 'b2b-progress-bar__label': labelExists,
                 'b2b-progress-bar__label-none': !labelExists,
                 [`b2b-progress-bar__label__${this.labelPosition}-${this.labelType}`]: labelExists,

package/dist/esm/b2b-radio-button.entry.js

@@ -61,11 +61,11 @@ const B2bRadioButtonComponent = class {
         return Array.from(document.querySelectorAll(`b2b-radio-button[name="${this.name}"]`)).filter((radio) => radio.value !== this.value);
     }
     render() {
-        return (h(Host, { key: 'e18102a2fb0a1386273ade95e4a7bffa17466755', onClick: this.onClick }, h("div", { key: '3ab98b94c94b3e027e673247245c7012d3f9bc86', class: {
+        return (h(Host, { key: 'c6a48de040535714aa894821869b17a09bd7c0bc', onClick: this.onClick }, h("div", { key: 'c7330bbaad0413b440b630607a7f036ae4ede8bd', class: {
                 'b2b-radio': true,
                 'b2b-radio--error': this.invalid && !this.disabled,
                 'b2b-radio--disabled': this.disabled,
-            } }, h("div", { key: 'd81ed252709872fb297fba2a497fb045f35285ac', class: "b2b-radio-items" }, h("input", { key: '7a914994f7ac1ae1e61e1d7f22f950fb6b1aff8c', 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: '9509f79a63adce1a01a549bd41656df1b81ead7a', id: this.name, required: this.required, disabled: this.disabled }, h("slot", { key: '178785143077da89f4af963ccb313e32d86a9408', name: "label" }, this.label))), (this.hint !== undefined && !this.invalid) ||
+            } }, h("div", { key: 'fa4653ef9abfffb7bccc3450d5fd024a3167297c', class: "b2b-radio-items" }, h("input", { key: '0ada5794f7abd8f5a10078e06a6d0ad8a2d2053e', 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: '1486659420211964f3a59c4465717170eaffb7ec', id: this.name, required: this.required, disabled: this.disabled }, h("slot", { key: 'deac0ee6f41f57b312837c8e24534f0e9416144b', name: "label" }, 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 getElement(this); }

package/dist/esm/b2b-radio-group.entry.js

@@ -75,11 +75,11 @@ const RadioButtonGroupComponent = class {
         this.removeChildText();
     }
     render() {
-        return (h(Host, { key: 'f3db64520ccc43bc53481c1a8b7bcd84e00137a9' }, h("div", { key: 'dc7b46f02261530f8514fcb8f7b82777ee304694', class: {
+        return (h(Host, { key: '7d9c1d82a8e36e51555112beb36140829d971c22' }, h("div", { key: 'c3a003fe8e873cdcf0f998087fb9ca88cd8cf829', class: {
                 'b2b-radio-group': true,
                 'b2b-radio-group--error': this.invalid && !this.disabled,
                 [`b2b-radio-group--${this.alignment}`]: true,
-            } }, (this.label || this.labelSlot) && (h("b2b-input-label", { id: this.name, required: this.required }, h("slot", { name: "label" }, this.label))), h("fieldset", { key: 'a966d24bb05131b586bf06ab9296cecf889c1479' }, h("div", { key: 'f5c4eee2aa0d6ac639cbfd13bd2cdd5a0caee0d5', class: "b2b-radio-group-options" }, h("slot", { key: '0f7f3ba4c038e8c9ef883738142eb463fbdafceb' }))), (this.hint !== undefined && !this.invalid) ||
+            } }, (this.label || this.labelSlot) && (h("b2b-input-label", { id: this.name, required: this.required }, h("slot", { name: "label" }, this.label))), h("fieldset", { key: '4d513eb53eb50d556d3e9b3635b0560dd337dd46' }, h("div", { key: '18268876504e9af54aa1815c76365ad41ff5b0ee', class: "b2b-radio-group-options" }, h("slot", { key: '78b7c3a6a05ace18d201b6fc600969df040ad531' }))), (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 getElement(this); }

package/dist/esm/b2b-required-separator.entry.js

@@ -9,7 +9,7 @@ const B2BRequiredSeparator = class {
         this.label = 'Pflichtfeld';
     }
     render() {
-        return (h(Host, { key: '579b61923204ef55e9869a380d756b65052b6090' }, h("div", { key: 'be5d925cca766cbefaa60eaecc194b6e7db60f2a', class: "b2b-required-separator__label" }, h("span", { key: 'ceb68c7a579e6686e1b2eb39175c790d78ae9945', class: "b2b-required-separator__asterisk" }, "* "), h("span", { key: 'bde31831c13a036c901611b86b6de30fcaa6dc18' }, this.label)), h("b2b-separator", { key: '003cd4d6cc099ec051076f6f3d9bf2d523df7e1f' })));
+        return (h(Host, { key: 'cab5659fd608d598bfdea6c24da780f5b1c8f0a4' }, h("div", { key: '107780204e6bc22b6d87014639307a1ddf0a3077', class: "b2b-required-separator__label" }, h("span", { key: '1997e65a06747f06779950ad793ddd221dcd9974', class: "b2b-required-separator__asterisk" }, "* "), h("span", { key: '44b6faacf88b76a13dcc2fcf2529354279103d83' }, this.label)), h("b2b-separator", { key: 'cf1747b9ec17ea9eb352f777f0ad25c8d6b2a927' })));
     }
 };
 B2BRequiredSeparator.style = B2bRequiredSeparatorStyle0;

package/dist/esm/b2b-rounded-icon.entry.js

@@ -11,16 +11,16 @@ const RoundedIconComponent = class {
         this.contentColor = 'var(--b2b-color-copy-default)';
     }
     render() {
-        return (h(Host, { key: 'b2542f30738b99706e264260504902e148af170f' }, h("div", { key: '01d1b4b8118a1754fe85354eb47dfb78a778b1f6', style: {
+        return (h(Host, { key: 'aeaecbab894eae02bf8cc6c441175ec07b5540e2' }, h("div", { key: '1b25b7d2d917c742361c8126b11d5254a9fac9c1', style: {
                 ['background-color']: this.color,
                 ['border']: `1px solid ${this.borderColor || this.color}`,
             }, class: {
                 'b2b-rounded-icon': true,
-            } }, h("div", { key: '3e319fcf7d1acc4c3a534c26f6106717a8d57fdf', style: {
+            } }, h("div", { key: '0c5f34202db459eb45f37d1fb16bede9dd50a2e7', style: {
                 ['color']: this.contentColor,
-            } }, h("slot", { key: '1f14bca3fb6fe8dc92d6cadc173f5b470a425db6', name: "icon" })), h("div", { key: '2e07fb2694f642788c09361a9aaa7c6f768107cc', style: {
+            } }, h("slot", { key: 'f87224fdf932a13ed106c10a2ff9b173fc833bee', name: "icon" })), h("div", { key: 'a0cbad312cc610ee4f18a76b32c3d690dcd6a7b2', style: {
                 ['color']: this.contentColor,
-            } }, h("slot", { key: 'c84e59d64323d19ff2a2a3245d6db424f8135bc6', name: "text" })))));
+            } }, h("slot", { key: '518902a11b10391fdb5d654baaf84ba6f7c0c65e', name: "text" })))));
     }
 };
 RoundedIconComponent.style = B2bRoundedIconStyle0;

package/dist/esm/b2b-scrollable-container.entry.js

@@ -8,7 +8,7 @@ const ScrollableContainerComponent = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '50b43bcc6fd513c782f1bed4f68449c3fb2b9a5f' }, h("slot", { key: 'd39b849277ecbc737ad9ccb19e930c3de7e1ea38' })));
+        return (h(Host, { key: '2fd5cba6708e2ec70567ea9b582ad5c2cbc9531f' }, h("slot", { key: '9998b1dcb05a6396e288317365d56e983baeb002' })));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/b2b-search.entry.js

@@ -25,7 +25,7 @@ const SearchComponent = class {
         }
     }
     render() {
-        return (h(Host, { key: '0863204d06c3b85010a176bc4286e31b89351184' }, h("b2b-input-group", { key: 'f3a8bbed419ac2b1d2e324203c6834b0748a4c50', disabled: this.disabled }, h("b2b-input-list", { key: 'd78357acc766ded0d5c49f02a5a91ee4f1b76ce5', slot: "start", value: this.value, placeholder: this.placeholder, optionsList: this.optionsList, "onb2b-input": this.onInput, "onb2b-option-selected": this.onOptionSelected }, h("slot", { key: 'c2c15a8dffa5fd6e54722abdca3a3cde9c04a24a' })), h("b2b-button", { key: '0dcc48c582fd7ac47af40b2e3bcd4ffc29b01257', slot: "end", variant: "primary", onClick: this.onSearchClicked }, h("b2b-icon", { key: '2d9ea153c46e4d6af113cbe33d8d1d909a1d0e18', icon: "b2b_icon-search", clickable: true })))));
+        return (h(Host, { key: 'b24052966f06f771d924c1fc7a2257155aa1fafe' }, h("b2b-input-group", { key: '35c7d7926e6d014a87d39174ba83e3eb7a323e32', disabled: this.disabled }, h("b2b-input-list", { key: 'ccf3037cf0f7d64ae7e5f37c1789a082886db2f2', slot: "start", value: this.value, placeholder: this.placeholder, optionsList: this.optionsList, "onb2b-input": this.onInput, "onb2b-option-selected": this.onOptionSelected }, h("slot", { key: '59a0f64d0f39498ddf04b3cdced2c8111de1ada9' })), h("b2b-button", { key: '7a09cbe052e0c17e9c76a53fc3c7e4694ff71461', slot: "end", variant: "primary", onClick: this.onSearchClicked }, h("b2b-icon", { key: '65d2f0468e9c8a8300ae4905e5644841dc80072c', icon: "b2b_icon-search", clickable: true })))));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/b2b-separator.entry.js

@@ -9,7 +9,7 @@ const B2bSeparatorComponent = class {
         this.alignment = 'horizontal';
     }
     render() {
-        return (h(Host, { key: '5d26a4636a4e167729ce76edfd20d64ae6f49c07' }, h("div", { key: 'e3f04f51c3a3a32fee947b109095aa682b64df49', class: {
+        return (h(Host, { key: '2a85d5e6381c1c666d57d9439ee6df185b7e41d3' }, h("div", { key: '6939b9e06e5c27d2ea0299a1165accaeeb33bc3e', class: {
                 [`b2b-separator--${this.alignment}`]: true,
             } })));
     }

package/dist/esm/b2b-tab-group.entry.js

@@ -124,7 +124,7 @@ const B2bTabGroupComponent = class {
         });
     }
     render() {
-        return (h(Host, { key: '82c0d22d7738ecbbe49dc358a81759da436389ea' }, h("slot", { key: '073c3086c66b28ee4d90e38dfc3920ca58deccfd', name: "tab" }), h("b2b-separator", { key: 'd9906b47b55895b61883767817cd761b10225dd0' }), h("slot", { key: 'f01db3ddcdcb289170dbb8865bf6873dd9442b60', name: "panel" })));
+        return (h(Host, { key: '9909139cbb9146d9f0362472c86d1f386b579ba6' }, h("slot", { key: 'ab007fd2e3db59a53a1a11e716fc20993390272d', name: "tab" }), h("b2b-separator", { key: '75c80e51f6b78a6bc19c7ab20507e6f47a66a6d6' }), h("slot", { key: 'c996bbfd3439a1db26b70e066766a9af99d825b4', name: "panel" })));
     }
     get hostElement() { return getElement(this); }
 };

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

@@ -10,7 +10,7 @@ const B2bTabPanelComponent = class {
         this.generatedId = i++;
     }
     render() {
-        return (h(Host, { key: 'af2fa2c4c2a00694c838ad5efcf293fde97a3cd4', id: `b2b-tab-panel-${this.generatedId}`, role: "tabpanel" }, h("div", { key: '3d14cdc1c06a1986cb4e3b23fce7d23fd907e6a1', class: "b2b-tab-panel" }, h("slot", { key: '76b6383394425c71055d82569dab910066265643' }))));
+        return (h(Host, { key: '7ef09ad5f34e94032ee3f48352980080998fe35c', id: `b2b-tab-panel-${this.generatedId}`, role: "tabpanel" }, h("div", { key: '68e0f565985114d15d1be05d3fed2a2fa25687d7', class: "b2b-tab-panel" }, h("slot", { key: '8ca942618a4efd0d7866c56080a50f49550799b4' }))));
     }
 };
 B2bTabPanelComponent.style = B2bTabPanelStyle0;

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

@@ -23,12 +23,12 @@ const B2bTabComponent = class {
         }
     }
     render() {
-        return (h(Host, { key: '8aa1b1ae2ad6d9b2f77cbd882602caade8cc8355', 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: '896a95b6fe0e389c380bed8d7755ef04467470c2', class: {
+        return (h(Host, { key: 'b0ce35de40859cbe4ac92fb7590dbcdf7ba2a856', 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: 'b40f64090aa72ad05ca09c7346adc0fd454e78fd', class: {
                 'b2b-tab': true,
                 'b2b-tab--selected': this.selected,
                 'b2b-tab--disabled': this.disabled,
                 'b2b-tab--error': this.invalid,
-            } }, h("slot", { key: '87e0d4dc4f316d16efde95c2e9f4c9fa63db984d' }))));
+            } }, h("slot", { key: '973bf596f14c101d95811440e0a610d96858f1ad' }))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/b2b-table-cell_2.entry.js

@@ -40,14 +40,14 @@ const TableCellComponent = class {
         }
     }
     render() {
-        return (h(Host, { key: '571ec5bc494057bfbe9c9146da086bb6a192f298', onMouseEnter: this.addExpandStyles, onMouseLeave: this.removeExpandStyles, class: {
+        return (h(Host, { key: 'b03771e3e73de98b729b18d86fdc9ae083db2c8a', onMouseEnter: this.addExpandStyles, onMouseLeave: this.removeExpandStyles, class: {
                 'b2b-table-cell': true,
                 ['b2b-table-cell--colspan']: this.size === TableSizes.COLSPAN,
                 ['b2b-table-cell--ellipsis']: this.useTextEllipsis,
                 ['b2b-table-cell--' + this.align]: true,
                 ['b2b-table-cell--divider']: this.divider,
                 [`b2b-table-cell-color-${this.color}`]: true,
-            }, role: "cell" }, h("slot", { key: '10385f497f0061d09b227b88456205bac24f272f' })));
+            }, role: "cell" }, h("slot", { key: '122acda5bae14213fd2e702b65edbcc0bfe9f672' })));
     }
     get host() { return getElement(this); }
 };
@@ -127,7 +127,7 @@ const TableHeaderComponent = class {
         this.setIconPlacement();
     }
     render() {
-        return (h(Host, { key: '34f96e3a7c5c36cafadb463a72f1acec6550d367', class: {
+        return (h(Host, { key: 'd96004629017b2e728289da6bf899886d3598548', class: {
                 [`b2b-table-header--${this.sortDirection && this.iconAlign}`]: true,
                 'b2b-table-header--divider': this.divider,
                 [`b2b-table-header--${this.size}`]: true,

package/dist/esm/b2b-table-row.entry.js

@@ -9,6 +9,8 @@ const TableRowComponent = class {
         registerInstance(this, hostRef);
         this.b2bOpen = createEvent(this, "b2b-open", 7);
         this.b2bSelected = createEvent(this, "b2b-row-selected", 7);
+        this.parentRowGroup = null;
+        this.observer = null;
         this.toggleOpen = () => {
             this.isOpen = !this.isOpen;
             this.b2bOpen.emit(this.isOpen);
@@ -24,7 +26,7 @@ const TableRowComponent = class {
             });
         };
         this.getRowColor = () => {
-            if (this.isAccordion() &&
+            if (this.isAccordionValue &&
                 isFirstRow(this.hostElement) &&
                 !this.isHeader()) {
                 return TableColourOptions.GROUP;
@@ -39,9 +41,6 @@ const TableRowComponent = class {
         this.getParentRowGroup = () => {
             return this.hostElement.closest('b2b-table-rowgroup');
         };
-        this.isAccordion = () => {
-            return this.getParentRowGroup().hasAttribute('accordion');
-        };
         this.isHeader = () => {
             return this.getParentRowGroup().type === 'header';
         };
@@ -57,7 +56,7 @@ const TableRowComponent = class {
             }
         };
         this.getAccordionColumns = () => {
-            if (this.isAccordion() && !this.isHeader()) {
+            if (this.isAccordionValue && !this.isHeader()) {
                 if (isFirstRow(this.hostElement)) {
                     return (h("b2b-table-cell", null, h("button", { onClick: this.toggleOpen, class: {
                             'b2b-table-row__accordion-icon': true,
@@ -66,7 +65,7 @@ const TableRowComponent = class {
                 }
                 return (h("b2b-table-cell", { class: "b2b-table-row__control-cell--accordion" }));
             }
-            else if (this.isAccordion() && this.isHeader()) {
+            else if (this.isAccordionValue && this.isHeader()) {
                 return (h("b2b-table-header", { class: "b2b-table-row__control-cell--accordion" }));
             }
         };
@@ -77,6 +76,7 @@ const TableRowComponent = class {
         this.value = undefined;
         this.indeterminate = false;
         this.checked = false;
+        this.isAccordionValue = false;
         this.isOpen = false;
     }
     toggleSelected(event) {
@@ -103,14 +103,35 @@ const TableRowComponent = class {
             this.getParentRowGroup().type !== 'header') {
             console.warn('You need to associate a value with the row as a unique identifier.');
         }
+        this.findParentAndObserve();
+    }
+    disconnectedCallback() {
+        if (this.observer !== undefined && this.observer !== null) {
+            this.observer.disconnect();
+            this.observer = null;
+        }
+    }
+    findParentAndObserve() {
+        this.parentRowGroup = this.hostElement.closest('b2b-table-rowgroup');
+        if (this.parentRowGroup !== undefined && this.parentRowGroup !== null) {
+            this.observer = new MutationObserver(() => {
+                var _a;
+                this.isAccordionValue =
+                    ((_a = this.parentRowGroup) === null || _a === void 0 ? void 0 : _a.hasAttribute('accordion')) || false;
+            });
+            this.observer.observe(this.parentRowGroup, { attributes: true });
+        }
+        else {
+            console.warn('Parent b2b-table-rowgroup not found!');
+        }
     }
     render() {
-        return (h(Host, { key: 'f92b4349e74b6f9f4ff5da3661a268c0554cacf1', class: {
+        return (h(Host, { key: 'c39eb58624347736a167fef2e4aa9fc9ca7c7e48', 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: '08f7b690c3b0a7ae8e8083254b9a975989306e57' })));
+            }, role: "row" }, this.getAccordionColumns(), this.getCheckbox(), h("slot", { key: 'e224986cde05a3e6fc60c087953512bca87999ef' })));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/b2b-table-rowgroup.entry.js

@@ -118,11 +118,11 @@ const TableRowgroupComponent = class {
         this.makeHeaderRowNotSelectable();
     }
     render() {
-        return (h(Host, { key: '4dd4d9fe40cbb15bbbdd8aeff90d31372da60cdd', class: {
+        return (h(Host, { key: 'faa8967bf314a57aaa29bf32e4a8dd9fb1d31229', 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: 'd4492ca4f42bde66052ed61c9d3bfebc74e790e7' })));
+            }, role: "rowgroup" }, h("slot", { key: 'bf00c613d18b138e715d9840141e06399e4f5309' })));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/b2b-table.entry.js

@@ -65,9 +65,9 @@ const TableComponent = class {
         }
     }
     render() {
-        return (h(Host, { key: '70f900f2160167e3f808c9c432cfa3bb134624c0', class: {
+        return (h(Host, { key: 'd69ea87cde7434a9555464edaf081268ee850bdb', class: {
                 ['b2b-table--' + this.size]: true,
-            }, role: "table" }, h("slot", { key: 'c0b35190bb004dd3332e3b2bb856e30a1adee829' })));
+            }, role: "table" }, h("slot", { key: '196c2f61af014d04a842543ea66ff806edbb8e5f' })));
     }
     get host() { return getElement(this); }
 };

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

@@ -50,10 +50,10 @@ const B2BTextareaComponent = class {
         }
     }
     render() {
-        return (h(Host, { key: 'adf829a538a8234008981a3f1a56d5f370b859ec', class: {
+        return (h(Host, { key: 'f58f062339891dfe7d78fcce5b9a90ac9871d826', 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: 'c64d67fb1eb2a7552643815f10b139d34a7a46bd', 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: '22cd5ea8b7b8cd34253c2cc076b0273b1481e10f', 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 getElement(this); }