@swisspost/design-system-components 1.6.3 → 1.7.0

package/dist/post-components/p-fffce1d7.js

@@ -1,2 +0,0 @@
-import{r,c as t,h as a,H as o,g as s}from"./p-a7649277.js";import{v as e}from"./p-88262544.js";import{f as i,a as b}from"./p-2737eaf5.js";const c='.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-info .tabs-wrapper{background-color:#cce4ee}.bg-success .tabs-wrapper{background-color:#2c911c}.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}.bg-success-green .tabs-wrapper{background-color:#2c871d}.bg-error-red .tabs-wrapper{background-color:#a51728}.bg-warning-orange .tabs-wrapper{background-color:#f49e00}.bg-success-background .tabs-wrapper{background-color:#c0debb}.bg-error-background .tabs-wrapper{background-color:#ffdade}.bg-warning-background .tabs-wrapper{background-color:#fce2b2}:host{display:block}';const n=class{constructor(a){r(this,a);this.tabChange=t(this,"tabChange",7);this.isLoaded=false;this.activePanel=undefined}get tabs(){return this.host.querySelectorAll("post-tab-header")}componentDidLoad(){this.moveMisplacedTabs();this.enableTabs();const r=this.activePanel||this.tabs.item(0).panel;void this.show(r);this.isLoaded=true}async show(r){var t;if(r===((t=this.activeTab)===null||t===void 0?void 0:t.panel)){return}const a=this.activeTab;const o=this.host.querySelector(`post-tab-header[panel=${r}]`);this.activateTab(o);if(this.showing){this.showing.effect["target"].style.display="none";this.showing.finish()}if(a&&!this.showing&&!this.hiding){this.hidePanel(a.panel)}if(this.hiding){await this.hiding.finished}this.showSelectedPanel();if(this.showing){await this.showing.finished}this.tabChange.emit(this.activeTab.panel)}moveMisplacedTabs(){if(!this.tabs)return;this.tabs.forEach((r=>{if(r.getAttribute("slot")==="tabs")return;r.setAttribute("slot","tabs")}))}enableTabs(){if(!this.tabs)return;this.tabs.forEach((async r=>{await r.componentOnReady();const t=r.shadowRoot.querySelector(".tab-title");if(t.getAttribute("aria-controls"))return;const a=this.getPanel(r.panel).shadowRoot.querySelector(".tab-pane");t.setAttribute("aria-controls",a.id);a.setAttribute("aria-labelledby",t.id);r.addEventListener("click",(()=>{void this.show(r.panel)}));r.addEventListener("keydown",(({key:t})=>{if(t==="ArrowRight"||t==="ArrowLeft")this.navigateTabs(r,t)}))}));if(this.activeTab&&!this.activeTab.isConnected){void this.show(this.tabs.item(0).panel)}}activateTab(r){if(this.activeTab){const r=this.activeTab.shadowRoot.querySelector(".tab-title");r.setAttribute("aria-selected","false");r.setAttribute("tabindex","-1");r.classList.remove("active")}const t=r.shadowRoot.querySelector(".tab-title");t.setAttribute("aria-selected","true");t.removeAttribute("tabindex");t.classList.add("active");this.activeTab=r}hidePanel(r){const t=this.getPanel(r);if(!t)return;this.hiding=i(t);this.hiding.onfinish=()=>{t.style.display="none";this.hiding=null}}showSelectedPanel(){const r=this.getPanel(this.activeTab.panel);r.style.display="block";if(!this.isLoaded)return;this.showing=b(r);this.showing.onfinish=()=>{this.showing=null}}getPanel(r){return this.host.querySelector(`post-tab-panel[name=${r}]`)}navigateTabs(r,t){const a=Array.from(this.tabs).indexOf(r);let o;if(t==="ArrowRight"){o=this.tabs[a+1]||this.tabs[0]}else{o=this.tabs[a-1]||this.tabs[this.tabs.length-1]}if(!o)return;const s=o.shadowRoot.querySelector(".tab-title");s.focus()}render(){return a(o,{"data-version":e},a("div",{class:"tabs-wrapper"},a("div",{class:"tabs",role:"tablist"},a("slot",{name:"tabs",onSlotchange:()=>this.enableTabs()}))),a("div",{class:"tab-content"},a("slot",{onSlotchange:()=>this.moveMisplacedTabs()})))}get host(){return s(this)}};n.style=c;export{n as P};
-//# sourceMappingURL=p-fffce1d7.js.map