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

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

@@ -0,0 +1,67 @@
+import { Host, h, } from "@stencil/core";
+export class B2bBreadCrumbComponent {
+  constructor() {
+    this.getBreadcrumbItems = () => {
+      return Array.from(this.host.querySelectorAll('b2b-breadcrumb-item'));
+    };
+    this.updateActiveItem = (newItem) => {
+      this.getBreadcrumbItems()
+        .filter(x => x.value != newItem.value)
+        .forEach(x => (x.active = false));
+    };
+  }
+  onSelectedChange(event) {
+    const item = event.target;
+    this.updateActiveItem(item);
+    this.b2bSelected.emit({ value: item.value });
+  }
+  render() {
+    return (h(Host, null, h("div", { class: "b2b-breadcrumb-nav" }, h("slot", null))));
+  }
+  static get is() { return "b2b-breadcrumb"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["breadcrumb.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["breadcrumb.css"]
+    };
+  }
+  static get events() {
+    return [{
+        "method": "b2bSelected",
+        "name": "b2b-selected",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emits the value of the currently selected item whenever an item is selected."
+        },
+        "complexType": {
+          "original": "BreadCrumbChangeEventDetail",
+          "resolved": "BreadCrumbChangeEventDetail<any>",
+          "references": {
+            "BreadCrumbChangeEventDetail": {
+              "location": "import",
+              "path": "../../utils/interfaces/interaction.interface",
+              "id": "src/utils/interfaces/interaction.interface.d.ts::BreadCrumbChangeEventDetail"
+            }
+          }
+        }
+      }];
+  }
+  static get elementRef() { return "host"; }
+  static get listeners() {
+    return [{
+        "name": "b2b-change",
+        "method": "onSelectedChange",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }];
+  }
+}

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

@@ -0,0 +1,22 @@
+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 defaultArgs = {
+  href: 'https://www.otto.de',
+  active: true,
+};
+export const story010Default = Template.bind({});
+story010Default.args = Object.assign({}, defaultArgs);
+story010Default.storyName = 'Default Breadcrumb';
+const breadcrumbArgs = getArgTypes('b2b-breadcrumb');
+export default {
+  title: 'Components/Interaction/Breadcrumb',
+  argTypes: breadcrumbArgs,
+  viewMode: 'docs',
+};

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 22 Aug 2023 12:55:37 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 Tue, 22 Aug 2023 12:55:37 GMT
+ * Generated on Mon, 13 Nov 2023 12:54:56 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */
@@ -284,8 +284,9 @@
   border: 0.125rem solid rgba(51, 51, 51, 0.2);
   border-top: 0.125rem solid var(--b2b-color-copy-default);
 }
-:host button:disabled,
-:host a:disabled {
+:host button:disabled, :host button.disabled,
+:host a:disabled,
+:host a.disabled {
   cursor: default;
   pointer-events: none;
   background-color: var(--b2b-color-grey-50);
@@ -294,9 +295,12 @@
   color: var(--b2b-color-grey-250);
 }
 :host button:disabled [slot=start],
-:host button:disabled [slot=end],
+:host button:disabled [slot=end], :host button.disabled [slot=start],
+:host button.disabled [slot=end],
 :host a:disabled [slot=start],
-:host a:disabled [slot=end] {
+:host a:disabled [slot=end],
+:host a.disabled [slot=start],
+:host a.disabled [slot=end] {
   fill: var(--b2b-color-grey-250);
 }
 :host button:focus,

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

@@ -1,4 +1,4 @@
-import { newE2EPage } from '@stencil/core/testing';
+import { newE2EPage } from "@stencil/core/testing";
 describe('B2B-Button', () => {
   let page;
   beforeEach(async () => {
@@ -33,10 +33,10 @@ describe('B2B-Button', () => {
     expect(eventSpy).not.toHaveReceivedEvent();
   });
   it('should support form submission from shadow dom', async () => {
-    const form = `
-      <form>
-        <b2b-button type='submit'>Hello World</b2b-button>
-      </form>
+    const form = `
+      <form>
+        <b2b-button type='submit'>Hello World</b2b-button>
+      </form>
     `;
     page = await newE2EPage();
     await page.setContent(form);
@@ -48,26 +48,26 @@ describe('B2B-Button', () => {
   });
   it('should reduce padding on the button if there is only an icon', async () => {
     page = await newE2EPage();
-    await page.setContent(`<b2b-button variant="primary" size="100">
-    <b2b-icon slot="end" icon="b2b_icon-check" size="100"></b2b-icon>
+    await page.setContent(`<b2b-button variant="primary" size="100">
+    <b2b-icon slot="end" icon="b2b_icon-check" size="100"></b2b-icon>
   </b2b-button>`);
     const button = await page.find('b2b-button');
     expect(button).toHaveClass('b2b-button--icon-only');
   });
   it('should not reduce padding on the button if there is text', async () => {
     page = await newE2EPage();
-    await page.setContent(`<b2b-button variant="primary" size="100">
-    <span>Hello World</span>
-    <b2b-icon slot="end" icon="b2b_icon-check" size="100"></b2b-icon>
+    await page.setContent(`<b2b-button variant="primary" size="100">
+    <span>Hello World</span>
+    <b2b-icon slot="end" icon="b2b_icon-check" size="100"></b2b-icon>
   </b2b-button>`);
     const button = await page.find('b2b-button');
     expect(button).not.toHaveClass('b2b-button--icon-only');
   });
   it('should not submit a form when the button is not of type submit', async () => {
-    const form = `
-      <form>
-        <b2b-button>Hello World</b2b-button>
-      </form>
+    const form = `
+      <form>
+        <b2b-button>Hello World</b2b-button>
+      </form>
     `;
     page = await newE2EPage();
     await page.setContent(form);

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

@@ -1,4 +1,4 @@
-import { h, Host, } from '@stencil/core';
+import { h, Host, } from "@stencil/core";
 export class ButtonComponent {
   constructor() {
     this.canLoad = () => {
@@ -237,7 +237,7 @@ export class ButtonComponent {
         "optional": true,
         "docs": {
           "tags": [],
-          "text": "If set to true, the browser will attempt to donwload and save the URL instead of opening it. The name of the created file\ndefaults to the URL string, but can be changed by the user."
+          "text": "If set to true, the browser will attempt to donwload and save the URL instead of opening it. The name of the created file\r\ndefaults to the URL string, but can be changed by the user."
         },
         "attribute": "download",
         "reflect": false
@@ -273,7 +273,8 @@ export class ButtonComponent {
           "parameters": [],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void>"

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

@@ -1,88 +1,144 @@
-import { html } from 'lit-html';
-import buttonDocs from './button.docs.mdx';
-import { getArgTypes } from '../../docs/config/utils';
-const Template = ({ variant, size, disabled, loading, content, type, href, download, target, }) => {
-  const label = content ? content : 'Details';
-  return html `<b2b-button
-    variant="${variant}"
-    size="${size}"
-    disabled="${disabled}"
-    loading="${loading}"
-    type="${type}"
-    .href="${href}"
-    download="${download}"
-    target="${target}">
-    ${label}
+var __rest = (this && this.__rest) || function (s, e) {
+  var t = {};
+  for (var p in s)
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+      t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+        t[p[i]] = s[p[i]];
+    }
+  return t;
+};
+import { html } from "lit-html";
+import { getArgTypes } from "../../docs/config/utils";
+const meta = {
+  title: 'Components/Interaction/Button',
+  component: 'b2b-button',
+  args: {
+    variant: 'secondary',
+    type: 'button',
+    size: '100',
+    disabled: false,
+    loading: false,
+    active: false,
+    target: 'self',
+    label: 'B2B Button',
+  },
+  argTypes: getArgTypes('b2b-button'),
+  render: (_a) => {
+    var args = __rest(_a, []);
+    return html `<b2b-button
+    variant="${args.variant}"
+    size="${args.size}"
+    disabled="${args.disabled}"
+    loading="${args.loading}"
+    type="${args.type}">
+    ${args.label}
   </b2b-button>`;
+  },
 };
-const defaultArgs = {
-  variant: 'secondary',
-  size: '100',
-  disabled: false,
-  loading: false,
-  type: 'button',
-  href: undefined,
-  target: 'blank',
-  download: null,
+export default meta;
+export const Primary = {
+  args: Object.assign(Object.assign({}, meta.args), { variant: 'primary', label: 'Primary' }),
 };
-export const story010Secondary = Template.bind({});
-story010Secondary.args = Object.assign({}, defaultArgs);
-story010Secondary.storyName = 'Secondary';
-export const story020Primary = Template.bind({});
-story020Primary.args = Object.assign(Object.assign({}, defaultArgs), { variant: 'primary', content: 'Primary' });
-story020Primary.storyName = 'Primary';
-export const story030Loading = Template.bind({});
-story030Loading.args = Object.assign(Object.assign({}, defaultArgs), { variant: 'primary', loading: true, content: 'Primary' });
-story030Loading.storyName = 'Loading';
-export const story040IconStart = Template.bind({});
-const iconStartContent = html `<b2b-icon
-    slot="start"
-    icon="b2b_icon-check"
-    size="100"
-    color="inherit"></b2b-icon>
-  Text`;
-story040IconStart.args = Object.assign(Object.assign({}, defaultArgs), { variant: 'primary', content: iconStartContent });
-story040IconStart.storyName = 'Button With Icon Start';
-export const story050IconEnd = Template.bind({});
-const iconEndContent = html `Text
-  <b2b-icon
-    slot="end"
-    icon="b2b_icon-check"
-    size="100"
-    color="inherit"></b2b-icon>`;
-story050IconEnd.args = Object.assign(Object.assign({}, defaultArgs), { variant: 'primary', content: iconEndContent });
-story050IconEnd.storyName = 'Button With Icon End';
-export const story055IconStartPali = Template.bind({});
-const iconStartPaliContent = html `<i class="obc_icon-check obc_mr-1"></i> Icon
-  Button`;
-story055IconStartPali.args = Object.assign(Object.assign({}, defaultArgs), { variant: 'primary', content: iconStartPaliContent });
-story055IconStartPali.storyName = 'Button With Pali Icon';
-export const story060IconSearch = Template.bind({});
-const iconSearchContent = html `<b2b-icon
-  icon="b2b_icon-check"
-  size="100"
-  color="primary"></b2b-icon>`;
-story060IconSearch.args = Object.assign(Object.assign({}, defaultArgs), { variant: 'secondary', content: iconSearchContent });
-story060IconSearch.storyName = 'Icon Only Button';
-export const story070Disabled = Template.bind({});
-story070Disabled.args = Object.assign(Object.assign({}, defaultArgs), { variant: 'primary', disabled: true, content: 'Primary has grey color when disabled' });
-story070Disabled.storyName = 'Disabled';
-export const story080Anchor = Template.bind({});
-story080Anchor.args = Object.assign(Object.assign({}, defaultArgs), { href: 'https://www.otto.de', content: 'Anchor Button' });
-story080Anchor.storyName = 'Anchor Button';
-const controls = {
-  variant: 'radio',
+export const Secondary = {
+  args: Object.assign(Object.assign({}, meta.args), { label: 'Secondary' }),
 };
-const buttonArgs = getArgTypes('b2b-button', controls);
-export default {
-  title: 'Components/Interaction/Button',
-  argTypes: Object.assign(Object.assign({}, buttonArgs), { content: {
-      control: false,
-    } }),
-  viewMode: 'docs',
-  parameters: {
-    docs: {
-      page: buttonDocs,
-    },
+export const Loading = {
+  args: Object.assign(Object.assign({}, meta.args), { loading: true, label: 'Loading' }),
+};
+export const IconStart = {
+  args: Object.assign(Object.assign({}, meta.args), { label: 'Icon Start' }),
+  render: (_a) => {
+    var args = __rest(_a, []);
+    return html `<b2b-button
+    variant="${args.variant}"
+    size="${args.size}"
+    disabled="${args.disabled}"
+    loading="${args.loading}"
+    type="${args.type}">
+    <b2b-icon slot="start" icon="b2b_icon-check" size="100"></b2b-icon>
+    ${args.label}
+  </b2b-button>`;
+  },
+};
+export const IconEnd = {
+  args: Object.assign(Object.assign({}, meta.args), { label: 'Icon End' }),
+  render: (_a) => {
+    var args = __rest(_a, []);
+    return html `<b2b-button
+    variant="${args.variant}"
+    size="${args.size}"
+    disabled="${args.disabled}"
+    loading="${args.loading}"
+    type="${args.type}">
+    ${args.label}
+    <b2b-icon slot="end" icon="b2b_icon-check" size="100"></b2b-icon>
+  </b2b-button>`;
+  },
+};
+export const PaliIcon = {
+  args: Object.assign(Object.assign({}, meta.args), { label: 'Icon from PaLi' }),
+  render: (_a) => {
+    var args = __rest(_a, []);
+    return html `<b2b-button
+    variant="${args.variant}"
+    size="${args.size}"
+    disabled="${args.disabled}"
+    loading="${args.loading}"
+    type="${args.type}">
+    <i slot="start" class="obc_icon-info"></i>
+    ${args.label}
+  </b2b-button>`;
+  },
+};
+export const IconOnly = {
+  args: Object.assign({}, meta.args),
+  render: (_a) => {
+    var args = __rest(_a, []);
+    return html `<b2b-button
+    variant="${args.variant}"
+    size="${args.size}"
+    disabled="${args.disabled}"
+    loading="${args.loading}"
+    type="${args.type}">
+    <b2b-icon slot="end" icon="b2b_icon-search" size="100"></b2b-icon>
+  </b2b-button>`;
+  },
+};
+export const Disabled = {
+  args: Object.assign(Object.assign({}, meta.args), { disabled: true, label: 'Disabled' }),
+};
+export const Anchor = {
+  args: Object.assign({}, meta.args),
+  render: (_a) => {
+    var args = __rest(_a, []);
+    return html `<b2b-button
+    variant="${args.variant}"
+    size="${args.size}"
+    disabled="${args.disabled}"
+    loading="${args.loading}"
+    href="www.otto.de"
+    target="blank"
+    type="${args.type}">
+    Go to otto.de
+  </b2b-button>`;
+  },
+};
+export const DisabledAnchor = {
+  args: Object.assign(Object.assign({}, meta.args), { disabled: true }),
+  render: (_a) => {
+    var args = __rest(_a, []);
+    return html `<b2b-button
+    variant="${args.variant}"
+    size="${args.size}"
+    disabled="${args.disabled}"
+    loading="${args.loading}"
+    href="www.otto.de"
+    target="blank"
+    type="${args.type}">
+    Go to otto.de
+  </b2b-button>`;
   },
 };

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 22 Aug 2023 12:55:37 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 Tue, 22 Aug 2023 12:55:37 GMT
+ * Generated on Mon, 13 Nov 2023 12:54:56 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */

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

@@ -1,4 +1,4 @@
-import { newE2EPage } from '@stencil/core/testing';
+import { newE2EPage } from "@stencil/core/testing";
 describe('B2B-Card', () => {
   let page;
   it('should render the card component', async () => {
@@ -90,9 +90,9 @@ describe('B2B-Card', () => {
   });
   it('should focus on next card when navigating with keyboard and first card has a href value', async () => {
     page = await newE2EPage();
-    await page.setContent(`<div>
-        <b2b-card id='card1' href="www.something.com"></b2b-card>
-        <b2b-card id='card2'>Hello World</b2b-card>
+    await page.setContent(`<div>
+        <b2b-card id='card1' href="www.something.com"></b2b-card>
+        <b2b-card id='card2'>Hello World</b2b-card>
       </div>`);
     await page.keyboard.press('Tab');
     await page.waitForChanges();

package/dist/collection/components/card/card.js

@@ -1,4 +1,4 @@
-import { h, Host, } from '@stencil/core';
+import { h, Host, } from "@stencil/core";
 export class CardComponent {
   constructor() {
     this.disabled = false;

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

@@ -1,18 +1,18 @@
-import { newSpecPage } from '@stencil/core/testing';
-import { h } from '@stencil/core';
-import { CardComponent } from './card';
+import { newSpecPage } from "@stencil/core/testing";
+import { h } from "@stencil/core";
+import { CardComponent } from "./card";
 it('should render the card with default values', async () => {
   const page = await newSpecPage({
     components: [CardComponent],
     template: () => h("b2b-card", null, "B2B Card"),
   });
-  expect(page.root).toEqualHtml(`
-    <b2b-card class="b2b-card" tabindex="0">
-      <mock:shadow-root>
-        <slot></slot>
-      </mock:shadow-root>
-      B2B Card
-    </b2b-card>
+  expect(page.root).toEqualHtml(`
+    <b2b-card class="b2b-card" tabindex="0">
+      <mock:shadow-root>
+        <slot></slot>
+      </mock:shadow-root>
+      B2B Card
+    </b2b-card>
 		`);
 });
 it('should disable the card', async () => {
@@ -20,13 +20,13 @@ it('should disable the card', async () => {
     components: [CardComponent],
     template: () => h("b2b-card", { disabled: true }, "B2B Card"),
   });
-  expect(page.root).toEqualHtml(`
-    <b2b-card tabindex="-1" aria-disabled="true" class="b2b-card b2b-card--disabled">
-      <mock:shadow-root>
-        <div class="b2b-card--disabled-overlay"></div>
-        <slot></slot>
-      </mock:shadow-root>
-      B2B Card
-    </b2b-card>
+  expect(page.root).toEqualHtml(`
+    <b2b-card tabindex="-1" aria-disabled="true" class="b2b-card b2b-card--disabled">
+      <mock:shadow-root>
+        <div class="b2b-card--disabled-overlay"></div>
+        <slot></slot>
+      </mock:shadow-root>
+      B2B Card
+    </b2b-card>
 		`);
 });

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

@@ -1,14 +1,13 @@
-import { html } from 'lit-html';
-import cardDocs from './card.docs.mdx';
-import { getArgTypes } from '../../docs/config/utils';
+import { html } from "lit-html";
+import { getArgTypes } from "../../docs/config/utils";
 const Template = ({ disabled, href, target }) => {
-  return html `<b2b-card disabled="${disabled}" href=${href} target="${target}">
-    <b2b-headline size="100">An Interactive Card</b2b-headline>
-    <b2b-paragraph
-      >You can hover over me or press tab on your keyboard to see me pop out. I
-      fill up to 100% of my parent element, so you can use me in a
-      grid.</b2b-paragraph
-    >
+  return html `<b2b-card disabled="${disabled}" href=${href} target="${target}">
+    <b2b-headline size="100">An Interactive Card</b2b-headline>
+    <b2b-paragraph
+      >You can hover over me or press tab on your keyboard to see me pop out. I
+      fill up to 100% of my parent element, so you can use me in a
+      grid.</b2b-paragraph
+    >
   </b2b-card>`;
 };
 const defaultArgs = {
@@ -33,9 +32,4 @@ export default {
   title: 'Components/Interaction/Card',
   argTypes: Object.assign({}, cardArgs),
   viewMode: 'docs',
-  parameters: {
-    docs: {
-      page: cardDocs,
-    },
-  },
 };

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 22 Aug 2023 12:55:37 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 Tue, 22 Aug 2023 12:55:37 GMT
+ * Generated on Mon, 13 Nov 2023 12:54:56 GMT
  */
 :root [data-theme="dark"] {
   --b2b-size-200: 5rem; /* 80px */
@@ -305,12 +305,12 @@
   background-color: var(--b2b-color-black-100);
 }
 .b2b-checkbox--indeterminate .b2b-checkbox__icon {
-  margin-top: var(--b2b-size-5);
-  margin-left: var(--b2b-size-5);
+  margin-top: 9px;
+  margin-left: var(--b2b-size-7);
   display: inline-block;
 }
 .b2b-checkbox--indeterminate.b2b-checkbox--standalone .b2b-checkbox__icon {
-  margin-top: var(--b2b-size-1);
+  margin-top: 7px;
 }
 /* stylelint-disable selector-class-pattern */
 .b2b-checkbox.b2b-checkbox--disabled.b2b-checkbox--checked .b2b-checkbox__input {

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

@@ -1,4 +1,4 @@
-import { newE2EPage } from '@stencil/core/testing';
+import { newE2EPage } from "@stencil/core/testing";
 describe('b2b-checkbox', () => {
   it('renders', async () => {
     const page = await newE2EPage();

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

@@ -1,4 +1,4 @@
-import { h, Host, } from '@stencil/core';
+import { h, Host, } from "@stencil/core";
 export class CheckboxComponent {
   constructor() {
     this.handleFormData = (event) => {
@@ -39,7 +39,7 @@ export class CheckboxComponent {
     };
     this.renderIcon = () => {
       if (this.indeterminate) {
-        return (h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 11 1", class: "b2b-checkbox__icon" }, h("path", { d: "M8.5 0H0.5C0.223633 0 0 0.223633 0 0.5C0 0.776367 0.223633 1 0.5 1H8.5C8.77637 1 9 0.776367 9 0.5C9 0.223633 8.77637 0 8.5 0Z", fill: "white" })));
+        return (h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 12 12", class: "b2b-checkbox__icon" }, h("path", { d: "M8.5 0H0.5C0.223633 0 0 0.223633 0 0.5C0 0.776367 0.223633 1 0.5 1H8.5C8.77637 1 9 0.776367 9 0.5C9 0.223633 8.77637 0 8.5 0Z", fill: "white" })));
       }
       if (this.checked) {
         return (h("svg", { class: "b2b-checkbox__icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { 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" })));
@@ -320,7 +320,8 @@ export class CheckboxComponent {
           "resolved": "FocusEvent",
           "references": {
             "FocusEvent": {
-              "location": "global"
+              "location": "global",
+              "id": "global::FocusEvent"
             }
           }
         }
@@ -339,7 +340,8 @@ export class CheckboxComponent {
           "resolved": "FocusEvent",
           "references": {
             "FocusEvent": {
-              "location": "global"
+              "location": "global",
+              "id": "global::FocusEvent"
             }
           }
         }
@@ -359,7 +361,8 @@ export class CheckboxComponent {
           "references": {
             "CheckboxEventDetail": {
               "location": "import",
-              "path": "../../utils/interfaces/form.interface"
+              "path": "../../utils/interfaces/form.interface",
+              "id": "src/utils/interfaces/form.interface.d.ts::CheckboxEventDetail"
             }
           }
         }