@swisspost/design-system-components 10.7.0 → 10.9.0

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

@@ -1 +1 @@
-import{p as t,H as s,c as e,h as i,a as o,t as a}from"./index.js";import{f as r}from"./p-D5knoiyy.js";import"./p-DeO0rZ1T.js";import{c as n}from"./p-lpWRZjJp.js";import{v as c}from"./p-BBz9PVf0.js";import{d as h}from"./p-BgEY7xhT.js";import{O as l}from"./p-CnN4Jdtv.js";import{T as b}from"./p-CVVXnYLU.js";var p=function(t,s,e,i){var o,a=arguments.length,r=a<3?s:null===i?i=Object.getOwnPropertyDescriptor(s,e):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,s,e,i);else for(var n=t.length-1;n>=0;n--)(o=t[n])&&(r=(a<3?o(r):a>3?o(s,e,r):o(s,e))||r);return a>3&&r&&Object.defineProperty(s,e,r),r};const d=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.postChange=e(this,"postChange"),this.showing=null,this.hiding=null,this.isLoaded=!1,this.isPagesVariant=!1,this.showLeftScrollButton=!1,this.showRightScrollButton=!1,this.textPrevTabItems="Previous tab items",this.textNextTabItems="Next tab items",this.size="large",this.updateScrollButtons=()=>{if(!this.tabsContainer)return;const t=getComputedStyle(this.tabsContainer),s=Number.parseFloat(t.paddingInlineStart)||0,e=Number.parseFloat(t.paddingInlineEnd)||0,i=this.tabsContainer.clientWidth-s-e,o=this.tabsContainer.scrollWidth-s-e;this.showLeftScrollButton=this.tabsContainer.scrollLeft>0,this.showRightScrollButton=this.tabsContainer.scrollLeft+i<o}}get tabs(){return Array.from(this.host.querySelectorAll("post-tab-item")).filter((t=>t.closest("post-tabs")===this.host))}get panels(){return Array.from(this.host.querySelectorAll("post-tab-panel")).filter((t=>t.closest("post-tabs")===this.host))}validateLabel(){this.isPagesVariant&&!this.label&&console.error(`[${this.host.localName}] Property "label" is required in Pages variant. Received: ${JSON.stringify(this.label)}.`,this.host)}componentWillRender(){this.detectVariant()}componentDidLoad(){if(this.leftScrollButton.ariaControlsElements=[this.tabsContainer],this.rightScrollButton.ariaControlsElements=[this.tabsContainer],this.moveMisplacedTabs(),this.moveMisplacedPanels(),this.enableTabs(),this.handleScrollButtons(),this.setupContentObserver(),this.setupResizeObserver(),this.validateLabel(),this.isPagesVariant){const t=this.findActivePagesTab();t&&(this.activateTab(t),this.scrollTabIntoView(t))}else{const t=this.activeTab||this.tabs[0]?.name;if(t){this.show(t);const s=this.tabs.find((s=>s.name===t));s&&this.scrollTabIntoView(s)}}this.isLoaded=!0}disconnectedCallback(){this.showing&&(this.showing.cancel(),this.showing=null),this.hiding&&(this.hiding.cancel(),this.hiding=null),this.contentObserver&&this.contentObserver?.disconnect(),this.resizeObserver?.disconnect(),this.tabsContainer?.removeEventListener("scroll",this.updateScrollButtons)}setupContentObserver(){this.contentObserver=new MutationObserver(this.handleContentChange.bind(this)),this.contentObserver?.observe(this.host,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["data-pages-variant","aria-current"]})}setupResizeObserver(){this.resizeObserver=new ResizeObserver(this.updateScrollButtons),this.resizeObserver.observe(this.tabsContainer)}handleContentChange(t){const s=this.shouldRedetectVariant(t);this.hasAriaCurrentChanged(t)&&this.isPagesVariant&&this.updateActivePagesTab(),s&&this.handleVariantChange(),this.updateScrollButtons()}shouldRedetectVariant(t){return t.some((t=>"childList"===t.type?t.addedNodes.length>0||t.removedNodes.length>0:"attributes"===t.type&&"data-pages-variant"===t.attributeName))}hasAriaCurrentChanged(t){return t.some((t=>"attributes"===t.type&&"aria-current"===t.attributeName))}updateActivePagesTab(){const t=this.findActivePagesTab();t&&t!==this.currentActiveTab&&(this.activateTab(t),this.scrollTabIntoView(t,"smooth"))}handleVariantChange(){const t=this.isPagesVariant;this.detectVariant(),t!==this.isPagesVariant&&(this.enableTabs(),this.initializeActiveTab())}initializeActiveTab(){if(this.isPagesVariant){const t=this.findActivePagesTab();t&&(this.activateTab(t),this.scrollTabIntoView(t))}else{const t=this.activeTab||this.tabs[0]?.name;t&&this.show(t)}}detectVariant(){const t=this.tabs.some((t=>null!==t.querySelector("a")||"true"===t.dataset.pagesVariant));if(t&&this.panels.length>0)throw Error("PostTabs: Mixed mode detected. Cannot use both Page Tabs (anchor elements) and Content Tabs (post-tab-panel elements) variants at the same time.");this.isPagesVariant=t,this.host.classList.remove("page-tabs","content-tabs"),this.host.classList.add(this.isPagesVariant?"page-tabs":"content-tabs")}findActivePagesTab(){return this.tabs.find((t=>null!==t.querySelector('a[aria-current="page"]')))||null}async show(t){try{if(t===this.currentActiveTab?.name)return;const s=this.currentActiveTab,e=this.host.querySelector(`post-tab-item[name="${t}"]`);if(!e)return;if(this.activateTab(e),this.scrollTabIntoView(e,"smooth"),this.showing&&(this.showing.finish(),this.showing=null),!s||this.showing||this.hiding||this.hidePanel(s.name),await this.awaitAnimation(this.hiding))return;if(this.showSelectedPanel(),await this.awaitAnimation(this.showing))return;this.isLoaded&&this.currentActiveTab&&this.postChange.emit(this.currentActiveTab.name)}catch(t){if(this.isAbortError(t))return;throw t}}async awaitAnimation(t){if(!t)return!1;try{return await t.finished,!1}catch(t){if(this.isAbortError(t))return!0;throw t}}isAbortError(t){return(t instanceof DOMException||t instanceof Error)&&"AbortError"===t.name}moveMisplacedTabs(){this.tabs&&this.tabs.forEach((t=>{t.getAttribute("slot")&&t.removeAttribute("slot")}))}moveMisplacedPanels(){this.panels&&this.panels.forEach((t=>{"panels"!==t.getAttribute("slot")&&t.setAttribute("slot","panels")}))}enableTabs(){this.tabs&&(this.tabs.forEach((async t=>{if(await n(t),this.isPagesVariant)return;if(t.getAttribute("aria-controls"))return;const s=this.getPanel(t.name);s&&(t.setAttribute("aria-controls",s.id),s.setAttribute("aria-labelledby",t.id)),t.addEventListener("click",(()=>{this.show(t.name)})),t.addEventListener("keydown",(s=>{if("Enter"!==s.key&&" "!==s.key||(s.preventDefault(),this.show(t.name)),"Home"!==s.key&&"End"!==s.key)return;s.preventDefault();const e=this.tabs.filter((t=>!t.hasAttribute("disabled")));if(0===e.length)return;const i="Home"===s.key?e[0]:e.at(-1);i&&(i?.focus(),this.show(i.name))})),t.addEventListener("keydown",(s=>{"ArrowRight"!==s.key&&"ArrowLeft"!==s.key||this.navigateTabs(t,s.key)}))})),this.currentActiveTab&&!this.currentActiveTab.isConnected&&this.show(this.tabs[0]?.name))}activateTab(t){this.currentActiveTab&&(this.isPagesVariant||(this.currentActiveTab.setAttribute("aria-selected","false"),this.currentActiveTab.setAttribute("tabindex","-1"))),this.isPagesVariant||(t.setAttribute("aria-selected","true"),t.setAttribute("tabindex","0")),this.currentActiveTab=t}hidePanel(t){const s=this.getPanel(t);s&&(this.hiding=r(s,"out"),this.hiding.onfinish=()=>{s.style.display="none",this.hiding=null})}showSelectedPanel(){if(!this.currentActiveTab)return;const t=this.getPanel(this.currentActiveTab.name);t&&(t.style.display="block",this.isLoaded&&(this.showing=r(t,"in"),this.showing.onfinish=()=>{this.showing=null}))}getPanel(t){return this.host.querySelector(`post-tab-panel[for=${t}]`)}navigateTabs(t,s){const e=Array.from(this.tabs).indexOf(t);let i;i="ArrowRight"===s?this.tabs[e+1]||this.tabs[0]:this.tabs[e-1]||this.tabs.at(-1),i&&(i.focus(),this.show(i.name))}scrollTabs(t){const s="prev"===t?-1:1,e=getComputedStyle(this.tabsContainer),i=Number.parseFloat(e.paddingInlineStart)||0,o=Number.parseFloat(e.paddingInlineEnd)||0;this.tabsContainer.scrollBy({left:s*(this.tabsContainer.clientWidth-i-o),behavior:"smooth"})}scrollTabIntoView(t,s="instant"){const e=this.tabsContainer,i=getComputedStyle(e),o=Number.parseFloat(i.paddingInlineStart)||0,a=Number.parseFloat(i.paddingInlineEnd)||0,r=t.offsetLeft,n=r+t.offsetWidth,c=e.scrollLeft+o,h=c+e.clientWidth-o-a;r<c?e.scrollTo({left:r-o,behavior:s}):n>h&&e.scrollTo({left:n-e.clientWidth+a,behavior:s})}handleScrollButtons(){this.updateScrollButtons(),this.tabsContainer.addEventListener("scroll",this.updateScrollButtons)}render(){const t=this.isPagesVariant?"nav":"div";return i(o,{key:"fb65fd2589517dd6d86e86435ec6b3a3b64b093d","data-version":c,style:void 0},i("div",{key:"dbcdd791af381ccc23953acb38a8e71527a804ee",class:"tabs-wrapper",part:"post-tabs"},i("button",{key:"20ce30515d80b282aa93f20a1f3281a1ef0f6359",ref:t=>this.leftScrollButton=t,class:"scroll-btn scroll-btn-left",type:"button","aria-label":this.textPrevTabItems,tabindex:this.showLeftScrollButton?0:-1,hidden:!this.showLeftScrollButton,onClick:()=>this.scrollTabs("prev")},i("post-icon",{key:"9a5402a28656d7a4459b9b848425bd15a45a0fce",name:"chevronleft"})),i(t,{key:"e821db02fd66aef6cf7a9fb5d925b0906571f3b6",ref:t=>this.tabsContainer=t,class:"tabs",role:this.isPagesVariant?void 0:"tablist","aria-label":this.isPagesVariant?this.label:void 0},i("slot",{key:"e3650e43ac269173cb58f1624f02778bf094573c",onSlotchange:()=>{this.moveMisplacedTabs(),this.enableTabs()}})),i("button",{key:"4345a9bc121ce187022cddf019d5c86d875a70e9",ref:t=>this.rightScrollButton=t,class:"scroll-btn scroll-btn-right",type:"button","aria-label":this.textNextTabItems,tabindex:this.showRightScrollButton?0:-1,hidden:!this.showRightScrollButton,onClick:()=>this.scrollTabs("next")},i("post-icon",{key:"2df749c1a4e506d9940ce61e077d0f0f330b7342",name:"chevronright"}))),!this.isPagesVariant&&i("div",{key:"184db29a5826af78d142ed1489be33c45831970b",class:"tab-content",part:"post-tabs-content"},i("slot",{key:"4a984c7de97f2f89e7fd0f829f5bc62e2323f056",name:"panels",onSlotchange:()=>this.moveMisplacedPanels()})))}get host(){return this}static get watchers(){return{label:[{validateLabel:0}]}}static get style(){return':host{display:block}:host .tabs-wrapper{position:relative;display:flex;align-items:center}:host .tabs-wrapper button.scroll-btn{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;display:flex;align-items:center;justify-content:center;transition:background-color 100ms,border-color 100ms,color 100ms;cursor:pointer}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn{background-color:ButtonFace !important}:host .tabs-wrapper button.scroll-btn:hover{background-color:Highlight !important}}:host .tabs-wrapper button.scroll-btn post-icon{color:currentColor}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn post-icon{color:Highlight}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:hover post-icon{color:canvas}}:host .tabs-wrapper button.scroll-btn[hidden]{display:none}:host .tabs-wrapper button.scroll-btn{outline-offset:var(--post-device-spacing-padding-44) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:has(:focus-visible),.pretend-focus){transition:none}:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:has(:focus-visible),.pretend-focus):hover{color:HighlightText;border-color:HighlightText}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:focus-within,.pretend-focus){transition:none}:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:focus-within,.pretend-focus):hover{color:HighlightText;border-color:HighlightText}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}:host .tabs-wrapper .tabs{overflow-x:hidden;background-color:rgba(0,0,0,0) !important;display:flex;flex-wrap:nowrap;align-items:end;overscroll-behavior-x:contain;white-space:nowrap;margin-block:0;padding-inline-start:0;list-style:none}:host(.page-tabs){overflow:visible !important}:host(.page-tabs) .tabs-wrapper{margin-inline:calc(-1*(var(--post-container-offset)))}@media screen and (min-width: 1024px){:host(.page-tabs) .tabs-wrapper{margin-inline:calc(-1 * (var(--post-container-offset)) + 20px)}:host(.page-tabs) .tabs-wrapper::after{box-shadow:20px 0 0 var(--post-palette-color-nested-tabs-page-stroke),-20px 0 0 var(--post-palette-color-nested-tabs-page-stroke)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){:host(.page-tabs) .tabs-wrapper::after{box-shadow:20px 0 0 LinkText,-20px 0 0 LinkText}}:host(.page-tabs) .tabs-wrapper button.scroll-btn{color:var(--post-scheme-color-interactive-primary-enabled-fg5);background-color:var(--post-scheme-color-interactive-primary-enabled-bg5);border:var(--post-device-border-width-default) solid var(--post-scheme-color-interactive-primary-enabled-stroke);position:absolute;z-index:2;box-shadow:var(--post-device-elevation-200);border-radius:var(--post-device-border-radius-2)}:host(.page-tabs) .tabs-wrapper button.scroll-btn:hover{border-color:var(--post-scheme-color-interactive-primary-hover-stroke) !important;color:var(--post-scheme-color-interactive-primary-hover-fg4);background-color:var(--post-scheme-color-interactive-primary-hover-bg8)}:host(.page-tabs) .tabs-wrapper button.scroll-btn.scroll-btn-left{inset-inline-start:0;border-inline-start:none;border-radius:0 var(--post-device-border-radius-2) var(--post-device-border-radius-2) 0}:host(.page-tabs) .tabs-wrapper button.scroll-btn.scroll-btn-right{inset-inline-end:0;border-inline-end:none;border-radius:var(--post-device-border-radius-2) 0 0 var(--post-device-border-radius-2)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(.page-tabs) .tabs-wrapper button.scroll-btn.scroll-btn{background-color:Highlight;color:HighlightText}}:host(.page-tabs) .tabs-wrapper::after{content:"";position:absolute;inset-block-end:0;inset-inline-start:0;width:100%;height:var(--post-device-border-width-default);background-color:var(--post-palette-color-nested-tabs-page-stroke)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(.page-tabs) .tabs-wrapper::after{background-color:LinkText}}:host(.page-tabs) .tabs-wrapper .tabs{padding-inline:calc(var(--post-container-offset));gap:var(--post-device-spacing-gap-inline-5);scrollbar-width:none}:host(.page-tabs) .tabs-wrapper .tabs::-webkit-scrollbar{display:none}:host(.page-tabs:not([size=small])) button.scroll-btn{top:var(--post-device-spacing-padding-36)}:host(.page-tabs[size=small]) button.scroll-btn{top:var(--post-device-spacing-padding-36)}:host(.content-tabs) .tabs-wrapper button.scroll-btn{flex-shrink:0;color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}:host(.content-tabs) .tabs-wrapper button.scroll-btn:hover{border-color:var(--post-scheme-color-interactive-primary-hover-stroke) !important;color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(.content-tabs) .tabs-wrapper button.scroll-btn:hover{color:HighlightText}}:host(post-tabs:not([size=small])) button.scroll-btn{height:var(--post-device-sizing-interactive-button-height-10);width:var(--post-device-sizing-interactive-button-width-1);border-radius:var(--post-device-border-radius-2)}:host(post-tabs:not([size=small])) button.scroll-btn post-icon{height:var(--post-device-sizing-interactive-icon-size5);width:var(--post-device-sizing-interactive-icon-size5)}:host(.page-tabs:not([size=small])) button.scroll-btn-left{padding-inline:var(--post-device-spacing-padding-39) var(--post-device-spacing-padding-40)}:host(.page-tabs:not([size=small])) button.scroll-btn-right{padding-inline:var(--post-device-spacing-padding-40) var(--post-device-spacing-padding-39)}:host([size=small]) button.scroll-btn{height:var(--post-device-sizing-interactive-button-size-1);width:var(--post-device-sizing-interactive-button-size-1);border-radius:var(--post-device-border-radius-2)}:host([size=small]) button.scroll-btn post-icon{height:var(--post-device-sizing-interactive-icon-size4);width:var(--post-device-sizing-interactive-icon-size4)}:host(.page-tabs[size=small]) button.scroll-btn-left{padding-inline:var(--post-device-spacing-padding-42) var(--post-device-spacing-padding-43)}:host(.page-tabs[size=small]) button.scroll-btn-right{padding-inline:var(--post-device-spacing-padding-43) var(--post-device-spacing-padding-42)}'}},[257,"post-tabs",{textPrevTabItems:[513,"text-prev-tab-items"],textNextTabItems:[513,"text-next-tab-items"],activeTab:[513,"active-tab"],size:[513],label:[513],isPagesVariant:[32],showLeftScrollButton:[32],showRightScrollButton:[32],show:[64]},void 0,{label:[{validateLabel:0}]}]);function v(){"undefined"!=typeof customElements&&["post-tabs","post-icon"].forEach((t=>{switch(t){case"post-tabs":customElements.get(a(t))||customElements.define(a(t),d);break;case"post-icon":customElements.get(a(t))||h()}}))}p([l(["small","large"])],d.prototype,"size",void 0),p([b("string")],d.prototype,"label",void 0),v();const u=d,g=v;export{u as PostTabs,g as defineCustomElement}
+import{p as t,H as s,c as e,h as i,a as o,t as a}from"./index.js";import{f as r}from"./p-D5knoiyy.js";import"./p-DeO0rZ1T.js";import{c as n}from"./p-lpWRZjJp.js";import{v as c}from"./p-CAL337jJ.js";import{d as h}from"./p-DGpWjdFJ.js";import{O as l}from"./p-CnN4Jdtv.js";import{T as b}from"./p-CVVXnYLU.js";var p=function(t,s,e,i){var o,a=arguments.length,r=a<3?s:null===i?i=Object.getOwnPropertyDescriptor(s,e):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,s,e,i);else for(var n=t.length-1;n>=0;n--)(o=t[n])&&(r=(a<3?o(r):a>3?o(s,e,r):o(s,e))||r);return a>3&&r&&Object.defineProperty(s,e,r),r};const d=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.postChange=e(this,"postChange"),this.showing=null,this.hiding=null,this.isLoaded=!1,this.isPagesVariant=!1,this.showLeftScrollButton=!1,this.showRightScrollButton=!1,this.textPrevTabItems="Previous tab items",this.textNextTabItems="Next tab items",this.size="large",this.handleContainerResize=()=>{this.updateScrollButtons();const t=this.host.clientWidth;t!==this.hostWidth&&(this.hostWidth=t,this.pendingScroll=void 0),this.pendingScroll?.()},this.updateScrollButtons=()=>{if(!this.tabsContainer)return;const t=getComputedStyle(this.tabsContainer),s=Number.parseFloat(t.paddingInlineStart)||0,e=Number.parseFloat(t.paddingInlineEnd)||0,i=this.tabsContainer.clientWidth-s-e,o=this.tabsContainer.scrollWidth-s-e;this.showLeftScrollButton=this.tabsContainer.scrollLeft>0,this.showRightScrollButton=this.tabsContainer.scrollLeft+i<o}}get tabs(){return Array.from(this.host.querySelectorAll("post-tab-item")).filter((t=>t.closest("post-tabs")===this.host))}get panels(){return Array.from(this.host.querySelectorAll("post-tab-panel")).filter((t=>t.closest("post-tabs")===this.host))}validateLabel(){this.isPagesVariant&&!this.label&&console.error(`[${this.host.localName}] Property "label" is required in Pages variant. Received: ${JSON.stringify(this.label)}.`,this.host)}componentWillRender(){this.detectVariant()}componentDidLoad(){if(this.leftScrollButton.ariaControlsElements=[this.tabsContainer],this.rightScrollButton.ariaControlsElements=[this.tabsContainer],this.moveMisplacedTabs(),this.moveMisplacedPanels(),this.enableTabs(),this.handleScrollButtons(),this.setupContentObserver(),this.setupResizeObserver(),this.validateLabel(),this.isPagesVariant){const t=this.findActivePagesTab();t&&(this.activateTab(t),this.scrollTabIntoView(t))}else{const t=this.activeTab||this.tabs[0]?.name;if(t){this.show(t);const s=this.tabs.find((s=>s.name===t));s&&this.scrollTabIntoView(s)}}this.isLoaded=!0}disconnectedCallback(){this.showing&&(this.showing.cancel(),this.showing=null),this.hiding&&(this.hiding.cancel(),this.hiding=null),this.contentObserver&&this.contentObserver?.disconnect(),this.resizeObserver?.disconnect(),this.tabsContainer?.removeEventListener("scroll",this.updateScrollButtons)}setupContentObserver(){this.contentObserver=new MutationObserver(this.handleContentChange.bind(this)),this.contentObserver?.observe(this.host,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["data-pages-variant","aria-current"]})}setupResizeObserver(){this.hostWidth=this.host.clientWidth,this.resizeObserver=new ResizeObserver(this.handleContainerResize),this.resizeObserver.observe(this.tabsContainer)}handleContentChange(t){const s=this.shouldRedetectVariant(t);this.hasAriaCurrentChanged(t)&&this.isPagesVariant&&this.updateActivePagesTab(),s&&this.handleVariantChange(),this.updateScrollButtons()}shouldRedetectVariant(t){return t.some((t=>"childList"===t.type?t.addedNodes.length>0||t.removedNodes.length>0:"attributes"===t.type&&"data-pages-variant"===t.attributeName))}hasAriaCurrentChanged(t){return t.some((t=>"attributes"===t.type&&"aria-current"===t.attributeName))}updateActivePagesTab(){const t=this.findActivePagesTab();t&&t!==this.currentActiveTab&&(this.activateTab(t),this.scrollTabIntoView(t,"smooth"))}handleVariantChange(){const t=this.isPagesVariant;this.detectVariant(),t!==this.isPagesVariant&&(this.enableTabs(),this.initializeActiveTab())}initializeActiveTab(){if(this.isPagesVariant){const t=this.findActivePagesTab();t&&(this.activateTab(t),this.scrollTabIntoView(t))}else{const t=this.activeTab||this.tabs[0]?.name;t&&this.show(t)}}detectVariant(){const t=this.tabs.some((t=>null!==t.querySelector("a")||"true"===t.dataset.pagesVariant));if(t&&this.panels.length>0)throw Error("PostTabs: Mixed mode detected. Cannot use both Page Tabs (anchor elements) and Content Tabs (post-tab-panel elements) variants at the same time.");this.isPagesVariant=t,this.host.classList.remove("page-tabs","content-tabs"),this.host.classList.add(this.isPagesVariant?"page-tabs":"content-tabs")}findActivePagesTab(){return this.tabs.find((t=>null!==t.querySelector('a[aria-current="page"]')))||null}async show(t){try{if(t===this.currentActiveTab?.name)return;const s=this.currentActiveTab,e=this.host.querySelector(`post-tab-item[name="${t}"]`);if(!e)return;if(this.activateTab(e),this.scrollTabIntoView(e,"smooth"),this.showing&&(this.showing.finish(),this.showing=null),!s||this.showing||this.hiding||this.hidePanel(s.name),await this.awaitAnimation(this.hiding))return;if(this.showSelectedPanel(),await this.awaitAnimation(this.showing))return;this.isLoaded&&this.currentActiveTab&&this.postChange.emit(this.currentActiveTab.name)}catch(t){if(this.isAbortError(t))return;throw t}}async awaitAnimation(t){if(!t)return!1;try{return await t.finished,!1}catch(t){if(this.isAbortError(t))return!0;throw t}}isAbortError(t){return(t instanceof DOMException||t instanceof Error)&&"AbortError"===t.name}moveMisplacedTabs(){this.tabs&&this.tabs.forEach((t=>{t.getAttribute("slot")&&t.removeAttribute("slot")}))}moveMisplacedPanels(){this.panels&&this.panels.forEach((t=>{"panels"!==t.getAttribute("slot")&&t.setAttribute("slot","panels")}))}enableTabs(){this.tabs&&(this.tabs.forEach((async t=>{if(await n(t),this.isPagesVariant)return;if(t.getAttribute("aria-controls"))return;const s=this.getPanel(t.name);s&&(t.setAttribute("aria-controls",s.id),s.setAttribute("aria-labelledby",t.id)),t.addEventListener("click",(()=>{this.show(t.name)})),t.addEventListener("keydown",(s=>{if("Enter"!==s.key&&" "!==s.key||(s.preventDefault(),this.show(t.name)),"Home"!==s.key&&"End"!==s.key)return;s.preventDefault();const e=this.tabs.filter((t=>!t.hasAttribute("disabled")));if(0===e.length)return;const i="Home"===s.key?e[0]:e.at(-1);i&&(i?.focus(),this.show(i.name))})),t.addEventListener("keydown",(s=>{"ArrowRight"!==s.key&&"ArrowLeft"!==s.key||this.navigateTabs(t,s.key)}))})),this.currentActiveTab&&!this.currentActiveTab.isConnected&&this.show(this.tabs[0]?.name))}activateTab(t){this.currentActiveTab&&(this.isPagesVariant||(this.currentActiveTab.setAttribute("aria-selected","false"),this.currentActiveTab.setAttribute("tabindex","-1"))),this.isPagesVariant||(t.setAttribute("aria-selected","true"),t.setAttribute("tabindex","0")),this.currentActiveTab=t}hidePanel(t){const s=this.getPanel(t);s&&(this.hiding=r(s,"out"),this.hiding.onfinish=()=>{s.style.display="none",this.hiding=null})}showSelectedPanel(){if(!this.currentActiveTab)return;const t=this.getPanel(this.currentActiveTab.name);t&&(t.style.display="block",this.isLoaded&&(this.showing=r(t,"in"),this.showing.onfinish=()=>{this.showing=null}))}getPanel(t){return this.host.querySelector(`post-tab-panel[for=${t}]`)}navigateTabs(t,s){const e=Array.from(this.tabs).indexOf(t);let i;i="ArrowRight"===s?this.tabs[e+1]||this.tabs[0]:this.tabs[e-1]||this.tabs.at(-1),i&&(i.focus(),this.show(i.name))}scrollTabs(t){const s="prev"===t?-1:1,e=getComputedStyle(this.tabsContainer),i=Number.parseFloat(e.paddingInlineStart)||0,o=Number.parseFloat(e.paddingInlineEnd)||0,a=this.tabsContainer.clientWidth-i-o;this.pendingScroll=s>0&&this.tabsContainer.scrollLeft+a>=this.tabsContainer.scrollWidth-this.tabsContainer.clientWidth?()=>this.scrollToEnd():void 0,this.tabsContainer.scrollBy({left:s*a,behavior:"smooth"})}scrollToEnd(){const t=this.tabsContainer,s=t.scrollWidth-t.clientWidth;t.scrollLeft>=s?this.pendingScroll=void 0:t.scrollTo({left:s,behavior:"smooth"})}scrollTabIntoView(t,s="instant"){const e=this.tabsContainer,i=getComputedStyle(e),o=Number.parseFloat(i.paddingInlineStart)||0,a=Number.parseFloat(i.paddingInlineEnd)||0,r=t.offsetLeft,n=r+t.offsetWidth,c=e.scrollLeft+o,h=c+e.clientWidth-o-a;this.pendingScroll=void 0,r<c?e.scrollTo({left:r-o,behavior:s}):n>h&&(this.pendingScroll=()=>this.scrollTabIntoView(t,s),e.scrollTo({left:n-e.clientWidth+a,behavior:s}))}handleScrollButtons(){this.updateScrollButtons(),this.tabsContainer.addEventListener("scroll",this.updateScrollButtons)}render(){const t=this.isPagesVariant?"nav":"div";return i(o,{key:"10c247c7c021a4fbbd8f79ce7b82888e0b7c8be2","data-version":c,style:void 0},i("div",{key:"5ccae325884c7cff0eec399da23513c0b864dde0",class:"tabs-wrapper",part:"post-tabs"},i("button",{key:"dd38a22327801b790f849449055b765d2c1bc3b6",ref:t=>this.leftScrollButton=t,class:"scroll-btn scroll-btn-left",type:"button","aria-label":this.textPrevTabItems,tabindex:-1,hidden:!this.showLeftScrollButton,onClick:()=>this.scrollTabs("prev")},i("post-icon",{key:"461a92ab071472c995d0adad5c73c75c82d982fe",name:"chevronleft"})),i(t,{key:"edecdbfdc681b96539e5a0755330faf1795ecb35",ref:t=>this.tabsContainer=t,class:"tabs",role:this.isPagesVariant?void 0:"tablist","aria-label":this.isPagesVariant?this.label:void 0},i("slot",{key:"6240234a2168b2e889cab92a7688731ca93a63a6",onSlotchange:()=>{this.moveMisplacedTabs(),this.enableTabs()}})),i("button",{key:"a4030c48cbbefb578b03ee9dad35724a1fdd5547",ref:t=>this.rightScrollButton=t,class:"scroll-btn scroll-btn-right",type:"button","aria-label":this.textNextTabItems,tabindex:-1,hidden:!this.showRightScrollButton,onClick:()=>this.scrollTabs("next")},i("post-icon",{key:"d89c831bdd2faf1991793df47e7ca79bf49e5339",name:"chevronright"}))),!this.isPagesVariant&&i("div",{key:"aba319437ba8bfb9e7a144a44efcc32d82ef6b02",class:"tab-content",part:"post-tabs-content"},i("slot",{key:"e689b5e3a030909c5c77899ac899ded2481f82a6",name:"panels",onSlotchange:()=>this.moveMisplacedPanels()})))}get host(){return this}static get watchers(){return{label:[{validateLabel:0}]}}static get style(){return':host{display:block}:host .tabs-wrapper{position:relative;display:flex;align-items:center}:host .tabs-wrapper button.scroll-btn{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;display:flex;align-items:center;justify-content:center;transition:background-color 100ms,border-color 100ms,color 100ms;cursor:pointer}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn{background-color:ButtonFace !important}:host .tabs-wrapper button.scroll-btn:hover{background-color:Highlight !important}}:host .tabs-wrapper button.scroll-btn post-icon{color:currentColor}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn post-icon{color:Highlight}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:hover post-icon{color:canvas}}:host .tabs-wrapper button.scroll-btn[hidden]{display:none}:host .tabs-wrapper button.scroll-btn{outline-offset:var(--post-device-spacing-padding-44) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}:host .tabs-wrapper button.scroll-btn:focus-visible{outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:focus-visible{transition:none}:host .tabs-wrapper button.scroll-btn:focus-visible:hover{color:HighlightText;border-color:HighlightText}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:focus-visible{outline-color:Highlight !important}}:host .tabs-wrapper button.scroll-btn.pretend-focus{outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn.pretend-focus{transition:none}:host .tabs-wrapper button.scroll-btn.pretend-focus:hover{color:HighlightText;border-color:HighlightText}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn.pretend-focus{outline-color:Highlight !important}}:host .tabs-wrapper button.scroll-btn:has(:focus-visible){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:has(:focus-visible){transition:none}:host .tabs-wrapper button.scroll-btn:has(:focus-visible):hover{color:HighlightText;border-color:HighlightText}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:focus-within,.pretend-focus){transition:none}:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:focus-within,.pretend-focus):hover{color:HighlightText;border-color:HighlightText}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .tabs-wrapper button.scroll-btn:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}:host .tabs-wrapper .tabs{overflow-x:hidden;background-color:rgba(0,0,0,0) !important;display:flex;flex-wrap:nowrap;align-items:end;overscroll-behavior-x:contain;white-space:nowrap;margin-block:0;padding-inline-start:0;list-style:none}:host(.page-tabs){overflow:visible !important}:host(.page-tabs) .tabs-wrapper{margin-inline:calc(-1*(var(--post-container-offset)))}@media screen and (min-width: 1024px){:host(.page-tabs) .tabs-wrapper{margin-inline:calc(-1 * (var(--post-container-offset)) + 20px)}:host(.page-tabs) .tabs-wrapper::after{box-shadow:20px 0 0 var(--post-palette-color-nested-tabs-page-stroke),-20px 0 0 var(--post-palette-color-nested-tabs-page-stroke)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){:host(.page-tabs) .tabs-wrapper::after{box-shadow:20px 0 0 LinkText,-20px 0 0 LinkText}}:host(.page-tabs) .tabs-wrapper button.scroll-btn{color:var(--post-scheme-color-interactive-primary-enabled-fg5);background-color:var(--post-scheme-color-interactive-primary-enabled-bg5);border:var(--post-device-border-width-default) solid var(--post-scheme-color-interactive-primary-enabled-stroke);position:absolute;z-index:2;box-shadow:var(--post-device-elevation-200);border-radius:var(--post-device-border-radius-2)}:host(.page-tabs) .tabs-wrapper button.scroll-btn:hover{border-color:var(--post-scheme-color-interactive-primary-hover-stroke) !important;color:var(--post-scheme-color-interactive-primary-hover-fg4);background-color:var(--post-scheme-color-interactive-primary-hover-bg8)}:host(.page-tabs) .tabs-wrapper button.scroll-btn.scroll-btn-left{inset-inline-start:0;border-inline-start:none;border-radius:0 var(--post-device-border-radius-2) var(--post-device-border-radius-2) 0}:host(.page-tabs) .tabs-wrapper button.scroll-btn.scroll-btn-right{inset-inline-end:0;border-inline-end:none;border-radius:var(--post-device-border-radius-2) 0 0 var(--post-device-border-radius-2)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(.page-tabs) .tabs-wrapper button.scroll-btn.scroll-btn{background-color:Highlight;color:HighlightText}}:host(.page-tabs) .tabs-wrapper::after{content:"";position:absolute;inset-block-end:0;inset-inline-start:0;width:100%;height:var(--post-device-border-width-default);background-color:var(--post-palette-color-nested-tabs-page-stroke)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(.page-tabs) .tabs-wrapper::after{background-color:LinkText}}:host(.page-tabs) .tabs-wrapper .tabs{padding-inline:calc(var(--post-container-offset));gap:var(--post-device-spacing-gap-inline-5);scrollbar-width:none}:host(.page-tabs) .tabs-wrapper .tabs::-webkit-scrollbar{display:none}:host(.page-tabs:not([size=small])) button.scroll-btn{top:var(--post-device-spacing-padding-36)}:host(.page-tabs[size=small]) button.scroll-btn{top:var(--post-device-spacing-padding-36)}:host(.content-tabs) .tabs-wrapper button.scroll-btn{flex-shrink:0;color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}:host(.content-tabs) .tabs-wrapper button.scroll-btn:hover{border-color:var(--post-scheme-color-interactive-primary-hover-stroke) !important;color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(.content-tabs) .tabs-wrapper button.scroll-btn:hover{color:HighlightText}}:host(post-tabs:not([size=small])) button.scroll-btn{height:var(--post-device-sizing-interactive-button-height-10);width:var(--post-device-sizing-interactive-button-width-1);border-radius:var(--post-device-border-radius-2)}:host(post-tabs:not([size=small])) button.scroll-btn post-icon{height:var(--post-device-sizing-interactive-icon-size5);width:var(--post-device-sizing-interactive-icon-size5)}:host(.page-tabs:not([size=small])) button.scroll-btn-left{padding-inline:var(--post-device-spacing-padding-39) var(--post-device-spacing-padding-40)}:host(.page-tabs:not([size=small])) button.scroll-btn-right{padding-inline:var(--post-device-spacing-padding-40) var(--post-device-spacing-padding-39)}:host([size=small]) button.scroll-btn{height:var(--post-device-sizing-interactive-button-size-1);width:var(--post-device-sizing-interactive-button-size-1);border-radius:var(--post-device-border-radius-2)}:host([size=small]) button.scroll-btn post-icon{height:var(--post-device-sizing-interactive-icon-size4);width:var(--post-device-sizing-interactive-icon-size4)}:host(.page-tabs[size=small]) button.scroll-btn-left{padding-inline:var(--post-device-spacing-padding-42) var(--post-device-spacing-padding-43)}:host(.page-tabs[size=small]) button.scroll-btn-right{padding-inline:var(--post-device-spacing-padding-43) var(--post-device-spacing-padding-42)}'}},[257,"post-tabs",{textPrevTabItems:[513,"text-prev-tab-items"],textNextTabItems:[513,"text-next-tab-items"],activeTab:[513,"active-tab"],size:[513],label:[513],isPagesVariant:[32],showLeftScrollButton:[32],showRightScrollButton:[32],show:[64]},void 0,{label:[{validateLabel:0}]}]);function v(){"undefined"!=typeof customElements&&["post-tabs","post-icon"].forEach((t=>{switch(t){case"post-tabs":customElements.get(a(t))||customElements.define(a(t),d);break;case"post-icon":customElements.get(a(t))||h()}}))}p([l(["small","large"])],d.prototype,"size",void 0),p([b("string")],d.prototype,"label",void 0),v();const u=d,g=v;export{u as PostTabs,g as defineCustomElement}

package/dist/components/react/post-togglebutton.js

@@ -1 +1 @@
-import{P as o,d as r}from"./p-1y1rv5Tw.js";const s=o,p=r;export{s as PostTogglebutton,p as defineCustomElement}
+import{P as o,d as s}from"./p-Db3d6dKF.js";const d=o,p=s;export{d as PostTogglebutton,p as defineCustomElement}

package/dist/components/react/post-tooltip-trigger.js

@@ -1 +1 @@
-import{p as t,H as e,h as s,a as i,t as o}from"./index.js";import"./p-DeO0rZ1T.js";import{v as n}from"./p-BBz9PVf0.js";import{R as r}from"./p-B2jsM_Ov.js";import{T as h}from"./p-CVVXnYLU.js";const a=["pointerenter","pointerleave","focusin","focusout"];let l;const c=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.delay=0,this.trigger=null,this.delayTimeout=null,this.boundTriggerHandler=this.handleTriggerEvent.bind(this),this.boundTooltipHandler=this.handleTooltipEvent.bind(this)}get tooltip(){const t=document.getElementById(this.for);return"post-tooltip"===t?.localName?t:null}componentWillLoad(){import("./p-BrY4VWTQ.js").then((function(t){return t.f})).then((t=>{l??=t.default}))}componentDidLoad(){this.setupTrigger(),this.attachListeners(),this.attachTooltipListeners()}disconnectedCallback(){this.removeListeners(),this.removeTooltipListeners(),this.cleanupTrigger(),this.delayTimeout&&(clearTimeout(this.delayTimeout),this.delayTimeout=null)}handleSlotChange(){this.cleanupTrigger(),this.setupTrigger()}cleanupTrigger(){if(this.trigger){const t=this.trigger.getAttribute("aria-describedby")||"";if(t.includes(this.for)){const e=t.split(" ").filter((t=>t!==this.for)).join(" ");e?this.trigger.setAttribute("aria-describedby",e):this.trigger.removeAttribute("aria-describedby")}this.trigger=null}}setupTrigger(){if(this.trigger=this.host.querySelector("*"),this.trigger){l?.(this.trigger)||this.trigger.setAttribute("tabindex","0");const t=this.trigger.getAttribute("aria-describedby")||"";t.includes(this.for)||this.trigger.setAttribute("aria-describedby",`${t} ${this.for}`.trim())}else console.warn("No content found in the post-tooltip-trigger slot. Please insert a focusable element or content that can receive focus.")}attachListeners(){a.forEach((t=>{this.host.addEventListener(t,this.boundTriggerHandler)}))}removeListeners(){a.forEach((t=>{this.host.removeEventListener(t,this.boundTriggerHandler)}))}attachTooltipListeners(){this.tooltip&&(this.tooltip.addEventListener("pointerenter",this.boundTooltipHandler),this.tooltip.addEventListener("pointerleave",this.boundTooltipHandler))}removeTooltipListeners(){this.tooltip&&(this.tooltip.removeEventListener("pointerenter",this.boundTooltipHandler),this.tooltip.removeEventListener("pointerleave",this.boundTooltipHandler))}handleTriggerEvent(t){switch(t.type){case"pointerenter":case"focusin":case"long-press":this.handleEnter();break;case"pointerleave":case"focusout":this.handleLeave(t)}}handleTooltipEvent(t){switch(t.type){case"pointerenter":this.handleEnter();break;case"pointerleave":this.handleLeave(t)}}handleEnter(){this.delayTimeout&&(clearTimeout(this.delayTimeout),this.delayTimeout=null),this.interestHandler()}handleLeave(t){const e=t.relatedTarget;this.tooltip&&e&&this.tooltip.contains(e)||e===this.trigger||this.interestLostHandler()}interestHandler(){this.trigger&&(this.delay>0?this.delayTimeout=globalThis.setTimeout((()=>{this.tooltip?.show(this.trigger),this.delayTimeout=null}),this.delay):this.tooltip?.show(this.trigger))}interestLostHandler(){this.delayTimeout&&(clearTimeout(this.delayTimeout),this.delayTimeout=null),this.tooltip?.hide()}render(){return s(i,{key:"55adc12f457aa8a5dd4357ed27876b0e526f7ae3","data-version":n},s("slot",{key:"84da1734ae1c1ac9376caa693108e3ed54bf176f",onSlotchange:()=>this.handleSlotChange()}))}get host(){return this}static get style(){return"post-tooltip-trigger{vertical-align:top}:host{cursor:pointer}"}},[257,"post-tooltip-trigger",{for:[513],delay:[2]}]);function p(){"undefined"!=typeof customElements&&["post-tooltip-trigger"].forEach((t=>{"post-tooltip-trigger"===t&&(customElements.get(o(t))||customElements.define(o(t),c))}))}(function(t,e,s,i){var o,n=arguments.length,r=n<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,s):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,s,i);else for(var h=t.length-1;h>=0;h--)(o=t[h])&&(r=(n<3?o(r):n>3?o(e,s,r):o(e,s))||r);n>3&&r&&Object.defineProperty(e,s,r)})([r(),h("string")],c.prototype,"for",void 0),p();const u=c,d=p;export{u as PostTooltipTrigger,d as defineCustomElement}
+import{p as t,H as e,h as s,a as i,t as o}from"./index.js";import"./p-DeO0rZ1T.js";import{v as n}from"./p-CAL337jJ.js";import{R as r}from"./p-B2jsM_Ov.js";import{T as h}from"./p-CVVXnYLU.js";const a=["pointerenter","pointerleave","focusin","focusout"];let l;const c=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.delay=0,this.trigger=null,this.delayTimeout=null,this.boundTriggerHandler=this.handleTriggerEvent.bind(this),this.boundTooltipHandler=this.handleTooltipEvent.bind(this)}get tooltip(){const t=document.getElementById(this.for);return"post-tooltip"===t?.localName?t:null}componentWillLoad(){import("./p-BrY4VWTQ.js").then((function(t){return t.f})).then((t=>{l??=t.default}))}componentDidLoad(){this.setupTrigger(),this.attachListeners(),this.attachTooltipListeners()}disconnectedCallback(){this.removeListeners(),this.removeTooltipListeners(),this.cleanupTrigger(),this.delayTimeout&&(clearTimeout(this.delayTimeout),this.delayTimeout=null)}handleSlotChange(){this.cleanupTrigger(),this.setupTrigger()}cleanupTrigger(){if(this.trigger){const t=this.trigger.getAttribute("aria-describedby")||"";if(t.includes(this.for)){const e=t.split(" ").filter((t=>t!==this.for)).join(" ");e?this.trigger.setAttribute("aria-describedby",e):this.trigger.removeAttribute("aria-describedby")}this.trigger=null}}setupTrigger(){if(this.trigger=this.host.querySelector("*"),this.trigger){l?.(this.trigger)||this.trigger.setAttribute("tabindex","0");const t=this.trigger.getAttribute("aria-describedby")||"";t.includes(this.for)||this.trigger.setAttribute("aria-describedby",`${t} ${this.for}`.trim())}else console.warn("No content found in the post-tooltip-trigger slot. Please insert a focusable element or content that can receive focus.")}attachListeners(){a.forEach((t=>{this.host.addEventListener(t,this.boundTriggerHandler)}))}removeListeners(){a.forEach((t=>{this.host.removeEventListener(t,this.boundTriggerHandler)}))}attachTooltipListeners(){this.tooltip&&(this.tooltip.addEventListener("pointerenter",this.boundTooltipHandler),this.tooltip.addEventListener("pointerleave",this.boundTooltipHandler))}removeTooltipListeners(){this.tooltip&&(this.tooltip.removeEventListener("pointerenter",this.boundTooltipHandler),this.tooltip.removeEventListener("pointerleave",this.boundTooltipHandler))}handleTriggerEvent(t){switch(t.type){case"pointerenter":case"focusin":case"long-press":this.handleEnter();break;case"pointerleave":case"focusout":this.handleLeave(t)}}handleTooltipEvent(t){switch(t.type){case"pointerenter":this.handleEnter();break;case"pointerleave":this.handleLeave(t)}}handleEnter(){this.delayTimeout&&(clearTimeout(this.delayTimeout),this.delayTimeout=null),this.interestHandler()}handleLeave(t){const e=t.relatedTarget;this.tooltip&&e&&this.tooltip.contains(e)||e===this.trigger||this.interestLostHandler()}interestHandler(){this.trigger&&(this.delay>0?this.delayTimeout=globalThis.setTimeout((()=>{this.tooltip?.show(this.trigger),this.delayTimeout=null}),this.delay):this.tooltip?.show(this.trigger))}interestLostHandler(){this.delayTimeout&&(clearTimeout(this.delayTimeout),this.delayTimeout=null),this.tooltip?.hide()}render(){return s(i,{key:"7811d666f249ead72768adaf5bdc92e47b447d8a","data-version":n},s("slot",{key:"68e56c43ebec2abffbf049647ac08757dadf22f9",onSlotchange:()=>this.handleSlotChange()}))}get host(){return this}static get style(){return"post-tooltip-trigger{vertical-align:top}:host{cursor:pointer}"}},[257,"post-tooltip-trigger",{for:[513],delay:[2]}]);function p(){"undefined"!=typeof customElements&&["post-tooltip-trigger"].forEach((t=>{"post-tooltip-trigger"===t&&(customElements.get(o(t))||customElements.define(o(t),c))}))}(function(t,e,s,i){var o,n=arguments.length,r=n<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,s):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,s,i);else for(var h=t.length-1;h>=0;h--)(o=t[h])&&(r=(n<3?o(r):n>3?o(e,s,r):o(e,s))||r);n>3&&r&&Object.defineProperty(e,s,r)})([r(),h("string")],c.prototype,"for",void 0),p();const d=c,u=p;export{d as PostTooltipTrigger,u as defineCustomElement}

package/dist/components/react/post-tooltip.js

@@ -1 +1 @@
-import{p as o,H as t,h as e,a as s,t as r}from"./index.js";import{d as a,a as p}from"./p-ialuSSl2.js";import"./p-DeO0rZ1T.js";import{v as i}from"./p-BBz9PVf0.js";import{O as n}from"./p-CnN4Jdtv.js";const c=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.placement="top",this.arrow=!1,this.open=!1}componentDidLoad(){this.host.id||console.error("No id set: <post-tooltip> must have an id, linking it to it's target element with a <post-tooltip-trigger> element.")}async show(o){this.open||await this.popoverRef.show(o)}async hide(){this.popoverRef.hide()}async toggle(o,t){this.popoverRef.toggle(o,t)}handleBeforeToggle(o){this.open=o.detail.willOpen}render(){return e(s,{key:"62d5983e0ef32f851166d0c1d2c457cac0809fdf","data-version":i},e("post-popovercontainer",{key:"10150540956510724ab4832ecceb421a7013d983",safeSpace:"trapezoid",class:this.arrow?"has-arrow":"",role:"tooltip",arrow:this.arrow,placement:this.placement,autoHide:!0,onPostBeforeToggle:o=>this.handleBeforeToggle(o),ref:o=>this.popoverRef=o},e("slot",{key:"cdfaf0e916afa55ec3f1a7f64003101985560e27"})))}get host(){return this}static get style(){return':host{display:none}:host([open]){display:contents}post-popovercontainer[arrow]::after{position:absolute;content:"";inset:-13px;z-index:-1}post-popovercontainer{--post-current-bg:var(--post-scheme-color-surface-accent-bg);--post-current-fg:var(--post-scheme-color-surface-accent-fg);--post-popovercontainer-arrow-border-width:var(--post-device-border-width-alternative1);--post-popovercontainer-arrow-border-color:var(--post-scheme-color-surface-accent-fg)}post-popovercontainer::part(post-popovercontainer-border-mask){display:block;box-shadow:inset 0 0 0 var(--post-device-spacing-padding-14) var(--post-scheme-color-surface-accent-bg)}post-popovercontainer::part(post-popovercontainer-content){border:var(--post-device-border-width-alternative1) solid var(--post-scheme-color-surface-accent-fg);border-radius:var(--post-device-border-radius-1);padding:var(--post-device-spacing-padding-14) var(--post-device-spacing-padding-15);font-size:var(--post-device-font-size-9);max-width:var(--post-tooltip-max-width, 280px);word-wrap:break-word;white-space:normal}'}},[257,"post-tooltip",{placement:[1],arrow:[4],open:[1540],show:[64],hide:[64],toggle:[64]}]);function d(){"undefined"!=typeof customElements&&["post-tooltip","post-popovercontainer"].forEach((o=>{switch(o){case"post-tooltip":customElements.get(r(o))||customElements.define(r(o),c);break;case"post-popovercontainer":customElements.get(r(o))||a()}}))}(function(o,t,e,s){var r,a=arguments.length,p=a<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,e):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)p=Reflect.decorate(o,t,e,s);else for(var i=o.length-1;i>=0;i--)(r=o[i])&&(p=(a<3?r(p):a>3?r(t,e,p):r(t,e))||p);a>3&&p&&Object.defineProperty(t,e,p)})([n(p)],c.prototype,"placement",void 0),d();const l=c,f=d;export{l as PostTooltip,f as defineCustomElement}
+import{p as e,H as o,h as t,a as s,t as r}from"./index.js";import{d as a,a as i}from"./p-D5lqOfVk.js";import"./p-DeO0rZ1T.js";import{v as p}from"./p-CAL337jJ.js";import{O as c}from"./p-CnN4Jdtv.js";const n=e(class extends o{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.placement="top",this.arrow=!1,this.open=!1}componentDidLoad(){this.host.id||console.error("No id set: <post-tooltip> must have an id, linking it to it's target element with a <post-tooltip-trigger> element.")}async show(e){this.open||await this.popoverRef.show(e)}async hide(){this.popoverRef.hide()}async toggle(e,o){this.popoverRef.toggle(e,o)}handleBeforeToggle(e){this.host.toggleAttribute("open",e.detail.willOpen),this.open=e.detail.willOpen}render(){return t(s,{key:"083507ae592ce9be50f6b4217a8d13785039478d","data-version":p},t("post-popovercontainer",{key:"e0436489bd955cee95b287f35759c364b019be94",safeSpace:!0,class:this.arrow?"has-arrow":"",role:"tooltip",arrow:this.arrow,placement:this.placement,autoHide:!0,onPostBeforeToggle:e=>this.handleBeforeToggle(e),ref:e=>this.popoverRef=e},t("div",{key:"8e6417485a89f56c18e731351de0e9f5db2cdd9a",class:"tooltip-content"},t("slot",{key:"e4c9fed0c8a8454c20f504e38557abd8ea253a1b"}))))}get host(){return this}static get style(){return":host{display:none}:host([open]){display:contents}post-popovercontainer{--post-current-bg:var(--post-scheme-color-surface-accent-bg);--post-current-fg:var(--post-scheme-color-surface-accent-fg);--post-popovercontainer-arrow-border-width:var(--post-device-border-width-alternative1);--post-popovercontainer-arrow-border-color:var(--post-scheme-color-surface-accent-fg)}post-popovercontainer::part(post-popovercontainer-border-mask){display:block;box-shadow:inset 0 0 0 var(--post-device-spacing-padding-14) var(--post-scheme-color-surface-accent-bg)}post-popovercontainer::part(post-popovercontainer-content){border:var(--post-device-border-width-alternative1) solid var(--post-scheme-color-surface-accent-fg);border-radius:var(--post-device-border-radius-1)}.tooltip-content{box-sizing:border-box;padding:var(--post-device-spacing-padding-14) var(--post-device-spacing-padding-15);font-size:var(--post-device-font-size-9);max-width:var(--post-tooltip-max-width, 280px);word-wrap:break-word;white-space:normal;overflow:hidden}"}},[257,"post-tooltip",{placement:[1],arrow:[4],open:[1540],show:[64],hide:[64],toggle:[64]}]);function d(){"undefined"!=typeof customElements&&["post-tooltip","post-popovercontainer"].forEach((e=>{switch(e){case"post-tooltip":customElements.get(r(e))||customElements.define(r(e),n);break;case"post-popovercontainer":customElements.get(r(e))||a()}}))}(function(e,o,t,s){var r,a=arguments.length,i=a<3?o:null===s?s=Object.getOwnPropertyDescriptor(o,t):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,o,t,s);else for(var p=e.length-1;p>=0;p--)(r=e[p])&&(i=(a<3?r(i):a>3?r(o,t,i):r(o,t))||i);a>3&&i&&Object.defineProperty(o,t,i)})([c(i)],n.prototype,"placement",void 0),d();const l=n,h=d;export{l as PostTooltip,h as defineCustomElement}

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2026-10-06T12:47:37",
+  "timestamp": "2026-11-12T15:47:52",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.43.3",
@@ -2735,7 +2735,7 @@
           },
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "An event emitted when the active language changes. The payload is the ISO 639 code of the newly active language.",
           "docsTags": []
         }
       ],
@@ -4753,12 +4753,12 @@
       "filePath": "src/components/post-popovercontainer/post-popovercontainer.tsx",
       "encapsulation": "shadow",
       "tag": "post-popovercontainer",
-      "readme": "# post-popover\n",
+      "readme": "# post-popovercontainer\n",
       "docs": "",
       "docsTags": [
         {
           "name": "slot",
-          "text": "- Default slot for placing content inside the popovercontainer."
+          "text": "- Default slot for placing content inside the popover."
         }
       ],
       "usage": {},
@@ -4774,7 +4774,7 @@
           "mutable": false,
           "attr": "arrow",
           "reflectToAttr": false,
-          "docs": "Whether or not to display a little pointer arrow",
+          "docs": "Show a little indicator arrow",
           "docsTags": [
             {
               "name": "default",
@@ -4803,7 +4803,30 @@
           "mutable": false,
           "attr": "auto-hide",
           "reflectToAttr": false,
-          "docs": "Whether to automatically hide the popover when the target moves outside the scrollport.\n\nIf the `post-header` can cover the target, the popover will also be hidden as soon as the\ntarget scrolls behind it.",
+          "docs": "Whether to automatically hide the popover when the anchor moves outside the scrollport.\n\nIf the `post-header` can cover the anchor, the popover will also be hidden as soon as the\nanchor scrolls behind it.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "autoResize",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "auto-resize",
+          "reflectToAttr": false,
+          "docs": "Whether to keep resizing the popover while it is open.\n\nEvery popover is sized once when it opens: the space available around the anchor, minus the\n`edgeGap`, becomes the maximum width and height of the popover. The placement is then\nrecalculated for that size.\n\nWith `autoResize`, the popover's size is recalculated on every position update, for example\nwhen the anchor moves while scrolling.",
           "docsTags": [],
           "values": [
             {
@@ -4826,7 +4849,7 @@
           "mutable": false,
           "attr": "edge-gap",
           "reflectToAttr": false,
-          "docs": "Gap between the edge of the page and the popovercontainer",
+          "docs": "Gap between the edge of the viewport and the popover.",
           "docsTags": [
             {
               "name": "default",
@@ -4885,7 +4908,7 @@
           "mutable": false,
           "attr": "placement",
           "reflectToAttr": false,
-          "docs": "Defines the placement of the popovercontainer according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\nPopovercontainers are automatically flipped to the opposite side if there is not enough available space and are shifted\ntowards the viewport if they would overlap edge boundaries.",
+          "docs": "Placement of the popover according to the floating-ui options.",
           "docsTags": [
             {
               "name": "default",
@@ -4950,25 +4973,20 @@
         },
         {
           "name": "safeSpace",
-          "type": "\"trapezoid\" | \"triangle\"",
+          "type": "boolean",
           "complexType": {
-            "original": "'triangle' | 'trapezoid'",
-            "resolved": "\"trapezoid\" | \"triangle\"",
+            "original": "boolean",
+            "resolved": "boolean",
             "references": {}
           },
           "mutable": false,
           "attr": "safe-space",
           "reflectToAttr": true,
-          "docs": "Enables a safespace through which the cursor can be moved without the popover being disabled",
+          "docs": "Whether to add a space through which the mouse can move without the popover being hidden.",
           "docsTags": [],
           "values": [
             {
-              "value": "trapezoid",
-              "type": "string"
-            },
-            {
-              "value": "triangle",
-              "type": "string"
+              "type": "boolean"
             }
           ],
           "optional": true,
@@ -4997,7 +5015,7 @@
           },
           "signature": "hide() => Promise<void>",
           "parameters": [],
-          "docs": "Programmatically hide the popovercontainer",
+          "docs": "Hides the popover.",
           "docsTags": []
         },
         {
@@ -5007,12 +5025,12 @@
             "docs": ""
           },
           "complexType": {
-            "signature": "(target: HTMLElement) => Promise<void>",
+            "signature": "(anchor: HTMLElement) => Promise<void>",
             "parameters": [
               {
-                "name": "target",
+                "name": "anchor",
                 "type": "HTMLElement",
-                "docs": "The element that invokes the popover and to which it is visually anchored."
+                "docs": "the element that the popover is visually anchored to."
               }
             ],
             "references": {
@@ -5027,19 +5045,19 @@
             },
             "return": "Promise<void>"
           },
-          "signature": "show(target: HTMLElement) => Promise<void>",
+          "signature": "show(anchor: HTMLElement) => Promise<void>",
           "parameters": [
             {
-              "name": "target",
+              "name": "anchor",
               "type": "HTMLElement",
-              "docs": "The element that invokes the popover and to which it is visually anchored."
+              "docs": "the element that the popover is visually anchored to."
             }
           ],
-          "docs": "Programmatically display the popovercontainer",
+          "docs": "Shows the popover.",
           "docsTags": [
             {
               "name": "param",
-              "text": "target The element that invokes the popover and to which it is visually anchored."
+              "text": "anchor the element that the popover is visually anchored to."
             }
           ]
         },
@@ -5047,20 +5065,20 @@
           "name": "toggle",
           "returns": {
             "type": "Promise<boolean>",
-            "docs": ""
+            "docs": "the new state of the popover: `true` if it is shown, `false` if it is hidden."
           },
           "complexType": {
-            "signature": "(target: HTMLElement, force?: boolean) => Promise<boolean>",
+            "signature": "(anchor: HTMLElement, force?: boolean) => Promise<boolean>",
             "parameters": [
               {
-                "name": "target",
+                "name": "anchor",
                 "type": "HTMLElement",
-                "docs": "The element that invokes the popover and to which it is visually anchored."
+                "docs": "the element that the popover is visually anchored to."
               },
               {
                 "name": "force",
                 "type": "boolean",
-                "docs": "Pass true to always show or false to always hide"
+                "docs": "the next state of the popover."
               }
             ],
             "references": {
@@ -5075,28 +5093,32 @@
             },
             "return": "Promise<boolean>"
           },
-          "signature": "toggle(target: HTMLElement, force?: boolean) => Promise<boolean>",
+          "signature": "toggle(anchor: HTMLElement, force?: boolean) => Promise<boolean>",
           "parameters": [
             {
-              "name": "target",
+              "name": "anchor",
               "type": "HTMLElement",
-              "docs": "The element that invokes the popover and to which it is visually anchored."
+              "docs": "the element that the popover is visually anchored to."
             },
             {
               "name": "force",
               "type": "boolean",
-              "docs": "Pass true to always show or false to always hide"
+              "docs": "the next state of the popover."
             }
           ],
-          "docs": "Toggle popovercontainer display",
+          "docs": "Toggles the popover's state from hidden to showing and vice versa.\n\nIf `state` is specified, the popover is forced to be shown if the is set to `true`, or hidden\nif it is set to `false`.",
           "docsTags": [
             {
               "name": "param",
-              "text": "target The element that invokes the popover and to which it is visually anchored."
+              "text": "anchor the element that the popover is visually anchored to."
             },
             {
               "name": "param",
-              "text": "force Pass true to always show or false to always hide"
+              "text": "force the next state of the popover."
+            },
+            {
+              "name": "returns",
+              "text": "the new state of the popover: `true` if it is shown, `false` if it is hidden."
             }
           ]
         }
@@ -5113,7 +5135,7 @@
           },
           "cancelable": true,
           "composed": true,
-          "docs": "Fires whenever the popovercontainer is about to be shown, passing in event.detail a `first` boolean, which is true if it is to be shown for the first time.",
+          "docs": "Emitted just before the popover is shown.\n\nThe payload contains a `first` boolean, that is set to `true` when the popover is about to be\nshown for the first time.",
           "docsTags": []
         },
         {
@@ -5127,7 +5149,7 @@
           },
           "cancelable": true,
           "composed": true,
-          "docs": "Fires whenever the popovercontainer is about to be shown or hidden, passing in event.detail a `willOpen` boolean, which is true if the popovercontainer is about to be opened and false if it is about to be closed.",
+          "docs": "Emitted just before the popover's state changes.\n\nThe payload contains a `willOpen` boolean, that is set to `true` when the popover is about to\nbe shown, `false` when it is about to be hidden.",
           "docsTags": []
         },
         {
@@ -5141,7 +5163,7 @@
           },
           "cancelable": true,
           "composed": true,
-          "docs": "Fires whenever the popovercontainer is hidden.",
+          "docs": "Emitted just after the popover is hidden.",
           "docsTags": []
         },
         {
@@ -5155,7 +5177,7 @@
           },
           "cancelable": true,
           "composed": true,
-          "docs": "Fires whenever the popovercontainer is shown, passing in event.detail a `first` boolean, which is true if it is shown for the first time.",
+          "docs": "Emitted just after the popover is shown.\n\nThe payload contains a `first` boolean, that is set to `true` when the popover is shown for the\nfirst time.",
           "docsTags": []
         },
         {
@@ -5169,7 +5191,7 @@
           },
           "cancelable": true,
           "composed": true,
-          "docs": "Fires whenever the popovercontainer gets shown or hidden, passing in event.detail an object containing a `isOpen`boolean, which is true if the popovercontainer was opened and false if it was closed.",
+          "docs": "Emitted just after the popover's state changes.\n\nThe payload contains a `isOpen` boolean, that is set to `true` when the popover is shown,\n`false` when it is hidden.",
           "docsTags": []
         }
       ],
@@ -5178,7 +5200,7 @@
       "slots": [
         {
           "name": "",
-          "docs": "Default slot for placing content inside the popovercontainer."
+          "docs": "Default slot for placing content inside the popover."
         }
       ],
       "parts": [

package/dist/esm/{create-validator-decorator-DFpQtJzK.js → create-validator-decorator-Cp_NUmrr.js}

@@ -1,4 +1,4 @@
-import { a as getElement } from './index-Bs0zeM5Q.js';
+import { a as getElement } from './index-D0jX3Fts.js';
 
 const EMPTY_VALUES = [undefined, null, '', Number.NaN];
 function isValueEmpty(value) {