@six-group/ui-library 0.0.0-insider.f37af2a → 0.0.0-insider.f658e4f

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

@@ -8,134 +8,138 @@ const DEFAULT_LANGUAGES = ['EN', 'DE', 'ES'];
  * @part separator - The separator between the language labels
  */
 export class SixLanguageSwitcher {
-  constructor() {
-    this.handleLanguageSwitching = (newLanguage, languageValue) => () => {
-      if (languageValue !== undefined) {
-        this.sixChange.emit(languageValue);
-      }
-      else {
-        this.sixChange.emit(newLanguage);
-      }
-      this.selected = newLanguage;
-    };
-    this.selected = undefined;
-    this.languages = DEFAULT_LANGUAGES;
-  }
-  handleChangesLanguages(newValue) {
-    if (!Array.isArray(newValue)) {
-      throw new Error('languages is expected to be an array');
+    constructor() {
+        this.handleLanguageSwitching = (newLanguage, languageValue) => () => {
+            if (languageValue !== undefined) {
+                this.sixChange.emit(languageValue);
+            }
+            else {
+                this.sixChange.emit(newLanguage);
+            }
+            this.selected = newLanguage;
+        };
+        this.selected = undefined;
+        this.languages = DEFAULT_LANGUAGES;
     }
-    this.updateSelectedLanguage();
-  }
-  componentWillLoad() {
-    if (this.selected === undefined) {
-      this.updateSelectedLanguage();
+    handleChangesLanguages(newValue) {
+        if (!Array.isArray(newValue)) {
+            throw new Error('languages is expected to be an array');
+        }
+        this.updateSelectedLanguage();
     }
-  }
-  updateSelectedLanguage() {
-    const selectedLanguage = this.languages[0];
-    if (typeof selectedLanguage === 'string') {
-      this.selected = selectedLanguage;
-      this.sixChange.emit(this.selected);
+    componentWillLoad() {
+        if (this.selected === undefined) {
+            this.updateSelectedLanguage();
+        }
     }
-    else {
-      this.selected = selectedLanguage.key;
-      this.sixChange.emit(selectedLanguage.value);
+    updateSelectedLanguage() {
+        const selectedLanguage = this.languages[0];
+        if (typeof selectedLanguage === 'string') {
+            this.selected = selectedLanguage;
+            this.sixChange.emit(this.selected);
+        }
+        else {
+            this.selected = selectedLanguage.key;
+            this.sixChange.emit(selectedLanguage.value);
+        }
     }
-  }
-  render() {
-    return (h("div", { part: "container", class: "language-switcher__container" }, this.languages.map((lang, index) => {
-      const language = typeof lang === 'string' ? lang : lang.key;
-      return (h("div", { onClick: this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value) }, h("span", { part: "label", class: {
-          'language-switcher__label': true,
-          'language-switcher__label--selected': this.selected === language,
-        } }, language), index < this.languages.length - 1 && (h("span", { part: "separator", class: "language-switcher__separator" }, "/"))));
-    })));
-  }
-  static get is() { return "six-language-switcher"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["six-language-switcher.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["six-language-switcher.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "selected": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "The language which should be shown as selected"
-        },
-        "attribute": "selected",
-        "reflect": true
-      },
-      "languages": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[] | SixLanguageSwitcherInput[]",
-          "resolved": "SixLanguageSwitcherInput[] | string[]",
-          "references": {
-            "SixLanguageSwitcherInput": {
-              "location": "local",
-              "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"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The languages which should be selectable options."
-        },
-        "defaultValue": "DEFAULT_LANGUAGES"
-      }
-    };
-  }
-  static get events() {
-    return [{
-        "method": "sixChange",
-        "name": "six-language-switcher-change",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Emitted when the language switchers value changes"
-        },
-        "complexType": {
-          "original": "SixLanguageSwitcherChangePayload",
-          "resolved": "string",
-          "references": {
-            "SixLanguageSwitcherChangePayload": {
-              "location": "local",
-              "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"
+    render() {
+        return (h("div", { key: '5ba97f481c478180a10697b498756392192f69f0', part: "container", class: "language-switcher__container" }, this.languages.map((lang, index) => {
+            const language = typeof lang === 'string' ? lang : lang.key;
+            return (h("div", { onClick: this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value), onKeyDown: (e) => {
+                    if (e.key === 'Enter' || e.key === ' ') {
+                        this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value)();
+                    }
+                } }, h("span", { part: "label", tabindex: "0", class: {
+                    'language-switcher__label': true,
+                    'language-switcher__label--selected': this.selected === language,
+                } }, language), index < this.languages.length - 1 && (h("span", { part: "separator", class: "language-switcher__separator" }, "|"))));
+        })));
+    }
+    static get is() { return "six-language-switcher"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["six-language-switcher.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["six-language-switcher.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "selected": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The language which should be shown as selected"
+                },
+                "attribute": "selected",
+                "reflect": true
+            },
+            "languages": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[] | SixLanguageSwitcherInput[]",
+                    "resolved": "SixLanguageSwitcherInput[] | string[]",
+                    "references": {
+                        "SixLanguageSwitcherInput": {
+                            "location": "local",
+                            "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"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The languages which should be selectable options."
+                },
+                "defaultValue": "DEFAULT_LANGUAGES"
             }
-          }
-        }
-      }];
-  }
-  static get watchers() {
-    return [{
-        "propName": "languages",
-        "methodName": "handleChangesLanguages"
-      }];
-  }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "sixChange",
+                "name": "six-language-switcher-change",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the language switchers value changes"
+                },
+                "complexType": {
+                    "original": "SixLanguageSwitcherChangePayload",
+                    "resolved": "string",
+                    "references": {
+                        "SixLanguageSwitcherChangePayload": {
+                            "location": "local",
+                            "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"
+                        }
+                    }
+                }
+            }];
+    }
+    static get watchers() {
+        return [{
+                "propName": "languages",
+                "methodName": "handleChangesLanguages"
+            }];
+    }
 }
 //# sourceMappingURL=six-language-switcher.js.map

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":"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","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\n              onClick={this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value)();\n                }\n              }}\n            >\n              <span\n                part=\"label\"\n                tabindex=\"0\"\n                class={{\n                  'language-switcher__label': true,\n                  'language-switcher__label--selected': this.selected === language,\n                }}\n              >\n                {language}\n              </span>\n\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

@@ -1,39 +1,39 @@
 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(`
+    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">
+            <span class="language-switcher__label language-switcher__label--selected" part="label" tabindex="0">
               EN
             </span>
             <span class="language-switcher__separator" part="separator">
-              /
+              |
             </span>
           </div>
           <div>
-            <span class="language-switcher__label" part="label">
+            <span class="language-switcher__label" part="label" tabindex="0">
               DE
             </span>
             <span class="language-switcher__separator" part="separator">
-              /
+              |
             </span>
           </div>
           <div>
-            <span class="language-switcher__label" part="label">
+            <span class="language-switcher__label" part="label" tabindex="0">
               ES
             </span>
           </div>
@@ -41,44 +41,44 @@ describe('SIX Language Switcher', () => {
       </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(`
+    });
+    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">
+            <span class="language-switcher__label language-switcher__label--selected" part="label" tabindex="0">
               IT
             </span>
             <span class="language-switcher__separator" part="separator">
-              /
+              |
             </span>
           </div>
           <div>
-            <span class="language-switcher__label" part="label">
+            <span class="language-switcher__label" part="label" tabindex="0">
               AR
             </span>
             <span class="language-switcher__separator" part="separator">
-              /
+              |
             </span>
           </div>
           <div>
-            <span class="language-switcher__label" part="label">
+            <span class="language-switcher__label" part="label" tabindex="0">
               BG
             </span>
           </div>
@@ -86,40 +86,40 @@ describe('SIX Language Switcher', () => {
       </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(`
+    });
+    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">
+            <span class="language-switcher__label" part="label" tabindex="0">
               EN
             </span>
             <span class="language-switcher__separator" part="separator">
-              /
+              |
             </span>
           </div>
           <div>
-            <span class="language-switcher__label language-switcher__label--selected" part="label">
+            <span class="language-switcher__label language-switcher__label--selected" part="label" tabindex="0">
               DE
             </span>
             <span class="language-switcher__separator" part="separator">
-              /
+              |
             </span>
           </div>
           <div>
-            <span class="language-switcher__label" part="label">
+            <span class="language-switcher__label" part="label" tabindex="0">
               ES
             </span>
           </div>
@@ -127,44 +127,44 @@ describe('SIX Language Switcher', () => {
       </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(`
+    });
+    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">
+            <span class="language-switcher__label" part="label" tabindex="0">
               EN
             </span>
             <span class="language-switcher__separator" part="separator">
-              /
+              |
             </span>
           </div>
           <div>
-            <span class="language-switcher__label language-switcher__label--selected" part="label">
+            <span class="language-switcher__label language-switcher__label--selected" part="label" tabindex="0">
               DE
             </span>
             <span class="language-switcher__separator" part="separator">
-              /
+              |
             </span>
           </div>
           <div>
-            <span class="language-switcher__label" part="label">
+            <span class="language-switcher__label" part="label" tabindex="0">
               ES
             </span>
           </div>
@@ -172,25 +172,25 @@ describe('SIX Language Switcher', () => {
       </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');
-  });
+    });
+    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