@otto-de/b2b-core-components 1.7.0 → 1.8.0

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

@@ -1,167 +1,167 @@
-import { html } from 'lit-html';
-import { getArgTypes } from '../../docs/config/utils';
+import { html } from "lit-html";
+import { getArgTypes } from "../../docs/config/utils";
 const Template = ({ margin, justify, textAlign, span, rowGap, columnGap, alignItems, storyName, }) => {
   const gridBoxStyles = `border: 1px solid #c4c4c4; padding: 1rem; background-color: #fff; height: 200px;`;
   const gridBoxSmallStyles = `border: 1px solid #c4c4c4; padding: 1rem; background-color: #fff; height: 100px;`;
   switch (storyName) {
     case '010Grid':
-      return html ` <b2b-grid margin="${margin}">
-        <b2b-grid-row
-          justify="${justify}"
-          row-gap="${rowGap}"
-          column-gap="${columnGap}">
-          <b2b-grid-col span="6" text-align="${textAlign}"
-            ><div style="${gridBoxStyles}">
-              <h4>Column 1-6 of ${9 + Number(span)}</h4>
-              <p>
-                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-                Suspendisse massa urna, accumsan id viverra et, mollis sit amet
-                sem. Cras congue ex ac arcu pellentesque, eu vestibulum sem
-                tempor. Curabitur consequat massa sed nulla lacinia, vitae
-                scelerisque ante egestas. Praesent et diam quis diam posuere
-                egestas. Duis feugiat lorem non nisl consectetur, sed fringilla
-                odio semper.
-              </p>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 7 of ${9 + Number(span)}</h4>
-              <p>I grow to fill up all available space</p>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 8 of ${9 + Number(span)}</h4>
-              <p>I grow to fill up all available space</p>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 9 of ${9 + Number(span)}</h4>
-              <p>I grow to fill up all available space</p>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col span="${span}"
-            ><div style="${gridBoxStyles}">
-              <h4>Column 10-${9 + Number(span)} of ${9 + Number(span)}</h4>
-              <p>Resize me by changing the span attribute in the args table.</p>
-            </div></b2b-grid-col
-          >
-        </b2b-grid-row>
+      return html ` <b2b-grid margin="${margin}">
+        <b2b-grid-row
+          justify="${justify}"
+          row-gap="${rowGap}"
+          column-gap="${columnGap}">
+          <b2b-grid-col span="6" text-align="${textAlign}"
+            ><div style="${gridBoxStyles}">
+              <h4>Column 1-6 of ${9 + Number(span)}</h4>
+              <p>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+                Suspendisse massa urna, accumsan id viverra et, mollis sit amet
+                sem. Cras congue ex ac arcu pellentesque, eu vestibulum sem
+                tempor. Curabitur consequat massa sed nulla lacinia, vitae
+                scelerisque ante egestas. Praesent et diam quis diam posuere
+                egestas. Duis feugiat lorem non nisl consectetur, sed fringilla
+                odio semper.
+              </p>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 7 of ${9 + Number(span)}</h4>
+              <p>I grow to fill up all available space</p>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 8 of ${9 + Number(span)}</h4>
+              <p>I grow to fill up all available space</p>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 9 of ${9 + Number(span)}</h4>
+              <p>I grow to fill up all available space</p>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col span="${span}"
+            ><div style="${gridBoxStyles}">
+              <h4>Column 10-${9 + Number(span)} of ${9 + Number(span)}</h4>
+              <p>Resize me by changing the span attribute in the args table.</p>
+            </div></b2b-grid-col
+          >
+        </b2b-grid-row>
       </b2b-grid>`;
     case '020AlignItems':
-      return html `<b2b-grid
-        ><b2b-grid-row
-          align-items="${alignItems}"
-          justify="${justify}"
-          row-gap="${rowGap}"
-          column-gap="${columnGap}">
-          <b2b-grid-col
-            ><div style="${gridBoxSmallStyles}">
-              <h4>Column 1 of 6</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 2 of 6</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxSmallStyles}">
-              <h4>Column 3 of 6</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 4 of 6</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxSmallStyles}">
-              <h4>Column 5 of 6</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 6 of 6</h4>
-            </div></b2b-grid-col
-          >
-        </b2b-grid-row></b2b-grid
+      return html `<b2b-grid
+        ><b2b-grid-row
+          align-items="${alignItems}"
+          justify="${justify}"
+          row-gap="${rowGap}"
+          column-gap="${columnGap}">
+          <b2b-grid-col
+            ><div style="${gridBoxSmallStyles}">
+              <h4>Column 1 of 6</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 2 of 6</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxSmallStyles}">
+              <h4>Column 3 of 6</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 4 of 6</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxSmallStyles}">
+              <h4>Column 5 of 6</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 6 of 6</h4>
+            </div></b2b-grid-col
+          >
+        </b2b-grid-row></b2b-grid
       >`;
     case '030TextAlign':
-      return html `<b2b-grid margin="${margin}">
-        <b2b-grid-row
-          justify="${justify}"
-          row-gap="${rowGap}"
-          column-gap="${columnGap}">
-          <b2b-grid-col span="6" text-align="${textAlign}"
-            ><div style="${gridBoxStyles}">
-              <h4>Column 1-6 of 9</h4>
-              <p>
-                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-                Suspendisse massa urna, accumsan id viverra et, mollis sit amet
-                sem. Cras congue ex ac arcu pellentesque, eu vestibulum sem
-                tempor. Curabitur consequat massa sed nulla lacinia, vitae
-                scelerisque ante egestas. Praesent et diam quis diam posuere
-                egestas. Duis feugiat lorem non nisl consectetur, sed fringilla
-                odio semper.
-              </p>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 7 of 9</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 8 of 9</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col
-            ><div style="${gridBoxStyles}">
-              <h4>Column 9 of 9</h4>
-            </div></b2b-grid-col
-          ></b2b-grid-row
-        ></b2b-grid
+      return html `<b2b-grid margin="${margin}">
+        <b2b-grid-row
+          justify="${justify}"
+          row-gap="${rowGap}"
+          column-gap="${columnGap}">
+          <b2b-grid-col span="6" text-align="${textAlign}"
+            ><div style="${gridBoxStyles}">
+              <h4>Column 1-6 of 9</h4>
+              <p>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+                Suspendisse massa urna, accumsan id viverra et, mollis sit amet
+                sem. Cras congue ex ac arcu pellentesque, eu vestibulum sem
+                tempor. Curabitur consequat massa sed nulla lacinia, vitae
+                scelerisque ante egestas. Praesent et diam quis diam posuere
+                egestas. Duis feugiat lorem non nisl consectetur, sed fringilla
+                odio semper.
+              </p>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 7 of 9</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 8 of 9</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col
+            ><div style="${gridBoxStyles}">
+              <h4>Column 9 of 9</h4>
+            </div></b2b-grid-col
+          ></b2b-grid-row
+        ></b2b-grid
       >`;
     case '040Justify':
-      return html `<b2b-grid margin="${margin}">
-        <b2b-grid-row
-          justify="${justify}"
-          row-gap="${rowGap}"
-          column-gap="${columnGap}">
-          <b2b-grid-col span="6" text-align="${textAlign}"
-            ><div style="${gridBoxStyles}">
-              <h4>Column 1-6 of 9</h4>
-              <p>
-                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-                Suspendisse massa urna, accumsan id viverra et, mollis sit amet
-                sem. Cras congue ex ac arcu pellentesque, eu vestibulum sem
-                tempor. Curabitur consequat massa sed nulla lacinia, vitae
-                scelerisque ante egestas. Praesent et diam quis diam posuere
-                egestas. Duis feugiat lorem non nisl consectetur, sed fringilla
-                odio semper.
-              </p>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col span="1"
-            ><div style="${gridBoxStyles}">
-              <h4>Column 7 of 9</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col span="1"
-            ><div style="${gridBoxStyles}">
-              <h4>Column 8 of 9</h4>
-            </div></b2b-grid-col
-          >
-          <b2b-grid-col span="1"
-            ><div style="${gridBoxStyles}">
-              <h4>Column 9 of 9</h4>
-            </div></b2b-grid-col
-          ></b2b-grid-row
-        ></b2b-grid
+      return html `<b2b-grid margin="${margin}">
+        <b2b-grid-row
+          justify="${justify}"
+          row-gap="${rowGap}"
+          column-gap="${columnGap}">
+          <b2b-grid-col span="6" text-align="${textAlign}"
+            ><div style="${gridBoxStyles}">
+              <h4>Column 1-6 of 9</h4>
+              <p>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+                Suspendisse massa urna, accumsan id viverra et, mollis sit amet
+                sem. Cras congue ex ac arcu pellentesque, eu vestibulum sem
+                tempor. Curabitur consequat massa sed nulla lacinia, vitae
+                scelerisque ante egestas. Praesent et diam quis diam posuere
+                egestas. Duis feugiat lorem non nisl consectetur, sed fringilla
+                odio semper.
+              </p>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col span="1"
+            ><div style="${gridBoxStyles}">
+              <h4>Column 7 of 9</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col span="1"
+            ><div style="${gridBoxStyles}">
+              <h4>Column 8 of 9</h4>
+            </div></b2b-grid-col
+          >
+          <b2b-grid-col span="1"
+            ><div style="${gridBoxStyles}">
+              <h4>Column 9 of 9</h4>
+            </div></b2b-grid-col
+          ></b2b-grid-row
+        ></b2b-grid
       >`;
   }
 };

package/dist/collection/components/grid/row.js

@@ -1,4 +1,4 @@
-import { h, Host } from '@stencil/core';
+import { h, Host } from "@stencil/core";
 export class B2bGridRowComponent {
   constructor() {
     this.columnGap = 24;
@@ -79,7 +79,7 @@ export class B2bGridRowComponent {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "| 'start'\n    | 'end'\n    | 'center'\n    | 'space-around'\n    | 'space-between'\n    | 'space-evenly'",
+          "original": "| 'start'\r\n    | 'end'\r\n    | 'center'\r\n    | 'space-around'\r\n    | 'space-between'\r\n    | 'space-evenly'",
           "resolved": "\"center\" | \"end\" | \"space-around\" | \"space-between\" | \"space-evenly\" | \"start\"",
           "references": {}
         },

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 14:16:21 GMT
+ * Generated on Mon, 13 Nov 2023 12:54:56 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 14:16:22 GMT
+ * Generated on Mon, 13 Nov 2023 12:54:56 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -1,4 +1,4 @@
-import { newE2EPage } from '@stencil/core/testing';
+import { newE2EPage } from "@stencil/core/testing";
 describe('B2B-Headline', () => {
   let page;
   beforeEach(async () => {

package/dist/collection/components/headline/headline.js

@@ -1,4 +1,4 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 /**
  * Headline component to render hading tags content.
  * Initial story: https://otto-eg.atlassian.net/browse/B2BDS-46

package/dist/collection/components/headline/headline.spec.js

@@ -1,20 +1,20 @@
-import { newSpecPage } from '@stencil/core/testing';
-import { h } from '@stencil/core';
-import { HeadlineComponent } from './headline';
+import { newSpecPage } from "@stencil/core/testing";
+import { h } from "@stencil/core";
+import { HeadlineComponent } from "./headline";
 it('should use h1 tag with headline 400 size', async () => {
   const page = await newSpecPage({
     components: [HeadlineComponent],
     template: () => (h("b2b-headline", { size: "400" }, "This is a h1 Headline")),
   });
-  expect(page.root).toEqualHtml(`
-    <b2b-headline>
-      <mock:shadow-root>
-        <h1 class="b2b-headline--400 b2b-headline--left">
-          <slot></slot>
-        </h1>
-      </mock:shadow-root>
-      This is a h1 Headline
-    </b2b-headline>
+  expect(page.root).toEqualHtml(`
+    <b2b-headline>
+      <mock:shadow-root>
+        <h1 class="b2b-headline--400 b2b-headline--left">
+          <slot></slot>
+        </h1>
+      </mock:shadow-root>
+      This is a h1 Headline
+    </b2b-headline>
   `);
 });
 it('should use h2 tag with headline 200 size', async () => {
@@ -22,15 +22,15 @@ it('should use h2 tag with headline 200 size', async () => {
     components: [HeadlineComponent],
     template: () => (h("b2b-headline", { size: "200" }, "This is a h2 Headline")),
   });
-  expect(page.root).toEqualHtml(`
-    <b2b-headline>
-      <mock:shadow-root>
-        <h2 class="b2b-headline--200 b2b-headline--left">
-          <slot></slot>
-        </h2>
-      </mock:shadow-root>
-      This is a h2 Headline
-    </b2b-headline>
+  expect(page.root).toEqualHtml(`
+    <b2b-headline>
+      <mock:shadow-root>
+        <h2 class="b2b-headline--200 b2b-headline--left">
+          <slot></slot>
+        </h2>
+      </mock:shadow-root>
+      This is a h2 Headline
+    </b2b-headline>
   `);
 });
 it('should use h3 tag with headline 100 size', async () => {
@@ -38,15 +38,15 @@ it('should use h3 tag with headline 100 size', async () => {
     components: [HeadlineComponent],
     template: () => (h("b2b-headline", { size: "100" }, "This is a h3 Headline")),
   });
-  expect(page.root).toEqualHtml(`
-    <b2b-headline>
-      <mock:shadow-root>
-        <h3 class="b2b-headline--100 b2b-headline--left">
-          <slot></slot>
-        </h3>
-      </mock:shadow-root>
-      This is a h3 Headline
-    </b2b-headline>
+  expect(page.root).toEqualHtml(`
+    <b2b-headline>
+      <mock:shadow-root>
+        <h3 class="b2b-headline--100 b2b-headline--left">
+          <slot></slot>
+        </h3>
+      </mock:shadow-root>
+      This is a h3 Headline
+    </b2b-headline>
   `);
 });
 it('should use h1 tag as default size', async () => {
@@ -54,14 +54,14 @@ it('should use h1 tag as default size', async () => {
     components: [HeadlineComponent],
     template: () => h("b2b-headline", null, "This is a h3 Headline"),
   });
-  expect(page.root).toEqualHtml(`
-    <b2b-headline>
-      <mock:shadow-root>
-        <h1 class="b2b-headline--400 b2b-headline--left">
-          <slot></slot>
-        </h1>
-      </mock:shadow-root>
-      This is a h3 Headline
-    </b2b-headline>
+  expect(page.root).toEqualHtml(`
+    <b2b-headline>
+      <mock:shadow-root>
+        <h1 class="b2b-headline--400 b2b-headline--left">
+          <slot></slot>
+        </h1>
+      </mock:shadow-root>
+      This is a h3 Headline
+    </b2b-headline>
   `);
 });

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

@@ -1,8 +1,8 @@
-import { html } from 'lit-html';
-import { getArgTypes } from '../../docs/config/utils';
+import { html } from "lit-html";
+import { getArgTypes } from "../../docs/config/utils";
 const template = ({ size, align, slot }) => {
-  return html `<b2b-headline size="${size}" align="${align}">
-    ${slot}
+  return html `<b2b-headline size="${size}" align="${align}">
+    ${slot}
   </b2b-headline>`;
 };
 const defaultArgs = {

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 14:16:21 GMT
+ * Generated on Mon, 13 Nov 2023 12:54:56 GMT
  */
 :root, :host {
   --b2b-size-200: 5rem; /* 80px */
@@ -122,7 +122,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 14:16:22 GMT
+ * Generated on Mon, 13 Nov 2023 12:54:56 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

package/dist/collection/components/icon/icon.js

@@ -1,6 +1,6 @@
-import { Build, h, Host } from '@stencil/core';
-import { buildPath, fetchIcon, iconContent } from './request';
-import { iconTypes } from './types';
+import { Build, h, Host } from "@stencil/core";
+import { buildPath, fetchIcon, iconContent } from "./request";
+import { iconTypes } from "./types";
 export class B2bIcon {
   constructor() {
     this.isIconSupported = () => {
@@ -55,7 +55,7 @@ export class B2bIcon {
       "$": ["icon.css"]
     };
   }
-  static get assetsDirs() { return ["icons"]; }
+  static get assetsDirs() { return ["icons", "logos"]; }
   static get properties() {
     return {
       "icon": {
@@ -63,11 +63,12 @@ export class B2bIcon {
         "mutable": false,
         "complexType": {
           "original": "IconName",
-          "resolved": "\"b2b_icon-360-degree\" | \"b2b_icon-advice\" | \"b2b_icon-allergen-sulfur-dioxide-sulfite\" | \"b2b_icon-almond\" | \"b2b_icon-archive\" | \"b2b_icon-armchair\" | \"b2b_icon-arrow-down\" | \"b2b_icon-arrow-graph\" | \"b2b_icon-arrow-left\" | \"b2b_icon-arrow-right\" | \"b2b_icon-arrow-up\" | \"b2b_icon-assembly\" | \"b2b_icon-assortment\" | \"b2b_icon-attachment\" | \"b2b_icon-augmented-reality\" | \"b2b_icon-autonomous-team\" | \"b2b_icon-bank-details\" | \"b2b_icon-bar-graph-ascending\" | \"b2b_icon-bar-graph-axis\" | \"b2b_icon-barley\" | \"b2b_icon-basket-sale\" | \"b2b_icon-basket\" | \"b2b_icon-basketball\" | \"b2b_icon-bikini\" | \"b2b_icon-blogs\" | \"b2b_icon-brandshop\" | \"b2b_icon-brazil-nut\" | \"b2b_icon-browser-click\" | \"b2b_icon-browser-content\" | \"b2b_icon-browser-psm\" | \"b2b_icon-burger\" | \"b2b_icon-bus\" | \"b2b_icon-callback\" | \"b2b_icon-camera\" | \"b2b_icon-cashback\" | \"b2b_icon-cashew-nut\" | \"b2b_icon-catalogue\" | \"b2b_icon-categories\" | \"b2b_icon-celery\" | \"b2b_icon-certificate\" | \"b2b_icon-chair\" | \"b2b_icon-chat\" | \"b2b_icon-check-bold\" | \"b2b_icon-check\" | \"b2b_icon-chicken\" | \"b2b_icon-city\" | \"b2b_icon-clear\" | \"b2b_icon-close-bold\" | \"b2b_icon-close\" | \"b2b_icon-code-management\" | \"b2b_icon-contact-mail\" | \"b2b_icon-copy\" | \"b2b_icon-cow\" | \"b2b_icon-crab\" | \"b2b_icon-critique\" | \"b2b_icon-curtain\" | \"b2b_icon-cut-out\" | \"b2b_icon-dashboard\" | \"b2b_icon-deer\" | \"b2b_icon-delete\" | \"b2b_icon-delivery-24h\" | \"b2b_icon-delivery-desired-date-selection\" | \"b2b_icon-delivery-desired-date\" | \"b2b_icon-delivery-express\" | \"b2b_icon-delivery-flat\" | \"b2b_icon-delivery-on-hangers\" | \"b2b_icon-delivery-preferred-place\" | \"b2b_icon-desktop-phone-ads-click\" | \"b2b_icon-desktop-phone-ads\" | \"b2b_icon-desktop-phone\" | \"b2b_icon-desktop\" | \"b2b_icon-devices-monitor-laptop-tablet\" | \"b2b_icon-dish-feature-lactose-free\" | \"b2b_icon-dislike\" | \"b2b_icon-disposal\" | \"b2b_icon-document-sign\" | \"b2b_icon-downloads\" | \"b2b_icon-dress\" | \"b2b_icon-dungarees\" | \"b2b_icon-duration\" | \"b2b_icon-e-invoice\" | \"b2b_icon-edit-pad\" | \"b2b_icon-edit\" | \"b2b_icon-egg\" | \"b2b_icon-ellipsis\" | \"b2b_icon-email-verification-confirmed-safe\" | \"b2b_icon-email-verification-confirmed\" | \"b2b_icon-email-verification-sent-safe\" | \"b2b_icon-email-verification-sent\" | \"b2b_icon-empty-hint\" | \"b2b_icon-end-to-end\" | \"b2b_icon-error-article-image\" | \"b2b_icon-error-hint\" | \"b2b_icon-error\" | \"b2b_icon-euro\" | \"b2b_icon-event\" | \"b2b_icon-events\" | \"b2b_icon-expand\" | \"b2b_icon-faq\" | \"b2b_icon-feedback\" | \"b2b_icon-filter\" | \"b2b_icon-fish\" | \"b2b_icon-fitness\" | \"b2b_icon-flag-chequered\" | \"b2b_icon-flexible-work\" | \"b2b_icon-flip\" | \"b2b_icon-food-processor\" | \"b2b_icon-fullscreen\" | \"b2b_icon-gallery-view\" | \"b2b_icon-gamepad\" | \"b2b_icon-garlic\" | \"b2b_icon-gender-intersex\" | \"b2b_icon-globe\" | \"b2b_icon-gluten\" | \"b2b_icon-glutenfree\" | \"b2b_icon-handshake\" | \"b2b_icon-hashtag\" | \"b2b_icon-hazelnut\" | \"b2b_icon-hide\" | \"b2b_icon-high-heels\" | \"b2b_icon-home\" | \"b2b_icon-info-small\" | \"b2b_icon-info\" | \"b2b_icon-inplace-zoom-reverse\" | \"b2b_icon-inplace-zoom\" | \"b2b_icon-insurance\" | \"b2b_icon-kamut\" | \"b2b_icon-laptop-os\" | \"b2b_icon-laptop\" | \"b2b_icon-leaving-page\" | \"b2b_icon-light-bulb\" | \"b2b_icon-like-fingers\" | \"b2b_icon-like-product\" | \"b2b_icon-like\" | \"b2b_icon-line-graph\" | \"b2b_icon-list-view\" | \"b2b_icon-location\" | \"b2b_icon-lupine\" | \"b2b_icon-macadamia\" | \"b2b_icon-material-samples\" | \"b2b_icon-measurement\" | \"b2b_icon-megaphone\" | \"b2b_icon-menu\" | \"b2b_icon-mic\" | \"b2b_icon-milk\" | \"b2b_icon-minus\" | \"b2b_icon-module-operations\" | \"b2b_icon-money-coins\" | \"b2b_icon-money-document\" | \"b2b_icon-money-plus\" | \"b2b_icon-money-stack\" | \"b2b_icon-money\" | \"b2b_icon-move\" | \"b2b_icon-mustard\" | \"b2b_icon-nav\" | \"b2b_icon-new\" | \"b2b_icon-newsletter-sign-up\" | \"b2b_icon-notification\" | \"b2b_icon-nuts\" | \"b2b_icon-oat\" | \"b2b_icon-order-cancelled\" | \"b2b_icon-order-delivered\" | \"b2b_icon-order-form\" | \"b2b_icon-order-management\" | \"b2b_icon-order-misdirected\" | \"b2b_icon-order-on-road\" | \"b2b_icon-order-packed\" | \"b2b_icon-order-payment\" | \"b2b_icon-order-received\" | \"b2b_icon-order-return\" | \"b2b_icon-order-shipped\" | \"b2b_icon-order-state-unknown\" | \"b2b_icon-order-stored\" | \"b2b_icon-order\" | \"b2b_icon-otto-app\" | \"b2b_icon-otto-campus\" | \"b2b_icon-otto-company\" | \"b2b_icon-otto-laptop\" | \"b2b_icon-otto-logo\" | \"b2b_icon-otto-up-points\" | \"b2b_icon-otto-up\" | \"b2b_icon-paper-plane\" | \"b2b_icon-pause\" | \"b2b_icon-payment-credit-card\" | \"b2b_icon-payment-invoice\" | \"b2b_icon-payment-pause\" | \"b2b_icon-payment-plan-protection\" | \"b2b_icon-payment-plan\" | \"b2b_icon-pdf\" | \"b2b_icon-peanut\" | \"b2b_icon-pecan-nut\" | \"b2b_icon-pending\" | \"b2b_icon-person-access\" | \"b2b_icon-person-callcenter\" | \"b2b_icon-person-check\" | \"b2b_icon-person-colleagues\" | \"b2b_icon-person-community\" | \"b2b_icon-person-development\" | \"b2b_icon-person-female\" | \"b2b_icon-person-info\" | \"b2b_icon-person-male\" | \"b2b_icon-person-rating\" | \"b2b_icon-person-support\" | \"b2b_icon-person-switch\" | \"b2b_icon-person-workshop\" | \"b2b_icon-person\" | \"b2b_icon-phone-permission\" | \"b2b_icon-phone\" | \"b2b_icon-pig\" | \"b2b_icon-pin\" | \"b2b_icon-pinch-gesture\" | \"b2b_icon-pinch\" | \"b2b_icon-pistachio\" | \"b2b_icon-plant\" | \"b2b_icon-play-1\" | \"b2b_icon-play\" | \"b2b_icon-plus\" | \"b2b_icon-price-alert\" | \"b2b_icon-price-tag\" | \"b2b_icon-print\" | \"b2b_icon-puzzle\" | \"b2b_icon-qr-code\" | \"b2b_icon-question-hint\" | \"b2b_icon-question\" | \"b2b_icon-rating-empty\" | \"b2b_icon-rating-filled\" | \"b2b_icon-rating-half\" | \"b2b_icon-rating-order\" | \"b2b_icon-rating-payment\" | \"b2b_icon-remote-work\" | \"b2b_icon-repair\" | \"b2b_icon-reply\" | \"b2b_icon-retirement-provision\" | \"b2b_icon-rocket\" | \"b2b_icon-rye\" | \"b2b_icon-sabbatical\" | \"b2b_icon-sale\" | \"b2b_icon-save\" | \"b2b_icon-sea\" | \"b2b_icon-search-enter\" | \"b2b_icon-search\" | \"b2b_icon-seo\" | \"b2b_icon-service-info\" | \"b2b_icon-sesame\" | \"b2b_icon-settings\" | \"b2b_icon-share-ios\" | \"b2b_icon-share\" | \"b2b_icon-sheep\" | \"b2b_icon-shell\" | \"b2b_icon-shirt\" | \"b2b_icon-shopping-cart-euro\" | \"b2b_icon-shopping-cart\" | \"b2b_icon-show\" | \"b2b_icon-smiley-angry\" | \"b2b_icon-smiley-happy\" | \"b2b_icon-smiley-negative\" | \"b2b_icon-smiley-neutral\" | \"b2b_icon-smiley-positive\" | \"b2b_icon-sms-info\" | \"b2b_icon-sneaker\" | \"b2b_icon-sort-ascending\" | \"b2b_icon-sort-descending\" | \"b2b_icon-sort\" | \"b2b_icon-soy\" | \"b2b_icon-spelt\" | \"b2b_icon-stationary\" | \"b2b_icon-studies\" | \"b2b_icon-success\" | \"b2b_icon-sustainable-delivery\" | \"b2b_icon-sustainable-energy-efficient\" | \"b2b_icon-sustainable-production\" | \"b2b_icon-sustainable-recycling\" | \"b2b_icon-sustainable-resource\" | \"b2b_icon-swipe-gesture\" | \"b2b_icon-sync-device\" | \"b2b_icon-t-shirt\" | \"b2b_icon-tablet\" | \"b2b_icon-tableware\" | \"b2b_icon-target-group\" | \"b2b_icon-teddy\" | \"b2b_icon-test-result\" | \"b2b_icon-town\" | \"b2b_icon-trash\" | \"b2b_icon-trend-down\" | \"b2b_icon-trend-up\" | \"b2b_icon-trousers\" | \"b2b_icon-trusted\" | \"b2b_icon-unpin\" | \"b2b_icon-upload\" | \"b2b_icon-user-management\" | \"b2b_icon-vacation\" | \"b2b_icon-variant-content\" | \"b2b_icon-vegan\" | \"b2b_icon-vegetarian\" | \"b2b_icon-viewtoggle-tiles\" | \"b2b_icon-village\" | \"b2b_icon-volume-off\" | \"b2b_icon-volume-on\" | \"b2b_icon-voucher\" | \"b2b_icon-walnut\" | \"b2b_icon-warning\" | \"b2b_icon-warranty\" | \"b2b_icon-washing-machine\" | \"b2b_icon-whatsapp\" | \"b2b_icon-wheat\" | \"b2b_icon-wifi\" | \"b2b_icon-wishlist-active\" | \"b2b_icon-wishlist\" | \"b2b_icon-work-life\" | \"b2b_icon-workshop\" | \"b2b_icon-zoom-in\" | \"b2b_icon-zoom-out\"",
+          "resolved": "\"b2b_icon-360-degree\" | \"b2b_icon-advice\" | \"b2b_icon-allergen-sulfur-dioxide-sulfite\" | \"b2b_icon-almond\" | \"b2b_icon-archive\" | \"b2b_icon-armchair\" | \"b2b_icon-arrow-down\" | \"b2b_icon-arrow-graph\" | \"b2b_icon-arrow-left\" | \"b2b_icon-arrow-right\" | \"b2b_icon-arrow-up\" | \"b2b_icon-assembly\" | \"b2b_icon-assortment\" | \"b2b_icon-attachment\" | \"b2b_icon-augmented-reality\" | \"b2b_icon-autonomous-team\" | \"b2b_icon-bank-details\" | \"b2b_icon-bar-graph-ascending\" | \"b2b_icon-bar-graph-axis\" | \"b2b_icon-barley\" | \"b2b_icon-basket-sale\" | \"b2b_icon-basket\" | \"b2b_icon-basketball\" | \"b2b_icon-bikini\" | \"b2b_icon-blogs\" | \"b2b_icon-brandshop\" | \"b2b_icon-brazil-nut\" | \"b2b_icon-browser-click\" | \"b2b_icon-browser-content\" | \"b2b_icon-browser-psm\" | \"b2b_icon-burger\" | \"b2b_icon-bus\" | \"b2b_icon-callback\" | \"b2b_icon-camera\" | \"b2b_icon-cashback\" | \"b2b_icon-cashew-nut\" | \"b2b_icon-catalogue\" | \"b2b_icon-categories\" | \"b2b_icon-celery\" | \"b2b_icon-certificate\" | \"b2b_icon-chair\" | \"b2b_icon-chat\" | \"b2b_icon-check-bold\" | \"b2b_icon-check\" | \"b2b_icon-chicken\" | \"b2b_icon-city\" | \"b2b_icon-clear\" | \"b2b_icon-close-bold\" | \"b2b_icon-close\" | \"b2b_icon-code-management\" | \"b2b_icon-contact-mail\" | \"b2b_icon-copy\" | \"b2b_icon-cow\" | \"b2b_icon-crab\" | \"b2b_icon-critique\" | \"b2b_icon-curtain\" | \"b2b_icon-cut-out\" | \"b2b_icon-dashboard\" | \"b2b_icon-deer\" | \"b2b_icon-delete\" | \"b2b_icon-delivery-24h\" | \"b2b_icon-delivery-desired-date-selection\" | \"b2b_icon-delivery-desired-date\" | \"b2b_icon-delivery-express\" | \"b2b_icon-delivery-flat\" | \"b2b_icon-delivery-on-hangers\" | \"b2b_icon-delivery-preferred-place\" | \"b2b_icon-desktop-phone-ads-click\" | \"b2b_icon-desktop-phone-ads\" | \"b2b_icon-desktop-phone\" | \"b2b_icon-desktop\" | \"b2b_icon-devices-monitor-laptop-tablet\" | \"b2b_icon-dish-feature-lactose-free\" | \"b2b_icon-dislike\" | \"b2b_icon-disposal\" | \"b2b_icon-document-sign\" | \"b2b_icon-downloads\" | \"b2b_icon-dress\" | \"b2b_icon-dungarees\" | \"b2b_icon-duration\" | \"b2b_icon-e-invoice\" | \"b2b_icon-edit-pad\" | \"b2b_icon-edit\" | \"b2b_icon-egg\" | \"b2b_icon-ellipsis\" | \"b2b_icon-email-verification-confirmed-safe\" | \"b2b_icon-email-verification-confirmed\" | \"b2b_icon-email-verification-sent-safe\" | \"b2b_icon-email-verification-sent\" | \"b2b_icon-empty-hint\" | \"b2b_icon-end-to-end\" | \"b2b_icon-error-article-image\" | \"b2b_icon-error-hint\" | \"b2b_icon-error\" | \"b2b_icon-euro\" | \"b2b_icon-event\" | \"b2b_icon-events\" | \"b2b_icon-expand\" | \"b2b_icon-faq\" | \"b2b_icon-feedback\" | \"b2b_icon-filter\" | \"b2b_icon-fish\" | \"b2b_icon-fitness\" | \"b2b_icon-flag-chequered\" | \"b2b_icon-flexible-work\" | \"b2b_icon-flip\" | \"b2b_icon-food-processor\" | \"b2b_icon-fullscreen\" | \"b2b_icon-gallery-view\" | \"b2b_icon-gamepad\" | \"b2b_icon-garlic\" | \"b2b_icon-gender-intersex\" | \"b2b_icon-globe\" | \"b2b_icon-gluten\" | \"b2b_icon-glutenfree\" | \"b2b_icon-handshake\" | \"b2b_icon-hashtag\" | \"b2b_icon-hazelnut\" | \"b2b_icon-hide\" | \"b2b_icon-high-heels\" | \"b2b_icon-home\" | \"b2b_icon-info-small\" | \"b2b_icon-info\" | \"b2b_icon-inplace-zoom-reverse\" | \"b2b_icon-inplace-zoom\" | \"b2b_icon-insurance\" | \"b2b_icon-kamut\" | \"b2b_icon-laptop-os\" | \"b2b_icon-laptop\" | \"b2b_icon-leaving-page\" | \"b2b_icon-light-bulb\" | \"b2b_icon-like-fingers\" | \"b2b_icon-like-product\" | \"b2b_icon-like\" | \"b2b_icon-line-graph\" | \"b2b_icon-list-view\" | \"b2b_icon-location\" | \"b2b_icon-lupine\" | \"b2b_icon-macadamia\" | \"b2b_icon-material-samples\" | \"b2b_icon-measurement\" | \"b2b_icon-megaphone\" | \"b2b_icon-menu\" | \"b2b_icon-mic\" | \"b2b_icon-milk\" | \"b2b_icon-minus\" | \"b2b_icon-module-operations\" | \"b2b_icon-money-coins\" | \"b2b_icon-money-document\" | \"b2b_icon-money-plus\" | \"b2b_icon-money-stack\" | \"b2b_icon-money\" | \"b2b_icon-move\" | \"b2b_icon-mustard\" | \"b2b_icon-nav\" | \"b2b_icon-new\" | \"b2b_icon-newsletter-sign-up\" | \"b2b_icon-notification\" | \"b2b_icon-nuts\" | \"b2b_icon-oat\" | \"b2b_icon-order-cancelled\" | \"b2b_icon-order-delivered\" | \"b2b_icon-order-form\" | \"b2b_icon-order-management\" | \"b2b_icon-order-misdirected\" | \"b2b_icon-order-on-road\" | \"b2b_icon-order-packed\" | \"b2b_icon-order-payment\" | \"b2b_icon-order-received\" | \"b2b_icon-order-return\" | \"b2b_icon-order-shipped\" | \"b2b_icon-order-state-unknown\" | \"b2b_icon-order-stored\" | \"b2b_icon-order\" | \"b2b_icon-otto-app\" | \"b2b_icon-otto-campus\" | \"b2b_icon-otto-company\" | \"b2b_icon-otto-laptop\" | \"b2b_icon-otto-logo\" | \"b2b_icon-otto-up-points\" | \"b2b_icon-otto-up\" | \"b2b_icon-paper-plane\" | \"b2b_icon-pause\" | \"b2b_icon-payment-credit-card\" | \"b2b_icon-payment-invoice\" | \"b2b_icon-payment-pause\" | \"b2b_icon-payment-plan-protection\" | \"b2b_icon-payment-plan\" | \"b2b_icon-pdf\" | \"b2b_icon-peanut\" | \"b2b_icon-pecan-nut\" | \"b2b_icon-pending\" | \"b2b_icon-person-access\" | \"b2b_icon-person-callcenter\" | \"b2b_icon-person-check\" | \"b2b_icon-person-colleagues\" | \"b2b_icon-person-community\" | \"b2b_icon-person-development\" | \"b2b_icon-person-female\" | \"b2b_icon-person-info\" | \"b2b_icon-person-male\" | \"b2b_icon-person-rating\" | \"b2b_icon-person-support\" | \"b2b_icon-person-switch\" | \"b2b_icon-person-workshop\" | \"b2b_icon-person\" | \"b2b_icon-phone-permission\" | \"b2b_icon-phone\" | \"b2b_icon-pig\" | \"b2b_icon-pin\" | \"b2b_icon-pinch-gesture\" | \"b2b_icon-pinch\" | \"b2b_icon-pistachio\" | \"b2b_icon-plant\" | \"b2b_icon-play-1\" | \"b2b_icon-play\" | \"b2b_icon-plus\" | \"b2b_icon-price-alert\" | \"b2b_icon-price-tag\" | \"b2b_icon-print\" | \"b2b_icon-puzzle\" | \"b2b_icon-qr-code\" | \"b2b_icon-question-hint\" | \"b2b_icon-question\" | \"b2b_icon-rating-empty\" | \"b2b_icon-rating-filled\" | \"b2b_icon-rating-half\" | \"b2b_icon-rating-order\" | \"b2b_icon-rating-payment\" | \"b2b_icon-remote-work\" | \"b2b_icon-repair\" | \"b2b_icon-reply\" | \"b2b_icon-retirement-provision\" | \"b2b_icon-rocket\" | \"b2b_icon-rye\" | \"b2b_icon-sabbatical\" | \"b2b_icon-sale\" | \"b2b_icon-save\" | \"b2b_icon-sea\" | \"b2b_icon-search-enter\" | \"b2b_icon-search\" | \"b2b_icon-seo\" | \"b2b_icon-service-info\" | \"b2b_icon-sesame\" | \"b2b_icon-settings\" | \"b2b_icon-share-ios\" | \"b2b_icon-share\" | \"b2b_icon-sheep\" | \"b2b_icon-shell\" | \"b2b_icon-shirt\" | \"b2b_icon-shopping-cart-euro\" | \"b2b_icon-shopping-cart\" | \"b2b_icon-show\" | \"b2b_icon-smiley-angry\" | \"b2b_icon-smiley-happy\" | \"b2b_icon-smiley-negative\" | \"b2b_icon-smiley-neutral\" | \"b2b_icon-smiley-positive\" | \"b2b_icon-sms-info\" | \"b2b_icon-sneaker\" | \"b2b_icon-sort-ascending\" | \"b2b_icon-sort-descending\" | \"b2b_icon-sort\" | \"b2b_icon-soy\" | \"b2b_icon-spelt\" | \"b2b_icon-stationary\" | \"b2b_icon-studies\" | \"b2b_icon-success\" | \"b2b_icon-sustainable-delivery\" | \"b2b_icon-sustainable-energy-efficient\" | \"b2b_icon-sustainable-production\" | \"b2b_icon-sustainable-recycling\" | \"b2b_icon-sustainable-resource\" | \"b2b_icon-swipe-gesture\" | \"b2b_icon-sync-device\" | \"b2b_icon-t-shirt\" | \"b2b_icon-tablet\" | \"b2b_icon-tableware\" | \"b2b_icon-target-group\" | \"b2b_icon-teddy\" | \"b2b_icon-test-result\" | \"b2b_icon-town\" | \"b2b_icon-trash\" | \"b2b_icon-trend-down\" | \"b2b_icon-trend-up\" | \"b2b_icon-trousers\" | \"b2b_icon-trusted\" | \"b2b_icon-unpin\" | \"b2b_icon-upload\" | \"b2b_icon-user-management\" | \"b2b_icon-vacation\" | \"b2b_icon-variant-content\" | \"b2b_icon-vegan\" | \"b2b_icon-vegetarian\" | \"b2b_icon-viewtoggle-tiles\" | \"b2b_icon-village\" | \"b2b_icon-volume-off\" | \"b2b_icon-volume-on\" | \"b2b_icon-voucher\" | \"b2b_icon-walnut\" | \"b2b_icon-warning\" | \"b2b_icon-warranty\" | \"b2b_icon-washing-machine\" | \"b2b_icon-whatsapp\" | \"b2b_icon-wheat\" | \"b2b_icon-wifi\" | \"b2b_icon-wishlist-active\" | \"b2b_icon-wishlist\" | \"b2b_icon-work-life\" | \"b2b_icon-workshop\" | \"b2b_icon-zoom-in\" | \"b2b_icon-zoom-out\" | \"b2b_logo-carrier-dhl\" | \"b2b_logo-carrier-gls\" | \"b2b_logo-carrier-hermes\" | \"b2b_logo-carrier-ups\"",
           "references": {
             "IconName": {
               "location": "import",
-              "path": "./types"
+              "path": "./types",
+              "id": "src/components/icon/types.ts::IconName"
             }
           }
         },

package/dist/collection/components/icon/icon.spec.js

@@ -1,6 +1,6 @@
-import { newSpecPage } from '@stencil/core/testing';
-import { h } from '@stencil/core';
-import { B2bIcon } from './icon';
+import { newSpecPage } from "@stencil/core/testing";
+import { h } from "@stencil/core";
+import { B2bIcon } from "./icon";
 it('should render the icon with default values', async () => {
   const page = await newSpecPage({
     components: [B2bIcon],