@six-group/ui-library 0.0.0-insider.cd0cd0d → 0.0.0-insider.d82aaa2

package/dist/collection/components/six-item-picker/test/six-item-picker.spec.js

@@ -0,0 +1,90 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixItemPicker } from "../six-item-picker";
+describe('six-item-picker', () => {
+  it('should render default', async () => {
+    // given
+    const page = await newSpecPage({
+      components: [SixItemPicker],
+      html: `<six-item-picker></six-item-picker>`,
+    });
+    // then
+    expect(page.root).toEqualHtml(`
+<six-item-picker roundtrip="" step="1" value="0">
+  <mock:shadow-root>
+    <div class="item_picker__container" part="container">
+      <div class="item_picker__btn" part="up">
+        <six-icon size="large">
+          expand_less
+        </six-icon>
+      </div>
+      <div class="item_picker__content" part="content">
+        0
+      </div>
+      <div class="item_picker__btn" part="down">
+        <six-icon size="large">
+          expand_more
+        </six-icon>
+      </div>
+    </div>
+  </mock:shadow-root>
+</six-item-picker>`);
+  });
+  it('should render number picker with correct attributes', async () => {
+    // given
+    const page = await newSpecPage({
+      components: [SixItemPicker],
+      html: `<six-item-picker value="5" step="5" min="3" max="13" roundtrip="false"></six-item-picker>`,
+    });
+    // then
+    expect(page.root).toEqualHtml(`
+<six-item-picker max="13" min="3" roundtrip="false" step="5" value="5">
+  <mock:shadow-root>
+    <div class="item_picker__container" part="container">
+      <div class="item_picker__btn" part="up">
+        <six-icon size="large">
+          expand_less
+        </six-icon>
+      </div>
+      <div class="item_picker__content" part="content">
+        5
+      </div>
+      <div class="item_picker__btn item_picker__btn--disabled" part="down">
+        <six-icon size="large">
+          expand_more
+        </six-icon>
+      </div>
+    </div>
+  </mock:shadow-root>
+</six-item-picker>
+    `);
+  });
+  it('should render letter picker with correct attributes', async () => {
+    // given
+    const page = await newSpecPage({
+      components: [SixItemPicker],
+      html: `<six-item-picker type="letter" roundtrip="false" min="c" max="k" value="d"></six-item-picker>`,
+    });
+    // then
+    expect(page.root).toEqualHtml(`
+<six-item-picker max="k" min="c" roundtrip="false" step="1" type="letter" value="d">
+  <mock:shadow-root>
+    <div class="item_picker__container" part="container">
+      <div class="item_picker__btn" part="up">
+        <six-icon size="large">
+          expand_less
+        </six-icon>
+      </div>
+      <div class="item_picker__content" part="content">
+        d
+      </div>
+      <div class="item_picker__btn" part="down">
+        <six-icon size="large">
+          expand_more
+        </six-icon>
+      </div>
+    </div>
+  </mock:shadow-root>
+</six-item-picker>`);
+  });
+});
+//# sourceMappingURL=six-item-picker.spec.js.map

package/dist/collection/components/six-item-picker/test/six-item-picker.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"six-item-picker.spec.js","sourceRoot":"","sources":["../../../../src/components/six-item-picker/test/six-item-picker.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;EAC/B,EAAE,CAAC,uBAAuB,EAAE,KAAK,IAAI,EAAE;IACrC,QAAQ;IACR,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;MAC3B,IAAI,EAAE,qCAAqC;KAC5C,CAAC,CAAC;IAEH,OAAO;IACP,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;mBAmBf,CAAC,CAAC;EACnB,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,qDAAqD,EAAE,KAAK,IAAI,EAAE;IACnE,QAAQ;IACR,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;MAC3B,IAAI,EAAE,2FAA2F;KAClG,CAAC,CAAC;IAEH,OAAO;IACP,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;KAoB7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,qDAAqD,EAAE,KAAK,IAAI,EAAE;IACnE,QAAQ;IACR,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;MAC3B,IAAI,EAAE,+FAA+F;KACtG,CAAC,CAAC;IAEH,OAAO;IACP,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;mBAmBf,CAAC,CAAC;EACnB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixItemPicker } from '../six-item-picker';\n\ndescribe('six-item-picker', () => {\n  it('should render default', async () => {\n    // given\n    const page = await newSpecPage({\n      components: [SixItemPicker],\n      html: `<six-item-picker></six-item-picker>`,\n    });\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-item-picker roundtrip=\"\" step=\"1\" value=\"0\">\n  <mock:shadow-root>\n    <div class=\"item_picker__container\" part=\"container\">\n      <div class=\"item_picker__btn\" part=\"up\">\n        <six-icon size=\"large\">\n          expand_less\n        </six-icon>\n      </div>\n      <div class=\"item_picker__content\" part=\"content\">\n        0\n      </div>\n      <div class=\"item_picker__btn\" part=\"down\">\n        <six-icon size=\"large\">\n          expand_more\n        </six-icon>\n      </div>\n    </div>\n  </mock:shadow-root>\n</six-item-picker>`);\n  });\n\n  it('should render number picker with correct attributes', async () => {\n    // given\n    const page = await newSpecPage({\n      components: [SixItemPicker],\n      html: `<six-item-picker value=\"5\" step=\"5\" min=\"3\" max=\"13\" roundtrip=\"false\"></six-item-picker>`,\n    });\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-item-picker max=\"13\" min=\"3\" roundtrip=\"false\" step=\"5\" value=\"5\">\n  <mock:shadow-root>\n    <div class=\"item_picker__container\" part=\"container\">\n      <div class=\"item_picker__btn\" part=\"up\">\n        <six-icon size=\"large\">\n          expand_less\n        </six-icon>\n      </div>\n      <div class=\"item_picker__content\" part=\"content\">\n        5\n      </div>\n      <div class=\"item_picker__btn item_picker__btn--disabled\" part=\"down\">\n        <six-icon size=\"large\">\n          expand_more\n        </six-icon>\n      </div>\n    </div>\n  </mock:shadow-root>\n</six-item-picker>\n    `);\n  });\n\n  it('should render letter picker with correct attributes', async () => {\n    // given\n    const page = await newSpecPage({\n      components: [SixItemPicker],\n      html: `<six-item-picker type=\"letter\" roundtrip=\"false\" min=\"c\" max=\"k\" value=\"d\"></six-item-picker>`,\n    });\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-item-picker max=\"k\" min=\"c\" roundtrip=\"false\" step=\"1\" type=\"letter\" value=\"d\">\n  <mock:shadow-root>\n    <div class=\"item_picker__container\" part=\"container\">\n      <div class=\"item_picker__btn\" part=\"up\">\n        <six-icon size=\"large\">\n          expand_less\n        </six-icon>\n      </div>\n      <div class=\"item_picker__content\" part=\"content\">\n        d\n      </div>\n      <div class=\"item_picker__btn\" part=\"down\">\n        <six-icon size=\"large\">\n          expand_more\n        </six-icon>\n      </div>\n    </div>\n  </mock:shadow-root>\n</six-item-picker>`);\n  });\n});\n"]}

package/dist/collection/components/six-language-switcher/six-language-switcher.js

@@ -1,4 +1,4 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 const DEFAULT_LANGUAGES = ['EN', 'DE', 'ES'];
 /*
  * @since 2.2.0
@@ -92,7 +92,8 @@ export class SixLanguageSwitcher {
           "references": {
             "SixLanguageSwitcherInput": {
               "location": "local",
-              "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-language-switcher/six-language-switcher.tsx"
+              "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-language-switcher/six-language-switcher.tsx",
+              "id": "src/components/six-language-switcher/six-language-switcher.tsx::SixLanguageSwitcherInput"
             }
           }
         },
@@ -123,7 +124,8 @@ export class SixLanguageSwitcher {
           "references": {
             "SixLanguageSwitcherChangePayload": {
               "location": "local",
-              "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-language-switcher/six-language-switcher.tsx"
+              "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-language-switcher/six-language-switcher.tsx",
+              "id": "src/components/six-language-switcher/six-language-switcher.tsx::SixLanguageSwitcherChangePayload"
             }
           }
         }

package/dist/collection/components/six-language-switcher/six-language-switcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"six-language-switcher.js","sourceRoot":"","sources":["../../../src/components/six-language-switcher/six-language-switcher.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAa/E,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;AAE7C;;;;;;GAMG;AAMH,MAAM,OAAO,mBAAmB;;IAqCtB,4BAAuB,GAAG,CAAC,WAAmB,EAAE,aAAsB,EAAE,EAAE,CAAC,GAAG,EAAE;MACtF,IAAI,aAAa,KAAK,SAAS,EAAE;QAC/B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;OACpC;WAAM;QACL,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;OAClC;MACD,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC;IAC9B,CAAC,CAAC;;qBAvCyD,iBAAiB;;EAG5E,sBAAsB,CAAC,QAAkB;IACvC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;MAC5B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;KACzD;IAED,IAAI,CAAC,sBAAsB,EAAE,CAAC;EAChC,CAAC;EAMD,iBAAiB;IACf,IAAI,IAAI,CAAC,QAAQ,KAAK,SAAS,EAAE;MAC/B,IAAI,CAAC,sBAAsB,EAAE,CAAC;KAC/B;EACH,CAAC;EAEO,sBAAsB;IAC5B,MAAM,gBAAgB,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IAC3C,IAAI,OAAO,gBAAgB,KAAK,QAAQ,EAAE;MACxC,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC;MACjC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;KACpC;SAAM;MACL,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,GAAG,CAAC;MACrC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;KAC7C;EACH,CAAC;EAWD,MAAM;IACJ,OAAO,CACL,WAAK,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,8BAA8B,IACvD,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;MAClC,MAAM,QAAQ,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;MAC5D,OAAO,CACL,WAAK,OAAO,EAAE,IAAI,CAAC,uBAAuB,CAAC,QAAQ,EAAE,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;QAChG,YACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE;YACL,0BAA0B,EAAE,IAAI;YAChC,oCAAoC,EAAE,IAAI,CAAC,QAAQ,KAAK,QAAQ;WACjE,IAEA,QAAQ,CACJ;QACN,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,CACpC,YAAM,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,8BAA8B,QAEpD,CACR,CACG,CACP,CAAC;IACJ,CAAC,CAAC,CACE,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\n\n/**\n * @since 2.1.0\n * @status experimental\n **/\n\nexport interface SixLanguageSwitcherInput {\n  key: string;\n  value: string;\n}\nexport type SixLanguageSwitcherChangePayload = string;\n\nconst DEFAULT_LANGUAGES = ['EN', 'DE', 'ES'];\n\n/*\n * @since 2.2.0\n * @status experimental\n * @part container - The whole component container\n * @part label - The language label\n * @part separator - The separator between the language labels\n */\n@Component({\n  tag: 'six-language-switcher',\n  styleUrl: 'six-language-switcher.scss',\n  shadow: true,\n})\nexport class SixLanguageSwitcher {\n  /** The language which should be shown as selected */\n  @Prop({ mutable: true, reflect: true }) selected?: string;\n\n  /** The languages which should be selectable options. */\n  @Prop() languages: string[] | SixLanguageSwitcherInput[] = DEFAULT_LANGUAGES;\n\n  @Watch('languages')\n  handleChangesLanguages(newValue: string[]) {\n    if (!Array.isArray(newValue)) {\n      throw new Error('languages is expected to be an array');\n    }\n\n    this.updateSelectedLanguage();\n  }\n  /**\n   * Emitted when the language switchers value changes\n   */\n  @Event({ eventName: 'six-language-switcher-change' }) sixChange!: EventEmitter<SixLanguageSwitcherChangePayload>;\n\n  componentWillLoad() {\n    if (this.selected === undefined) {\n      this.updateSelectedLanguage();\n    }\n  }\n\n  private updateSelectedLanguage() {\n    const selectedLanguage = this.languages[0];\n    if (typeof selectedLanguage === 'string') {\n      this.selected = selectedLanguage;\n      this.sixChange.emit(this.selected);\n    } else {\n      this.selected = selectedLanguage.key;\n      this.sixChange.emit(selectedLanguage.value);\n    }\n  }\n\n  private handleLanguageSwitching = (newLanguage: string, languageValue?: string) => () => {\n    if (languageValue !== undefined) {\n      this.sixChange.emit(languageValue);\n    } else {\n      this.sixChange.emit(newLanguage);\n    }\n    this.selected = newLanguage;\n  };\n\n  render() {\n    return (\n      <div part=\"container\" class=\"language-switcher__container\">\n        {this.languages.map((lang, index) => {\n          const language = typeof lang === 'string' ? lang : lang.key;\n          return (\n            <div onClick={this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value)}>\n              <span\n                part=\"label\"\n                class={{\n                  'language-switcher__label': true,\n                  'language-switcher__label--selected': this.selected === language,\n                }}\n              >\n                {language}\n              </span>\n              {index < this.languages.length - 1 && (\n                <span part=\"separator\" class=\"language-switcher__separator\">\n                  /\n                </span>\n              )}\n            </div>\n          );\n        })}\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"six-language-switcher.js","sourceRoot":"","sources":["../../../src/components/six-language-switcher/six-language-switcher.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAa/E,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;AAE7C;;;;;;GAMG;AAMH,MAAM,OAAO,mBAAmB;;IAqCtB,4BAAuB,GAAG,CAAC,WAAmB,EAAE,aAAsB,EAAE,EAAE,CAAC,GAAG,EAAE;MACtF,IAAI,aAAa,KAAK,SAAS,EAAE;QAC/B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;OACpC;WAAM;QACL,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;OAClC;MACD,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC;IAC9B,CAAC,CAAC;;qBAvCyD,iBAAiB;;EAG5E,sBAAsB,CAAC,QAAkB;IACvC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;MAC5B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;KACzD;IAED,IAAI,CAAC,sBAAsB,EAAE,CAAC;EAChC,CAAC;EAMD,iBAAiB;IACf,IAAI,IAAI,CAAC,QAAQ,KAAK,SAAS,EAAE;MAC/B,IAAI,CAAC,sBAAsB,EAAE,CAAC;KAC/B;EACH,CAAC;EAEO,sBAAsB;IAC5B,MAAM,gBAAgB,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IAC3C,IAAI,OAAO,gBAAgB,KAAK,QAAQ,EAAE;MACxC,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC;MACjC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;KACpC;SAAM;MACL,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,GAAG,CAAC;MACrC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;KAC7C;EACH,CAAC;EAWD,MAAM;IACJ,OAAO,CACL,WAAK,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,8BAA8B,IACvD,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;MAClC,MAAM,QAAQ,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;MAC5D,OAAO,CACL,WAAK,OAAO,EAAE,IAAI,CAAC,uBAAuB,CAAC,QAAQ,EAAE,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;QAChG,YACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE;YACL,0BAA0B,EAAE,IAAI;YAChC,oCAAoC,EAAE,IAAI,CAAC,QAAQ,KAAK,QAAQ;WACjE,IAEA,QAAQ,CACJ;QACN,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,CACpC,YAAM,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,8BAA8B,QAEpD,CACR,CACG,CACP,CAAC;IACJ,CAAC,CAAC,CACE,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\n\n/**\n * @since 2.1.0\n * @status experimental\n **/\n\nexport interface SixLanguageSwitcherInput {\n  key: string;\n  value: string;\n}\nexport type SixLanguageSwitcherChangePayload = string;\n\nconst DEFAULT_LANGUAGES = ['EN', 'DE', 'ES'];\n\n/*\n * @since 2.2.0\n * @status experimental\n * @part container - The whole component container\n * @part label - The language label\n * @part separator - The separator between the language labels\n */\n@Component({\n  tag: 'six-language-switcher',\n  styleUrl: 'six-language-switcher.scss',\n  shadow: true,\n})\nexport class SixLanguageSwitcher {\n  /** The language which should be shown as selected */\n  @Prop({ mutable: true, reflect: true }) selected?: string;\n\n  /** The languages which should be selectable options. */\n  @Prop() languages: string[] | SixLanguageSwitcherInput[] = DEFAULT_LANGUAGES;\n\n  @Watch('languages')\n  handleChangesLanguages(newValue: string[]) {\n    if (!Array.isArray(newValue)) {\n      throw new Error('languages is expected to be an array');\n    }\n\n    this.updateSelectedLanguage();\n  }\n  /**\n   * Emitted when the language switchers value changes\n   */\n  @Event({ eventName: 'six-language-switcher-change' }) sixChange!: EventEmitter<SixLanguageSwitcherChangePayload>;\n\n  componentWillLoad() {\n    if (this.selected === undefined) {\n      this.updateSelectedLanguage();\n    }\n  }\n\n  private updateSelectedLanguage() {\n    const selectedLanguage = this.languages[0];\n    if (typeof selectedLanguage === 'string') {\n      this.selected = selectedLanguage;\n      this.sixChange.emit(this.selected);\n    } else {\n      this.selected = selectedLanguage.key;\n      this.sixChange.emit(selectedLanguage.value);\n    }\n  }\n\n  private handleLanguageSwitching = (newLanguage: string, languageValue?: string) => () => {\n    if (languageValue !== undefined) {\n      this.sixChange.emit(languageValue);\n    } else {\n      this.sixChange.emit(newLanguage);\n    }\n    this.selected = newLanguage;\n  };\n\n  render() {\n    return (\n      <div part=\"container\" class=\"language-switcher__container\">\n        {this.languages.map((lang, index) => {\n          const language = typeof lang === 'string' ? lang : lang.key;\n          return (\n            <div onClick={this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value)}>\n              <span\n                part=\"label\"\n                class={{\n                  'language-switcher__label': true,\n                  'language-switcher__label--selected': this.selected === language,\n                }}\n              >\n                {language}\n              </span>\n              {index < this.languages.length - 1 && (\n                <span part=\"separator\" class=\"language-switcher__separator\">\n                  /\n                </span>\n              )}\n            </div>\n          );\n        })}\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/six-language-switcher/test/six-language-switcher.spec.js

@@ -0,0 +1,196 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixLanguageSwitcher } from "../six-language-switcher";
+describe('SIX Language Switcher', () => {
+  it('should properly render with default settings', async () => {
+    var _a;
+    // given
+    const config = {
+      components: [SixLanguageSwitcher],
+      html: `<six-language-switcher></six-language-switcher>`,
+    };
+    // when
+    const page = await newSpecPage(config);
+    // then
+    expect((_a = page === null || page === void 0 ? void 0 : page.root) === null || _a === void 0 ? void 0 : _a.selected).toEqual('EN');
+    expect(page.root).toEqualHtml(`
+    <six-language-switcher selected="EN">
+      <mock:shadow-root>
+        <div class="language-switcher__container" part="container">
+          <div>
+            <span class="language-switcher__label language-switcher__label--selected" part="label">
+              EN
+            </span>
+            <span class="language-switcher__separator" part="separator">
+              /
+            </span>
+          </div>
+          <div>
+            <span class="language-switcher__label" part="label">
+              DE
+            </span>
+            <span class="language-switcher__separator" part="separator">
+              /
+            </span>
+          </div>
+          <div>
+            <span class="language-switcher__label" part="label">
+              ES
+            </span>
+          </div>
+        </div>
+      </mock:shadow-root>
+    </six-language-switcher>
+    `);
+  });
+  it('should allow to set custom languages', async () => {
+    var _a;
+    // given
+    const config = {
+      components: [SixLanguageSwitcher],
+      html: `<six-language-switcher></six-language-switcher>`,
+    };
+    // when
+    const page = await newSpecPage(config);
+    if ((page === null || page === void 0 ? void 0 : page.root) != null) {
+      page.root.languages = ['IT', 'AR', 'BG'];
+    }
+    await page.waitForChanges();
+    // then
+    expect((_a = page === null || page === void 0 ? void 0 : page.root) === null || _a === void 0 ? void 0 : _a.selected).toEqual('IT');
+    expect(page.root).toEqualHtml(`
+    <six-language-switcher selected="IT">
+      <mock:shadow-root>
+        <div class="language-switcher__container" part="container">
+          <div>
+            <span class="language-switcher__label language-switcher__label--selected" part="label">
+              IT
+            </span>
+            <span class="language-switcher__separator" part="separator">
+              /
+            </span>
+          </div>
+          <div>
+            <span class="language-switcher__label" part="label">
+              AR
+            </span>
+            <span class="language-switcher__separator" part="separator">
+              /
+            </span>
+          </div>
+          <div>
+            <span class="language-switcher__label" part="label">
+              BG
+            </span>
+          </div>
+        </div>
+      </mock:shadow-root>
+    </six-language-switcher>
+    `);
+  });
+  it('should properly set selected language', async () => {
+    var _a;
+    // given
+    const config = {
+      components: [SixLanguageSwitcher],
+      html: `<six-language-switcher selected="DE"></six-language-switcher>`,
+    };
+    // when
+    const page = await newSpecPage(config);
+    // then
+    expect((_a = page === null || page === void 0 ? void 0 : page.root) === null || _a === void 0 ? void 0 : _a.selected).toEqual('DE');
+    expect(page.root).toEqualHtml(`
+    <six-language-switcher selected="DE">
+      <mock:shadow-root>
+        <div class="language-switcher__container" part="container">
+          <div>
+            <span class="language-switcher__label" part="label">
+              EN
+            </span>
+            <span class="language-switcher__separator" part="separator">
+              /
+            </span>
+          </div>
+          <div>
+            <span class="language-switcher__label language-switcher__label--selected" part="label">
+              DE
+            </span>
+            <span class="language-switcher__separator" part="separator">
+              /
+            </span>
+          </div>
+          <div>
+            <span class="language-switcher__label" part="label">
+              ES
+            </span>
+          </div>
+        </div>
+      </mock:shadow-root>
+    </six-language-switcher>
+    `);
+  });
+  it('should properly set language after having been rendered', async () => {
+    var _a;
+    // given
+    const config = {
+      components: [SixLanguageSwitcher],
+      html: `<six-language-switcher></six-language-switcher>`,
+    };
+    // when
+    const page = await newSpecPage(config);
+    if (page.root != null) {
+      page.root.selected = 'DE';
+    }
+    await page.waitForChanges();
+    // then
+    expect((_a = page === null || page === void 0 ? void 0 : page.root) === null || _a === void 0 ? void 0 : _a.selected).toEqual('DE');
+    expect(page.root).toEqualHtml(`
+    <six-language-switcher selected="DE">
+      <mock:shadow-root>
+        <div class="language-switcher__container" part="container">
+          <div>
+            <span class="language-switcher__label" part="label">
+              EN
+            </span>
+            <span class="language-switcher__separator" part="separator">
+              /
+            </span>
+          </div>
+          <div>
+            <span class="language-switcher__label language-switcher__label--selected" part="label">
+              DE
+            </span>
+            <span class="language-switcher__separator" part="separator">
+              /
+            </span>
+          </div>
+          <div>
+            <span class="language-switcher__label" part="label">
+              ES
+            </span>
+          </div>
+        </div>
+      </mock:shadow-root>
+    </six-language-switcher>
+    `);
+  });
+  it('should properly update selected language after languages have been changed', async () => {
+    var _a;
+    // given
+    const config = {
+      components: [SixLanguageSwitcher],
+      html: `<six-language-switcher></six-language-switcher>`,
+    };
+    // when
+    const page = await newSpecPage(config);
+    if (page.root != null) {
+      page.root.languages = ['IT', 'AR', 'BG'];
+    }
+    await page.waitForChanges();
+    if (page.root != null) {
+      page.root.selected = 'BG';
+    }
+    // then
+    expect((_a = page === null || page === void 0 ? void 0 : page.root) === null || _a === void 0 ? void 0 : _a.selected).toEqual('BG');
+  });
+});
+//# sourceMappingURL=six-language-switcher.spec.js.map

package/dist/collection/components/six-language-switcher/test/six-language-switcher.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"six-language-switcher.spec.js","sourceRoot":"","sources":["../../../../src/components/six-language-switcher/test/six-language-switcher.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixLanguageSwitcher } from '../six-language-switcher';\n\ndescribe('SIX Language Switcher', () => {\n  it('should properly render with default settings', async () => {\n    // given\n    const config = {\n      components: [SixLanguageSwitcher],\n      html: `<six-language-switcher></six-language-switcher>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page?.root?.selected).toEqual('EN');\n    expect(page.root).toEqualHtml(`\n    <six-language-switcher selected=\"EN\">\n      <mock:shadow-root>\n        <div class=\"language-switcher__container\" part=\"container\">\n          <div>\n            <span class=\"language-switcher__label language-switcher__label--selected\" part=\"label\">\n              EN\n            </span>\n            <span class=\"language-switcher__separator\" part=\"separator\">\n              /\n            </span>\n          </div>\n          <div>\n            <span class=\"language-switcher__label\" part=\"label\">\n              DE\n            </span>\n            <span class=\"language-switcher__separator\" part=\"separator\">\n              /\n            </span>\n          </div>\n          <div>\n            <span class=\"language-switcher__label\" part=\"label\">\n              ES\n            </span>\n          </div>\n        </div>\n      </mock:shadow-root>\n    </six-language-switcher>\n    `);\n  });\n\n  it('should allow to set custom languages', async () => {\n    // given\n    const config = {\n      components: [SixLanguageSwitcher],\n      html: `<six-language-switcher></six-language-switcher>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n    if (page?.root != null) {\n      page.root.languages = ['IT', 'AR', 'BG'];\n    }\n    await page.waitForChanges();\n\n    // then\n    expect(page?.root?.selected).toEqual('IT');\n    expect(page.root).toEqualHtml(`\n    <six-language-switcher selected=\"IT\">\n      <mock:shadow-root>\n        <div class=\"language-switcher__container\" part=\"container\">\n          <div>\n            <span class=\"language-switcher__label language-switcher__label--selected\" part=\"label\">\n              IT\n            </span>\n            <span class=\"language-switcher__separator\" part=\"separator\">\n              /\n            </span>\n          </div>\n          <div>\n            <span class=\"language-switcher__label\" part=\"label\">\n              AR\n            </span>\n            <span class=\"language-switcher__separator\" part=\"separator\">\n              /\n            </span>\n          </div>\n          <div>\n            <span class=\"language-switcher__label\" part=\"label\">\n              BG\n            </span>\n          </div>\n        </div>\n      </mock:shadow-root>\n    </six-language-switcher>\n    `);\n  });\n\n  it('should properly set selected language', async () => {\n    // given\n    const config = {\n      components: [SixLanguageSwitcher],\n      html: `<six-language-switcher selected=\"DE\"></six-language-switcher>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page?.root?.selected).toEqual('DE');\n    expect(page.root).toEqualHtml(`\n    <six-language-switcher selected=\"DE\">\n      <mock:shadow-root>\n        <div class=\"language-switcher__container\" part=\"container\">\n          <div>\n            <span class=\"language-switcher__label\" part=\"label\">\n              EN\n            </span>\n            <span class=\"language-switcher__separator\" part=\"separator\">\n              /\n            </span>\n          </div>\n          <div>\n            <span class=\"language-switcher__label language-switcher__label--selected\" part=\"label\">\n              DE\n            </span>\n            <span class=\"language-switcher__separator\" part=\"separator\">\n              /\n            </span>\n          </div>\n          <div>\n            <span class=\"language-switcher__label\" part=\"label\">\n              ES\n            </span>\n          </div>\n        </div>\n      </mock:shadow-root>\n    </six-language-switcher>\n    `);\n  });\n\n  it('should properly set language after having been rendered', async () => {\n    // given\n    const config = {\n      components: [SixLanguageSwitcher],\n      html: `<six-language-switcher></six-language-switcher>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n    if (page.root != null) {\n      page.root.selected = 'DE';\n    }\n    await page.waitForChanges();\n\n    // then\n    expect(page?.root?.selected).toEqual('DE');\n    expect(page.root).toEqualHtml(`\n    <six-language-switcher selected=\"DE\">\n      <mock:shadow-root>\n        <div class=\"language-switcher__container\" part=\"container\">\n          <div>\n            <span class=\"language-switcher__label\" part=\"label\">\n              EN\n            </span>\n            <span class=\"language-switcher__separator\" part=\"separator\">\n              /\n            </span>\n          </div>\n          <div>\n            <span class=\"language-switcher__label language-switcher__label--selected\" part=\"label\">\n              DE\n            </span>\n            <span class=\"language-switcher__separator\" part=\"separator\">\n              /\n            </span>\n          </div>\n          <div>\n            <span class=\"language-switcher__label\" part=\"label\">\n              ES\n            </span>\n          </div>\n        </div>\n      </mock:shadow-root>\n    </six-language-switcher>\n    `);\n  });\n\n  it('should properly update selected language after languages have been changed', async () => {\n    // given\n    const config = {\n      components: [SixLanguageSwitcher],\n      html: `<six-language-switcher></six-language-switcher>`,\n    };\n    // when\n    const page = await newSpecPage(config);\n    if (page.root != null) {\n      page.root.languages = ['IT', 'AR', 'BG'];\n    }\n    await page.waitForChanges();\n    if (page.root != null) {\n      page.root.selected = 'BG';\n    }\n\n    // then\n    expect(page?.root?.selected).toEqual('BG');\n  });\n});\n"]}

package/dist/collection/components/six-layout-grid/six-layout-grid.js

@@ -1,4 +1,4 @@
-import { h, Host } from '@stencil/core';
+import { h, Host } from "@stencil/core";
 /**
  * @since 1.01
  * @status stable

package/dist/collection/components/six-layout-grid/test/six-layout-grid.spec.js

@@ -0,0 +1,18 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixLayoutGrid } from "../six-layout-grid";
+describe('six-layout-grid', () => {
+  it('renders', async () => {
+    const page = await newSpecPage({
+      components: [SixLayoutGrid],
+      html: `<six-layout-grid></six-layout-grid>`,
+    });
+    expect(page.root).toEqualHtml(`
+      <six-layout-grid style="--no-of-columns: 12;">
+        <mock:shadow-root>
+          <slot></slot>
+        </mock:shadow-root>
+      </six-layout-grid>
+    `);
+  });
+});
+//# sourceMappingURL=six-layout-grid.spec.js.map

package/dist/collection/components/six-layout-grid/test/six-layout-grid.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"six-layout-grid.spec.js","sourceRoot":"","sources":["../../../../src/components/six-layout-grid/test/six-layout-grid.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;EAC/B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;MAC3B,IAAI,EAAE,qCAAqC;KAC5C,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAM7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixLayoutGrid } from '../six-layout-grid';\n\ndescribe('six-layout-grid', () => {\n  it('renders', async () => {\n    const page = await newSpecPage({\n      components: [SixLayoutGrid],\n      html: `<six-layout-grid></six-layout-grid>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <six-layout-grid style=\"--no-of-columns: 12;\">\n        <mock:shadow-root>\n          <slot></slot>\n        </mock:shadow-root>\n      </six-layout-grid>\n    `);\n  });\n});\n"]}

package/dist/collection/components/six-main-container/six-main-container.js

@@ -1,4 +1,4 @@
-import { h, Host } from '@stencil/core';
+import { h, Host } from "@stencil/core";
 /**
  * @since 1.01
  * @status stable

package/dist/collection/components/six-main-container/test/six-main-container.spec.js

@@ -0,0 +1,22 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixMainContainer } from "../six-main-container";
+describe('six-main-container', () => {
+  it('renders', async () => {
+    const page = await newSpecPage({
+      components: [SixMainContainer],
+      html: `<six-main-container></six-main-container>`,
+    });
+    expect(page.root).toEqualHtml(`
+      <six-main-container>
+        <mock:shadow-root>
+          <div class="left-margin" part="left-margin"></div>
+          <div class="content content--padded" part="content">
+            <slot></slot>
+          </div>
+          <div class="right-margin" part="right-margin"></div>
+        </mock:shadow-root>
+      </six-main-container>
+    `);
+  });
+});
+//# sourceMappingURL=six-main-container.spec.js.map

package/dist/collection/components/six-main-container/test/six-main-container.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"six-main-container.spec.js","sourceRoot":"","sources":["../../../../src/components/six-main-container/test/six-main-container.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;EAClC,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,gBAAgB,CAAC;MAC9B,IAAI,EAAE,2CAA2C;KAClD,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;KAU7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixMainContainer } from '../six-main-container';\n\ndescribe('six-main-container', () => {\n  it('renders', async () => {\n    const page = await newSpecPage({\n      components: [SixMainContainer],\n      html: `<six-main-container></six-main-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <six-main-container>\n        <mock:shadow-root>\n          <div class=\"left-margin\" part=\"left-margin\"></div>\n          <div class=\"content content--padded\" part=\"content\">\n            <slot></slot>\n          </div>\n          <div class=\"right-margin\" part=\"right-margin\"></div>\n        </mock:shadow-root>\n      </six-main-container>\n    `);\n  });\n});\n"]}

package/dist/collection/components/six-menu/six-menu.js

@@ -1,7 +1,7 @@
-import { h } from '@stencil/core';
-import { getTextContent } from '../../utils/slot';
-import { EventListeners } from '../../utils/event-listeners';
-import { debounce } from '../../utils/execution-control';
+import { h } from "@stencil/core";
+import { getTextContent } from "../../utils/slot";
+import { EventListeners } from "../../utils/event-listeners";
+import { debounce } from "../../utils/execution-control";
 const isFocusedMenuItem = (menuItem) => { var _a, _b, _c; return (_c = (_b = (_a = menuItem === null || menuItem === void 0 ? void 0 : menuItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.menu-item')) === null || _b === void 0 ? void 0 : _b.classList) === null || _c === void 0 ? void 0 : _c.contains('menu-item--focused'); };
 const isSIXMenuItemElement = (el) => (el === null || el === void 0 ? void 0 : el.tagName.toLowerCase()) === 'six-menu-item';
 const mapToMenuItem = ({ value, label }) => h("six-menu-item", { value: value }, label);
@@ -259,7 +259,8 @@ export class SixMenu {
           "references": {
             "SixMenuItemData": {
               "location": "local",
-              "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-menu/six-menu.tsx"
+              "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-menu/six-menu.tsx",
+              "id": "src/components/six-menu/six-menu.tsx::SixMenuItemData"
             }
           }
         },
@@ -367,7 +368,8 @@ export class SixMenu {
           "references": {
             "SixMenuItemSelectedPayload": {
               "location": "local",
-              "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-menu/six-menu.tsx"
+              "path": "/home/runner/work/six-webcomponents/six-webcomponents/libraries/ui-library/src/components/six-menu/six-menu.tsx",
+              "id": "src/components/six-menu/six-menu.tsx::SixMenuItemSelectedPayload"
             }
           }
         }
@@ -384,10 +386,12 @@ export class SixMenu {
             }],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             },
             "HTMLSlotElement": {
-              "location": "global"
+              "location": "global",
+              "id": "global::HTMLSlotElement"
             }
           },
           "return": "Promise<void>"

package/dist/collection/components/six-menu/six-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"six-menu.js","sourceRoot":"","sources":["../../../src/components/six-menu/six-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { getTextContent } from '../../utils/slot';\nimport { StyleDeclaration } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { debounce } from '../../utils/execution-control';\n\nexport interface SixMenuItemData {\n  label: string;\n  value: string;\n}\n\nexport interface SixMenuItemSelectedPayload {\n  name: string;\n  item: HTMLSixMenuItemElement;\n}\n\nconst isFocusedMenuItem = (menuItem: HTMLSixMenuItemElement) =>\n  menuItem?.shadowRoot?.querySelector('.menu-item')?.classList?.contains('menu-item--focused');\n\nconst isSIXMenuItemElement = (el?: Element): el is HTMLSixMenuItemElement =>\n  el?.tagName.toLowerCase() === 'six-menu-item';\n\nconst mapToMenuItem = ({ value, label }: SixMenuItemData) => <six-menu-item value={value}>{label}</six-menu-item>;\n\nconst DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING = 5;\n\nconst DEFAULT_SIX_MENU_ITEM_HEIGHT = 64;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The menu's content, including menu items, menu dividers, and menu labels.\n *\n * @part base - The component's base wrapper.\n */\n@Component({\n  tag: 'six-menu',\n  styleUrl: 'six-menu.scss',\n  shadow: true,\n})\nexport class SixMenu {\n  private readonly eventListeners = new EventListeners();\n\n  private menu?: HTMLElement;\n  private menuWrapper?: HTMLElement;\n  private typeToSelectString = '';\n  private typeToSelectTimeout?: number;\n\n  @Element() host!: HTMLSixMenuElement;\n\n  /** Emitted when a menu item is selected. */\n  @Event({ eventName: 'six-menu-item-selected' }) sixMenuItemSelected!: EventEmitter<SixMenuItemSelectedPayload>;\n\n  /** Set to true to remove the box-shadow */\n  @Prop() removeBoxShadow = false;\n\n  /** Set the options to be shown in the dropdown */\n  @Prop() items: SixMenuItemData[] | null = null;\n\n  /** Defines how many items should be shown. If the number of items is larger than this property a scrollbar will be shown */\n  @Prop() itemsShown?: number;\n\n  /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)\n   *  are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */\n  @Prop() virtualScroll = false;\n\n  /**\n   * Used for virtual scrolling\n   * Define how many items should be rendered in the DOM when using virtual scrolling\n   */\n  @Prop() itemSize = 10;\n\n  /**\n   * Used for virtual scrolling\n   * Define the debounce for listening on scrolling changes in milliseconds.\n   * The lower the number the more sensitive the component reacts to scrolling changes.\n   */\n  @Prop() scrollingDebounce = 15;\n\n  /**\n   * Used to calculate which items should be rendered in the DOM\n   */\n  @State()\n  private scrollingIndex = 0;\n\n  // set a default item height, this variable will be updated with the real value after the first render.\n  // However, it's necessary to have a default value because we can only fetch the proper height after the first render\n  @State()\n  sixMenuItemHeight = DEFAULT_SIX_MENU_ITEM_HEIGHT;\n\n  connectedCallback() {\n    this.handleClick = this.handleClick.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  componentWillLoad() {\n    if (this.items === null) {\n      return;\n    }\n  }\n\n  private handleScrolling = () => {\n    if (this.menuWrapper == null) return;\n    // for performance improvements we only update the DOM if the scrollRatio change \"enough\"\n    this.scrollingIndex = Math.floor(this.menuWrapper.scrollTop / this.sixMenuItemHeight);\n  };\n\n  componentDidLoad() {\n    this.setupForVirtualScrollingAfterRendering();\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n  }\n\n  /**\n   * Initiates type-to-select logic, which automatically selects an option based on what the user is currently typing.\n   * The key passed will be appended to the internal query and the selection will be updated. After a brief period, the\n   * internal query is cleared automatically. This method is intended to be used with the keydown event. Useful for\n   * enabling type-to-select when the menu doesn't have focus.\n   */\n  @Method()\n  async typeToSelect(key: string) {\n    clearTimeout(this.typeToSelectTimeout);\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    this.typeToSelectTimeout = setTimeout(() => (this.typeToSelectString = ''), 750);\n    this.typeToSelectString += key.toLowerCase();\n    const items = this.getItems();\n    for (const item of items) {\n      const slot = item.shadowRoot?.querySelector('slot:not([name])') as HTMLSlotElement;\n      const label = getTextContent(slot).toLowerCase().trim();\n      if (label.substring(0, this.typeToSelectString.length) === this.typeToSelectString) {\n        item.setFocus();\n        break;\n      }\n    }\n  }\n\n  private getItemsShown(): number {\n    const defaultItemsShown = this.virtualScroll ? DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING : 0;\n    return this.itemsShown ?? defaultItemsShown;\n  }\n\n  private setupForVirtualScrollingAfterRendering() {\n    if (!this.virtualScroll || this.menuWrapper == null) return;\n\n    this.eventListeners.add(this.menuWrapper, 'scroll', debounce(this.handleScrolling, this.scrollingDebounce));\n\n    // set menu height to proper height once the item is rendered.\n    const menuItemHeight = this.menu?.querySelector('six-menu-item')?.clientHeight;\n    if (menuItemHeight != null && menuItemHeight > 0) {\n      this.sixMenuItemHeight = menuItemHeight;\n    }\n  }\n\n  private getItems(): HTMLSixMenuItemElement[] {\n    if (this.menu == null) return [];\n\n    if (this.items != null) {\n      return this.items.map(mapToMenuItem);\n    }\n\n    const slot = this.menu.querySelector('slot');\n    if (slot == null) return [];\n    return [...slot.assignedElements({ flatten: true })].filter(\n      (el): el is HTMLSixMenuItemElement => isSIXMenuItemElement(el) && !el.disabled\n    );\n  }\n\n  private getActiveItemIndex() {\n    const items = this.getItems();\n    const selectedItem = this.getActiveItem();\n    if (selectedItem != null) {\n      const itemIndex = items.indexOf(selectedItem);\n      if (itemIndex > -1) {\n        return itemIndex;\n      }\n    }\n    const sixMenuItems = this.extractItemsFromDOM();\n    return sixMenuItems.findIndex(isFocusedMenuItem);\n  }\n\n  private getActiveItem(): HTMLSixMenuItemElement | undefined {\n    const activeElement = this.getItems().find((i) => i === document.activeElement);\n    if (activeElement != null) {\n      return activeElement;\n    }\n    return this.extractItemsFromDOM()?.find(isFocusedMenuItem);\n  }\n\n  private extractItemsFromDOM() {\n    return Array.from(this.host.shadowRoot?.querySelectorAll('six-menu-item') ?? []);\n  }\n\n  private setActiveItem(item: HTMLSixMenuItemElement) {\n    item?.setFocus();\n  }\n\n  private handleClick(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n    const clickedItem = target.closest('six-menu-item');\n    if (clickedItem && !clickedItem.disabled) {\n      this.sixMenuItemSelected.emit({ name: clickedItem.value, item: clickedItem });\n    }\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    // Make a selection when pressing enter\n    if (event.key === 'Enter') {\n      const activeItem = this.getActiveItem();\n      event.preventDefault();\n\n      if (activeItem != null) {\n        this.sixMenuItemSelected.emit({ name: activeItem.value, item: activeItem });\n      }\n    }\n\n    // Prevent scrolling when space is pressed\n    if (event.key === ' ') {\n      event.preventDefault();\n    }\n\n    // Move the selection when pressing down or up\n    if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n      const items = this.items === null ? this.getItems() : this.extractItemsFromDOM();\n\n      let indexOfActiveItem = this.getActiveItemIndex();\n\n      if (items.length > 0) {\n        event.preventDefault();\n\n        if (event.key === 'ArrowDown') {\n          indexOfActiveItem++;\n        } else if (event.key === 'ArrowUp') {\n          indexOfActiveItem--;\n        } else if (event.key === 'Home') {\n          indexOfActiveItem = 0;\n        } else if (event.key === 'End') {\n          indexOfActiveItem = items.length - 1;\n        }\n\n        if (indexOfActiveItem < 0) indexOfActiveItem = 0;\n        if (indexOfActiveItem > items.length - 1) indexOfActiveItem = items.length - 1;\n\n        this.setActiveItem(items[indexOfActiveItem]);\n\n        return;\n      }\n    }\n\n    void this.typeToSelect(event.key);\n  }\n\n  private getMenuWrapperStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n    if (this.getItemsShown() > 0) {\n      // calculate the proper height to show the correct number of items\n      styles.height = `${(this.getItemsShown() ?? 0) * this.sixMenuItemHeight}px`;\n    }\n    return {\n      ...styles,\n    };\n  }\n\n  private getMenuContainerStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n\n    if (this.virtualScroll) {\n      // calculate height of content are if all items would be rendered so the scrollbar has the proper size\n      styles.transform = `translateY(${this.sixMenuItemHeight * this.scrollingIndex}px)`;\n    }\n\n    return {\n      ...styles,\n    };\n  }\n\n  private getScrollbarGhostStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n\n    if (this.virtualScroll && this.items !== null) {\n      styles.height = `${this.items.length * this.sixMenuItemHeight - this.itemSize * this.sixMenuItemHeight}px`;\n    }\n\n    return {\n      ...styles,\n    };\n  }\n\n  private renderItems() {\n    if (this.items === undefined || this.items === null) {\n      return;\n    }\n\n    if (!this.virtualScroll) {\n      return this.items.map(mapToMenuItem);\n    }\n\n    return this.items\n      .slice(this.scrollingIndex, Math.min(this.items.length, this.itemSize + this.scrollingIndex))\n      .map(mapToMenuItem);\n  }\n\n  render() {\n    return (\n      <div\n        ref={(el) => (this.menuWrapper = el)}\n        style={this.getMenuWrapperStyle()}\n        part=\"wrapper\"\n        class={{\n          menu: true,\n          'menu--noshadow': this.removeBoxShadow,\n          'menu__wrapper--scrollable': this.getItemsShown() > 0,\n        }}\n      >\n        <div\n          ref={(el) => (this.menu = el)}\n          part=\"base\"\n          role=\"menu\"\n          onClick={this.handleClick}\n          onKeyDown={this.handleKeyDown}\n          tabIndex={0}\n          style={this.getMenuContainerStyle()}\n        >\n          <slot />\n          {this.renderItems()}\n        </div>\n        {this.virtualScroll && <div style={this.getScrollbarGhostStyle()} />}\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"six-menu.js","sourceRoot":"","sources":["../../../src/components/six-menu/six-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { getTextContent } from '../../utils/slot';\nimport { StyleDeclaration } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { debounce } from '../../utils/execution-control';\n\nexport interface SixMenuItemData {\n  label: string;\n  value: string;\n}\n\nexport interface SixMenuItemSelectedPayload {\n  name: string;\n  item: HTMLSixMenuItemElement;\n}\n\nconst isFocusedMenuItem = (menuItem: HTMLSixMenuItemElement) =>\n  menuItem?.shadowRoot?.querySelector('.menu-item')?.classList?.contains('menu-item--focused');\n\nconst isSIXMenuItemElement = (el?: Element): el is HTMLSixMenuItemElement =>\n  el?.tagName.toLowerCase() === 'six-menu-item';\n\nconst mapToMenuItem = ({ value, label }: SixMenuItemData) => <six-menu-item value={value}>{label}</six-menu-item>;\n\nconst DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING = 5;\n\nconst DEFAULT_SIX_MENU_ITEM_HEIGHT = 64;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The menu's content, including menu items, menu dividers, and menu labels.\n *\n * @part base - The component's base wrapper.\n */\n@Component({\n  tag: 'six-menu',\n  styleUrl: 'six-menu.scss',\n  shadow: true,\n})\nexport class SixMenu {\n  private readonly eventListeners = new EventListeners();\n\n  private menu?: HTMLElement;\n  private menuWrapper?: HTMLElement;\n  private typeToSelectString = '';\n  private typeToSelectTimeout?: number;\n\n  @Element() host!: HTMLSixMenuElement;\n\n  /** Emitted when a menu item is selected. */\n  @Event({ eventName: 'six-menu-item-selected' }) sixMenuItemSelected!: EventEmitter<SixMenuItemSelectedPayload>;\n\n  /** Set to true to remove the box-shadow */\n  @Prop() removeBoxShadow = false;\n\n  /** Set the options to be shown in the dropdown */\n  @Prop() items: SixMenuItemData[] | null = null;\n\n  /** Defines how many items should be shown. If the number of items is larger than this property a scrollbar will be shown */\n  @Prop() itemsShown?: number;\n\n  /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)\n   *  are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */\n  @Prop() virtualScroll = false;\n\n  /**\n   * Used for virtual scrolling\n   * Define how many items should be rendered in the DOM when using virtual scrolling\n   */\n  @Prop() itemSize = 10;\n\n  /**\n   * Used for virtual scrolling\n   * Define the debounce for listening on scrolling changes in milliseconds.\n   * The lower the number the more sensitive the component reacts to scrolling changes.\n   */\n  @Prop() scrollingDebounce = 15;\n\n  /**\n   * Used to calculate which items should be rendered in the DOM\n   */\n  @State()\n  private scrollingIndex = 0;\n\n  // set a default item height, this variable will be updated with the real value after the first render.\n  // However, it's necessary to have a default value because we can only fetch the proper height after the first render\n  @State()\n  sixMenuItemHeight = DEFAULT_SIX_MENU_ITEM_HEIGHT;\n\n  connectedCallback() {\n    this.handleClick = this.handleClick.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  componentWillLoad() {\n    if (this.items === null) {\n      return;\n    }\n  }\n\n  private handleScrolling = () => {\n    if (this.menuWrapper == null) return;\n    // for performance improvements we only update the DOM if the scrollRatio change \"enough\"\n    this.scrollingIndex = Math.floor(this.menuWrapper.scrollTop / this.sixMenuItemHeight);\n  };\n\n  componentDidLoad() {\n    this.setupForVirtualScrollingAfterRendering();\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n  }\n\n  /**\n   * Initiates type-to-select logic, which automatically selects an option based on what the user is currently typing.\n   * The key passed will be appended to the internal query and the selection will be updated. After a brief period, the\n   * internal query is cleared automatically. This method is intended to be used with the keydown event. Useful for\n   * enabling type-to-select when the menu doesn't have focus.\n   */\n  @Method()\n  async typeToSelect(key: string) {\n    clearTimeout(this.typeToSelectTimeout);\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    this.typeToSelectTimeout = setTimeout(() => (this.typeToSelectString = ''), 750);\n    this.typeToSelectString += key.toLowerCase();\n    const items = this.getItems();\n    for (const item of items) {\n      const slot = item.shadowRoot?.querySelector('slot:not([name])') as HTMLSlotElement;\n      const label = getTextContent(slot).toLowerCase().trim();\n      if (label.substring(0, this.typeToSelectString.length) === this.typeToSelectString) {\n        item.setFocus();\n        break;\n      }\n    }\n  }\n\n  private getItemsShown(): number {\n    const defaultItemsShown = this.virtualScroll ? DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING : 0;\n    return this.itemsShown ?? defaultItemsShown;\n  }\n\n  private setupForVirtualScrollingAfterRendering() {\n    if (!this.virtualScroll || this.menuWrapper == null) return;\n\n    this.eventListeners.add(this.menuWrapper, 'scroll', debounce(this.handleScrolling, this.scrollingDebounce));\n\n    // set menu height to proper height once the item is rendered.\n    const menuItemHeight = this.menu?.querySelector('six-menu-item')?.clientHeight;\n    if (menuItemHeight != null && menuItemHeight > 0) {\n      this.sixMenuItemHeight = menuItemHeight;\n    }\n  }\n\n  private getItems(): HTMLSixMenuItemElement[] {\n    if (this.menu == null) return [];\n\n    if (this.items != null) {\n      return this.items.map(mapToMenuItem);\n    }\n\n    const slot = this.menu.querySelector('slot');\n    if (slot == null) return [];\n    return [...slot.assignedElements({ flatten: true })].filter(\n      (el): el is HTMLSixMenuItemElement => isSIXMenuItemElement(el) && !el.disabled\n    );\n  }\n\n  private getActiveItemIndex() {\n    const items = this.getItems();\n    const selectedItem = this.getActiveItem();\n    if (selectedItem != null) {\n      const itemIndex = items.indexOf(selectedItem);\n      if (itemIndex > -1) {\n        return itemIndex;\n      }\n    }\n    const sixMenuItems = this.extractItemsFromDOM();\n    return sixMenuItems.findIndex(isFocusedMenuItem);\n  }\n\n  private getActiveItem(): HTMLSixMenuItemElement | undefined {\n    const activeElement = this.getItems().find((i) => i === document.activeElement);\n    if (activeElement != null) {\n      return activeElement;\n    }\n    return this.extractItemsFromDOM()?.find(isFocusedMenuItem);\n  }\n\n  private extractItemsFromDOM() {\n    return Array.from(this.host.shadowRoot?.querySelectorAll('six-menu-item') ?? []);\n  }\n\n  private setActiveItem(item: HTMLSixMenuItemElement) {\n    item?.setFocus();\n  }\n\n  private handleClick(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n    const clickedItem = target.closest('six-menu-item');\n    if (clickedItem && !clickedItem.disabled) {\n      this.sixMenuItemSelected.emit({ name: clickedItem.value, item: clickedItem });\n    }\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    // Make a selection when pressing enter\n    if (event.key === 'Enter') {\n      const activeItem = this.getActiveItem();\n      event.preventDefault();\n\n      if (activeItem != null) {\n        this.sixMenuItemSelected.emit({ name: activeItem.value, item: activeItem });\n      }\n    }\n\n    // Prevent scrolling when space is pressed\n    if (event.key === ' ') {\n      event.preventDefault();\n    }\n\n    // Move the selection when pressing down or up\n    if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n      const items = this.items === null ? this.getItems() : this.extractItemsFromDOM();\n\n      let indexOfActiveItem = this.getActiveItemIndex();\n\n      if (items.length > 0) {\n        event.preventDefault();\n\n        if (event.key === 'ArrowDown') {\n          indexOfActiveItem++;\n        } else if (event.key === 'ArrowUp') {\n          indexOfActiveItem--;\n        } else if (event.key === 'Home') {\n          indexOfActiveItem = 0;\n        } else if (event.key === 'End') {\n          indexOfActiveItem = items.length - 1;\n        }\n\n        if (indexOfActiveItem < 0) indexOfActiveItem = 0;\n        if (indexOfActiveItem > items.length - 1) indexOfActiveItem = items.length - 1;\n\n        this.setActiveItem(items[indexOfActiveItem]);\n\n        return;\n      }\n    }\n\n    void this.typeToSelect(event.key);\n  }\n\n  private getMenuWrapperStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n    if (this.getItemsShown() > 0) {\n      // calculate the proper height to show the correct number of items\n      styles.height = `${(this.getItemsShown() ?? 0) * this.sixMenuItemHeight}px`;\n    }\n    return {\n      ...styles,\n    };\n  }\n\n  private getMenuContainerStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n\n    if (this.virtualScroll) {\n      // calculate height of content are if all items would be rendered so the scrollbar has the proper size\n      styles.transform = `translateY(${this.sixMenuItemHeight * this.scrollingIndex}px)`;\n    }\n\n    return {\n      ...styles,\n    };\n  }\n\n  private getScrollbarGhostStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n\n    if (this.virtualScroll && this.items !== null) {\n      styles.height = `${this.items.length * this.sixMenuItemHeight - this.itemSize * this.sixMenuItemHeight}px`;\n    }\n\n    return {\n      ...styles,\n    };\n  }\n\n  private renderItems() {\n    if (this.items === undefined || this.items === null) {\n      return;\n    }\n\n    if (!this.virtualScroll) {\n      return this.items.map(mapToMenuItem);\n    }\n\n    return this.items\n      .slice(this.scrollingIndex, Math.min(this.items.length, this.itemSize + this.scrollingIndex))\n      .map(mapToMenuItem);\n  }\n\n  render() {\n    return (\n      <div\n        ref={(el) => (this.menuWrapper = el)}\n        style={this.getMenuWrapperStyle()}\n        part=\"wrapper\"\n        class={{\n          menu: true,\n          'menu--noshadow': this.removeBoxShadow,\n          'menu__wrapper--scrollable': this.getItemsShown() > 0,\n        }}\n      >\n        <div\n          ref={(el) => (this.menu = el)}\n          part=\"base\"\n          role=\"menu\"\n          onClick={this.handleClick}\n          onKeyDown={this.handleKeyDown}\n          tabIndex={0}\n          style={this.getMenuContainerStyle()}\n        >\n          <slot />\n          {this.renderItems()}\n        </div>\n        {this.virtualScroll && <div style={this.getScrollbarGhostStyle()} />}\n      </div>\n    );\n  }\n}\n"]}