@otto-de/b2b-core-components 1.18.0 → 1.20.0

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

@@ -1,19 +1,28 @@
 import { html } from "lit-html";
 import { getArgTypes } from "../../docs/config/utils";
-const Template = ({ href, active }) => {
-    return html ` <b2b-breadcrumb>
-    <b2b-breadcrumb-item href="${href}">Start</b2b-breadcrumb-item>
-    <b2b-breadcrumb-item>Weiter</b2b-breadcrumb-item>
-    <b2b-breadcrumb-item active="${active}">Ende</b2b-breadcrumb-item>
-  </b2b-breadcrumb>`;
+const Template = ({ href, active, paddingTop, paddingBottom }) => {
+    return html `
+    <b2b-breadcrumb
+      padding-top="${paddingTop}"
+      padding-bottom="${paddingBottom}">
+      <b2b-breadcrumb-item href="${href}">Start</b2b-breadcrumb-item>
+      <b2b-breadcrumb-item>Weiter</b2b-breadcrumb-item>
+      <b2b-breadcrumb-item active="${active}">Ende</b2b-breadcrumb-item>
+    </b2b-breadcrumb>
+  `;
 };
 const defaultArgs = {
     href: 'https://www.otto.de',
     active: true,
+    paddingTop: 0, // Default padding top in px
+    paddingBottom: 0, // Default padding bottom in px
 };
 export const story010Default = Template.bind({});
 story010Default.args = Object.assign({}, defaultArgs);
 story010Default.storyName = 'Default Breadcrumb';
+export const story020PaddingTopBottom = Template.bind({});
+story020PaddingTopBottom.args = Object.assign(Object.assign({}, defaultArgs), { paddingTop: 10, paddingBottom: 15 });
+story020PaddingTopBottom.storyName = 'Custom Padding';
 const breadcrumbArgs = getArgTypes('b2b-breadcrumb');
 export default {
     title: 'Components/Interaction/Breadcrumb',

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/card/card.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/checkbox/checkbox.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -27,4 +27,10 @@ describe('b2b-checkbox', () => {
         await page.waitForChanges();
         expect(element).toHaveClass('b2b-checkbox--checked');
     });
+    it('use label slot if provided', async () => {
+        const page = await newE2EPage();
+        await page.setContent('<b2b-checkbox><span slot="label">Custom label</span></b2b-checkbox>');
+        const element = await page.find('span');
+        expect(element).toEqualText('Custom label');
+    });
 });

package/dist/collection/components/checkbox/checkbox.js

@@ -72,7 +72,7 @@ export class CheckboxComponent {
                 'b2b-checkbox--checked': this.checked,
                 'b2b-checkbox--standalone': this.standalone,
                 'b2b-checkbox--indeterminate': this.indeterminate,
-            } }, h("div", { key: '29a99d41fca9d51aea5ac58feb92910f10d58e46', class: "b2b-checkbox-items" }, this.renderIcon(), h("input", { key: 'a05a1ba84a49d775a887e393ade4a5c2ce993273', class: "b2b-checkbox__input", "aria-labelledby": this.name, type: "checkbox", name: this.name, id: this.name, value: this.value, checked: this.checked, disabled: this.disabled || this.groupDisabled, onFocus: this.onFocus, onBlur: this.onBlur }), !this.standalone && (h("b2b-input-label", { id: this.name, required: this.required, disabled: this.disabled }, this.label))), (this.hint !== undefined && !this.invalid) ||
+            } }, h("div", { key: 'dab97157c87fbc3a9599355113b930039afeb1d0', class: "b2b-checkbox__items" }, this.renderIcon(), h("input", { key: '253f9206dc69ce6c404c7e4b3c260da6772d2786', class: "b2b-checkbox__input", "aria-labelledby": this.name, type: "checkbox", name: this.name, id: this.name, value: this.value, checked: this.checked, disabled: this.disabled || this.groupDisabled, onFocus: this.onFocus, onBlur: this.onBlur }), !this.standalone && (h("b2b-input-label", { id: this.name, required: this.required, disabled: this.disabled }, h("slot", { 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)) : (''))));
     }
     static get is() { return "b2b-checkbox"; }

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

@@ -41,6 +41,11 @@ story050Disabled.storyName = 'Disabled';
 export const story060Required = Template.bind({});
 story060Required.args = Object.assign(Object.assign({}, defaultArgs), { label: 'Required checkbox', required: true });
 story060Required.storyName = 'Required';
+export const story070LabelSlot = {
+    args: Object.assign({}, defaultArgs),
+    render: ({}) => html `<b2b-checkbox><span slot="label">Label Slot</span></b2b-input>`,
+};
+story070LabelSlot.storyName = 'Label slot';
 const controls = {};
 const inputCheckboxArgs = getArgTypes('b2b-checkbox', controls);
 export default {

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/chip/chip.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/date-picker/date-picker-days-header.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/date-picker/date-picker-days.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */
@@ -253,7 +253,6 @@
   color: var(--b2b-color-white-100);
   pointer-events: none;
   width: 100%;
-  height: 100%;
 }
 .b2b-date-picker-days .b2b-date-picker-day--focussed {
   background-color: var(--b2b-color-hover);

package/dist/collection/components/date-picker/date-picker-header.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/date-picker/date-picker-months.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/date-picker/date-picker-years.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/date-picker/date-picker.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */
@@ -217,7 +217,7 @@
 }
 :host .b2b-date-picker {
   position: relative;
-  z-index: 1000;
+  z-index: 300;
 }
 :host .b2b-date-picker__backdrop {
   position: fixed;
@@ -263,7 +263,7 @@
   margin-left: 0;
   padding-left: 0;
   height: 100%;
-  width: 15%;
+  width: 100%;
   color: var(--b2b-color-black-100);
   font-size: var(--b2b-size-35);
   line-height: var(--b2b-size-copy-line-height-100);
@@ -306,7 +306,7 @@
   padding-bottom: var(--b2b-size-40);
   outline: none;
   background-color: var(--b2b-color-white-100);
-  z-index: 900;
+  z-index: 200;
 }
 :host .b2b-date-picker-body--hidden {
   display: none;

package/dist/collection/components/date-picker/date-picker.js

@@ -18,6 +18,9 @@ export class B2bDatePicker {
             event.target.value = value;
             if (value.length === 10) {
                 this.parseDateInput(value);
+                if (this.invalid) {
+                    this.showDatePicker = false;
+                }
             }
         };
         this.handleKeyDown = (event) => {
@@ -120,6 +123,7 @@ export class B2bDatePicker {
         this.focused = false;
     }
     getPreviousMonth() {
+        this.invalid = false;
         if (this.selectedMonth === 0) {
             this.setCurrentMonth(11);
             this.setCurrentYear(this.selectedYear - 1);
@@ -136,7 +140,6 @@ export class B2bDatePicker {
         }
         if (!regex.test(dateString)) {
             this.invalid = true;
-            this.showDatePicker = false;
             this.errorMessage = this.FORMATTING_ERROR_MESSAGE;
             return;
         }
@@ -151,7 +154,6 @@ export class B2bDatePicker {
             this.setSelectedDateForDisplay();
         }
         else {
-            this.showDatePicker = false;
             this.invalid = true;
             this.focused = false;
             this.selectedDay = this.todayWithoutTime.getDate();
@@ -161,9 +163,13 @@ export class B2bDatePicker {
     }
     isValidDate(day, month, year) {
         const date = new Date(year, month - 1, day);
-        const isValidDay = day > 0 && day <= 31;
-        const isValidMonth = month > 0 && month <= 12;
-        const isValidYear = year > 0;
+        const isValidDay = date.getDate() === day;
+        const isValidMonth = date.getMonth() + 1 === month;
+        const isValidYear = date.getFullYear() === year && year >= 1900 && year <= 2100;
+        if (!isValidDay || !isValidMonth || !isValidYear) {
+            this.errorMessage = this.DISABLED_DATE_ERROR_MESSAGE;
+            return false;
+        }
         let isValidRange = true;
         if (this.disablePastDates && date < this.todayWithoutTime) {
             this.errorMessage = this.DISABLED_DATE_ERROR_MESSAGE;
@@ -177,7 +183,7 @@ export class B2bDatePicker {
             this.errorMessage = this.DISABLED_DATE_ERROR_MESSAGE;
             isValidRange = false;
         }
-        return isValidDay && isValidMonth && isValidYear && isValidRange;
+        return isValidRange;
     }
     emitSelectedDate() {
         this.b2bSelected.emit({
@@ -197,6 +203,7 @@ export class B2bDatePicker {
         this.invalid = false;
     }
     getNextMonth() {
+        this.invalid = false;
         if (this.selectedMonth === 11) {
             this.setCurrentMonth(0);
             this.setCurrentYear(this.selectedYear + 1);
@@ -246,6 +253,12 @@ export class B2bDatePicker {
             closeIcon.focus();
         }
     }
+    handleFocusOut() {
+        if (this.userInputDate === '' || this.invalid) {
+            return;
+        }
+        this.parseDateInput(this.userInputDate);
+    }
     moveFocusToInputComponent() {
         const inputElement = this.host.shadowRoot.querySelector('input.b2b-date-picker-input');
         if (inputElement !== undefined && !this.invalid) {
@@ -263,18 +276,19 @@ export class B2bDatePicker {
         }
     }
     render() {
-        return (h(Host, { key: 'd15a38cafce3ebd3ff46af901b2500f6aabb0d18' }, h("div", { key: 'c9f85e00fb6cc3a8faa2805db6748be2e482270e', class: "b2b-date-picker" }, h("div", { key: '3f5e66b7e99b46c8d94ac75361929ed92e49bb00', class: "b2b-date-picker-label" }, this.label), h("div", { key: '73b43cb76b8b64c5398e0a0ca644c2545b6a83bd', class: {
+        return (h(Host, { key: '8c47388da5b4d322847338e17106f6421e570f94' }, h("div", { key: 'a5c01d164a0fd8555df6ee8cd01380072832bc8a', class: "b2b-date-picker" }, h("div", { key: 'ce234fe5588126890b384d742c5fe9cc6482e298', class: "b2b-date-picker-label" }, this.label), h("div", { key: '017889d17ab599540bb4db90b25b90bad1c37f2e', class: {
                 'b2b-date-picker-input-wrapper': true,
                 'b2b-date-picker-input-wrapper--focused': this.focused || this.showDatePicker,
                 'b2b-date-picker-input-wrapper--error': this.invalid,
-            } }, h("div", { key: '67840404495817b9b506dd2cb72ecad8103e694c', class: "b2b-date-picker-input-focus-wrapper", onClick: () => {
+            } }, h("div", { key: 'dbb4c054fd05e75d4fd51cf37d8771062bfc4501', class: "b2b-date-picker-input-focus-wrapper", onClick: () => {
                 this.moveFocusToInputComponent();
-            } }, h("input", { key: 'b00fc707d2aafcf328c7207625303723463d5b98', type: "text", tabindex: 0, class: {
+            } }, h("input", { key: 'f4e4a9a6ba7304d12d3e84290647df5d1e7acd15', type: "text", tabindex: 0, class: {
                 'b2b-date-picker-input': true,
                 'b2b-date-picker-input--error': this.invalid,
             }, value: this.userInputDate, onInput: this.handleInputChange, onKeyDown: this.handleKeyDown, onFocus: this.handleInputFocus, onBlur: () => {
                 this.focused = false;
-            } })), h("div", { key: 'a68a1143b3caf59acea3ebc60ac79032078c8151', class: "b2b-icons" }, this.userInputDate && (h("div", { tabIndex: 0, onClick: () => {
+                this.handleFocusOut();
+            } })), h("div", { key: 'c604c6f2908bc9d96f0f489fd4758e0fe6c8e5f9', class: "b2b-icons" }, this.userInputDate && (h("div", { tabIndex: 0, onClick: () => {
                 this.invalid = false;
                 this.clearDateInput();
             }, class: "b2b-close-icon", onKeyDown: event => {
@@ -282,7 +296,7 @@ export class B2bDatePicker {
                     this.invalid = false;
                     this.clearDateInput();
                 }
-            } }, h("b2b-icon", { icon: "b2b_icon-close", "aria-label": "clear input", clickable: true }))), h("div", { key: '3b8281645b3ddebeeb317a85b0e46ed3929604bb', tabindex: 0, onClick: () => {
+            } }, h("b2b-icon", { icon: "b2b_icon-close", "aria-label": "clear input", clickable: true }))), h("div", { key: 'c3e12e0904a2ee72ff672415e49e0ebaa48e46d9', tabindex: 0, onClick: () => {
                 if (this.invalid) {
                     this.invalid = false;
                 }
@@ -294,9 +308,9 @@ export class B2bDatePicker {
                     }
                     this.showHideDatePicker();
                 }
-            }, class: "b2b-event-icon" }, h("b2b-icon", { key: 'be4431c9059fafd5dcf5aedb0140944e822ccccc', "aria-label": this.showDatePicker
+            }, class: "b2b-event-icon" }, h("b2b-icon", { key: 'a38cbfb24b84ca95bcd2507357e3e003cd5fd708', "aria-label": this.showDatePicker
                 ? 'close date picker'
-                : 'open date picker', icon: "b2b_icon-event", clickable: true }))))), h("div", { key: 'e3c641e8f775a5626cdf14acaa7149af127aa46f', class: {
+                : 'open date picker', icon: "b2b_icon-event", clickable: true }))))), h("div", { key: 'addb043cc83121ad0e70611a1621f95d473f7cd1', class: {
                 'b2b-date-picker-body': true,
                 'b2b-date-picker-body--hidden': !this.showDatePicker,
             } }, this.datePickerView === DatePickerView.Days && (h("div", null, h("b2b-date-picker-header", { selectedMonth: this.selectedMonth, selectedYear: this.selectedYear }), h("b2b-date-picker-days-header", null), h("b2b-date-picker-days", { selectedMonth: this.selectedMonth, selectedYear: this.selectedYear, selectedDay: this.selectedDay, disableWeekends: this.disableWeekends, disableFutureDates: this.disableFutureDates, disablePastDates: this.disablePastDates }))), this.datePickerView === DatePickerView.Months && (h("b2b-date-picker-months", { selectedMonth: this.selectedMonth })), this.datePickerView === DatePickerView.Years && (h("b2b-date-picker-years", { selectedYear: this.selectedYear }))), this.showDatePicker && (h("div", { class: "b2b-date-picker__backdrop", onClick: this.handleBackdropDismiss })), !this.showDatePicker && (h("span", { class: {

package/dist/collection/components/dropdown/dropdown.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/flyout-menu/flyout-menu-option.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/flyout-menu/flyout-menu.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/headline/headline.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/icon/icon.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/icon-100/icon-100.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/icon-50/icon-50.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 08 Nov 2024 12:23:19 GMT
+ * Generated on Thu, 12 Dec 2024 07:14:23 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/icon-50/icons-50/b2b_icon-arrow-down.svg

@@ -1,3 +1,4 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M10.3765 4.17133C10.1939 3.96235 9.87747 3.94184 9.67092 4.12397L6.00002 7.33637L2.32913 4.12787C2.12161 3.94623 1.8052 3.96576 1.62356 4.17524C1.44192 4.38324 1.46292 4.69916 1.67092 4.8808L5.67092 8.3769C5.76516 8.45942 5.88284 8.50043 6.00002 8.50043C6.1177 8.50043 6.23489 8.45942 6.32913 8.3769L10.3291 4.8769C10.5371 4.69477 10.5581 4.37885 10.3765 4.17133Z" fill="#222222"/>
+<path d="M10.3765 4.17133C10.1939 3.96235 9.87747 3.94184 9.67092 4.12397L6.00002 7.33637L2.32913 4.12787C2.12161 3.94623 1.8052 3.96576 1.62356 4.17524C1.44192 4.38324 1.46292 4.69916 1.67092 4.8808L5.67092 8.3769C5.76516 8.45942 5.88284 8.50043 6.00002 8.50043C6.1177 8.50043 6.23489 8.45942 6.32913 8.3769L10.3291 4.8769C10.5371 4.69477 10.5581 4.37885 10.3765 4.17133Z"/>
 </svg>
+

package/dist/collection/components/icon-50/icons-50/b2b_icon-arrow-left.svg

@@ -1,3 +1,4 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M4.66406 6.00072L7.87646 2.32982C8.05811 2.1223 8.03711 1.80638 7.8291 1.62425C7.62158 1.44213 7.30566 1.46215 7.12354 1.67162L3.62354 5.67162C3.45898 5.86009 3.45898 6.14134 3.62354 6.32982L7.11963 10.3298C7.21826 10.4431 7.35693 10.5007 7.49609 10.5007C7.61328 10.5007 7.73047 10.4602 7.8252 10.3772C8.0332 10.1955 8.0542 9.87963 7.87256 9.67162L4.66406 6.00072Z" fill="#222222"/>
+<path d="M4.66406 6.00072L7.87646 2.32982C8.05811 2.1223 8.03711 1.80638 7.8291 1.62425C7.62158 1.44213 7.30566 1.46215 7.12354 1.67162L3.62354 5.67162C3.45898 5.86009 3.45898 6.14134 3.62354 6.32982L7.11963 10.3298C7.21826 10.4431 7.35693 10.5007 7.49609 10.5007C7.61328 10.5007 7.73047 10.4602 7.8252 10.3772C8.0332 10.1955 8.0542 9.87963 7.87256 9.67162L4.66406 6.00072Z"/>
 </svg>
+

package/dist/collection/components/icon-50/icons-50/b2b_icon-arrow-right.svg

@@ -1,3 +1,4 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M8.37646 5.67162L4.87646 1.67162C4.69335 1.46215 4.37744 1.44213 4.17089 1.62425C3.96288 1.80638 3.94189 2.1223 4.12353 2.32982L7.33593 6.00072L4.12744 9.67162C3.94579 9.87963 3.96679 10.1955 4.1748 10.3772C4.26953 10.4602 4.38671 10.5007 4.5039 10.5007C4.64306 10.5007 4.78173 10.4426 4.88037 10.3298L8.37646 6.32982C8.54101 6.14134 8.54101 5.86009 8.37646 5.67162Z" fill="#222222"/>
+<path d="M8.37646 5.67162L4.87646 1.67162C4.69335 1.46215 4.37744 1.44213 4.17089 1.62425C3.96288 1.80638 3.94189 2.1223 4.12353 2.32982L7.33593 6.00072L4.12744 9.67162C3.94579 9.87963 3.96679 10.1955 4.1748 10.3772C4.26953 10.4602 4.38671 10.5007 4.5039 10.5007C4.64306 10.5007 4.78173 10.4426 4.88037 10.3298L8.37646 6.32982C8.54101 6.14134 8.54101 5.86009 8.37646 5.67162Z"/>
 </svg>
+

package/dist/collection/components/icon-50/icons-50/b2b_icon-arrow-up.svg

@@ -1,3 +1,4 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M10.3291 7.12842L6.32913 3.62842C6.14114 3.46338 5.86038 3.4624 5.67092 3.62842L1.67092 7.12451C1.46291 7.30615 1.44192 7.62207 1.62356 7.83008C1.8052 8.03857 2.12161 8.05859 2.32913 7.87744L6.00002 4.66895L9.67092 7.88135C9.76565 7.96436 9.88284 8.00488 10 8.00488C10.1392 8.00488 10.2774 7.94727 10.3765 7.83398C10.5581 7.62647 10.5371 7.31055 10.3291 7.12842Z" fill="#222222"/>
+<path d="M10.3291 7.12842L6.32913 3.62842C6.14114 3.46338 5.86038 3.4624 5.67092 3.62842L1.67092 7.12451C1.46291 7.30615 1.44192 7.62207 1.62356 7.83008C1.8052 8.03857 2.12161 8.05859 2.32913 7.87744L6.00002 4.66895L9.67092 7.88135C9.76565 7.96436 9.88284 8.00488 10 8.00488C10.1392 8.00488 10.2774 7.94727 10.3765 7.83398C10.5581 7.62647 10.5371 7.31055 10.3291 7.12842Z"/>
 </svg>
+

package/dist/collection/components/icon-50/icons-50/b2b_icon-basket.svg

@@ -1,4 +1,5 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M9.96338 1.43604C9.93115 1.18652 9.71875 1 9.46729 1H2.5332C2.28174 1 2.06934 1.18652 2.03711 1.43604L1.00391 9.43604C0.98584 9.57861 1.02979 9.72217 1.12451 9.83008C1.21924 9.93799 1.35645 10 1.5 10H10.5C10.6436 10 10.7808 9.93799 10.8755 9.83008C10.9702 9.72217 11.0142 9.57861 10.9961 9.43604L9.96338 1.43604ZM2.06885 9L2.97266 2H9.02783L9.93115 9H2.06885Z" fill="#222222"/>
-<path d="M7.50049 3C7.22412 3 7.00049 3.22363 7.00049 3.5C7.00049 4.23828 6.46191 4.5 6.00049 4.5C5.53906 4.5 5.00049 4.23828 5.00049 3.5C5.00049 3.22363 4.77686 3 4.50049 3C4.22412 3 4.00049 3.22363 4.00049 3.5C4.00049 4.271 4.34668 4.74072 4.63721 4.99854C5.00049 5.32178 5.48486 5.5 6.00049 5.5C6.99414 5.5 8.00049 4.81299 8.00049 3.5C8.00049 3.22363 7.77686 3 7.50049 3Z" fill="#222222"/>
+<path d="M9.96338 1.43604C9.93115 1.18652 9.71875 1 9.46729 1H2.5332C2.28174 1 2.06934 1.18652 2.03711 1.43604L1.00391 9.43604C0.98584 9.57861 1.02979 9.72217 1.12451 9.83008C1.21924 9.93799 1.35645 10 1.5 10H10.5C10.6436 10 10.7808 9.93799 10.8755 9.83008C10.9702 9.72217 11.0142 9.57861 10.9961 9.43604L9.96338 1.43604ZM2.06885 9L2.97266 2H9.02783L9.93115 9H2.06885Z"/>
+<path d="M7.50049 3C7.22412 3 7.00049 3.22363 7.00049 3.5C7.00049 4.23828 6.46191 4.5 6.00049 4.5C5.53906 4.5 5.00049 4.23828 5.00049 3.5C5.00049 3.22363 4.77686 3 4.50049 3C4.22412 3 4.00049 3.22363 4.00049 3.5C4.00049 4.271 4.34668 4.74072 4.63721 4.99854C5.00049 5.32178 5.48486 5.5 6.00049 5.5C6.99414 5.5 8.00049 4.81299 8.00049 3.5C8.00049 3.22363 7.77686 3 7.50049 3Z"/>
 </svg>
+

package/dist/collection/components/icon-50/icons-50/b2b_icon-check.svg

@@ -1,3 +1,4 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M10.8584 3.15143C10.6656 2.95416 10.3496 2.9483 10.1514 3.14166L4.34671 8.78766L1.8638 6.1568C1.67435 5.9566 1.35745 5.94781 1.15677 6.13629C0.956085 6.32623 0.946807 6.64264 1.13626 6.84332L3.9678 9.84332C4.06009 9.94049 4.18704 9.99713 4.32083 10.0001C4.32425 10.0001 4.32816 10.0001 4.33157 10.0001C4.46146 10.0001 4.58694 9.94928 4.68021 9.85846L10.8487 3.85846C11.0464 3.66607 11.0508 3.34918 10.8584 3.15143Z" fill="#222222"/>
+<path d="M10.8584 3.15143C10.6656 2.95416 10.3496 2.9483 10.1514 3.14166L4.34671 8.78766L1.8638 6.1568C1.67435 5.9566 1.35745 5.94781 1.15677 6.13629C0.956085 6.32623 0.946807 6.64264 1.13626 6.84332L3.9678 9.84332C4.06009 9.94049 4.18704 9.99713 4.32083 10.0001C4.32425 10.0001 4.32816 10.0001 4.33157 10.0001C4.46146 10.0001 4.58694 9.94928 4.68021 9.85846L10.8487 3.85846C11.0464 3.66607 11.0508 3.34918 10.8584 3.15143Z"/>
 </svg>
+

package/dist/collection/components/icon-50/icons-50/b2b_icon-close.svg

@@ -1,3 +1,4 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M6.70703 6L9.85352 2.85352C10.0488 2.6582 10.0488 2.3418 9.85352 2.14648C9.6582 1.95117 9.3418 1.95117 9.14648 2.14648L6 5.29297L2.85352 2.14648C2.6582 1.95117 2.3418 1.95117 2.14648 2.14648C1.95117 2.3418 1.95117 2.6582 2.14648 2.85352L5.29297 6L2.14648 9.14648C1.95117 9.3418 1.95117 9.6582 2.14648 9.85352C2.24414 9.95117 2.37207 10 2.5 10C2.62793 10 2.75586 9.95117 2.85352 9.85352L6 6.70703L9.14648 9.85352C9.24414 9.95117 9.37207 10 9.5 10C9.62793 10 9.75586 9.95117 9.85352 9.85352C10.0488 9.6582 10.0488 9.3418 9.85352 9.14648L6.70703 6Z" fill="#222222"/>
+<path d="M6.70703 6L9.85352 2.85352C10.0488 2.6582 10.0488 2.3418 9.85352 2.14648C9.6582 1.95117 9.3418 1.95117 9.14648 2.14648L6 5.29297L2.85352 2.14648C2.6582 1.95117 2.3418 1.95117 2.14648 2.14648C1.95117 2.3418 1.95117 2.6582 2.14648 2.85352L5.29297 6L2.14648 9.14648C1.95117 9.3418 1.95117 9.6582 2.14648 9.85352C2.24414 9.95117 2.37207 10 2.5 10C2.62793 10 2.75586 9.95117 2.85352 9.85352L6 6.70703L9.14648 9.85352C9.24414 9.95117 9.37207 10 9.5 10C9.62793 10 9.75586 9.95117 9.85352 9.85352C10.0488 9.6582 10.0488 9.3418 9.85352 9.14648L6.70703 6Z"/>
 </svg>
+

package/dist/collection/components/icon-50/icons-50/b2b_icon-delete.svg

@@ -1,6 +1,7 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M4.5 9C4.77637 9 5 8.77637 5 8.5V4.5C5 4.22363 4.77637 4 4.5 4C4.22363 4 4 4.22363 4 4.5V8.5C4 8.77637 4.22363 9 4.5 9Z" fill="#222222"/>
-<path d="M6.5 9C6.77637 9 7 8.77637 7 8.5V4.5C7 4.22363 6.77637 4 6.5 4C6.22363 4 6 4.22363 6 4.5V8.5C6 8.77637 6.22363 9 6.5 9Z" fill="#222222"/>
-<path d="M8.5 9C8.77637 9 9 8.77637 9 8.5V4.5C9 4.22363 8.77637 4 8.5 4C8.22363 4 8 4.22363 8 4.5V8.5C8 8.77637 8.22363 9 8.5 9Z" fill="#222222"/>
-<path d="M11.5 1H7.9989L8 0.994629V0.494629C8 0.218262 7.77637 -0.00537109 7.5 -0.00537109H5.5C5.22363 -0.00537109 5 0.218262 5 0.494629V0.994629L5.0011 1H1.5C1.22363 1 1 1.22363 1 1.5C1 1.77637 1.22363 2 1.5 2H2V11.5C2 11.7764 2.22363 12 2.5 12H10.5C10.7764 12 11 11.7764 11 11.5V2H11.5C11.7764 2 12 1.77637 12 1.5C12 1.22363 11.7764 1 11.5 1ZM10 11H3V2.00537H10V11Z" fill="#222222"/>
+<path d="M4.5 9C4.77637 9 5 8.77637 5 8.5V4.5C5 4.22363 4.77637 4 4.5 4C4.22363 4 4 4.22363 4 4.5V8.5C4 8.77637 4.22363 9 4.5 9Z"/>
+<path d="M6.5 9C6.77637 9 7 8.77637 7 8.5V4.5C7 4.22363 6.77637 4 6.5 4C6.22363 4 6 4.22363 6 4.5V8.5C6 8.77637 6.22363 9 6.5 9Z"/>
+<path d="M8.5 9C8.77637 9 9 8.77637 9 8.5V4.5C9 4.22363 8.77637 4 8.5 4C8.22363 4 8 4.22363 8 4.5V8.5C8 8.77637 8.22363 9 8.5 9Z"/>
+<path d="M11.5 1H7.9989L8 0.994629V0.494629C8 0.218262 7.77637 -0.00537109 7.5 -0.00537109H5.5C5.22363 -0.00537109 5 0.218262 5 0.494629V0.994629L5.0011 1H1.5C1.22363 1 1 1.22363 1 1.5C1 1.77637 1.22363 2 1.5 2H2V11.5C2 11.7764 2.22363 12 2.5 12H10.5C10.7764 12 11 11.7764 11 11.5V2H11.5C11.7764 2 12 1.77637 12 1.5C12 1.22363 11.7764 1 11.5 1ZM10 11H3V2.00537H10V11Z"/>
 </svg>
+

package/dist/collection/components/icon-50/icons-50/b2b_icon-error-hint.svg

@@ -1,3 +1,4 @@
 <svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-<path d="M7.85352 3.14648C7.6582 2.95117 7.3418 2.95117 7.14648 3.14648L5.5 4.79297L3.85352 3.14648C3.6582 2.95117 3.3418 2.95117 3.14648 3.14648C2.95117 3.3418 2.95117 3.6582 3.14648 3.85352L4.79297 5.5L3.14648 7.14648C2.95117 7.3418 2.95117 7.6582 3.14648 7.85352C3.24414 7.95117 3.37207 8 3.5 8C3.62793 8 3.75586 7.95117 3.85352 7.85352L5.5 6.20703L7.14648 7.85352C7.24414 7.95117 7.37207 8 7.5 8C7.62793 8 7.75586 7.95117 7.85352 7.85352C8.04883 7.6582 8.04883 7.3418 7.85352 7.14648L6.20703 5.5L7.85352 3.85352C8.04883 3.6582 8.04883 3.3418 7.85352 3.14648ZM5.5 0C2.46729 0 0 2.46729 0 5.5C0 8.53271 2.46729 11 5.5 11C8.53271 11 11 8.53271 11 5.5C11 2.46729 8.53271 0 5.5 0ZM5.5 10C3.01855 10 1 7.98145 1 5.5C1 3.01855 3.01855 1 5.5 1C7.98145 1 10 3.01855 10 5.5C10 7.98145 7.98145 10 5.5 10Z" fill="#222222"/>
+<path d="M7.85352 3.14648C7.6582 2.95117 7.3418 2.95117 7.14648 3.14648L5.5 4.79297L3.85352 3.14648C3.6582 2.95117 3.3418 2.95117 3.14648 3.14648C2.95117 3.3418 2.95117 3.6582 3.14648 3.85352L4.79297 5.5L3.14648 7.14648C2.95117 7.3418 2.95117 7.6582 3.14648 7.85352C3.24414 7.95117 3.37207 8 3.5 8C3.62793 8 3.75586 7.95117 3.85352 7.85352L5.5 6.20703L7.14648 7.85352C7.24414 7.95117 7.37207 8 7.5 8C7.62793 8 7.75586 7.95117 7.85352 7.85352C8.04883 7.6582 8.04883 7.3418 7.85352 7.14648L6.20703 5.5L7.85352 3.85352C8.04883 3.6582 8.04883 3.3418 7.85352 3.14648ZM5.5 0C2.46729 0 0 2.46729 0 5.5C0 8.53271 2.46729 11 5.5 11C8.53271 11 11 8.53271 11 5.5C11 2.46729 8.53271 0 5.5 0ZM5.5 10C3.01855 10 1 7.98145 1 5.5C1 3.01855 3.01855 1 5.5 1C7.98145 1 10 3.01855 10 5.5C10 7.98145 7.98145 10 5.5 10Z"/>
 </svg>
+