@otto-de/b2b-core-components 1.27.0 → 1.28.0

package/dist/collection/components/separator/separator.js

@@ -4,7 +4,7 @@ export class B2bSeparatorComponent {
         this.alignment = 'horizontal';
     }
     render() {
-        return (h(Host, { key: '2a85d5e6381c1c666d57d9439ee6df185b7e41d3' }, h("div", { key: '6939b9e06e5c27d2ea0299a1165accaeeb33bc3e', class: {
+        return (h(Host, { key: '06f767c6c587079b6ed216081a4df3c9e599d28f' }, h("div", { key: 'c4439cc5b13f6b2932e982c03a3c2518341ef8f2', class: {
                 [`b2b-separator--${this.alignment}`]: true,
             } })));
     }

package/dist/collection/components/shimmer/shimmer.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/shimmer/shimmer.js

@@ -10,7 +10,7 @@ export class ShimmerComponent {
             width: `${this.width}px`,
             height: `${this.height}px`,
         };
-        return (h(Host, { key: 'd49facd00500b965059c0322adfc56961bc69f8e' }, this.loading ? (h("div", { class: "b2b-shimmer", style: shimmerStyle })) : (h("slot", null))));
+        return (h(Host, { key: 'd56356a77a4cc11ceee13d7e579a4df5aa9826f1' }, this.loading ? (h("div", { class: "b2b-shimmer", style: shimmerStyle })) : (h("slot", null))));
     }
     static get is() { return "b2b-shimmer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/snackbar/snackbar.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/snackbar/snackbar.e2e.js

@@ -38,8 +38,6 @@ describe('B2B-Snackbar', () => {
         await page.setContent(`<b2b-snackbar opened timed="true" duration="1000">test</b2b-snackbar>`);
         const element = await page.find('b2b-snackbar >>> div');
         expect(await element.isVisible()).toBe(true);
-        await element.hover();
-        await page.mouse.move(0, 0);
         await new Promise(res => setTimeout(res, 2000));
         await page.waitForChanges();
         const snackbar = await page.find('b2b-snackbar');

package/dist/collection/components/snackbar/snackbar.js

@@ -14,6 +14,9 @@ export class SnackbarComponent {
         this.close = () => {
             this.opened = false;
             this.b2bClose.emit();
+            if (this.timed && this.type !== 'error') {
+                this.clearTimer();
+            }
         };
         this.isActionPresent = () => {
             return this.hasAction;
@@ -51,22 +54,25 @@ export class SnackbarComponent {
         this.width = undefined;
     }
     onVisibleChange(newValue) {
+        if (newValue) {
+            this.open();
+        }
+    }
+    componentWillLoad() {
+        this.onVisibleChange(this.opened);
+    }
+    open() {
         if (this.timed && this.type !== 'error') {
-            if (newValue) {
-                this.remainingTime = this.duration;
-                this.startTimer();
-            }
-            else {
-                this.clearTimer();
-            }
+            this.remainingTime = this.duration;
+            this.startTimer();
         }
     }
     startTimer() {
+        this.clearTimer();
         if (this.timed && this.type !== 'error') {
-            this.clearTimer();
             this.startTime = Date.now();
             this.timeoutId = window.setTimeout(() => {
-                this.opened = false;
+                this.close();
             }, this.remainingTime);
         }
     }
@@ -80,17 +86,17 @@ export class SnackbarComponent {
         clearTimeout(this.timeoutId);
     }
     render() {
-        return (h(Host, { key: '693f7639a65edfd76e101540ccd663cc3f533448', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("div", { key: 'f522b01889ee90866e2fd01036805139aa0f39df', class: {
+        return (h(Host, { key: 'b22311754d7186da6012cec8f82d251f3cbafd83', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("div", { key: '810bcfee20a5b9a88586ad1cb98c685819381847', class: {
                 'b2b-snackbar': true,
                 [`b2b-snackbar--${this.type}`]: true,
                 'b2b-snackbar--opened': this.opened,
-            }, style: this.width ? { width: this.width } : { width: 'auto' } }, h("div", { key: '3cafcd2cbff1203950ad15b038f0346e12232131', class: "b2b-snackbar__content" }, h("span", { key: '5811cd72a94d7ba281f3733dd9ed0281cb47c37f', class: { [`b2b-snackbar--${this.type}__icon`]: true } }, this.chooseIcon()), h("p", { key: '079f6ad5e83c365a224bc0c1f9862cd6409a7a6d', class: "b2b-snackbar__content__description" }, this.description)), this.isActionPresent() && (h("div", { class: {
+            }, style: this.width ? { width: this.width } : { width: 'auto' } }, h("div", { key: 'd8e5cb8e8cda32693ae68055cb06918f51f1688d', class: "b2b-snackbar__content" }, h("span", { key: '8e31a914129f255151569eaf0e806f337b085f6d', class: { [`b2b-snackbar--${this.type}__icon`]: true } }, this.chooseIcon()), h("p", { key: '3a6faa0dd08da3ea8f830bc59116ab50b574d770', class: "b2b-snackbar__content__description" }, this.description)), this.isActionPresent() && (h("div", { class: {
                 'b2b-snackbar__action': true,
                 [`b2b-snackbar__action--${this.type}`]: true,
-            }, onClick: this.handleActionClick }, h("a", null, this.actionLabel))), h("div", { key: '901aa5ad65f440e7de8a87e5a1fd88643b9766b6', class: {
+            }, onClick: this.handleActionClick }, h("a", null, this.actionLabel))), h("div", { key: '362ad1e19f9ea031f1ef5991da654d47a0a1f701', class: {
                 'b2b-snackbar__close-icon': true,
                 [`b2b-snackbar__close-icon--${this.type}`]: true,
-            }, onClick: this.close }, h("b2b-icon-100", { key: 'efd48b87b50a36d790f59bccfc3553a9d105adfd', clickable: true, size: 24, icon: "b2b_icon-close" })))));
+            }, onClick: this.close }, h("b2b-icon-100", { key: '1913c3bfc643fb845568c4388cdd300f6c3df8a7', clickable: true, size: 24, icon: "b2b_icon-close" })))));
     }
     static get is() { return "b2b-snackbar"; }
     static get encapsulation() { return "shadow"; }
@@ -156,7 +162,7 @@ export class SnackbarComponent {
                     "text": "Whether the snackbar is currently visible. Set to true to display the snackbar."
                 },
                 "attribute": "opened",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "false"
             },
             "timed": {

package/dist/collection/components/snackbar/snackbar.stories.js

@@ -21,7 +21,7 @@ const meta = {
     args: {
         type: 'info',
         description: `This is a snackbar`,
-        opened: true,
+        opened: false,
         timed: false,
         duration: 5000,
         hasAction: true,
@@ -38,12 +38,13 @@ const meta = {
         const hideSnackbar = async () => {
             updateArgs({ opened: false });
         };
-        return html ` <b2b-button variant="primary" @click=${showSnackBar}
+        return html ` <b2b-button @click=${showSnackBar} variant="primary"
         >Show Snackbar</b2b-button
       >
       <b2b-button @click=${hideSnackbar}>Hide Snackbar</b2b-button>
       <hr />
       <b2b-snackbar
+        @b2b-close=${hideSnackbar}
         description="${args.description}"
         type="${args.type}"
         opened="${args.opened}"
@@ -84,7 +85,7 @@ export const ErrorSnackbar = {
     },
 };
 export const TimedSnackbar = {
-    args: Object.assign(Object.assign({}, meta.args), { type: 'info', timed: true, duration: 3000, description: 'This is timed snackbar' }),
+    args: Object.assign(Object.assign({}, meta.args), { type: 'info', opened: true, timed: true, duration: 10000, description: 'This is timed snackbar' }),
     play: async () => {
         await showSnackBar();
     },

package/dist/collection/components/spinner/spinner.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/spinner/spinner.js

@@ -9,7 +9,7 @@ export class SpinnerComponent {
         this.color = 'primary';
     }
     render() {
-        return (h("div", { key: '8739a726fd4f0a51b87d51cab6a3f85264f1ed08', class: {
+        return (h("div", { key: '4260cc2e742b9d3a77fc1739f7de248ee70ffd69', class: {
                 'b2b-spinner': true,
                 ['b2b-spinner--size-' + this.size]: true,
                 ['b2b-spinner--color-' + this.color]: true,

package/dist/collection/components/tab/tab.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/tab/tab.js

@@ -17,12 +17,12 @@ export class B2bTabComponent {
         }
     }
     render() {
-        return (h(Host, { key: '12d81a324c80b9005c0ac9524fcfe5db9efb831d', 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: 'f7c39b2cd098336fa4808a0ab8830631dc3db7db', class: {
+        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: {
                 'b2b-tab': true,
                 'b2b-tab--selected': this.selected,
                 'b2b-tab--disabled': this.disabled,
                 'b2b-tab--error': this.invalid,
-            } }, h("slot", { key: 'd8066ec2d861a5d623e118a14a474af951d9ea70' }))));
+            } }, h("slot", { key: '87e0d4dc4f316d16efde95c2e9f4c9fa63db984d' }))));
     }
     static get is() { return "b2b-tab"; }
     static get encapsulation() { return "shadow"; }

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

@@ -121,7 +121,7 @@ export class B2bTabGroupComponent {
         });
     }
     render() {
-        return (h(Host, { key: '8324f8a2a6c8b77a048bab28d3a5382f27c07ce1' }, h("slot", { key: 'b97fc6fb827875d8f70bd0f6c8e4b01d9b57d098', name: "tab" }), h("b2b-separator", { key: 'b1b68f251b274afc40cdb9e2e79fe3410cd21063' }), h("slot", { key: '93587b074a6354d31b038a130ca35548f6803f43', name: "panel" })));
+        return (h(Host, { key: '82c0d22d7738ecbbe49dc358a81759da436389ea' }, h("slot", { key: '073c3086c66b28ee4d90e38dfc3920ca58deccfd', name: "tab" }), h("b2b-separator", { key: 'd9906b47b55895b61883767817cd761b10225dd0' }), h("slot", { key: 'f01db3ddcdcb289170dbb8865bf6873dd9442b60', name: "panel" })));
     }
     static get is() { return "b2b-tab-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tab-panel/tab-panel.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -5,7 +5,7 @@ export class B2bTabPanelComponent {
         this.generatedId = i++;
     }
     render() {
-        return (h(Host, { key: 'e4d4215b6795a66b2a944ef5d535552ef5adbba2', id: `b2b-tab-panel-${this.generatedId}`, role: "tabpanel" }, h("div", { key: '90736ddfab88b436b1b63cad2a69d8bbfcf3485d', class: "b2b-tab-panel" }, h("slot", { key: '11793052ee41b883a968e0d667ff44c9c30b73aa' }))));
+        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' }))));
     }
     static get is() { return "b2b-tab-panel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-cell/table-cell.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/table/table-cell/table-cell.js

@@ -36,14 +36,14 @@ export class TableCellComponent {
         }
     }
     render() {
-        return (h(Host, { key: 'c9054312fdf96b346c6ed6633845b676471ee1e6', onMouseEnter: this.addExpandStyles, onMouseLeave: this.removeExpandStyles, class: {
+        return (h(Host, { key: '571ec5bc494057bfbe9c9146da086bb6a192f298', 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: 'f05c8ea4484ce55c6f08a85034883fe74051638f' })));
+            }, role: "cell" }, h("slot", { key: '10385f497f0061d09b227b88456205bac24f272f' })));
     }
     static get is() { return "b2b-table-cell"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-header/table-header.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/table/table-header/table-header.js

@@ -72,7 +72,7 @@ export class TableHeaderComponent {
         this.setIconPlacement();
     }
     render() {
-        return (h(Host, { key: 'e6604084cded7295c561d2ddcb443fa4ac890a96', class: {
+        return (h(Host, { key: '34f96e3a7c5c36cafadb463a72f1acec6550d367', class: {
                 [`b2b-table-header--${this.sortDirection && this.iconAlign}`]: true,
                 'b2b-table-header--divider': this.divider,
                 [`b2b-table-header--${this.size}`]: true,

package/dist/collection/components/table/table-row/table-row.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -110,12 +110,12 @@ export class TableRowComponent {
         }
     }
     render() {
-        return (h(Host, { key: 'e2986d793ab548b9452aded06773b63c86db8375', class: {
+        return (h(Host, { key: '9a5b7dad23904822431e478a2cba8afd65d41d49', 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: '72962668970275a6e00cd99c98871241f6fd2956' })));
+            }, role: "row" }, this.getAccordionColumns(), this.getCheckbox(), h("slot", { key: 'ce9384518ed7337c3e0bd6e22a8b206af8a7452e' })));
     }
     static get is() { return "b2b-table-row"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-rowgroup/table-rowgroup.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -113,11 +113,11 @@ export class TableRowgroupComponent {
         this.makeHeaderRowNotSelectable();
     }
     render() {
-        return (h(Host, { key: '5f69a02dde8828439de23f661b3237c8cd2061da', class: {
+        return (h(Host, { key: '13fd30394de031e092fba44f9321c87a3e8429ec', 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: '4df0d32b50e5c4dccee61cfd39d44da34c37960a' })));
+            }, role: "rowgroup" }, h("slot", { key: '7858dfcb69a29d791bd419a30b9cc4f95e3b2280' })));
     }
     static get is() { return "b2b-table-rowgroup"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/table/table.js

@@ -60,9 +60,9 @@ export class TableComponent {
         }
     }
     render() {
-        return (h(Host, { key: '065f6cb66e8195bd73258b636585ef26acb9f0ac', class: {
+        return (h(Host, { key: '70f900f2160167e3f808c9c432cfa3bb134624c0', class: {
                 ['b2b-table--' + this.size]: true,
-            }, role: "table" }, h("slot", { key: 'f9d9ab1c60c408d0c3931d31bb05d645e6744038' })));
+            }, role: "table" }, h("slot", { key: 'c0b35190bb004dd3332e3b2bb856e30a1adee829' })));
     }
     static get is() { return "b2b-table"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/textarea/textarea.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/textarea/textarea.js

@@ -45,10 +45,10 @@ export class B2BTextareaComponent {
         }
     }
     render() {
-        return (h(Host, { key: 'dd2881928405f65eb0e6e142c4241a0f985053bc', class: {
+        return (h(Host, { key: 'adf829a538a8234008981a3f1a56d5f370b859ec', 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: '05a53ba78cef9e2558226d99a04eefeed3b1a549', 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: '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.hint !== undefined && this.disabled) ? (h("span", null, this.hint)) : (''), this.error !== undefined && this.invalid && !this.disabled ? (h("span", null, this.error)) : ('')));
     }
     static get is() { return "b2b-textarea"; }

package/dist/collection/components/toggle-button/toggle-button.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -31,13 +31,13 @@ export class B2bToggleButtonComponent {
         return Array.from(document.querySelectorAll(`b2b-toggle-button[name="${this.name}"]`)).filter((toggle) => toggle.value !== this.value);
     }
     render() {
-        return (h(Host, { key: '255ef8569e3f8ef1bb9bbb5c48a423dbadcb2f72', onClick: this.onClick }, h("span", { key: '1511b7dc188f7e9285d4d443500b8b0551c7956d', class: {
+        return (h(Host, { key: '72a27c904d091619da19fb5dab2da588326688df', onClick: this.onClick }, h("span", { key: '165c0254153fa4a3bff6d76f58f844830344f8c2', class: {
                 'b2b-toggle-button': true,
                 'b2b-toggle-button--disabled': this.disabled,
-            } }, h("input", { key: '0cfccff92c1470e2d3e62ee9c09bed049e5ba2f6', tabindex: 0, class: {
+            } }, h("input", { key: '0d6ee278d5db9f360e7ab466daeaebced17063e6', 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: 'f99e5fce510f5979b5281b24616000d80f80c457', 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: 'f073f01258465886c9fe70e99692ffee84db38bc', 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/collection/components/toggle-chip/toggle-chip.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -32,11 +32,11 @@ export class B2BToggleChipComponent {
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: '3eed467bbc6068073c8bd601115fc54b3b6f3fe0' }, h("span", { key: '4a94f8cb72a4f129df07b39c0676b7a51b309d77', onClick: this.onClick, onKeyDown: this.onKeyDown, class: {
+        return (h(Host, { key: 'f1666274891d2a73ec37becece45d1b756bc7510' }, h("span", { key: '3ac8a839ad72f507a091863d06ee7620ea4795d1', onClick: this.onClick, onKeyDown: this.onKeyDown, class: {
                 'b2b-toggle-chip': true,
-            } }, h("input", { key: '38d66b138ffc4215fe22d430c3c396f09c763a86', "aria-labelledby": this.name, tabindex: this.disabled ? -1 : 0, class: {
+            } }, h("input", { key: '6233e0b013d8136768f46f771ecc76bbfd663794', "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: '3b29bd1cfb6d0387715d8d151f024dc369071a47', 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: 'b100606b6bba9648d00b2660de654d045dc8aa85', id: this.name, tabIndex: -1, class: {
                 'b2b-toggle-chip__label': true,
                 'b2b-toggle-chip__label--active': this.active && !this.disabled,
                 'b2b-toggle-chip__label--disabled': this.disabled,

package/dist/collection/components/toggle-group/toggle-group.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -45,10 +45,10 @@ export class B2BToggleGroup {
         }
     }
     render() {
-        return (h(Host, { key: '2736df48eff433ad9040e2cad8668b1a08e97c25' }, h("div", { key: '32c10360a73e3c901d4b244ed9584290365b70b1', class: {
+        return (h(Host, { key: 'e81f98de29ab06594da8b9e19e68f4ec9f3c878f' }, h("div", { key: 'a590585c94ab40ea54abd08031ab9b1482bc4a78', class: {
                 'b2b-toggle-group': true,
                 'b2b-toggle-group--disabled': this.disabled,
-            } }, h("fieldset", { key: '053f62bdb8a5293b2c5e9f8e55686181726f6870' }, h("slot", { key: 'a25c46e0def62b2bf31228e350eaf2d78580b661' })))));
+            } }, h("fieldset", { key: 'f8a20fb30c7b5fd958171f91a2219a2efbd7a5ca' }, h("slot", { key: '3e0bc10d09053d008a9d771721c57463ce437e27' })))));
     }
     static get is() { return "b2b-toggle-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toggle-switch/toggle-switch.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -124,7 +124,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 03 Apr 2025 08:28:50 GMT
+ * Generated on Tue, 29 Apr 2025 06:54:24 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -38,17 +38,17 @@ export class B2bToggleSwitchComponent {
     render() {
         // workaround for purgecss as safelist doesn't work
         const isLeft = this.labelPosition === 'left';
-        return (h(Host, { key: '75acfc0ca73754d89f4fb2400de58c4684177bb1' }, h("div", { key: '8c3ba099e53c97877391b19cbf75f6e2a767cc8b', class: {
+        return (h(Host, { key: 'ead51ac66423aad33f3714724dd943f76c9a5a2d' }, h("div", { key: 'bd253f3dac1128d188d1fcee84fd35c1dcb07a2d', class: {
                 'b2b-toggle': true,
                 'b2b-toggle--disabled': this.disabled,
                 'b2b-toggle--checked': this.state,
-            } }, h("div", { key: '400f2c983e0583087e6d44d10885bfd433128bea', class: {
+            } }, h("div", { key: '69f605ce7363e4aa7aa89b0783721ae30c8897ca', class: {
                 'b2b-toggle__label': true,
                 'b2b-toggle__label--left': isLeft,
-            } }, h("span", { key: 'fc8a40bc9e89a506482df840f6ded6d9417e3424', class: "b2b-toggle__switch", role: "switch", tabIndex: 0, onKeyDown: this.onKeyDown, onClick: this.onClick }, h("svg", { key: 'b8dc5e77008cd4c50b2add85696367e9911b1a49', class: {
+            } }, h("span", { key: 'b52b3852d95df99a32aa095532d7fe6897e7b638', class: "b2b-toggle__switch", role: "switch", tabIndex: 0, onKeyDown: this.onKeyDown, onClick: this.onClick }, h("svg", { key: 'c8752f6668e05da681f6682e604441fdac6b1365', 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: '5f858db03eccfcd5b5c93f1d0fd4cfbb502b49e5', 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: '09d63539b5f10f54089658ea44fa081bbd3fceb7', 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))))));