@swisspost/internet-header 1.5.0-beta.1 → 1.5.0

package/dist/collection/components/post-language-switch/post-language-switch.js

@@ -1,186 +1,186 @@
-import { Host, h, } from '@stencil/core';
-import { SvgSprite } from '../../utils/svg-sprite.component';
-import { SvgIcon } from '../../utils/svg-icon.component';
-import { state } from '../../data/store';
-import { userPrefersReducedMotion, elementHasTransition } from '../../services/ui.service';
-import { translate } from '../../services/language.service';
-import { PostLanguageSwitchList } from './components/post-language-switch-list';
-export class PostLanguageSwitch {
-  constructor() {
-    this.mode = undefined;
-    this.langSwitchOpen = false;
-  }
-  componentWillUpdate() {
-    // Check if language switch got set to close and if mode is dropdown
-    if (this.languageSwitchDropdown && !this.langSwitchOpen && this.mode == 'dropdown') {
-      this.languageSwitchDropdown.classList.remove('open');
-      // Check if element has transition applied and whether user prefers to see animations or not
-      if (elementHasTransition(this.languageSwitchDropdown, 'transform') &&
-        !userPrefersReducedMotion()) {
-        // Wait for CSS transition 'transform' to end before continuing
-        return new Promise(resolve => {
-          var _a;
-          (_a = this.languageSwitchDropdown) === null || _a === void 0 ? void 0 : _a.addEventListener('transitionend', event => {
-            if (event.propertyName === 'transform') {
-              resolve(true);
-            }
-          });
-        });
-      }
-    }
-  }
-  componentDidUpdate() {
-    // Language switch got set to open
-    if (this.languageSwitchDropdown && this.langSwitchOpen) {
-      // Force browser to redraw/refresh DOM before adding 'open' class
-      this.languageSwitchDropdown.getBoundingClientRect();
-      this.languageSwitchDropdown.classList.add('open');
-    }
-  }
-  /**
-   * Open or close the language switch programatically
-   * @param force Boolean to force a state
-   * @returns Boolean indicating new state
-   */
-  async toggleDropdown(force) {
-    this.langSwitchOpen = force !== null && force !== void 0 ? force : !this.langSwitchOpen;
-    this.dropdownToggled.emit({ open: this.langSwitchOpen, element: this.host });
-    return this.langSwitchOpen;
-  }
-  /**
-   * Emit a language change to the parent component
-   *
-   * @param newLang Config of the new language
-   */
-  switchLanguage(newLang) {
-    this.languageChanged.emit(newLang.lang);
-    this.toggleDropdown(false);
-  }
-  getMergedLanguageConfig(config, overrides) {
-    if (overrides === undefined) {
-      return config;
-    }
-    return config.map(langConfig => Object.assign({}, langConfig, overrides.find(l => l.lang === langConfig.lang)));
-  }
-  setDropdownRef(element) {
-    this.languageSwitchDropdown = element;
-  }
-  render() {
-    var _a;
-    if (((_a = state.localizedConfig) === null || _a === void 0 ? void 0 : _a.header) === undefined)
-      return;
-    const config = state.localizedConfig.header;
-    const mergedConfig = this.getMergedLanguageConfig(config.navLang, state.languageSwitchOverrides);
-    return (h(Host, null, h("div", { class: `language-switch ${this.mode}` }, h(SvgSprite, null), this.mode === 'dropdown' ? (h("button", { class: "lang-btn", "aria-expanded": `${this.langSwitchOpen}`, "aria-haspopup": "listbox", onClick: () => this.toggleDropdown() }, h("span", { class: "visually-hidden" }, config.translations.navLangAriaLabel), h("span", { "aria-hidden": "true" }, state.currentLanguage), h(SvgIcon, { name: "pi-arrow-down", classNames: this.langSwitchOpen ? 'rotated' : '' }))) : (h("span", { class: "bold current-language" }, h("span", { class: "visually-hidden" }, translate('Current language is English')), h("span", null, state.currentLanguage))), this.langSwitchOpen || this.mode === 'list' ? (h(PostLanguageSwitchList, { navLang: mergedConfig, switchLanguage: e => this.switchLanguage(e), dropdownRef: e => e !== undefined && this.setDropdownRef(e) })) : null)));
-  }
-  static get is() { return "post-language-switch"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["post-language-switch.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["post-language-switch.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "mode": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'dropdown' | 'list'",
-          "resolved": "\"dropdown\" | \"list\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "mode",
-        "reflect": false
-      }
-    };
-  }
-  static get states() {
-    return {
-      "langSwitchOpen": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "dropdownToggled",
-        "name": "dropdownToggled",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "DropdownEvent",
-          "resolved": "{ open: boolean; element: DropdownElement; }",
-          "references": {
-            "DropdownEvent": {
-              "location": "import",
-              "path": "../../models/header.model"
-            }
-          }
-        }
-      }, {
-        "method": "languageChanged",
-        "name": "languageChanged",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        }
-      }];
-  }
-  static get methods() {
-    return {
-      "toggleDropdown": {
-        "complexType": {
-          "signature": "(force?: boolean) => Promise<boolean>",
-          "parameters": [{
-              "tags": [{
-                  "name": "param",
-                  "text": "force Boolean to force a state"
-                }],
-              "text": "Boolean to force a state"
-            }],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<boolean>"
-        },
-        "docs": {
-          "text": "Open or close the language switch programatically",
-          "tags": [{
-              "name": "param",
-              "text": "force Boolean to force a state"
-            }, {
-              "name": "returns",
-              "text": "Boolean indicating new state"
-            }]
-        }
-      }
-    };
-  }
-  static get elementRef() { return "host"; }
-}
-//# sourceMappingURL=post-language-switch.js.map
+import { Host, h, } from '@stencil/core';
+import { SvgSprite } from '../../utils/svg-sprite.component';
+import { SvgIcon } from '../../utils/svg-icon.component';
+import { state } from '../../data/store';
+import { userPrefersReducedMotion, elementHasTransition } from '../../services/ui.service';
+import { translate } from '../../services/language.service';
+import { PostLanguageSwitchList } from './components/post-language-switch-list';
+export class PostLanguageSwitch {
+  constructor() {
+    this.mode = undefined;
+    this.langSwitchOpen = false;
+  }
+  componentWillUpdate() {
+    // Check if language switch got set to close and if mode is dropdown
+    if (this.languageSwitchDropdown && !this.langSwitchOpen && this.mode == 'dropdown') {
+      this.languageSwitchDropdown.classList.remove('open');
+      // Check if element has transition applied and whether user prefers to see animations or not
+      if (elementHasTransition(this.languageSwitchDropdown, 'transform') &&
+        !userPrefersReducedMotion()) {
+        // Wait for CSS transition 'transform' to end before continuing
+        return new Promise(resolve => {
+          var _a;
+          (_a = this.languageSwitchDropdown) === null || _a === void 0 ? void 0 : _a.addEventListener('transitionend', event => {
+            if (event.propertyName === 'transform') {
+              resolve(true);
+            }
+          });
+        });
+      }
+    }
+  }
+  componentDidUpdate() {
+    // Language switch got set to open
+    if (this.languageSwitchDropdown && this.langSwitchOpen) {
+      // Force browser to redraw/refresh DOM before adding 'open' class
+      this.languageSwitchDropdown.getBoundingClientRect();
+      this.languageSwitchDropdown.classList.add('open');
+    }
+  }
+  /**
+   * Open or close the language switch programatically
+   * @param force Boolean to force a state
+   * @returns Boolean indicating new state
+   */
+  async toggleDropdown(force) {
+    this.langSwitchOpen = force !== null && force !== void 0 ? force : !this.langSwitchOpen;
+    this.dropdownToggled.emit({ open: this.langSwitchOpen, element: this.host });
+    return this.langSwitchOpen;
+  }
+  /**
+   * Emit a language change to the parent component
+   *
+   * @param newLang Config of the new language
+   */
+  switchLanguage(newLang) {
+    this.languageChanged.emit(newLang.lang);
+    this.toggleDropdown(false);
+  }
+  getMergedLanguageConfig(config, overrides) {
+    if (overrides === undefined) {
+      return config;
+    }
+    return config.map(langConfig => Object.assign({}, langConfig, overrides.find(l => l.lang === langConfig.lang)));
+  }
+  setDropdownRef(element) {
+    this.languageSwitchDropdown = element;
+  }
+  render() {
+    var _a;
+    if (((_a = state.localizedConfig) === null || _a === void 0 ? void 0 : _a.header) === undefined)
+      return;
+    const config = state.localizedConfig.header;
+    const mergedConfig = this.getMergedLanguageConfig(config.navLang, state.languageSwitchOverrides);
+    return (h(Host, null, h("div", { class: `language-switch ${this.mode}` }, h(SvgSprite, null), this.mode === 'dropdown' ? (h("button", { class: "lang-btn", "aria-expanded": `${this.langSwitchOpen}`, "aria-haspopup": "listbox", onClick: () => this.toggleDropdown() }, h("span", { class: "visually-hidden" }, config.translations.navLangAriaLabel), h("span", { "aria-hidden": "true" }, state.currentLanguage), h(SvgIcon, { name: "pi-arrow-down", classNames: this.langSwitchOpen ? 'rotated' : '' }))) : (h("span", { class: "bold current-language" }, h("span", { class: "visually-hidden" }, translate('Current language is English')), h("span", null, state.currentLanguage))), this.langSwitchOpen || this.mode === 'list' ? (h(PostLanguageSwitchList, { navLang: mergedConfig, switchLanguage: e => this.switchLanguage(e), dropdownRef: e => e !== undefined && this.setDropdownRef(e) })) : null)));
+  }
+  static get is() { return "post-language-switch"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["post-language-switch.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["post-language-switch.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "mode": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'dropdown' | 'list'",
+          "resolved": "\"dropdown\" | \"list\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "mode",
+        "reflect": false
+      }
+    };
+  }
+  static get states() {
+    return {
+      "langSwitchOpen": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "dropdownToggled",
+        "name": "dropdownToggled",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "DropdownEvent",
+          "resolved": "{ open: boolean; element: DropdownElement; }",
+          "references": {
+            "DropdownEvent": {
+              "location": "import",
+              "path": "../../models/header.model"
+            }
+          }
+        }
+      }, {
+        "method": "languageChanged",
+        "name": "languageChanged",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "toggleDropdown": {
+        "complexType": {
+          "signature": "(force?: boolean) => Promise<boolean>",
+          "parameters": [{
+              "tags": [{
+                  "name": "param",
+                  "text": "force Boolean to force a state"
+                }],
+              "text": "Boolean to force a state"
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<boolean>"
+        },
+        "docs": {
+          "text": "Open or close the language switch programatically",
+          "tags": [{
+              "name": "param",
+              "text": "force Boolean to force a state"
+            }, {
+              "name": "returns",
+              "text": "Boolean indicating new state"
+            }]
+        }
+      }
+    };
+  }
+  static get elementRef() { return "host"; }
+}
+//# sourceMappingURL=post-language-switch.js.map

package/dist/collection/components/post-language-switch/post-language-switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"post-language-switch.js","sourceRoot":"","sources":["../../../../src/components/post-language-switch/post-language-switch.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\r\n  Component,\r\n  Event,\r\n  Host,\r\n  h,\r\n  Method,\r\n  EventEmitter,\r\n  State,\r\n  Prop,\r\n  Element,\r\n} from '@stencil/core';\r\nimport { SvgSprite } from '../../utils/svg-sprite.component';\r\nimport { SvgIcon } from '../../utils/svg-icon.component';\r\nimport { state } from '../../data/store';\r\nimport {\r\n  DropdownElement,\r\n  DropdownEvent,\r\n  HasDropdown,\r\n  NavLangEntity,\r\n} from '../../models/header.model';\r\nimport { userPrefersReducedMotion, elementHasTransition } from '../../services/ui.service';\r\nimport { translate } from '../../services/language.service';\r\nimport { PostLanguageSwitchList } from './components/post-language-switch-list';\r\nimport { IAvailableLanguage } from '../../models/language.model';\r\n\r\n@Component({\r\n  tag: 'post-language-switch',\r\n  styleUrl: 'post-language-switch.scss',\r\n  shadow: true,\r\n})\r\nexport class PostLanguageSwitch implements HasDropdown {\r\n  @Prop() mode: 'dropdown' | 'list';\r\n  @State() langSwitchOpen = false;\r\n  @Element() host: DropdownElement;\r\n  @Event() dropdownToggled: EventEmitter<DropdownEvent>;\r\n  @Event({ bubbles: true }) languageChanged: EventEmitter<string>;\r\n  private languageSwitchDropdown: HTMLElement | undefined;\r\n\r\n  componentWillUpdate() {\r\n    // Check if language switch got set to close and if mode is dropdown\r\n    if (this.languageSwitchDropdown && !this.langSwitchOpen && this.mode == 'dropdown') {\r\n      this.languageSwitchDropdown.classList.remove('open');\r\n\r\n      // Check if element has transition applied and whether user prefers to see animations or not\r\n      if (\r\n        elementHasTransition(this.languageSwitchDropdown, 'transform') &&\r\n        !userPrefersReducedMotion()\r\n      ) {\r\n        // Wait for CSS transition 'transform' to end before continuing\r\n        return new Promise<boolean>(resolve => {\r\n          this.languageSwitchDropdown?.addEventListener('transitionend', event => {\r\n            if (event.propertyName === 'transform') {\r\n              resolve(true);\r\n            }\r\n          });\r\n        });\r\n      }\r\n    }\r\n  }\r\n\r\n  componentDidUpdate() {\r\n    // Language switch got set to open\r\n    if (this.languageSwitchDropdown && this.langSwitchOpen) {\r\n      // Force browser to redraw/refresh DOM before adding 'open' class\r\n      this.languageSwitchDropdown.getBoundingClientRect();\r\n      this.languageSwitchDropdown.classList.add('open');\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Open or close the language switch programatically\r\n   * @param force Boolean to force a state\r\n   * @returns Boolean indicating new state\r\n   */\r\n  @Method()\r\n  async toggleDropdown(force?: boolean) {\r\n    this.langSwitchOpen = force ?? !this.langSwitchOpen;\r\n    this.dropdownToggled.emit({ open: this.langSwitchOpen, element: this.host });\r\n    return this.langSwitchOpen;\r\n  }\r\n\r\n  /**\r\n   * Emit a language change to the parent component\r\n   *\r\n   * @param newLang Config of the new language\r\n   */\r\n  switchLanguage(newLang: NavLangEntity) {\r\n    this.languageChanged.emit(newLang.lang);\r\n    this.toggleDropdown(false);\r\n  }\r\n\r\n  private getMergedLanguageConfig(config: NavLangEntity[], overrides?: IAvailableLanguage[]) {\r\n    if (overrides === undefined) {\r\n      return config;\r\n    }\r\n\r\n    return config.map(langConfig =>\r\n      Object.assign(\r\n        {},\r\n        langConfig,\r\n        overrides.find(l => l.lang === langConfig.lang),\r\n      ),\r\n    );\r\n  }\r\n\r\n  private setDropdownRef(element: HTMLElement | undefined) {\r\n    this.languageSwitchDropdown = element;\r\n  }\r\n\r\n  render() {\r\n    if (state.localizedConfig?.header === undefined) return;\r\n    const config = state.localizedConfig.header;\r\n    const mergedConfig = this.getMergedLanguageConfig(\r\n      config.navLang,\r\n      state.languageSwitchOverrides,\r\n    );\r\n\r\n    return (\r\n      <Host>\r\n        <div class={`language-switch ${this.mode}`}>\r\n          <SvgSprite />\r\n          {this.mode === 'dropdown' ? (\r\n            <button\r\n              class=\"lang-btn\"\r\n              aria-expanded={`${this.langSwitchOpen}`}\r\n              aria-haspopup=\"listbox\"\r\n              onClick={() => this.toggleDropdown()}\r\n            >\r\n              <span class=\"visually-hidden\">{config.translations.navLangAriaLabel}</span>\r\n              <span aria-hidden=\"true\">{state.currentLanguage}</span>\r\n              <SvgIcon name=\"pi-arrow-down\" classNames={this.langSwitchOpen ? 'rotated' : ''} />\r\n            </button>\r\n          ) : (\r\n            <span class=\"bold current-language\">\r\n              <span class=\"visually-hidden\">{translate('Current language is English')}</span>\r\n              <span>{state.currentLanguage}</span>\r\n            </span>\r\n          )}\r\n          {this.langSwitchOpen || this.mode === 'list' ? (\r\n            <PostLanguageSwitchList\r\n              navLang={mergedConfig}\r\n              switchLanguage={e => this.switchLanguage(e)}\r\n              dropdownRef={e => e !== undefined && this.setDropdownRef(e)}\r\n            />\r\n          ) : null}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"post-language-switch.js","sourceRoot":"","sources":["../../../../src/components/post-language-switch/post-language-switch.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Event,\n  Host,\n  h,\n  Method,\n  EventEmitter,\n  State,\n  Prop,\n  Element,\n} from '@stencil/core';\nimport { SvgSprite } from '../../utils/svg-sprite.component';\nimport { SvgIcon } from '../../utils/svg-icon.component';\nimport { state } from '../../data/store';\nimport {\n  DropdownElement,\n  DropdownEvent,\n  HasDropdown,\n  NavLangEntity,\n} from '../../models/header.model';\nimport { userPrefersReducedMotion, elementHasTransition } from '../../services/ui.service';\nimport { translate } from '../../services/language.service';\nimport { PostLanguageSwitchList } from './components/post-language-switch-list';\nimport { IAvailableLanguage } from '../../models/language.model';\n\n@Component({\n  tag: 'post-language-switch',\n  styleUrl: 'post-language-switch.scss',\n  shadow: true,\n})\nexport class PostLanguageSwitch implements HasDropdown {\n  @Prop() mode: 'dropdown' | 'list';\n  @State() langSwitchOpen = false;\n  @Element() host: DropdownElement;\n  @Event() dropdownToggled: EventEmitter<DropdownEvent>;\n  @Event({ bubbles: true }) languageChanged: EventEmitter<string>;\n  private languageSwitchDropdown: HTMLElement | undefined;\n\n  componentWillUpdate() {\n    // Check if language switch got set to close and if mode is dropdown\n    if (this.languageSwitchDropdown && !this.langSwitchOpen && this.mode == 'dropdown') {\n      this.languageSwitchDropdown.classList.remove('open');\n\n      // Check if element has transition applied and whether user prefers to see animations or not\n      if (\n        elementHasTransition(this.languageSwitchDropdown, 'transform') &&\n        !userPrefersReducedMotion()\n      ) {\n        // Wait for CSS transition 'transform' to end before continuing\n        return new Promise<boolean>(resolve => {\n          this.languageSwitchDropdown?.addEventListener('transitionend', event => {\n            if (event.propertyName === 'transform') {\n              resolve(true);\n            }\n          });\n        });\n      }\n    }\n  }\n\n  componentDidUpdate() {\n    // Language switch got set to open\n    if (this.languageSwitchDropdown && this.langSwitchOpen) {\n      // Force browser to redraw/refresh DOM before adding 'open' class\n      this.languageSwitchDropdown.getBoundingClientRect();\n      this.languageSwitchDropdown.classList.add('open');\n    }\n  }\n\n  /**\n   * Open or close the language switch programatically\n   * @param force Boolean to force a state\n   * @returns Boolean indicating new state\n   */\n  @Method()\n  async toggleDropdown(force?: boolean) {\n    this.langSwitchOpen = force ?? !this.langSwitchOpen;\n    this.dropdownToggled.emit({ open: this.langSwitchOpen, element: this.host });\n    return this.langSwitchOpen;\n  }\n\n  /**\n   * Emit a language change to the parent component\n   *\n   * @param newLang Config of the new language\n   */\n  switchLanguage(newLang: NavLangEntity) {\n    this.languageChanged.emit(newLang.lang);\n    this.toggleDropdown(false);\n  }\n\n  private getMergedLanguageConfig(config: NavLangEntity[], overrides?: IAvailableLanguage[]) {\n    if (overrides === undefined) {\n      return config;\n    }\n\n    return config.map(langConfig =>\n      Object.assign(\n        {},\n        langConfig,\n        overrides.find(l => l.lang === langConfig.lang),\n      ),\n    );\n  }\n\n  private setDropdownRef(element: HTMLElement | undefined) {\n    this.languageSwitchDropdown = element;\n  }\n\n  render() {\n    if (state.localizedConfig?.header === undefined) return;\n    const config = state.localizedConfig.header;\n    const mergedConfig = this.getMergedLanguageConfig(\n      config.navLang,\n      state.languageSwitchOverrides,\n    );\n\n    return (\n      <Host>\n        <div class={`language-switch ${this.mode}`}>\n          <SvgSprite />\n          {this.mode === 'dropdown' ? (\n            <button\n              class=\"lang-btn\"\n              aria-expanded={`${this.langSwitchOpen}`}\n              aria-haspopup=\"listbox\"\n              onClick={() => this.toggleDropdown()}\n            >\n              <span class=\"visually-hidden\">{config.translations.navLangAriaLabel}</span>\n              <span aria-hidden=\"true\">{state.currentLanguage}</span>\n              <SvgIcon name=\"pi-arrow-down\" classNames={this.langSwitchOpen ? 'rotated' : ''} />\n            </button>\n          ) : (\n            <span class=\"bold current-language\">\n              <span class=\"visually-hidden\">{translate('Current language is English')}</span>\n              <span>{state.currentLanguage}</span>\n            </span>\n          )}\n          {this.langSwitchOpen || this.mode === 'list' ? (\n            <PostLanguageSwitchList\n              navLang={mergedConfig}\n              switchLanguage={e => this.switchLanguage(e)}\n              dropdownRef={e => e !== undefined && this.setDropdownRef(e)}\n            />\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/post-logo/logo-sprite.component.js

@@ -1,4 +1,4 @@
-import { h } from '@stencil/core';
-export const LogoSprite = () => (h("svg", { "aria-hidden": "true", style: { display: 'none' } }, h("symbol", { id: "favicon", viewBox: "0 0 48 48" }, h("g", { "clip-path": "url(#a)" }, h("path", { fill: "#FC0", d: "M47.2 0H0v47.2h47.2V0Z" }), h("path", { fill: "#fff", "fill-rule": "evenodd", d: "m18.68 35.91 1.48-7.02H6.42l-1.47 7.02h13.73Z", "clip-rule": "evenodd" }), h("path", { fill: "#000", "fill-rule": "evenodd", d: "M16.96 16.56c-.47-.07-.94-.1-1.42-.1H11.6L8.5 31.1h3.1l.95-4.47h1.8c.74.02 1.48-.07 2.18-.27a5.8 5.8 0 0 0 4-4.59c.49-2.73-.87-4.76-3.57-5.2Zm.47 5.06a2.63 2.63 0 0 1-2.06 2.22c-.33.06-.66.1-1 .1h-1.25l1-4.78h1.36c.31-.01.62.03.92.11.77.26 1.24 1.03 1.03 2.35", "clip-rule": "evenodd" }), h("path", { fill: "red", "fill-rule": "evenodd", d: "m34.5 16.43 1.86-8.84H24.63l-2.45 11.58h2.9l1.87-8.84h5.93L31 19.17h8.8l-1.17 5.53h-8.75l-1.75 8.28H21.5l-.57 2.78h9.54l1.75-8.3h8.72l2.34-11.03H34.5Z", "clip-rule": "evenodd" })), h("defs", null, h("clipPath", { id: "a" }, h("path", { fill: "#fff", d: "M0 0h47.2v47.2H0z" }))))));
-export const FaviconSvg = (props) => (h("svg", { viewBox: "0 0 48 48", class: props.className, "aria-hidden": "true" }, h("use", { href: "#favicon" })));
-//# sourceMappingURL=logo-sprite.component.js.map
+import { h } from '@stencil/core';
+export const LogoSprite = () => (h("svg", { "aria-hidden": "true", style: { display: 'none' } }, h("symbol", { id: "favicon", viewBox: "0 0 48 48" }, h("g", { "clip-path": "url(#a)" }, h("path", { fill: "#FC0", d: "M47.2 0H0v47.2h47.2V0Z" }), h("path", { fill: "#fff", "fill-rule": "evenodd", d: "m18.68 35.91 1.48-7.02H6.42l-1.47 7.02h13.73Z", "clip-rule": "evenodd" }), h("path", { fill: "#000", "fill-rule": "evenodd", d: "M16.96 16.56c-.47-.07-.94-.1-1.42-.1H11.6L8.5 31.1h3.1l.95-4.47h1.8c.74.02 1.48-.07 2.18-.27a5.8 5.8 0 0 0 4-4.59c.49-2.73-.87-4.76-3.57-5.2Zm.47 5.06a2.63 2.63 0 0 1-2.06 2.22c-.33.06-.66.1-1 .1h-1.25l1-4.78h1.36c.31-.01.62.03.92.11.77.26 1.24 1.03 1.03 2.35", "clip-rule": "evenodd" }), h("path", { fill: "red", "fill-rule": "evenodd", d: "m34.5 16.43 1.86-8.84H24.63l-2.45 11.58h2.9l1.87-8.84h5.93L31 19.17h8.8l-1.17 5.53h-8.75l-1.75 8.28H21.5l-.57 2.78h9.54l1.75-8.3h8.72l2.34-11.03H34.5Z", "clip-rule": "evenodd" })), h("defs", null, h("clipPath", { id: "a" }, h("path", { fill: "#fff", d: "M0 0h47.2v47.2H0z" }))))));
+export const FaviconSvg = (props) => (h("svg", { viewBox: "0 0 48 48", class: props.className, "aria-hidden": "true" }, h("use", { href: "#favicon" })));
+//# sourceMappingURL=logo-sprite.component.js.map

package/dist/collection/components/post-logo/logo-sprite.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"logo-sprite.component.js","sourceRoot":"","sources":["../../../../src/components/post-logo/logo-sprite.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAElC,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,CAC9B,0BAAiB,MAAM,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;EAChD,cAAQ,EAAE,EAAC,SAAS,EAAC,OAAO,EAAC,WAAW;IACtC,sBAAa,SAAS;MACpB,YAAM,IAAI,EAAC,MAAM,EAAC,CAAC,EAAC,wBAAwB,GAAG;MAC/C,YACE,IAAI,EAAC,MAAM,eACD,SAAS,EACnB,CAAC,EAAC,+CAA+C,eACvC,SAAS,GACnB;MACF,YACE,IAAI,EAAC,MAAM,eACD,SAAS,EACnB,CAAC,EAAC,qQAAqQ,eAC7P,SAAS,GACnB;MACF,YACE,IAAI,EAAC,KAAK,eACA,SAAS,EACnB,CAAC,EAAC,wJAAwJ,eAChJ,SAAS,GACnB,CACA;IACJ;MACE,gBAAU,EAAE,EAAC,GAAG;QACd,YAAM,IAAI,EAAC,MAAM,EAAC,CAAC,EAAC,mBAAmB,GAAG,CACjC,CACN,CACA,CACL,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAA6B,EAAE,EAAE,CAAC,CAC3D,WAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAE,KAAK,CAAC,SAAS,iBAAc,MAAM;EACjE,WAAK,IAAI,EAAC,UAAU,GAAG,CACnB,CACP,CAAC","sourcesContent":["import { h } from '@stencil/core';\r\n\r\nexport const LogoSprite = () => (\r\n  <svg aria-hidden=\"true\" style={{ display: 'none' }}>\r\n    <symbol id=\"favicon\" viewBox=\"0 0 48 48\">\r\n      <g clip-path=\"url(#a)\">\r\n        <path fill=\"#FC0\" d=\"M47.2 0H0v47.2h47.2V0Z\" />\r\n        <path\r\n          fill=\"#fff\"\r\n          fill-rule=\"evenodd\"\r\n          d=\"m18.68 35.91 1.48-7.02H6.42l-1.47 7.02h13.73Z\"\r\n          clip-rule=\"evenodd\"\r\n        />\r\n        <path\r\n          fill=\"#000\"\r\n          fill-rule=\"evenodd\"\r\n          d=\"M16.96 16.56c-.47-.07-.94-.1-1.42-.1H11.6L8.5 31.1h3.1l.95-4.47h1.8c.74.02 1.48-.07 2.18-.27a5.8 5.8 0 0 0 4-4.59c.49-2.73-.87-4.76-3.57-5.2Zm.47 5.06a2.63 2.63 0 0 1-2.06 2.22c-.33.06-.66.1-1 .1h-1.25l1-4.78h1.36c.31-.01.62.03.92.11.77.26 1.24 1.03 1.03 2.35\"\r\n          clip-rule=\"evenodd\"\r\n        />\r\n        <path\r\n          fill=\"red\"\r\n          fill-rule=\"evenodd\"\r\n          d=\"m34.5 16.43 1.86-8.84H24.63l-2.45 11.58h2.9l1.87-8.84h5.93L31 19.17h8.8l-1.17 5.53h-8.75l-1.75 8.28H21.5l-.57 2.78h9.54l1.75-8.3h8.72l2.34-11.03H34.5Z\"\r\n          clip-rule=\"evenodd\"\r\n        />\r\n      </g>\r\n      <defs>\r\n        <clipPath id=\"a\">\r\n          <path fill=\"#fff\" d=\"M0 0h47.2v47.2H0z\" />\r\n        </clipPath>\r\n      </defs>\r\n    </symbol>\r\n  </svg>\r\n);\r\n\r\nexport const FaviconSvg = (props: { className?: string }) => (\r\n  <svg viewBox=\"0 0 48 48\" class={props.className} aria-hidden=\"true\">\r\n    <use href=\"#favicon\" />\r\n  </svg>\r\n);\r\n"]}
+{"version":3,"file":"logo-sprite.component.js","sourceRoot":"","sources":["../../../../src/components/post-logo/logo-sprite.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAElC,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,CAC9B,0BAAiB,MAAM,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;EAChD,cAAQ,EAAE,EAAC,SAAS,EAAC,OAAO,EAAC,WAAW;IACtC,sBAAa,SAAS;MACpB,YAAM,IAAI,EAAC,MAAM,EAAC,CAAC,EAAC,wBAAwB,GAAG;MAC/C,YACE,IAAI,EAAC,MAAM,eACD,SAAS,EACnB,CAAC,EAAC,+CAA+C,eACvC,SAAS,GACnB;MACF,YACE,IAAI,EAAC,MAAM,eACD,SAAS,EACnB,CAAC,EAAC,qQAAqQ,eAC7P,SAAS,GACnB;MACF,YACE,IAAI,EAAC,KAAK,eACA,SAAS,EACnB,CAAC,EAAC,wJAAwJ,eAChJ,SAAS,GACnB,CACA;IACJ;MACE,gBAAU,EAAE,EAAC,GAAG;QACd,YAAM,IAAI,EAAC,MAAM,EAAC,CAAC,EAAC,mBAAmB,GAAG,CACjC,CACN,CACA,CACL,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAA6B,EAAE,EAAE,CAAC,CAC3D,WAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAE,KAAK,CAAC,SAAS,iBAAc,MAAM;EACjE,WAAK,IAAI,EAAC,UAAU,GAAG,CACnB,CACP,CAAC","sourcesContent":["import { h } from '@stencil/core';\n\nexport const LogoSprite = () => (\n  <svg aria-hidden=\"true\" style={{ display: 'none' }}>\n    <symbol id=\"favicon\" viewBox=\"0 0 48 48\">\n      <g clip-path=\"url(#a)\">\n        <path fill=\"#FC0\" d=\"M47.2 0H0v47.2h47.2V0Z\" />\n        <path\n          fill=\"#fff\"\n          fill-rule=\"evenodd\"\n          d=\"m18.68 35.91 1.48-7.02H6.42l-1.47 7.02h13.73Z\"\n          clip-rule=\"evenodd\"\n        />\n        <path\n          fill=\"#000\"\n          fill-rule=\"evenodd\"\n          d=\"M16.96 16.56c-.47-.07-.94-.1-1.42-.1H11.6L8.5 31.1h3.1l.95-4.47h1.8c.74.02 1.48-.07 2.18-.27a5.8 5.8 0 0 0 4-4.59c.49-2.73-.87-4.76-3.57-5.2Zm.47 5.06a2.63 2.63 0 0 1-2.06 2.22c-.33.06-.66.1-1 .1h-1.25l1-4.78h1.36c.31-.01.62.03.92.11.77.26 1.24 1.03 1.03 2.35\"\n          clip-rule=\"evenodd\"\n        />\n        <path\n          fill=\"red\"\n          fill-rule=\"evenodd\"\n          d=\"m34.5 16.43 1.86-8.84H24.63l-2.45 11.58h2.9l1.87-8.84h5.93L31 19.17h8.8l-1.17 5.53h-8.75l-1.75 8.28H21.5l-.57 2.78h9.54l1.75-8.3h8.72l2.34-11.03H34.5Z\"\n          clip-rule=\"evenodd\"\n        />\n      </g>\n      <defs>\n        <clipPath id=\"a\">\n          <path fill=\"#fff\" d=\"M0 0h47.2v47.2H0z\" />\n        </clipPath>\n      </defs>\n    </symbol>\n  </svg>\n);\n\nexport const FaviconSvg = (props: { className?: string }) => (\n  <svg viewBox=\"0 0 48 48\" class={props.className} aria-hidden=\"true\">\n    <use href=\"#favicon\" />\n  </svg>\n);\n"]}

package/dist/collection/components/post-logo/post-logo.js

@@ -1,60 +1,60 @@
-import { Host, h } from '@stencil/core';
-import { throttle } from 'throttle-debounce';
-import { state } from '../../data/store';
-import { LogoSprite, FaviconSvg } from './logo-sprite.component';
-export class PostLogo {
-  constructor() {
-    this.showFaviconLogo = undefined;
-    // Register window resize event listener and a resize observer on the mainnav controls (they change size while controls are being loaded) to display an accurately sized logo
-    this.throttledResize = throttle(300, () => this.handleResize());
-    window.addEventListener('resize', this.throttledResize, { passive: true });
-    this.resizeObserver = new ResizeObserver(this.handleResize.bind(this));
-    // Initially call the resize handler
-    this.handleResize();
-  }
-  componentDidLoad() {
-    var _a;
-    const mainNavControls = (_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('.main-navigation-controls');
-    if (mainNavControls) {
-      this.resizeObserver.observe(mainNavControls);
-    }
-  }
-  disconnectedCallback() {
-    window.removeEventListener('resize', this.throttledResize);
-    this.resizeObserver.disconnect();
-  }
-  handleResize() {
-    var _a, _b;
-    const mainNavControls = (_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('.main-navigation-controls');
-    const menuButton = (_b = this.host.parentElement) === null || _b === void 0 ? void 0 : _b.querySelector('.menu-button');
-    if (mainNavControls && menuButton)
-      this.showFaviconLogo =
-        window.innerWidth - (150 + mainNavControls.clientWidth + menuButton.clientWidth) <= 0;
-  }
-  render() {
-    var _a;
-    if (((_a = state.localizedConfig) === null || _a === void 0 ? void 0 : _a.header.logo) === undefined)
-      return;
-    const config = state.localizedConfig.header.logo;
-    return (h(Host, null, h(LogoSprite, null), h("a", { href: config.logoLink, class: "logo" }, h("span", { class: "visually-hidden" }, config.logoLinkTitle), h(FaviconSvg, { className: "square-logo" }), h("img", { class: "logo-svg full-logo", src: config.logoSvg, alt: config.logoText }))));
-  }
-  static get is() { return "post-logo"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["post-logo.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["post-logo.css"]
-    };
-  }
-  static get states() {
-    return {
-      "showFaviconLogo": {}
-    };
-  }
-  static get elementRef() { return "host"; }
-}
-//# sourceMappingURL=post-logo.js.map
+import { Host, h } from '@stencil/core';
+import { throttle } from 'throttle-debounce';
+import { state } from '../../data/store';
+import { LogoSprite, FaviconSvg } from './logo-sprite.component';
+export class PostLogo {
+  constructor() {
+    this.showFaviconLogo = undefined;
+    // Register window resize event listener and a resize observer on the mainnav controls (they change size while controls are being loaded) to display an accurately sized logo
+    this.throttledResize = throttle(300, () => this.handleResize());
+    window.addEventListener('resize', this.throttledResize, { passive: true });
+    this.resizeObserver = new ResizeObserver(this.handleResize.bind(this));
+    // Initially call the resize handler
+    this.handleResize();
+  }
+  componentDidLoad() {
+    var _a;
+    const mainNavControls = (_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('.main-navigation-controls');
+    if (mainNavControls) {
+      this.resizeObserver.observe(mainNavControls);
+    }
+  }
+  disconnectedCallback() {
+    window.removeEventListener('resize', this.throttledResize);
+    this.resizeObserver.disconnect();
+  }
+  handleResize() {
+    var _a, _b;
+    const mainNavControls = (_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('.main-navigation-controls');
+    const menuButton = (_b = this.host.parentElement) === null || _b === void 0 ? void 0 : _b.querySelector('.menu-button');
+    if (mainNavControls && menuButton)
+      this.showFaviconLogo =
+        window.innerWidth - (150 + mainNavControls.clientWidth + menuButton.clientWidth) <= 0;
+  }
+  render() {
+    var _a;
+    if (((_a = state.localizedConfig) === null || _a === void 0 ? void 0 : _a.header.logo) === undefined)
+      return;
+    const config = state.localizedConfig.header.logo;
+    return (h(Host, null, h(LogoSprite, null), h("a", { href: config.logoLink, class: "logo" }, h("span", { class: "visually-hidden" }, config.logoLinkTitle), h(FaviconSvg, { className: "square-logo" }), h("img", { class: "logo-svg full-logo", src: config.logoSvg, alt: config.logoText }))));
+  }
+  static get is() { return "post-logo"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["post-logo.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["post-logo.css"]
+    };
+  }
+  static get states() {
+    return {
+      "showFaviconLogo": {}
+    };
+  }
+  static get elementRef() { return "host"; }
+}
+//# sourceMappingURL=post-logo.js.map

package/dist/collection/components/post-logo/post-logo.js.map

@@ -1 +1 @@
-{"version":3,"file":"post-logo.js","sourceRoot":"","sources":["../../../../src/components/post-logo/post-logo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAOjE,MAAM,OAAO,QAAQ;EAMnB;;IACE,6KAA6K;IAC7K,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;IAChE,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAe,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAC3E,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IAEvE,oCAAoC;IACpC,IAAI,CAAC,YAAY,EAAE,CAAC;GACrB;EAED,gBAAgB;;IACd,MAAM,eAAe,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,0CAAE,aAAa,CAAC,2BAA2B,CAAC,CAAC;IAC5F,IAAI,eAAe,EAAE;MACnB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC;KAC9C;EACH,CAAC;EAED,oBAAoB;IAClB,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IAC3D,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;EACnC,CAAC;EAED,YAAY;;IACV,MAAM,eAAe,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,0CAAE,aAAa,CAAC,2BAA2B,CAAC,CAAC;IAC5F,MAAM,UAAU,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,0CAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAC1E,IAAI,eAAe,IAAI,UAAU;MAC/B,IAAI,CAAC,eAAe;QAClB,MAAM,CAAC,UAAU,GAAG,CAAC,GAAG,GAAG,eAAe,CAAC,WAAW,GAAG,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;EAC5F,CAAC;EAED,MAAM;;IACJ,IAAI,CAAA,MAAA,KAAK,CAAC,eAAe,0CAAE,MAAM,CAAC,IAAI,MAAK,SAAS;MAAE,OAAO;IAC7D,MAAM,MAAM,GAAG,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC;IAEjD,OAAO,CACL,EAAC,IAAI;MACH,EAAC,UAAU,OAAG;MACd,SAAG,IAAI,EAAE,MAAM,CAAC,QAAQ,EAAE,KAAK,EAAC,MAAM;QACpC,YAAM,KAAK,EAAC,iBAAiB,IAAE,MAAM,CAAC,aAAa,CAAQ;QAC3D,EAAC,UAAU,IAAC,SAAS,EAAC,aAAa,GAAG;QACtC,WAAK,KAAK,EAAC,oBAAoB,EAAC,GAAG,EAAE,MAAM,CAAC,OAAO,EAAE,GAAG,EAAE,MAAM,CAAC,QAAQ,GAAI,CAC3E,CACC,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, State, Element } from '@stencil/core';\r\nimport { throttle } from 'throttle-debounce';\r\nimport { state } from '../../data/store';\r\nimport { LogoSprite, FaviconSvg } from './logo-sprite.component';\r\n\r\n@Component({\r\n  tag: 'post-logo',\r\n  styleUrl: 'post-logo.scss',\r\n  shadow: true,\r\n})\r\nexport class PostLogo {\r\n  @State() showFaviconLogo: boolean;\r\n  @Element() host: HTMLPostLogoElement;\r\n  private throttledResize: throttle<() => void>;\r\n  private resizeObserver: ResizeObserver;\r\n\r\n  constructor() {\r\n    // Register window resize event listener and a resize observer on the mainnav controls (they change size while controls are being loaded) to display an accurately sized logo\r\n    this.throttledResize = throttle(300, () => this.handleResize());\r\n    window.addEventListener('resize', this.throttledResize, { passive: true });\r\n    this.resizeObserver = new ResizeObserver(this.handleResize.bind(this));\r\n\r\n    // Initially call the resize handler\r\n    this.handleResize();\r\n  }\r\n\r\n  componentDidLoad() {\r\n    const mainNavControls = this.host.parentElement?.querySelector('.main-navigation-controls');\r\n    if (mainNavControls) {\r\n      this.resizeObserver.observe(mainNavControls);\r\n    }\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    window.removeEventListener('resize', this.throttledResize);\r\n    this.resizeObserver.disconnect();\r\n  }\r\n\r\n  handleResize() {\r\n    const mainNavControls = this.host.parentElement?.querySelector('.main-navigation-controls');\r\n    const menuButton = this.host.parentElement?.querySelector('.menu-button');\r\n    if (mainNavControls && menuButton)\r\n      this.showFaviconLogo =\r\n        window.innerWidth - (150 + mainNavControls.clientWidth + menuButton.clientWidth) <= 0;\r\n  }\r\n\r\n  render() {\r\n    if (state.localizedConfig?.header.logo === undefined) return;\r\n    const config = state.localizedConfig.header.logo;\r\n\r\n    return (\r\n      <Host>\r\n        <LogoSprite />\r\n        <a href={config.logoLink} class=\"logo\">\r\n          <span class=\"visually-hidden\">{config.logoLinkTitle}</span>\r\n          <FaviconSvg className=\"square-logo\" />\r\n          <img class=\"logo-svg full-logo\" src={config.logoSvg} alt={config.logoText} />\r\n        </a>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"post-logo.js","sourceRoot":"","sources":["../../../../src/components/post-logo/post-logo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAOjE,MAAM,OAAO,QAAQ;EAMnB;;IACE,6KAA6K;IAC7K,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;IAChE,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAe,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAC3E,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IAEvE,oCAAoC;IACpC,IAAI,CAAC,YAAY,EAAE,CAAC;GACrB;EAED,gBAAgB;;IACd,MAAM,eAAe,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,0CAAE,aAAa,CAAC,2BAA2B,CAAC,CAAC;IAC5F,IAAI,eAAe,EAAE;MACnB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC;KAC9C;EACH,CAAC;EAED,oBAAoB;IAClB,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IAC3D,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;EACnC,CAAC;EAED,YAAY;;IACV,MAAM,eAAe,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,0CAAE,aAAa,CAAC,2BAA2B,CAAC,CAAC;IAC5F,MAAM,UAAU,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,0CAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAC1E,IAAI,eAAe,IAAI,UAAU;MAC/B,IAAI,CAAC,eAAe;QAClB,MAAM,CAAC,UAAU,GAAG,CAAC,GAAG,GAAG,eAAe,CAAC,WAAW,GAAG,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;EAC5F,CAAC;EAED,MAAM;;IACJ,IAAI,CAAA,MAAA,KAAK,CAAC,eAAe,0CAAE,MAAM,CAAC,IAAI,MAAK,SAAS;MAAE,OAAO;IAC7D,MAAM,MAAM,GAAG,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC;IAEjD,OAAO,CACL,EAAC,IAAI;MACH,EAAC,UAAU,OAAG;MACd,SAAG,IAAI,EAAE,MAAM,CAAC,QAAQ,EAAE,KAAK,EAAC,MAAM;QACpC,YAAM,KAAK,EAAC,iBAAiB,IAAE,MAAM,CAAC,aAAa,CAAQ;QAC3D,EAAC,UAAU,IAAC,SAAS,EAAC,aAAa,GAAG;QACtC,WAAK,KAAK,EAAC,oBAAoB,EAAC,GAAG,EAAE,MAAM,CAAC,OAAO,EAAE,GAAG,EAAE,MAAM,CAAC,QAAQ,GAAI,CAC3E,CACC,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, State, Element } from '@stencil/core';\nimport { throttle } from 'throttle-debounce';\nimport { state } from '../../data/store';\nimport { LogoSprite, FaviconSvg } from './logo-sprite.component';\n\n@Component({\n  tag: 'post-logo',\n  styleUrl: 'post-logo.scss',\n  shadow: true,\n})\nexport class PostLogo {\n  @State() showFaviconLogo: boolean;\n  @Element() host: HTMLPostLogoElement;\n  private throttledResize: throttle<() => void>;\n  private resizeObserver: ResizeObserver;\n\n  constructor() {\n    // Register window resize event listener and a resize observer on the mainnav controls (they change size while controls are being loaded) to display an accurately sized logo\n    this.throttledResize = throttle(300, () => this.handleResize());\n    window.addEventListener('resize', this.throttledResize, { passive: true });\n    this.resizeObserver = new ResizeObserver(this.handleResize.bind(this));\n\n    // Initially call the resize handler\n    this.handleResize();\n  }\n\n  componentDidLoad() {\n    const mainNavControls = this.host.parentElement?.querySelector('.main-navigation-controls');\n    if (mainNavControls) {\n      this.resizeObserver.observe(mainNavControls);\n    }\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener('resize', this.throttledResize);\n    this.resizeObserver.disconnect();\n  }\n\n  handleResize() {\n    const mainNavControls = this.host.parentElement?.querySelector('.main-navigation-controls');\n    const menuButton = this.host.parentElement?.querySelector('.menu-button');\n    if (mainNavControls && menuButton)\n      this.showFaviconLogo =\n        window.innerWidth - (150 + mainNavControls.clientWidth + menuButton.clientWidth) <= 0;\n  }\n\n  render() {\n    if (state.localizedConfig?.header.logo === undefined) return;\n    const config = state.localizedConfig.header.logo;\n\n    return (\n      <Host>\n        <LogoSprite />\n        <a href={config.logoLink} class=\"logo\">\n          <span class=\"visually-hidden\">{config.logoLinkTitle}</span>\n          <FaviconSvg className=\"square-logo\" />\n          <img class=\"logo-svg full-logo\" src={config.logoSvg} alt={config.logoText} />\n        </a>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/post-main-navigation/components/level-one-action.component.js

@@ -1,13 +1,13 @@
-import { h } from '@stencil/core';
-export const LevelOneAction = (props) => {
-  var _a, _b, _c;
-  const TagName = props.level.url ? 'a' : 'button';
-  return (h(TagName, { class: {
-      'main-link': true,
-      'active': !!props.level.isActiveOverride,
-      'focus': props.isOpen,
-    }, href: props.level.url, title: ((_a = props.level.title) === null || _a === void 0 ? void 0 : _a.trim()) && ((_b = props.level.title) === null || _b === void 0 ? void 0 : _b.trim()) !== ((_c = props.level.text) === null || _c === void 0 ? void 0 : _c.trim())
-      ? props.level.title
-      : undefined, tabindex: props.level.url ? undefined : 0, "aria-haspopup": !props.level.noFlyout + '', "aria-expanded": props.level.noFlyout ? null : props.isOpen + '', onTouchEnd: e => props.onTouchEnd(e), onKeyDown: e => props.onKeyDown(e), onClick: e => props.onClick(e) }, h("span", null, props.level.text), h("svg", { "aria-hidden": "true" }, h("use", { href: "#pi-pointy-arrow-right" }))));
-};
-//# sourceMappingURL=level-one-action.component.js.map
+import { h } from '@stencil/core';
+export const LevelOneAction = (props) => {
+  var _a, _b, _c;
+  const TagName = props.level.url ? 'a' : 'button';
+  return (h(TagName, { class: {
+      'main-link': true,
+      'active': !!props.level.isActiveOverride,
+      'focus': props.isOpen,
+    }, href: props.level.url, title: ((_a = props.level.title) === null || _a === void 0 ? void 0 : _a.trim()) && ((_b = props.level.title) === null || _b === void 0 ? void 0 : _b.trim()) !== ((_c = props.level.text) === null || _c === void 0 ? void 0 : _c.trim())
+      ? props.level.title
+      : undefined, tabindex: props.level.url ? undefined : 0, "aria-haspopup": !props.level.noFlyout + '', "aria-expanded": props.level.noFlyout ? null : props.isOpen + '', onTouchEnd: e => props.onTouchEnd(e), onKeyDown: e => props.onKeyDown(e), onClick: e => props.onClick(e) }, h("span", null, props.level.text), h("svg", { "aria-hidden": "true" }, h("use", { href: "#pi-pointy-arrow-right" }))));
+};
+//# sourceMappingURL=level-one-action.component.js.map