@swisspost/design-system-components 1.5.0 → 1.5.1

package/dist/collection/components/post-tab-header/post-tab-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"post-tab-header.js","sourceRoot":"","sources":["../../../../src/components/post-tab-header/post-tab-header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAO5C,MAAM,OAAO,aAAa;;;;;EAWxB,WAAW,CAAC,QAAyC;IACnD,aAAa,CAAC,QAAQ,EAAE,uDAAuD,CAAC,CAAC;EACnF,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,KAAK,GAAG,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,MAAM,CAAC,UAAU,EAAE,EAAE,CAAC;EAC5D,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,oBAAe,OAAO;MACzB,UAAI,KAAK,EAAC,UAAU;QAClB,0BACgB,OAAO,EACrB,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EAAC,GAAG,EACR,EAAE,EAAE,IAAI,CAAC,KAAK,EACd,IAAI,EAAC,KAAK;UAEV,eAAO,CACL,CACD,CACA,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { checkNonEmpty } from '../../utils';\n\n@Component({\n  tag: 'post-tab-header',\n  styleUrl: 'post-tab-header.scss',\n  shadow: true,\n})\nexport class PostTabHeader {\n  @Element() host: HTMLPostTabHeaderElement;\n\n  @State() tabId: string;\n\n  /**\n   * The name of the panel controlled by the tab header.\n   */\n  @Prop() readonly panel: HTMLPostTabPanelElement['name'];\n\n  @Watch('panel')\n  validateFor(newValue: HTMLPostTabPanelElement['name']) {\n    checkNonEmpty(newValue, 'The \"panel\" prop is required for the post-tab-header.');\n  }\n\n  componentWillLoad() {\n    this.tabId = `tab-${this.host.id || crypto.randomUUID()}`;\n  }\n\n  render() {\n    return (\n      <Host data-version={version}>\n        <li class=\"nav-item\">\n          <a\n            aria-selected=\"false\"\n            class=\"tab-title nav-link\"\n            href=\"#\"\n            id={this.tabId}\n            role=\"tab\"\n          >\n            <slot/>\n          </a>\n        </li>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"post-tab-header.js","sourceRoot":"","sources":["../../../../src/components/post-tab-header/post-tab-header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAO5C,MAAM,OAAO,aAAa;;;;;EAWxB,WAAW,CAAC,QAAyC;IACnD,aAAa,CAAC,QAAQ,EAAE,uDAAuD,CAAC,CAAC;EACnF,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,KAAK,GAAG,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,MAAM,CAAC,UAAU,EAAE,EAAE,CAAC;EAC5D,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,oBAAe,OAAO;MACzB,+BAAsB,OAAO,EAAC,KAAK,EAAC,WAAW,EAAC,EAAE,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,IAAI,EAAC,QAAQ;QACpG,eAAQ,CACD,CACJ,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { checkNonEmpty } from '../../utils';\n\n@Component({\n  tag: 'post-tab-header',\n  styleUrl: 'post-tab-header.scss',\n  shadow: true,\n})\nexport class PostTabHeader {\n  @Element() host: HTMLPostTabHeaderElement;\n\n  @State() tabId: string;\n\n  /**\n   * The name of the panel controlled by the tab header.\n   */\n  @Prop() readonly panel: HTMLPostTabPanelElement['name'];\n\n  @Watch('panel')\n  validateFor(newValue: HTMLPostTabPanelElement['name']) {\n    checkNonEmpty(newValue, 'The \"panel\" prop is required for the post-tab-header.');\n  }\n\n  componentWillLoad() {\n    this.tabId = `tab-${this.host.id || crypto.randomUUID()}`;\n  }\n\n  render() {\n    return (\n      <Host data-version={version}>\n        <button aria-selected=\"false\" class=\"tab-title\" id={this.tabId} role=\"tab\" tabindex=\"-1\" type=\"button\">\n          <slot />\n        </button>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/post-tab-panel/post-tab-panel.css

@@ -1,3 +1 @@
-:host {
-  display: none;
-}
+:host{display:none}

package/dist/collection/components/post-tabs/post-tabs.css

@@ -1,148 +1 @@
-/**
- * Colors used by the post style guide
- */
-/**
- * Maps. Allow maps to have custom colors from the project
- * by always merging into a default empty map
- */
-.tabs-wrapper {
-  position: relative;
-  padding-top: 1rem;
-  border: 0;
-  background-color: #faf9f8;
-}
-.tabs-wrapper::after {
-  content: "";
-  position: absolute;
-  bottom: 0;
-  width: 100%;
-  height: 1px;
-  background-color: hsl(0, 0%, 80%);
-}
-.tabs-wrapper .tabs {
-  background-color: transparent !important;
-}
-@media (forced-colors: active), (-ms-high-contrast: active), (-ms-high-contrast: white-on-black) {
-  .tabs-wrapper::after {
-    background-color: ButtonBorder;
-  }
-}
-
-.tabs {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  display: flex;
-  flex-wrap: nowrap;
-  overflow-x: auto;
-  /* prevent scroll chaining on x scroll */
-  overscroll-behavior-x: contain;
-  white-space: nowrap;
-}
-.tabs::after {
-  content: "";
-  display: block;
-  flex: 1 0 auto;
-  width: 1rem;
-}
-
-.tab-content {
-  padding-top: 1rem;
-  padding-bottom: 1rem;
-}
-
-.bg-yellow .tabs-wrapper {
-  background-color: #fc0;
-}
-
-.bg-light .tabs-wrapper {
-  background-color: #faf9f8;
-}
-
-.bg-gray .tabs-wrapper {
-  background-color: #f4f3f1;
-}
-
-.bg-dark .tabs-wrapper {
-  background-color: hsl(0, 0%, 20%);
-}
-
-.bg-primary .tabs-wrapper {
-  background-color: hsl(0, 0%, 20%);
-}
-
-.bg-white .tabs-wrapper {
-  background-color: #fff;
-}
-
-.bg-black .tabs-wrapper {
-  background-color: #000;
-}
-
-.bg-success .tabs-wrapper {
-  background-color: #2c911c;
-}
-
-.bg-info .tabs-wrapper {
-  background-color: #cce4ee;
-}
-
-.bg-warning .tabs-wrapper {
-  background-color: #f49e00;
-}
-
-.bg-danger .tabs-wrapper {
-  background-color: #a51728;
-}
-
-.bg-nightblue .tabs-wrapper {
-  background-color: #004976;
-}
-
-.bg-nightblue-bright .tabs-wrapper {
-  background-color: #0076a8;
-}
-
-.bg-petrol .tabs-wrapper {
-  background-color: #006d68;
-}
-
-.bg-petrol-bright .tabs-wrapper {
-  background-color: #00968f;
-}
-
-.bg-coral .tabs-wrapper {
-  background-color: #9e2a2f;
-}
-
-.bg-coral-bright .tabs-wrapper {
-  background-color: #e03c31;
-}
-
-.bg-olive .tabs-wrapper {
-  background-color: #716135;
-}
-
-.bg-olive-bright .tabs-wrapper {
-  background-color: #aa9d2e;
-}
-
-.bg-purple .tabs-wrapper {
-  background-color: #80276c;
-}
-
-.bg-purple-bright .tabs-wrapper {
-  background-color: #c5299b;
-}
-
-.bg-aubergine .tabs-wrapper {
-  background-color: #523178;
-}
-
-.bg-aubergine-bright .tabs-wrapper {
-  background-color: #7566a0;
-}
-
-:host {
-  display: block;
-}
+.tabs-wrapper{position:relative;padding-top:1rem;border:0;background-color:#faf9f8}.tabs-wrapper::after{content:"";position:absolute;bottom:0;width:100%;height:1px;background-color:#ccc}.tabs-wrapper .tabs{background-color:rgba(0,0,0,0) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tabs-wrapper::after{background-color:ButtonBorder}}.tabs{margin:0;padding:0;list-style:none;display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;white-space:nowrap}.tabs::after{content:"";display:block;flex:1 0 auto;width:1rem}.tab-content{padding-top:1rem;padding-bottom:1rem}.bg-yellow .tabs-wrapper{background-color:#fc0}.bg-light .tabs-wrapper{background-color:#faf9f8}.bg-gray .tabs-wrapper{background-color:#f4f3f1}.bg-dark .tabs-wrapper{background-color:#333}.bg-primary .tabs-wrapper{background-color:#333}.bg-white .tabs-wrapper{background-color:#fff}.bg-black .tabs-wrapper{background-color:#000}.bg-success .tabs-wrapper{background-color:#2c911c}.bg-info .tabs-wrapper{background-color:#cce4ee}.bg-warning .tabs-wrapper{background-color:#f49e00}.bg-danger .tabs-wrapper{background-color:#a51728}.bg-nightblue .tabs-wrapper{background-color:#004976}.bg-nightblue-bright .tabs-wrapper{background-color:#0076a8}.bg-petrol .tabs-wrapper{background-color:#006d68}.bg-petrol-bright .tabs-wrapper{background-color:#00968f}.bg-coral .tabs-wrapper{background-color:#9e2a2f}.bg-coral-bright .tabs-wrapper{background-color:#e03c31}.bg-olive .tabs-wrapper{background-color:#716135}.bg-olive-bright .tabs-wrapper{background-color:#aa9d2e}.bg-purple .tabs-wrapper{background-color:#80276c}.bg-purple-bright .tabs-wrapper{background-color:#c5299b}.bg-aubergine .tabs-wrapper{background-color:#523178}.bg-aubergine-bright .tabs-wrapper{background-color:#7566a0}:host{display:block}

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

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 import { version } from '../../../package.json';
 import { fadeIn, fadeOut } from '../../animations';
 export class PostTabs {
@@ -13,7 +13,7 @@ export class PostTabs {
     this.moveMisplacedTabs();
     this.enableTabs();
     const initiallyActivePanel = this.activePanel || this.tabs.item(0).panel;
-    this.show(initiallyActivePanel);
+    void this.show(initiallyActivePanel);
     this.isLoaded = true;
   }
   /**
@@ -70,24 +70,29 @@ export class PostTabs {
       const tabPanel = this.getPanel(tab.panel).shadowRoot.querySelector('.tab-pane');
       tabTitle.setAttribute('aria-controls', tabPanel.id);
       tabPanel.setAttribute('aria-labelledby', tabTitle.id);
-      tab.addEventListener('click', e => {
-        e.preventDefault();
-        this.show(tab.panel);
+      tab.addEventListener('click', () => {
+        void this.show(tab.panel);
+      });
+      tab.addEventListener('keydown', ({ key }) => {
+        if (key === 'ArrowRight' || key === 'ArrowLeft')
+          this.navigateTabs(tab, key);
       });
     });
     // if the currently active tab was removed from the DOM then select the first one
     if (this.activeTab && !this.activeTab.isConnected) {
-      this.show(this.tabs.item(0).panel);
+      void this.show(this.tabs.item(0).panel);
     }
   }
   activateTab(tab) {
     if (this.activeTab) {
       const tabTitle = this.activeTab.shadowRoot.querySelector('.tab-title');
       tabTitle.setAttribute('aria-selected', 'false');
+      tabTitle.setAttribute('tabindex', '-1');
       tabTitle.classList.remove('active');
     }
     const tabTitle = tab.shadowRoot.querySelector('.tab-title');
     tabTitle.setAttribute('aria-selected', 'true');
+    tabTitle.removeAttribute('tabindex');
     tabTitle.classList.add('active');
     this.activeTab = tab;
   }
@@ -115,8 +120,22 @@ export class PostTabs {
   getPanel(name) {
     return this.host.querySelector(`post-tab-panel[name=${name}]`);
   }
+  navigateTabs(tab, key) {
+    const activeTabIndex = Array.from(this.tabs).indexOf(tab);
+    let nextTab;
+    if (key === 'ArrowRight') {
+      nextTab = this.tabs[activeTabIndex + 1] || this.tabs[0];
+    }
+    else {
+      nextTab = this.tabs[activeTabIndex - 1] || this.tabs[this.tabs.length - 1];
+    }
+    if (!nextTab)
+      return;
+    const nextTabTitle = nextTab.shadowRoot.querySelector('.tab-title');
+    nextTabTitle.focus();
+  }
   render() {
-    return (h(Host, { "data-version": version }, h("div", { class: "tabs-wrapper" }, h("ul", { class: "tabs nav", role: "tablist" }, h("slot", { name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { class: "tab-content" }, h("slot", { onSlotchange: () => this.moveMisplacedTabs() }))));
+    return (h(Host, { "data-version": version }, h("div", { class: "tabs-wrapper" }, h("div", { class: "tabs", role: "tablist" }, h("slot", { name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { class: "tab-content" }, h("slot", { onSlotchange: () => this.moveMisplacedTabs() }))));
   }
   static get is() { return "post-tabs"; }
   static get encapsulation() { return "shadow"; }

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

@@ -1 +1 @@
-{"version":3,"file":"post-tabs.js","sourceRoot":"","sources":["../../../../src/components/post-tabs/post-tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Element, Method, Event, EventEmitter, Prop } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { fadeIn, fadeOut } from '../../animations';\n\n@Component({\n  tag: 'post-tabs',\n  styleUrl: 'post-tabs.scss',\n  shadow: true,\n})\nexport class PostTabs {\n  private activeTab: HTMLPostTabHeaderElement;\n  private showing: Animation;\n  private hiding: Animation;\n  private isLoaded = false;\n\n  private get tabs(): NodeListOf<HTMLPostTabHeaderElement> {\n    return this.host.querySelectorAll('post-tab-header');\n  }\n\n  @Element() host: HTMLPostTabsElement;\n\n  /**\n   * The name of the panel that is initially shown.\n   * If not specified, it defaults to the panel associated with the first tab.\n   *\n   * **Changing this value after initialization has no effect.**\n   */\n  @Prop() readonly activePanel: HTMLPostTabPanelElement['name'];\n\n  /**\n   * An event emitted after the active tab changes, when the fade in transition of its associated panel is finished.\n   * The payload is the name of the newly shown panel.\n   */\n  @Event() tabChange: EventEmitter<HTMLPostTabPanelElement['name']>;\n\n  componentDidLoad() {\n    this.moveMisplacedTabs();\n    this.enableTabs();\n\n    const initiallyActivePanel = this.activePanel || this.tabs.item(0).panel;\n    this.show(initiallyActivePanel);\n\n    this.isLoaded = true;\n  }\n\n  /**\n   * Shows the panel with the given name and selects its associated tab.\n   * Any other panel that was previously shown becomes hidden and its associated tab is unselected.\n   */\n  @Method()\n  async show(panelName: string) {\n    // do nothing if the tab is already active\n    if (panelName === this.activeTab?.panel) {\n      return;\n    }\n\n    const previousTab = this.activeTab;\n    const newTab : HTMLPostTabHeaderElement = this.host.querySelector(`post-tab-header[panel=${panelName}]`);\n    this.activateTab(newTab);\n\n    // if a panel is currently being displayed, remove it from the view and complete the associated animation\n    if (this.showing) {\n      this.showing.effect['target'].style.display = 'none';\n      this.showing.finish();\n    }\n\n    // hide the currently visible panel only if no other animation is running\n    if (previousTab && !this.showing && !this.hiding) {\n      this.hidePanel(previousTab.panel);\n    }\n\n    // wait for any hiding animation to complete before showing the selected tab\n    if (this.hiding) {\n      await this.hiding.finished;\n    }\n\n    this.showSelectedPanel();\n\n    // wait for any display animation to complete for the returned promise to fully resolve\n    if (this.showing) {\n      await this.showing.finished;\n    }\n\n    this.tabChange.emit(this.activeTab.panel);\n  }\n  private moveMisplacedTabs() {\n    if (!this.tabs) return;\n\n    this.tabs.forEach(tab => {\n      if (tab.getAttribute('slot') === 'tabs') return;\n      tab.setAttribute('slot', 'tabs');\n    });\n  }\n\n  private enableTabs() {\n    if (!this.tabs) return;\n\n    this.tabs.forEach(async tab => {\n      await tab.componentOnReady();\n\n      const tabTitle = tab.shadowRoot.querySelector('.tab-title');\n\n      // if the tab has an \"aria-controls\" attribute it was already linked to its panel: do nothing\n      if (tabTitle.getAttribute('aria-controls')) return;\n\n      const tabPanel = this.getPanel(tab.panel).shadowRoot.querySelector('.tab-pane');\n      tabTitle.setAttribute('aria-controls', tabPanel.id);\n      tabPanel.setAttribute('aria-labelledby', tabTitle.id);\n\n      tab.addEventListener('click', e => {\n        e.preventDefault();\n        this.show(tab.panel);\n      });\n    });\n\n    // if the currently active tab was removed from the DOM then select the first one\n    if (this.activeTab && !this.activeTab.isConnected) {\n      this.show(this.tabs.item(0).panel);\n    }\n  }\n\n  private activateTab(tab: HTMLPostTabHeaderElement) {\n    if (this.activeTab) {\n      const tabTitle = this.activeTab.shadowRoot.querySelector('.tab-title');\n      tabTitle.setAttribute('aria-selected', 'false');\n      tabTitle.classList.remove('active');\n    }\n\n    const tabTitle = tab.shadowRoot.querySelector('.tab-title');\n    tabTitle.setAttribute('aria-selected', 'true');\n    tabTitle.classList.add('active');\n\n    this.activeTab = tab;\n  }\n\n  private hidePanel(panelName: HTMLPostTabPanelElement['name']) {\n    const previousPanel = this.getPanel(panelName);\n\n    if (!previousPanel) return;\n\n    this.hiding = fadeOut(previousPanel);\n    this.hiding.onfinish = () => {\n      previousPanel.style.display = 'none';\n      this.hiding = null;\n    };\n  }\n\n  private showSelectedPanel() {\n    const panel = this.getPanel(this.activeTab.panel);\n    panel.style.display = 'block';\n\n    // prevent the initially selected panel from fading in\n    if (!this.isLoaded) return;\n\n    this.showing = fadeIn(panel);\n    this.showing.onfinish = () => {\n      this.showing = null;\n    };\n  }\n\n  private getPanel(name: string): HTMLPostTabPanelElement {\n    return this.host.querySelector(\n      `post-tab-panel[name=${name}]`\n    );\n  }\n\n  render() {\n    return (\n      <Host data-version={version}>\n        <div class=\"tabs-wrapper\">\n          <ul class=\"tabs nav\" role=\"tablist\">\n            <slot name=\"tabs\" onSlotchange={() => this.enableTabs()} />\n          </ul>\n        </div>\n        <div class=\"tab-content\">\n          <slot onSlotchange={() => this.moveMisplacedTabs()} />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"post-tabs.js","sourceRoot":"","sources":["../../../../src/components/post-tabs/post-tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { fadeIn, fadeOut } from '../../animations';\n\n@Component({\n  tag: 'post-tabs',\n  styleUrl: 'post-tabs.scss',\n  shadow: true,\n})\nexport class PostTabs {\n  private activeTab: HTMLPostTabHeaderElement;\n  private showing: Animation;\n  private hiding: Animation;\n  private isLoaded = false;\n\n  private get tabs(): NodeListOf<HTMLPostTabHeaderElement> {\n    return this.host.querySelectorAll('post-tab-header');\n  }\n\n  @Element() host: HTMLPostTabsElement;\n\n  /**\n   * The name of the panel that is initially shown.\n   * If not specified, it defaults to the panel associated with the first tab.\n   *\n   * **Changing this value after initialization has no effect.**\n   */\n  @Prop() readonly activePanel: HTMLPostTabPanelElement['name'];\n\n  /**\n   * An event emitted after the active tab changes, when the fade in transition of its associated panel is finished.\n   * The payload is the name of the newly shown panel.\n   */\n  @Event() tabChange: EventEmitter<HTMLPostTabPanelElement['name']>;\n\n  componentDidLoad() {\n    this.moveMisplacedTabs();\n    this.enableTabs();\n\n    const initiallyActivePanel = this.activePanel || this.tabs.item(0).panel;\n    void this.show(initiallyActivePanel);\n\n    this.isLoaded = true;\n  }\n\n  /**\n   * Shows the panel with the given name and selects its associated tab.\n   * Any other panel that was previously shown becomes hidden and its associated tab is unselected.\n   */\n  @Method()\n  async show(panelName: string) {\n    // do nothing if the tab is already active\n    if (panelName === this.activeTab?.panel) {\n      return;\n    }\n\n    const previousTab = this.activeTab;\n    const newTab: HTMLPostTabHeaderElement = this.host.querySelector(\n      `post-tab-header[panel=${panelName}]`,\n    );\n    this.activateTab(newTab);\n\n    // if a panel is currently being displayed, remove it from the view and complete the associated animation\n    if (this.showing) {\n      this.showing.effect['target'].style.display = 'none';\n      this.showing.finish();\n    }\n\n    // hide the currently visible panel only if no other animation is running\n    if (previousTab && !this.showing && !this.hiding) {\n      this.hidePanel(previousTab.panel);\n    }\n\n    // wait for any hiding animation to complete before showing the selected tab\n    if (this.hiding) {\n      await this.hiding.finished;\n    }\n\n    this.showSelectedPanel();\n\n    // wait for any display animation to complete for the returned promise to fully resolve\n    if (this.showing) {\n      await this.showing.finished;\n    }\n\n    this.tabChange.emit(this.activeTab.panel);\n  }\n\n  private moveMisplacedTabs() {\n    if (!this.tabs) return;\n\n    this.tabs.forEach(tab => {\n      if (tab.getAttribute('slot') === 'tabs') return;\n      tab.setAttribute('slot', 'tabs');\n    });\n  }\n\n  private enableTabs() {\n    if (!this.tabs) return;\n\n    this.tabs.forEach(async tab => {\n      await tab.componentOnReady();\n\n      const tabTitle = tab.shadowRoot.querySelector('.tab-title');\n\n      // if the tab has an \"aria-controls\" attribute it was already linked to its panel: do nothing\n      if (tabTitle.getAttribute('aria-controls')) return;\n\n      const tabPanel = this.getPanel(tab.panel).shadowRoot.querySelector('.tab-pane');\n      tabTitle.setAttribute('aria-controls', tabPanel.id);\n      tabPanel.setAttribute('aria-labelledby', tabTitle.id);\n\n      tab.addEventListener('click', () => {\n        void this.show(tab.panel);\n      });\n\n      tab.addEventListener('keydown', ({ key }) => {\n        if (key === 'ArrowRight' || key === 'ArrowLeft') this.navigateTabs(tab, key);\n      });\n    });\n\n    // if the currently active tab was removed from the DOM then select the first one\n    if (this.activeTab && !this.activeTab.isConnected) {\n      void this.show(this.tabs.item(0).panel);\n    }\n  }\n\n  private activateTab(tab: HTMLPostTabHeaderElement) {\n    if (this.activeTab) {\n      const tabTitle = this.activeTab.shadowRoot.querySelector('.tab-title');\n      tabTitle.setAttribute('aria-selected', 'false');\n      tabTitle.setAttribute('tabindex', '-1');\n      tabTitle.classList.remove('active');\n    }\n\n    const tabTitle = tab.shadowRoot.querySelector('.tab-title');\n    tabTitle.setAttribute('aria-selected', 'true');\n    tabTitle.removeAttribute('tabindex');\n    tabTitle.classList.add('active');\n\n    this.activeTab = tab;\n  }\n\n  private hidePanel(panelName: HTMLPostTabPanelElement['name']) {\n    const previousPanel = this.getPanel(panelName);\n\n    if (!previousPanel) return;\n\n    this.hiding = fadeOut(previousPanel);\n    this.hiding.onfinish = () => {\n      previousPanel.style.display = 'none';\n      this.hiding = null;\n    };\n  }\n\n  private showSelectedPanel() {\n    const panel = this.getPanel(this.activeTab.panel);\n    panel.style.display = 'block';\n\n    // prevent the initially selected panel from fading in\n    if (!this.isLoaded) return;\n\n    this.showing = fadeIn(panel);\n    this.showing.onfinish = () => {\n      this.showing = null;\n    };\n  }\n\n  private getPanel(name: string): HTMLPostTabPanelElement {\n    return this.host.querySelector(`post-tab-panel[name=${name}]`);\n  }\n\n  private navigateTabs(tab: HTMLPostTabHeaderElement, key: 'ArrowRight' | 'ArrowLeft') {\n    const activeTabIndex = Array.from(this.tabs).indexOf(tab);\n\n    let nextTab: HTMLPostTabHeaderElement;\n    if (key === 'ArrowRight') {\n      nextTab = this.tabs[activeTabIndex + 1] || this.tabs[0];\n    } else {\n      nextTab = this.tabs[activeTabIndex - 1] || this.tabs[this.tabs.length - 1];\n    }\n\n    if (!nextTab) return;\n\n    const nextTabTitle = nextTab.shadowRoot.querySelector('.tab-title') as HTMLAnchorElement;\n    nextTabTitle.focus();\n  }\n\n  render() {\n    return (\n      <Host data-version={version}>\n        <div class=\"tabs-wrapper\">\n          <div class=\"tabs\" role=\"tablist\">\n            <slot name=\"tabs\" onSlotchange={() => this.enableTabs()} />\n          </div>\n        </div>\n        <div class=\"tab-content\">\n          <slot onSlotchange={() => this.moveMisplacedTabs()} />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/post-tooltip/post-tooltip.css

@@ -1,194 +1 @@
-/**
- * Colors used by the post style guide
- */
-/**
- * Maps. Allow maps to have custom colors from the project
- * by always merging into a default empty map
- */
-:host, .bg-yellow {
-  --post-bg-opacity: 1;
-  background-color: rgba(var(--post-bg-rgb), var(--post-bg-opacity)) !important;
-  color: var(--post-contrast-color) !important;
-}
-
-.bg-yellow {
-  --post-contrast-color: #000;
-  --post-contrast-color-inverted: #fff;
-  --post-gray-10: hsl(0, 0%, 90%);
-  --post-gray-20: hsl(0, 0%, 80%);
-  --post-gray-40: hsl(0, 0%, 60%);
-  --post-gray-60: hsl(0, 0%, 40%);
-  --post-gray-80: hsl(0, 0%, 20%);
-  --post-yellow: #fc0;
-  --post-light: #faf9f8;
-  --post-gray: #f4f3f1;
-  --post-dark: hsl(0, 0%, 20%);
-  --post-primary: hsl(0, 0%, 20%);
-  --post-white: #fff;
-  --post-black: #000;
-  --post-success: #2c911c;
-  --post-info: #cce4ee;
-  --post-warning: #f49e00;
-  --post-danger: #a51728;
-  --post-nightblue: #004976;
-  --post-nightblue-bright: #0076a8;
-  --post-petrol: #006d68;
-  --post-petrol-bright: #00968f;
-  --post-coral: #9e2a2f;
-  --post-coral-bright: #e03c31;
-  --post-olive: #716135;
-  --post-olive-bright: #aa9d2e;
-  --post-purple: #80276c;
-  --post-purple-bright: #c5299b;
-  --post-aubergine: #523178;
-  --post-aubergine-bright: #7566a0;
-  --post-contrast-color-rgb: 0, 0, 0;
-  --post-contrast-color-inverted-rgb: 255, 255, 255;
-  --post-gray-10-rgb: 230, 230, 230;
-  --post-gray-20-rgb: 204, 204, 204;
-  --post-gray-40-rgb: 153, 153, 153;
-  --post-gray-60-rgb: 102, 102, 102;
-  --post-gray-80-rgb: 51, 51, 51;
-  --post-yellow-rgb: 255, 204, 0;
-  --post-light-rgb: 250, 249, 248;
-  --post-gray-rgb: 244, 243, 241;
-  --post-dark-rgb: 51, 51, 51;
-  --post-primary-rgb: 51, 51, 51;
-  --post-white-rgb: 255, 255, 255;
-  --post-black-rgb: 0, 0, 0;
-  --post-success-rgb: 44, 145, 28;
-  --post-info-rgb: 204, 228, 238;
-  --post-warning-rgb: 244, 158, 0;
-  --post-danger-rgb: 165, 23, 40;
-  --post-nightblue-rgb: 0, 73, 118;
-  --post-nightblue-bright-rgb: 0, 118, 168;
-  --post-petrol-rgb: 0, 109, 104;
-  --post-petrol-bright-rgb: 0, 150, 143;
-  --post-coral-rgb: 158, 42, 47;
-  --post-coral-bright-rgb: 224, 60, 49;
-  --post-olive-rgb: 113, 97, 53;
-  --post-olive-bright-rgb: 170, 157, 46;
-  --post-purple-rgb: 128, 39, 108;
-  --post-purple-bright-rgb: 197, 41, 155;
-  --post-aubergine-rgb: 82, 49, 120;
-  --post-aubergine-bright-rgb: 117, 102, 160;
-}
-
-:host {
-  --post-contrast-color: #fff;
-  --post-contrast-color-inverted: #000;
-  --post-dark: #faf9f8;
-  --post-light: hsl(0, 0%, 20%);
-  --post-gray-80: hsl(0, 0%, 90%);
-  --post-gray-60: hsl(0, 0%, 80%);
-  --post-gray-40: hsl(0, 0%, 60%);
-  --post-gray-20: hsl(0, 0%, 40%);
-  --post-gray-10: hsl(0, 0%, 20%);
-  --post-contrast-color-rgb: 255, 255, 255;
-  --post-contrast-color-inverted-rgb: 0, 0, 0;
-  --post-dark-rgb: 250, 249, 248;
-  --post-light-rgb: 51, 51, 51;
-  --post-gray-80-rgb: 230, 230, 230;
-  --post-gray-60-rgb: 204, 204, 204;
-  --post-gray-40-rgb: 153, 153, 153;
-  --post-gray-20-rgb: 102, 102, 102;
-  --post-gray-10-rgb: 51, 51, 51;
-}
-
-@layer polyfill {
-  [popover] {
-    position: fixed;
-    z-index: 2147483647;
-    inset: 0;
-    padding: 0.25em;
-    width: fit-content;
-    height: fit-content;
-    border-width: initial;
-    border-color: initial;
-    border-image: initial;
-    border-style: solid;
-    background-color: canvas;
-    color: canvastext;
-    overflow: auto;
-    margin: auto;
-  }
-  [popover]:not(.\:popover-open) {
-    display: none;
-  }
-  [popover]:is(dialog[open]) {
-    display: revert;
-  }
-  [anchor].\:popover-open {
-    inset: auto;
-  }
-  @supports selector([popover]:open) {
-    [popover]:not(.\:popover-open, dialog[open]) {
-      display: revert;
-    }
-    [anchor]:is(:open) {
-      inset: auto;
-    }
-  }
-  @supports selector([popover]:popover-open) {
-    [popover]:not(.\:popover-open, dialog[open]) {
-      display: revert;
-    }
-    [anchor]:is(:popover-open) {
-      inset: auto;
-    }
-  }
-  @supports not (background-color: canvas) {
-    [popover] {
-      background-color: white;
-      color: black;
-    }
-  }
-  @supports (width: -moz-fit-content) {
-    [popover] {
-      width: -moz-fit-content;
-      height: -moz-fit-content;
-    }
-  }
-  @supports not (inset: 0) {
-    [popover] {
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-    }
-  }
-}
-:host {
-  --post-bg-rgb: 51, 51, 51;
-}
-
-div {
-  position: absolute;
-  z-index: 1070;
-  width: max-content;
-  max-width: 30ch;
-  margin: 0;
-  padding: 0.25rem 0.5rem;
-  color: inherit;
-  background-color: inherit;
-  border-color: transparent;
-  border-radius: 4px;
-  overflow: visible;
-  pointer-events: none;
-}
-
-.arrow {
-  position: absolute;
-  width: 0.7071067812rem;
-  aspect-ratio: 1/1;
-  background-color: inherit;
-  rotate: 45deg;
-  pointer-events: none;
-  z-index: -1;
-  border-right: 2px solid transparent;
-  border-bottom: 2px solid transparent;
-}
-
-.bg-yellow {
-  --post-bg-rgb: 255, 204, 0;
-}
+:host,.bg-yellow{--post-bg-opacity: 1;background-color:rgba(var(--post-bg-rgb), var(--post-bg-opacity)) !important;color:var(--post-contrast-color) !important}.bg-yellow{--post-contrast-color: #000;--post-contrast-color-inverted: #fff;--post-gray-10: hsl(0, 0%, 90%);--post-gray-20: hsl(0, 0%, 80%);--post-gray-40: hsl(0, 0%, 60%);--post-gray-60: hsl(0, 0%, 40%);--post-gray-80: hsl(0, 0%, 20%);--post-yellow: #fc0;--post-light: #faf9f8;--post-gray: #f4f3f1;--post-dark: hsl(0, 0%, 20%);--post-primary: hsl(0, 0%, 20%);--post-white: #fff;--post-black: #000;--post-success: #2c911c;--post-info: #cce4ee;--post-warning: #f49e00;--post-danger: #a51728;--post-nightblue: #004976;--post-nightblue-bright: #0076a8;--post-petrol: #006d68;--post-petrol-bright: #00968f;--post-coral: #9e2a2f;--post-coral-bright: #e03c31;--post-olive: #716135;--post-olive-bright: #aa9d2e;--post-purple: #80276c;--post-purple-bright: #c5299b;--post-aubergine: #523178;--post-aubergine-bright: #7566a0;--post-contrast-color-rgb: 0, 0, 0;--post-contrast-color-inverted-rgb: 255, 255, 255;--post-gray-10-rgb: 230, 230, 230;--post-gray-20-rgb: 204, 204, 204;--post-gray-40-rgb: 153, 153, 153;--post-gray-60-rgb: 102, 102, 102;--post-gray-80-rgb: 51, 51, 51;--post-yellow-rgb: 255, 204, 0;--post-light-rgb: 250, 249, 248;--post-gray-rgb: 244, 243, 241;--post-dark-rgb: 51, 51, 51;--post-primary-rgb: 51, 51, 51;--post-white-rgb: 255, 255, 255;--post-black-rgb: 0, 0, 0;--post-success-rgb: 44, 145, 28;--post-info-rgb: 204, 228, 238;--post-warning-rgb: 244, 158, 0;--post-danger-rgb: 165, 23, 40;--post-nightblue-rgb: 0, 73, 118;--post-nightblue-bright-rgb: 0, 118, 168;--post-petrol-rgb: 0, 109, 104;--post-petrol-bright-rgb: 0, 150, 143;--post-coral-rgb: 158, 42, 47;--post-coral-bright-rgb: 224, 60, 49;--post-olive-rgb: 113, 97, 53;--post-olive-bright-rgb: 170, 157, 46;--post-purple-rgb: 128, 39, 108;--post-purple-bright-rgb: 197, 41, 155;--post-aubergine-rgb: 82, 49, 120;--post-aubergine-bright-rgb: 117, 102, 160}:host{--post-contrast-color: #fff;--post-contrast-color-inverted: #000;--post-dark: #faf9f8;--post-light: hsl(0, 0%, 20%);--post-gray-80: hsl(0, 0%, 90%);--post-gray-60: hsl(0, 0%, 80%);--post-gray-40: hsl(0, 0%, 60%);--post-gray-20: hsl(0, 0%, 40%);--post-gray-10: hsl(0, 0%, 20%);--post-contrast-color-rgb: 255, 255, 255;--post-contrast-color-inverted-rgb: 0, 0, 0;--post-dark-rgb: 250, 249, 248;--post-light-rgb: 51, 51, 51;--post-gray-80-rgb: 230, 230, 230;--post-gray-60-rgb: 204, 204, 204;--post-gray-40-rgb: 153, 153, 153;--post-gray-20-rgb: 102, 102, 102;--post-gray-10-rgb: 51, 51, 51}@layer polyfill{[popover]{position:fixed;z-index:2147483647;inset:0;padding:.25em;width:fit-content;height:fit-content;border-width:initial;border-color:initial;border-image:initial;border-style:solid;background-color:canvas;color:canvastext;overflow:auto;margin:auto}[popover]:not(.\:popover-open){display:none}[popover]:is(dialog[open]){display:revert}[anchor].\:popover-open{inset:auto}@supports selector([popover]:open){[popover]:not(.\:popover-open,dialog[open]){display:revert}[anchor]:is(:open){inset:auto}}@supports selector([popover]:popover-open){[popover]:not(.\:popover-open,dialog[open]){display:revert}[anchor]:is(:popover-open){inset:auto}}@supports not (background-color: canvas){[popover]{background-color:white;color:black}}@supports(width: -moz-fit-content){[popover]{width:-moz-fit-content;height:-moz-fit-content}}@supports not (inset: 0){[popover]{top:0;left:0;right:0;bottom:0}}}:host{--post-bg-rgb: 51, 51, 51}div{position:absolute;z-index:1070;width:max-content;max-width:30ch;margin:0;padding:.25rem .5rem;color:inherit;background-color:inherit;border-color:rgba(0,0,0,0);border-radius:4px;overflow:visible;pointer-events:none}.arrow{position:absolute;width:.7071067812rem;aspect-ratio:1/1;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1;border-right:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}.bg-yellow{--post-bg-rgb: 255, 204, 0}

package/dist/components/package.js

@@ -1,4 +1,4 @@
-const version = "1.5.0";
+const version = "1.5.1";
 
 export { version as v };
 

package/dist/components/post-alert.js

@@ -7,7 +7,7 @@ import { c as checkNonEmpty } from './check-non-empty.js';
 
 const ALERT_TYPES = ['primary', 'success', 'danger', 'warning', 'info', 'gray'];
 
-const postAlertCss = "/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */.alert-primary,.alert-success,.alert-danger,.alert-warning,.alert-info,.alert-gray,.alert-notification,.alert-error{background-color:rgb(var(--post-bg-rgb)) !important;color:var(--post-contrast-color) !important}.alert-success,.alert-warning,.alert-info,.alert-gray{--post-contrast-color:#000;--post-contrast-color-inverted:#fff;--post-gray-10:hsl(0, 0%, 90%);--post-gray-20:hsl(0, 0%, 80%);--post-gray-40:hsl(0, 0%, 60%);--post-gray-60:hsl(0, 0%, 40%);--post-gray-80:hsl(0, 0%, 20%);--post-yellow:#fc0;--post-light:#faf9f8;--post-gray:#f4f3f1;--post-dark:hsl(0, 0%, 20%);--post-primary:hsl(0, 0%, 20%);--post-white:#fff;--post-black:#000;--post-success:#2c911c;--post-info:#cce4ee;--post-warning:#f49e00;--post-danger:#a51728;--post-nightblue:#004976;--post-nightblue-bright:#0076a8;--post-petrol:#006d68;--post-petrol-bright:#00968f;--post-coral:#9e2a2f;--post-coral-bright:#e03c31;--post-olive:#716135;--post-olive-bright:#aa9d2e;--post-purple:#80276c;--post-purple-bright:#c5299b;--post-aubergine:#523178;--post-aubergine-bright:#7566a0;--post-contrast-color-rgb:0, 0, 0;--post-contrast-color-inverted-rgb:255, 255, 255;--post-gray-10-rgb:230, 230, 230;--post-gray-20-rgb:204, 204, 204;--post-gray-40-rgb:153, 153, 153;--post-gray-60-rgb:102, 102, 102;--post-gray-80-rgb:51, 51, 51;--post-yellow-rgb:255, 204, 0;--post-light-rgb:250, 249, 248;--post-gray-rgb:244, 243, 241;--post-dark-rgb:51, 51, 51;--post-primary-rgb:51, 51, 51;--post-white-rgb:255, 255, 255;--post-black-rgb:0, 0, 0;--post-success-rgb:44, 145, 28;--post-info-rgb:204, 228, 238;--post-warning-rgb:244, 158, 0;--post-danger-rgb:165, 23, 40;--post-nightblue-rgb:0, 73, 118;--post-nightblue-bright-rgb:0, 118, 168;--post-petrol-rgb:0, 109, 104;--post-petrol-bright-rgb:0, 150, 143;--post-coral-rgb:158, 42, 47;--post-coral-bright-rgb:224, 60, 49;--post-olive-rgb:113, 97, 53;--post-olive-bright-rgb:170, 157, 46;--post-purple-rgb:128, 39, 108;--post-purple-bright-rgb:197, 41, 155;--post-aubergine-rgb:82, 49, 120;--post-aubergine-bright-rgb:117, 102, 160}.alert-primary,.alert-danger,.alert-notification,.alert-error{--post-contrast-color:#fff;--post-contrast-color-inverted:#000;--post-dark:#faf9f8;--post-light:hsl(0, 0%, 20%);--post-gray-80:hsl(0, 0%, 90%);--post-gray-60:hsl(0, 0%, 80%);--post-gray-40:hsl(0, 0%, 60%);--post-gray-20:hsl(0, 0%, 40%);--post-gray-10:hsl(0, 0%, 20%);--post-contrast-color-rgb:255, 255, 255;--post-contrast-color-inverted-rgb:0, 0, 0;--post-dark-rgb:250, 249, 248;--post-light-rgb:51, 51, 51;--post-gray-80-rgb:230, 230, 230;--post-gray-60-rgb:204, 204, 204;--post-gray-40-rgb:153, 153, 153;--post-gray-20-rgb:102, 102, 102;--post-gray-10-rgb:51, 51, 51}.alert{position:relative;box-sizing:border-box;min-height:5rem;box-shadow:0 2px 4px 0 rgba(0, 0, 0, 0.2);border-radius:4px;padding:1rem 1.25rem;padding-inline-start:5.5rem;margin-block-end:1rem;font-size:1rem;font-weight:300}.alert.no-icon{min-height:3.5rem;padding-inline-start:1.25rem}.alert[class^=pi-],.alert[class*=\" pi-\"]{background-size:3rem;background-position:1.25rem 1rem;background-repeat:no-repeat}.alert[class^=pi-].no-icon,.alert[class*=\" pi-\"].no-icon{background-image:none}.alert::before{content:\"\";display:block}.alert::before,.alert>post-icon{position:absolute;height:3rem;width:3rem;left:1.25rem;top:1rem}.alert.no-icon::before,.alert[class^=pi-]::before,.alert[class*=\" pi-\"]::before{content:unset}.alert.no-icon>post-icon,.alert[class^=pi-]>post-icon,.alert[class*=\" pi-\"]>post-icon{display:none}@media (forced-colors: active), (-ms-high-contrast: active), (-ms-high-contrast: white-on-black){.alert{filter:none !important;background-color:transparent !important;border:2px solid WindowText}}.alert:not(.alert-action){display:flex;flex-direction:column;justify-content:center;gap:0.25rem}.alert:not(.alert-action) a{font-weight:400}.alert:not(.alert-action) hr{margin-block:0.5rem 0.75rem !important}.alert:not(.alert-action)>:only-child,.alert:not(.alert-action)>post-icon:first-child+:last-child{font-size:1.0625rem;font-weight:700}.alert:not(.alert-action)>*{margin:0}.alert-heading{font-size:1.0625rem;font-weight:700}.alert-dismissible{pointer-events:auto;position:relative;padding-inline-end:4rem}.alert-dismissible>.btn-close{position:absolute;inset-block-start:1rem;inset-inline-end:1.25rem}.alert-dismissible>.btn-close:first-child+:last-child{font-size:1.0625rem;font-weight:700}.alert-action{display:flex;flex-direction:row;align-items:center;gap:1.25rem}.alert-action>.alert-content{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;gap:0.25rem}.alert-action>.alert-content a{font-weight:400}.alert-action>.alert-content hr{margin-block:0.5rem 0.75rem !important}.alert-action>.alert-content>:only-child,.alert-action>.alert-content>post-icon:first-child+:last-child{font-size:1.0625rem;font-weight:700}.alert-action>.alert-content>*{margin:0}.alert-action>.alert-buttons{flex:0 0 auto;display:flex;align-items:center;gap:0.5rem}@media (min-width: 780px){.alert-action.alert-dismissible>.btn-close{inset-block-start:calc(50% - 0.75rem)}}@media (max-width: 779.98px){.alert-action{flex-direction:column;align-items:stretch;padding-inline:1.25rem}.alert-action>.alert-content{padding-inline-start:4.25rem;padding-inline-end:2.75rem}.alert-action>.alert-buttons{display:flex}.alert-action>.alert-buttons>.btn{flex:1 0 0;width:100%}.alert-action>.alert-buttons>.btn:first-child{margin-inline-start:0}}.alert-fixed-bottom{position:fixed;inset-block-end:0;inset-inline-start:0;inset-inline-end:0;margin-bottom:0;border-radius:0;z-index:1030}@media (min-width: 1441px){.alert-fixed-bottom{padding-inline-end:calc((100% - 1440px) / 2 + 128px + 1.25rem);padding-inline-start:calc(\n      (100% - 1440px) / 2 + 128px + 1.25rem + 3rem + 1.25rem\n    );background-position-x:calc((100% - 1440px) / 2 + 128px + 1.25rem + 1.5rem)}.alert-fixed-bottom::before{left:calc((100% - 1440px) / 2 + 128px + 1.25rem)}.alert-fixed-bottom.no-icon{padding-inline-start:calc((100% - 1440px) / 2 + 128px + 1.25rem)}.alert-fixed-bottom.alert-dismissible{padding-inline-end:calc(\n        (100% - 1440px) / 2 + 128px + 1.25rem + 1.25rem + 1.5rem\n      )}.alert-fixed-bottom.alert-dismissible>.btn-close{inset-inline-end:calc((100% - 1440px) / 2 + 128px + 1.25rem)}}.alert-primary{--post-bg-rgb:51, 51, 51}.alert-primary:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M30.533 26.933c-3.333-4.8-5.867-12.667-5.867-18.267 0-4.8-3.867-8.667-8.667-8.667S7.332 3.866 7.332 8.666c0 5.6-2.533 13.467-5.867 18.267L1.998 28h11.333v4h5.333v-4h11.333l.533-1.067zm-13.2 3.734h-2.667V28h2.667v2.667zm-14.133-4c3.2-5.067 5.467-12.533 5.467-18 0-4 3.333-7.333 7.333-7.333s7.333 3.333 7.333 7.333c0 5.467 2.267 12.933 5.467 18H3.2z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M30.533 26.933c-3.333-4.8-5.867-12.667-5.867-18.267 0-4.8-3.867-8.667-8.667-8.667S7.332 3.866 7.332 8.666c0 5.6-2.533 13.467-5.867 18.267L1.998 28h11.333v4h5.333v-4h11.333l.533-1.067zm-13.2 3.734h-2.667V28h2.667v2.667zm-14.133-4c3.2-5.067 5.467-12.533 5.467-18 0-4 3.333-7.333 7.333-7.333s7.333 3.333 7.333 7.333c0 5.467 2.267 12.933 5.467 18H3.2z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-primary>post-icon{background-color:hsl(0, 0%, 20%)}.alert-success{--post-bg-rgb:44, 145, 28}.alert-success:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m12.667 24.533-7.6-7.6 1.867-1.867 5.733 5.733 12.4-12.4 1.867 1.867z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m12.667 24.533-7.6-7.6 1.867-1.867 5.733 5.733 12.4-12.4 1.867 1.867z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-success>post-icon{background-color:#2c911c}.alert-danger{--post-bg-rgb:165, 23, 40}.alert-danger:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-danger>post-icon{background-color:#a51728}.alert-warning{--post-bg-rgb:244, 158, 0}.alert-warning:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-warning>post-icon{background-color:#f49e00}.alert-info{--post-bg-rgb:204, 228, 238}.alert-info:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M17.333 25.333v-16h-4.667V12h2v13.333h-2V28h6.667v-2.667zM14.667 4h2.667v2.667h-2.667V4z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M17.333 25.333v-16h-4.667V12h2v13.333h-2V28h6.667v-2.667zM14.667 4h2.667v2.667h-2.667V4z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-info>post-icon{background-color:#cce4ee}.alert-gray{--post-bg-rgb:244, 243, 241}.alert-gray:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xml:space='preserve' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M31.986 15.73c-.503.16-1.03.27-1.586.27a5.241 5.241 0 0 1-4.43-2.448c-.73.382-1.547.62-2.427.62a5.257 5.257 0 0 1-5.257-5.258c0-.88.237-1.698.62-2.427a5.241 5.241 0 0 1-2.449-4.43c0-.714.145-1.393.403-2.014C16.574.028 16.29 0 16 0 7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16c0-.091-.012-.18-.014-.27zM16 30.667c-8.087 0-14.667-6.58-14.667-14.667 0-7.806 6.13-14.207 13.828-14.643a6.54 6.54 0 0 0 2.116 5.56 6.325 6.325 0 0 0-.325 1.997 6.598 6.598 0 0 0 6.59 6.59c.677 0 1.346-.108 1.998-.324a6.54 6.54 0 0 0 5.067 2.15C29.933 24.796 23.639 30.667 16 30.667zM11.352 14.17a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0zm-4 0c0-.735.599-1.333 1.334-1.333s1.333.598 1.333 1.333-.598 1.334-1.333 1.334-1.334-.598-1.334-1.334zm13.981 8.496a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0zm-4 0a1.335 1.335 0 0 1 2.667 0c0 .735-.598 1.333-1.333 1.333a1.335 1.335 0 0 1-1.334-1.333zm-7.276-1.829a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm0 2.667a.667.667 0 1 1 .002-1.335.667.667 0 0 1-.002 1.335zm7.772-6a2 2 0 1 0-4 0 2 2 0 0 0 4 0zm-2 .666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334zM11.505 5.505a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm0 2.666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334zM28.93 18.548a13.19 13.19 0 0 1-4.335 7.357.663.663 0 0 1-.94-.073.666.666 0 0 1 .073-.94 11.84 11.84 0 0 0 3.894-6.61.668.668 0 0 1 1.307.266zm-6.668 8.212a.667.667 0 0 1-.295.896c-.837.423-1.722.757-2.63.99a.665.665 0 1 1-.33-1.292 11.647 11.647 0 0 0 2.359-.888.668.668 0 0 1 .896.294zM4 15.921a.666.666 0 1 1-1.333 0 13.13 13.13 0 0 1 4.597-9.984.666.666 0 1 1 .867 1.013A11.798 11.798 0 0 0 4 15.92z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xml:space='preserve' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M31.986 15.73c-.503.16-1.03.27-1.586.27a5.241 5.241 0 0 1-4.43-2.448c-.73.382-1.547.62-2.427.62a5.257 5.257 0 0 1-5.257-5.258c0-.88.237-1.698.62-2.427a5.241 5.241 0 0 1-2.449-4.43c0-.714.145-1.393.403-2.014C16.574.028 16.29 0 16 0 7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16c0-.091-.012-.18-.014-.27zM16 30.667c-8.087 0-14.667-6.58-14.667-14.667 0-7.806 6.13-14.207 13.828-14.643a6.54 6.54 0 0 0 2.116 5.56 6.325 6.325 0 0 0-.325 1.997 6.598 6.598 0 0 0 6.59 6.59c.677 0 1.346-.108 1.998-.324a6.54 6.54 0 0 0 5.067 2.15C29.933 24.796 23.639 30.667 16 30.667zM11.352 14.17a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0zm-4 0c0-.735.599-1.333 1.334-1.333s1.333.598 1.333 1.333-.598 1.334-1.333 1.334-1.334-.598-1.334-1.334zm13.981 8.496a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0zm-4 0a1.335 1.335 0 0 1 2.667 0c0 .735-.598 1.333-1.333 1.333a1.335 1.335 0 0 1-1.334-1.333zm-7.276-1.829a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm0 2.667a.667.667 0 1 1 .002-1.335.667.667 0 0 1-.002 1.335zm7.772-6a2 2 0 1 0-4 0 2 2 0 0 0 4 0zm-2 .666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334zM11.505 5.505a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm0 2.666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334zM28.93 18.548a13.19 13.19 0 0 1-4.335 7.357.663.663 0 0 1-.94-.073.666.666 0 0 1 .073-.94 11.84 11.84 0 0 0 3.894-6.61.668.668 0 0 1 1.307.266zm-6.668 8.212a.667.667 0 0 1-.295.896c-.837.423-1.722.757-2.63.99a.665.665 0 1 1-.33-1.292 11.647 11.647 0 0 0 2.359-.888.668.668 0 0 1 .896.294zM4 15.921a.666.666 0 1 1-1.333 0 13.13 13.13 0 0 1 4.597-9.984.666.666 0 1 1 .867 1.013A11.798 11.798 0 0 0 4 15.92z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-gray>post-icon{background-color:#f4f3f1}.alert-notification{--post-bg-rgb:51, 51, 51}.alert-notification:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M30.533 26.933c-3.333-4.8-5.867-12.667-5.867-18.267 0-4.8-3.867-8.667-8.667-8.667S7.332 3.866 7.332 8.666c0 5.6-2.533 13.467-5.867 18.267L1.998 28h11.333v4h5.333v-4h11.333l.533-1.067zm-13.2 3.734h-2.667V28h2.667v2.667zm-14.133-4c3.2-5.067 5.467-12.533 5.467-18 0-4 3.333-7.333 7.333-7.333s7.333 3.333 7.333 7.333c0 5.467 2.267 12.933 5.467 18H3.2z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M30.533 26.933c-3.333-4.8-5.867-12.667-5.867-18.267 0-4.8-3.867-8.667-8.667-8.667S7.332 3.866 7.332 8.666c0 5.6-2.533 13.467-5.867 18.267L1.998 28h11.333v4h5.333v-4h11.333l.533-1.067zm-13.2 3.734h-2.667V28h2.667v2.667zm-14.133-4c3.2-5.067 5.467-12.533 5.467-18 0-4 3.333-7.333 7.333-7.333s7.333 3.333 7.333 7.333c0 5.467 2.267 12.933 5.467 18H3.2z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-notification>post-icon{background-color:hsl(0, 0%, 20%)}.alert-error{--post-bg-rgb:165, 23, 40}.alert-error:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-error>post-icon{background-color:#a51728}.btn-close{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;user-select:none;appearance:button;outline:none;outline-offset:2px;border-radius:4px;color:var(--post-gray-80);transition:opacity 250ms, border-color 250ms, background-color 250ms, color 250ms}.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline:2px solid var(--post-contrast-color)}.btn-close::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor;content:\"\";display:block;height:1.5rem;width:1.5rem}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:var(--post-contrast-color)}.btn-close:disabled{color:var(--post-gray-40)}.btn-close-white{color:hsl(0, 0%, 90%)}.btn-close-white:focus,.btn-close-white:not(:disabled):hover,.btn-close-white.pretend-hover{color:#fff}.btn-close-white:disabled{color:hsl(0, 0%, 60%)}/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}:host ::slotted(*){margin:0 !important}.visually-hidden{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.visually-hidden:not(caption){position:absolute !important}.alert-heading>::slotted(h1){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h2){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h3){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h4){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h5){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h6){font-size:inherit !important;font-weight:inherit !important}";
+const postAlertCss = "/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */.alert-primary,.alert-success,.alert-danger,.alert-warning,.alert-info,.alert-gray,.alert-notification,.alert-error{background-color:rgb(var(--post-bg-rgb)) !important;color:var(--post-contrast-color) !important}.alert-success,.alert-warning,.alert-info,.alert-gray{--post-contrast-color:#000;--post-contrast-color-inverted:#fff;--post-gray-10:hsl(0, 0%, 90%);--post-gray-20:hsl(0, 0%, 80%);--post-gray-40:hsl(0, 0%, 60%);--post-gray-60:hsl(0, 0%, 40%);--post-gray-80:hsl(0, 0%, 20%);--post-yellow:#fc0;--post-light:#faf9f8;--post-gray:#f4f3f1;--post-dark:hsl(0, 0%, 20%);--post-primary:hsl(0, 0%, 20%);--post-white:#fff;--post-black:#000;--post-success:#2c911c;--post-info:#cce4ee;--post-warning:#f49e00;--post-danger:#a51728;--post-nightblue:#004976;--post-nightblue-bright:#0076a8;--post-petrol:#006d68;--post-petrol-bright:#00968f;--post-coral:#9e2a2f;--post-coral-bright:#e03c31;--post-olive:#716135;--post-olive-bright:#aa9d2e;--post-purple:#80276c;--post-purple-bright:#c5299b;--post-aubergine:#523178;--post-aubergine-bright:#7566a0;--post-contrast-color-rgb:0, 0, 0;--post-contrast-color-inverted-rgb:255, 255, 255;--post-gray-10-rgb:230, 230, 230;--post-gray-20-rgb:204, 204, 204;--post-gray-40-rgb:153, 153, 153;--post-gray-60-rgb:102, 102, 102;--post-gray-80-rgb:51, 51, 51;--post-yellow-rgb:255, 204, 0;--post-light-rgb:250, 249, 248;--post-gray-rgb:244, 243, 241;--post-dark-rgb:51, 51, 51;--post-primary-rgb:51, 51, 51;--post-white-rgb:255, 255, 255;--post-black-rgb:0, 0, 0;--post-success-rgb:44, 145, 28;--post-info-rgb:204, 228, 238;--post-warning-rgb:244, 158, 0;--post-danger-rgb:165, 23, 40;--post-nightblue-rgb:0, 73, 118;--post-nightblue-bright-rgb:0, 118, 168;--post-petrol-rgb:0, 109, 104;--post-petrol-bright-rgb:0, 150, 143;--post-coral-rgb:158, 42, 47;--post-coral-bright-rgb:224, 60, 49;--post-olive-rgb:113, 97, 53;--post-olive-bright-rgb:170, 157, 46;--post-purple-rgb:128, 39, 108;--post-purple-bright-rgb:197, 41, 155;--post-aubergine-rgb:82, 49, 120;--post-aubergine-bright-rgb:117, 102, 160}.alert-primary,.alert-danger,.alert-notification,.alert-error{--post-contrast-color:#fff;--post-contrast-color-inverted:#000;--post-dark:#faf9f8;--post-light:hsl(0, 0%, 20%);--post-gray-80:hsl(0, 0%, 90%);--post-gray-60:hsl(0, 0%, 80%);--post-gray-40:hsl(0, 0%, 60%);--post-gray-20:hsl(0, 0%, 40%);--post-gray-10:hsl(0, 0%, 20%);--post-contrast-color-rgb:255, 255, 255;--post-contrast-color-inverted-rgb:0, 0, 0;--post-dark-rgb:250, 249, 248;--post-light-rgb:51, 51, 51;--post-gray-80-rgb:230, 230, 230;--post-gray-60-rgb:204, 204, 204;--post-gray-40-rgb:153, 153, 153;--post-gray-20-rgb:102, 102, 102;--post-gray-10-rgb:51, 51, 51}.alert{position:relative;box-sizing:border-box;min-height:5rem;box-shadow:0 2px 4px 0 rgba(0,0,0,.2);border-radius:4px;padding:1rem 1.25rem;padding-inline-start:5.5rem;margin-block-end:1rem;font-size:1rem;font-weight:300}.alert.no-icon{min-height:3.5rem;padding-inline-start:1.25rem}.alert[class^=pi-],.alert[class*=\" pi-\"]{background-size:3rem;background-position:1.25rem 1rem;background-repeat:no-repeat}.alert[class^=pi-].no-icon,.alert[class*=\" pi-\"].no-icon{background-image:none}.alert::before{content:\"\";display:block}.alert::before,.alert>post-icon{position:absolute;height:3rem;width:3rem;left:1.25rem;top:1rem}.alert.no-icon::before,.alert[class^=pi-]::before,.alert[class*=\" pi-\"]::before{content:unset}.alert.no-icon>post-icon,.alert[class^=pi-]>post-icon,.alert[class*=\" pi-\"]>post-icon{display:none}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.alert{filter:none !important;background-color:rgba(0,0,0,0) !important;border:2px solid WindowText}}.alert:not(.alert-action){display:flex;flex-direction:column;justify-content:center;gap:.25rem}.alert:not(.alert-action) a{font-weight:400}.alert:not(.alert-action) hr{margin-block:.5rem .75rem !important}.alert:not(.alert-action)>:only-child,.alert:not(.alert-action)>post-icon:first-child+:last-child{font-size:1.0625rem;font-weight:700}.alert:not(.alert-action)>*{margin:0}.alert-heading{font-size:1.0625rem;font-weight:700}.alert-dismissible{pointer-events:auto;position:relative;padding-inline-end:4rem}.alert-dismissible>.btn-close{position:absolute;inset-block-start:1rem;inset-inline-end:1.25rem}.alert-dismissible>.btn-close:first-child+:last-child{font-size:1.0625rem;font-weight:700}.alert-action{display:flex;flex-direction:row;align-items:center;gap:1.25rem}.alert-action>.alert-content{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;gap:.25rem}.alert-action>.alert-content a{font-weight:400}.alert-action>.alert-content hr{margin-block:.5rem .75rem !important}.alert-action>.alert-content>:only-child,.alert-action>.alert-content>post-icon:first-child+:last-child{font-size:1.0625rem;font-weight:700}.alert-action>.alert-content>*{margin:0}.alert-action>.alert-buttons{flex:0 0 auto;display:flex;align-items:center;gap:.5rem}@media (min-width: 780px){.alert-action.alert-dismissible>.btn-close{inset-block-start:calc(50% - 0.75rem)}}@media (max-width: 779.98px){.alert-action{flex-direction:column;align-items:stretch;padding-inline:1.25rem}.alert-action>.alert-content{padding-inline-start:4.25rem;padding-inline-end:2.75rem}.alert-action>.alert-buttons{display:flex}.alert-action>.alert-buttons>.btn{flex:1 0 0;width:100%}.alert-action>.alert-buttons>.btn:first-child{margin-inline-start:0}}.alert-fixed-bottom{position:fixed;inset-block-end:0;inset-inline-start:0;inset-inline-end:0;margin-bottom:0;border-radius:0;z-index:1030}@media (min-width: 1441px){.alert-fixed-bottom{padding-inline-end:calc((100% - 1440px) / 2 + 120px + 1.25rem);padding-inline-start:calc(\n      (100% - 1440px) / 2 + 120px + 1.25rem + 3rem + 1.25rem\n    );background-position-x:calc((100% - 1440px) / 2 + 120px + 1.25rem + 1.5rem)}.alert-fixed-bottom::before{left:calc((100% - 1440px) / 2 + 120px + 1.25rem)}.alert-fixed-bottom.no-icon{padding-inline-start:calc((100% - 1440px) / 2 + 120px + 1.25rem)}.alert-fixed-bottom.alert-dismissible{padding-inline-end:calc(\n        (100% - 1440px) / 2 + 120px + 1.25rem + 1.25rem + 1.5rem\n      )}.alert-fixed-bottom.alert-dismissible>.btn-close{inset-inline-end:calc((100% - 1440px) / 2 + 120px + 1.25rem)}}.alert-primary{--post-bg-rgb:51, 51, 51}.alert-primary:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M30.533 26.933c-3.333-4.8-5.867-12.667-5.867-18.267 0-4.8-3.867-8.667-8.667-8.667S7.332 3.866 7.332 8.666c0 5.6-2.533 13.467-5.867 18.267L1.998 28h11.333v4h5.333v-4h11.333l.533-1.067zm-13.2 3.734h-2.667V28h2.667v2.667zm-14.133-4c3.2-5.067 5.467-12.533 5.467-18 0-4 3.333-7.333 7.333-7.333s7.333 3.333 7.333 7.333c0 5.467 2.267 12.933 5.467 18H3.2z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M30.533 26.933c-3.333-4.8-5.867-12.667-5.867-18.267 0-4.8-3.867-8.667-8.667-8.667S7.332 3.866 7.332 8.666c0 5.6-2.533 13.467-5.867 18.267L1.998 28h11.333v4h5.333v-4h11.333l.533-1.067zm-13.2 3.734h-2.667V28h2.667v2.667zm-14.133-4c3.2-5.067 5.467-12.533 5.467-18 0-4 3.333-7.333 7.333-7.333s7.333 3.333 7.333 7.333c0 5.467 2.267 12.933 5.467 18H3.2z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-primary>post-icon{background-color:#333}.alert-success{--post-bg-rgb:44, 145, 28}.alert-success:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m12.667 24.533-7.6-7.6 1.867-1.867 5.733 5.733 12.4-12.4 1.867 1.867z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m12.667 24.533-7.6-7.6 1.867-1.867 5.733 5.733 12.4-12.4 1.867 1.867z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-success>post-icon{background-color:#2c911c}.alert-danger{--post-bg-rgb:165, 23, 40}.alert-danger:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-danger>post-icon{background-color:#a51728}.alert-warning{--post-bg-rgb:244, 158, 0}.alert-warning:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-warning>post-icon{background-color:#f49e00}.alert-info{--post-bg-rgb:204, 228, 238}.alert-info:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M17.333 25.333v-16h-4.667V12h2v13.333h-2V28h6.667v-2.667zM14.667 4h2.667v2.667h-2.667V4z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M17.333 25.333v-16h-4.667V12h2v13.333h-2V28h6.667v-2.667zM14.667 4h2.667v2.667h-2.667V4z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-info>post-icon{background-color:#cce4ee}.alert-gray{--post-bg-rgb:244, 243, 241}.alert-gray:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xml:space='preserve' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M31.986 15.73c-.503.16-1.03.27-1.586.27a5.241 5.241 0 0 1-4.43-2.448c-.73.382-1.547.62-2.427.62a5.257 5.257 0 0 1-5.257-5.258c0-.88.237-1.698.62-2.427a5.241 5.241 0 0 1-2.449-4.43c0-.714.145-1.393.403-2.014C16.574.028 16.29 0 16 0 7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16c0-.091-.012-.18-.014-.27zM16 30.667c-8.087 0-14.667-6.58-14.667-14.667 0-7.806 6.13-14.207 13.828-14.643a6.54 6.54 0 0 0 2.116 5.56 6.325 6.325 0 0 0-.325 1.997 6.598 6.598 0 0 0 6.59 6.59c.677 0 1.346-.108 1.998-.324a6.54 6.54 0 0 0 5.067 2.15C29.933 24.796 23.639 30.667 16 30.667zM11.352 14.17a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0zm-4 0c0-.735.599-1.333 1.334-1.333s1.333.598 1.333 1.333-.598 1.334-1.333 1.334-1.334-.598-1.334-1.334zm13.981 8.496a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0zm-4 0a1.335 1.335 0 0 1 2.667 0c0 .735-.598 1.333-1.333 1.333a1.335 1.335 0 0 1-1.334-1.333zm-7.276-1.829a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm0 2.667a.667.667 0 1 1 .002-1.335.667.667 0 0 1-.002 1.335zm7.772-6a2 2 0 1 0-4 0 2 2 0 0 0 4 0zm-2 .666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334zM11.505 5.505a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm0 2.666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334zM28.93 18.548a13.19 13.19 0 0 1-4.335 7.357.663.663 0 0 1-.94-.073.666.666 0 0 1 .073-.94 11.84 11.84 0 0 0 3.894-6.61.668.668 0 0 1 1.307.266zm-6.668 8.212a.667.667 0 0 1-.295.896c-.837.423-1.722.757-2.63.99a.665.665 0 1 1-.33-1.292 11.647 11.647 0 0 0 2.359-.888.668.668 0 0 1 .896.294zM4 15.921a.666.666 0 1 1-1.333 0 13.13 13.13 0 0 1 4.597-9.984.666.666 0 1 1 .867 1.013A11.798 11.798 0 0 0 4 15.92z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xml:space='preserve' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M31.986 15.73c-.503.16-1.03.27-1.586.27a5.241 5.241 0 0 1-4.43-2.448c-.73.382-1.547.62-2.427.62a5.257 5.257 0 0 1-5.257-5.258c0-.88.237-1.698.62-2.427a5.241 5.241 0 0 1-2.449-4.43c0-.714.145-1.393.403-2.014C16.574.028 16.29 0 16 0 7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16c0-.091-.012-.18-.014-.27zM16 30.667c-8.087 0-14.667-6.58-14.667-14.667 0-7.806 6.13-14.207 13.828-14.643a6.54 6.54 0 0 0 2.116 5.56 6.325 6.325 0 0 0-.325 1.997 6.598 6.598 0 0 0 6.59 6.59c.677 0 1.346-.108 1.998-.324a6.54 6.54 0 0 0 5.067 2.15C29.933 24.796 23.639 30.667 16 30.667zM11.352 14.17a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0zm-4 0c0-.735.599-1.333 1.334-1.333s1.333.598 1.333 1.333-.598 1.334-1.333 1.334-1.334-.598-1.334-1.334zm13.981 8.496a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0zm-4 0a1.335 1.335 0 0 1 2.667 0c0 .735-.598 1.333-1.333 1.333a1.335 1.335 0 0 1-1.334-1.333zm-7.276-1.829a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm0 2.667a.667.667 0 1 1 .002-1.335.667.667 0 0 1-.002 1.335zm7.772-6a2 2 0 1 0-4 0 2 2 0 0 0 4 0zm-2 .666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334zM11.505 5.505a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm0 2.666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334zM28.93 18.548a13.19 13.19 0 0 1-4.335 7.357.663.663 0 0 1-.94-.073.666.666 0 0 1 .073-.94 11.84 11.84 0 0 0 3.894-6.61.668.668 0 0 1 1.307.266zm-6.668 8.212a.667.667 0 0 1-.295.896c-.837.423-1.722.757-2.63.99a.665.665 0 1 1-.33-1.292 11.647 11.647 0 0 0 2.359-.888.668.668 0 0 1 .896.294zM4 15.921a.666.666 0 1 1-1.333 0 13.13 13.13 0 0 1 4.597-9.984.666.666 0 1 1 .867 1.013A11.798 11.798 0 0 0 4 15.92z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-gray>post-icon{background-color:#f4f3f1}.alert-notification{--post-bg-rgb:51, 51, 51}.alert-notification:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M30.533 26.933c-3.333-4.8-5.867-12.667-5.867-18.267 0-4.8-3.867-8.667-8.667-8.667S7.332 3.866 7.332 8.666c0 5.6-2.533 13.467-5.867 18.267L1.998 28h11.333v4h5.333v-4h11.333l.533-1.067zm-13.2 3.734h-2.667V28h2.667v2.667zm-14.133-4c3.2-5.067 5.467-12.533 5.467-18 0-4 3.333-7.333 7.333-7.333s7.333 3.333 7.333 7.333c0 5.467 2.267 12.933 5.467 18H3.2z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M30.533 26.933c-3.333-4.8-5.867-12.667-5.867-18.267 0-4.8-3.867-8.667-8.667-8.667S7.332 3.866 7.332 8.666c0 5.6-2.533 13.467-5.867 18.267L1.998 28h11.333v4h5.333v-4h11.333l.533-1.067zm-13.2 3.734h-2.667V28h2.667v2.667zm-14.133-4c3.2-5.067 5.467-12.533 5.467-18 0-4 3.333-7.333 7.333-7.333s7.333 3.333 7.333 7.333c0 5.467 2.267 12.933 5.467 18H3.2z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-notification>post-icon{background-color:#333}.alert-error{--post-bg-rgb:165, 23, 40}.alert-error:not(.no-icon,[class^=pi-],[class*=\" pi-\"])::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='M14.667 4h2.667v18.667h-2.667V4zm0 21.333h2.667V28h-2.667v-2.667z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor}.alert-error>post-icon{background-color:#a51728}.btn-close{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;user-select:none;appearance:button;outline:none;outline-offset:2px;border-radius:4px;color:var(--post-gray-80);transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms}.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline:2px solid var(--post-contrast-color)}.btn-close::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor;content:\"\";display:block;height:1.5rem;width:1.5rem}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:var(--post-contrast-color)}.btn-close:disabled{color:var(--post-gray-40)}.btn-close-white{color:#e6e6e6}.btn-close-white:focus,.btn-close-white:not(:disabled):hover,.btn-close-white.pretend-hover{color:#fff}.btn-close-white:disabled{color:#999}/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}:host ::slotted(*){margin:0 !important}.visually-hidden{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.visually-hidden:not(caption){position:absolute !important}.alert-heading>::slotted(h1){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h2){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h3){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h4){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h5){font-size:inherit !important;font-weight:inherit !important}.alert-heading>::slotted(h6){font-size:inherit !important;font-weight:inherit !important}";
 
 const PostAlert$1 = /*@__PURE__*/ proxyCustomElement(class PostAlert extends HTMLElement {
   constructor() {
@@ -75,7 +75,6 @@ const PostAlert$1 = /*@__PURE__*/ proxyCustomElement(class PostAlert extends HTM
   }
   render() {
     const defaultAlertContent = [
-      this.icon && this.icon !== 'none' && (h("post-icon", { key: `${this.alertId}-icon`, name: this.icon })),
       this.hasHeading && (h("div", { key: `${this.alertId}-heading`, class: "alert-heading" }, h("slot", { name: "heading" }))),
       h("slot", { key: `${this.alertId}-message` })
     ];
@@ -83,7 +82,7 @@ const PostAlert$1 = /*@__PURE__*/ proxyCustomElement(class PostAlert extends HTM
       h("div", { key: `${this.alertId}-content`, class: "alert-content" }, defaultAlertContent),
       h("div", { key: `${this.alertId}-buttons`, class: "alert-buttons" }, h("slot", { name: "actions" })),
     ];
-    return (h(Host, { "data-version": version }, h("div", { role: "alert", class: this.classes }, this.dismissible && (h("button", { class: "btn-close", onClick: this.onDismissButtonClick }, h("span", { class: "visually-hidden" }, this.dismissLabel))), this.hasActions
+    return (h(Host, { "data-version": version }, h("div", { role: "alert", class: this.classes }, this.dismissible && (h("button", { class: "btn-close", onClick: this.onDismissButtonClick }, h("span", { class: "visually-hidden" }, this.dismissLabel))), this.icon && this.icon !== 'none' && (h("post-icon", { key: `${this.alertId}-icon`, name: this.icon })), this.hasActions
       ? actionAlertContent
       : defaultAlertContent)));
   }