@pine-ds/core 4.4.3 → 4.5.0

package/components/pds-table-row.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as s,h as i,Host as o,transformTag as r}from"@stencil/core/internal/client";import{a as l}from"./closest.js";import{d as c}from"./pds-checkbox2.js";import{d}from"./pds-icon2.js";import{d as h}from"./pds-table-cell2.js";const a=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsTableRowSelected=s(this,"pdsTableRowSelected",7),this.observer=null,this.bodyObserver=null,this.hasDivider=!1,this.isLastRow=!1,this.handleCheckboxChange=e=>{this.isSelected=e.detail.checked,this.handleSelect(this.isSelected)},this.handleSelect=e=>{if(this.indeterminate=!1,!l("pds-table-head",this.hostElement)){const t=Array.from(this.hostElement.parentNode.children).indexOf(this.hostElement);this.pdsTableRowSelected.emit({rowIndex:t,isSelected:e})}},this.generateUniqueId=()=>`${Math.random().toString(36).substring(2,8)}-${(new Date).toISOString().replace(/[:.]/g,"-")}`}classNames(){const e=[];return this.isSelected&&e.push("is-selected"),this.hasDivider&&e.push("has-divider"),this.isLastRow&&e.push("is-last-row"),e.join(" ")}componentWillRender(){if(this.tableRef=this.hostElement.closest("pds-table"),this.tableRef&&this.tableRef.fixedColumn){const e=this.hostElement.querySelector("pds-table-cell");null==e||e.classList.add("is-fixed")}}componentWillLoad(){this.isSelected&&this.handleSelect(this.isSelected)}connectedCallback(){this.tableRef=this.hostElement.closest("pds-table"),this.setupObservers(),this.updateDividerState()}disconnectedCallback(){this.cleanupObservers()}cleanupObservers(){this.observer&&(this.observer.disconnect(),this.observer=null),this.bodyObserver&&(this.bodyObserver.disconnect(),this.bodyObserver=null)}setupObservers(){this.cleanupObservers(),this.tableRef&&"undefined"!=typeof MutationObserver&&(this.observer=new MutationObserver((()=>{this.updateDividerState()})),this.observer.observe(this.tableRef,{attributes:!0,attributeFilter:["row-dividers"]}));const e=this.hostElement.closest("pds-table-body");e&&"undefined"!=typeof MutationObserver&&(this.bodyObserver=new MutationObserver((()=>{this.updateLastRowState()})),this.bodyObserver.observe(e,{childList:!0}))}shouldHaveDivider(){return this.tableRef||(this.tableRef=this.hostElement.closest("pds-table")),!(!this.tableRef||!this.tableRef.rowDividers)}updateDividerState(){this.hasDivider=this.shouldHaveDivider(),this.updateLastRowState()}updateLastRowState(){if(!this.hasDivider)return void(this.isLastRow=!1);const e=this.hostElement.closest("pds-table-body");if(e){const t=Array.from(e.querySelectorAll("pds-table-row"));this.isLastRow=t[t.length-1]===this.hostElement}else this.isLastRow=!1}render(){return i(o,{key:"16ca08eefa74468559a1c084b7619836f01b27af",class:this.classNames(),role:"row",part:"row"},this.tableRef&&this.tableRef.selectable&&i("pds-table-cell",{key:"4b4d2ae15d519e08cd6710ddb6759923d478457c",part:"checkbox-cell",class:this.tableRef.selectable?"has-checkbox":""},i("pds-checkbox",{key:"78b9a731113cce82c59f40713561033f563ffc5f",componentId:this.generateUniqueId(),onPdsCheckboxChange:this.handleCheckboxChange,indeterminate:this.indeterminate,label:"Select Row",hideLabel:!0,checked:this.isSelected,part:"row-checkbox"})),i("slot",{key:"5522f2335912f59013e9fc1e1fc6070d645cd519"}))}get hostElement(){return this}static get style(){return":host{--color-background-interactive:var(--pine-color-background-subtle);border-color:inherit;display:table-row;vertical-align:inherit}:host::part(checkbox-cell){background-color:var(--pine-color-background-container);inset-inline-start:var(--pine-dimension-none);position:-webkit-sticky;position:sticky;z-index:var(--pine-z-index-raised)}:host(:hover),:host(:hover)::part(checkbox-cell),:host(:hover) ::slotted(pds-table-cell),:host(.is-selected),:host(.is-selected)::part(checkbox-cell),:host(.is-selected) ::slotted(pds-table-cell){background:var(--color-background-interactive)}:host(.has-divider) ::slotted(pds-table-cell),:host(.has-divider) pds-table-cell{-webkit-border-after:var(--pine-border-width-thin) solid var(--pine-color-border-subtle);border-block-end:var(--pine-border-width-thin) solid var(--pine-color-border-subtle)}:host(.has-divider.is-last-row) ::slotted(pds-table-cell),:host(.has-divider.is-last-row) pds-table-cell{-webkit-border-after:0;border-block-end:0}"}},[257,"pds-table-row",{indeterminate:[1028],isSelected:[1028,"is-selected"],hasDivider:[32],isLastRow:[32]}]),n=a,b=function(){"undefined"!=typeof customElements&&["pds-table-row","pds-checkbox","pds-icon","pds-table-cell"].forEach((e=>{switch(e){case"pds-table-row":customElements.get(r(e))||customElements.define(r(e),a);break;case"pds-checkbox":customElements.get(r(e))||c();break;case"pds-icon":customElements.get(r(e))||d();break;case"pds-table-cell":customElements.get(r(e))||h()}}))};export{n as PdsTableRow,b as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as t,createEvent as s,h as i,Host as o,transformTag as r}from"@stencil/core/internal/client";import{c as l}from"./closest.js";import{d as c}from"./pds-checkbox2.js";import{d}from"./pds-icon2.js";import{d as h}from"./pds-table-cell2.js";const a=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsTableRowSelected=s(this,"pdsTableRowSelected",7),this.observer=null,this.bodyObserver=null,this.hasDivider=!1,this.isLastRow=!1,this.handleCheckboxChange=e=>{this.isSelected=e.detail.checked,this.handleSelect(this.isSelected)},this.handleSelect=e=>{if(this.indeterminate=!1,!l("pds-table-head",this.hostElement)){const t=Array.from(this.hostElement.parentNode.children).indexOf(this.hostElement);this.pdsTableRowSelected.emit({rowIndex:t,isSelected:e})}},this.generateUniqueId=()=>`${Math.random().toString(36).substring(2,8)}-${(new Date).toISOString().replace(/[:.]/g,"-")}`}classNames(){const e=[];return this.isSelected&&e.push("is-selected"),this.hasDivider&&e.push("has-divider"),this.isLastRow&&e.push("is-last-row"),e.join(" ")}componentWillRender(){if(this.tableRef=this.hostElement.closest("pds-table"),this.tableRef&&this.tableRef.fixedColumn){const e=this.hostElement.querySelector("pds-table-cell");null==e||e.classList.add("is-fixed")}}componentWillLoad(){this.isSelected&&this.handleSelect(this.isSelected)}connectedCallback(){this.tableRef=this.hostElement.closest("pds-table"),this.setupObservers(),this.updateDividerState()}disconnectedCallback(){this.cleanupObservers()}cleanupObservers(){this.observer&&(this.observer.disconnect(),this.observer=null),this.bodyObserver&&(this.bodyObserver.disconnect(),this.bodyObserver=null)}setupObservers(){this.cleanupObservers(),this.tableRef&&"undefined"!=typeof MutationObserver&&(this.observer=new MutationObserver((()=>{this.updateDividerState()})),this.observer.observe(this.tableRef,{attributes:!0,attributeFilter:["row-dividers"]}));const e=this.hostElement.closest("pds-table-body");e&&"undefined"!=typeof MutationObserver&&(this.bodyObserver=new MutationObserver((()=>{this.updateLastRowState()})),this.bodyObserver.observe(e,{childList:!0}))}shouldHaveDivider(){return this.tableRef||(this.tableRef=this.hostElement.closest("pds-table")),!(!this.tableRef||!this.tableRef.rowDividers)}updateDividerState(){this.hasDivider=this.shouldHaveDivider(),this.updateLastRowState()}updateLastRowState(){if(!this.hasDivider)return void(this.isLastRow=!1);const e=this.hostElement.closest("pds-table-body");if(e){const t=Array.from(e.querySelectorAll("pds-table-row"));this.isLastRow=t[t.length-1]===this.hostElement}else this.isLastRow=!1}render(){return i(o,{key:"16ca08eefa74468559a1c084b7619836f01b27af",class:this.classNames(),role:"row",part:"row"},this.tableRef&&this.tableRef.selectable&&i("pds-table-cell",{key:"4b4d2ae15d519e08cd6710ddb6759923d478457c",part:"checkbox-cell",class:this.tableRef.selectable?"has-checkbox":""},i("pds-checkbox",{key:"78b9a731113cce82c59f40713561033f563ffc5f",componentId:this.generateUniqueId(),onPdsCheckboxChange:this.handleCheckboxChange,indeterminate:this.indeterminate,label:"Select Row",hideLabel:!0,checked:this.isSelected,part:"row-checkbox"})),i("slot",{key:"5522f2335912f59013e9fc1e1fc6070d645cd519"}))}get hostElement(){return this}static get style(){return":host{--color-background-interactive:var(--pine-color-background-subtle);border-color:inherit;display:table-row;vertical-align:inherit}:host::part(checkbox-cell){background-color:var(--pine-color-background-container);inset-inline-start:var(--pine-dimension-none);position:-webkit-sticky;position:sticky;z-index:var(--pine-z-index-raised)}:host(:hover),:host(:hover)::part(checkbox-cell),:host(:hover) ::slotted(pds-table-cell),:host(.is-selected),:host(.is-selected)::part(checkbox-cell),:host(.is-selected) ::slotted(pds-table-cell){background:var(--color-background-interactive)}:host(.has-divider) ::slotted(pds-table-cell),:host(.has-divider) pds-table-cell{-webkit-border-after:var(--pine-border-width-thin) solid var(--pine-color-border-subtle);border-block-end:var(--pine-border-width-thin) solid var(--pine-color-border-subtle)}:host(.has-divider.is-last-row) ::slotted(pds-table-cell),:host(.has-divider.is-last-row) pds-table-cell{-webkit-border-after:0;border-block-end:0}"}},[257,"pds-table-row",{indeterminate:[1028],isSelected:[1028,"is-selected"],hasDivider:[32],isLastRow:[32]}]),n=a,b=function(){"undefined"!=typeof customElements&&["pds-table-row","pds-checkbox","pds-icon","pds-table-cell"].forEach((e=>{switch(e){case"pds-table-row":customElements.get(r(e))||customElements.define(r(e),a);break;case"pds-checkbox":customElements.get(r(e))||c();break;case"pds-icon":customElements.get(r(e))||d();break;case"pds-table-cell":customElements.get(r(e))||h()}}))};export{n as PdsTableRow,b as defineCustomElement}

package/components/pds-tabpanel.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as t,h as a,Host as s,transformTag as n}from"@stencil/core/internal/client";import{u as i}from"./reconnected-content.js";const p=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.selected=!1,this.stretch=!1}componentDidRender(){i(this.el.querySelector(".pds-tabpanel"),".pds-tabpanel")}render(){return a(s,{key:"cce5229aaa694a4eeb30ceacb7edbb7b03f7e24a",slot:"tabpanels",class:this.stretch&&this.selected?"pds-tabpanel--stretch-active":void 0},a("div",{key:"614187ea6676c80d94acd9aef7c8e10137fb6179",role:"tabpanel",id:this.parentComponentId+"__"+this.name+"-panel",tabindex:"0","aria-labelledby":this.parentComponentId+"__"+this.name,class:this.selected?"pds-tabpanel is-active":"pds-tabpanel"},a("slot",{key:"368f81238023d647d42b3c1f6dc14795245bbc87"})))}get el(){return this}static get style(){return":host{display:block}:host(.pds-tabpanel--stretch-active){-ms-flex:1 1 auto;flex:1 1 auto;min-block-size:0}:host(.pds-tabpanel--stretch-active) .pds-tabpanel.is-active{block-size:100%}.pds-tabpanel{display:none;margin-top:var(--tabs-dimension-panel-margin-top);padding:var(--tabs-dimension-panel-padding)}.pds-tabpanel:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-tabpanel.is-active{display:block}"}},[260,"pds-tabpanel",{name:[1],parentComponentId:[1,"parent-component-id"],variant:[1],selected:[1028],stretch:[4]}]),l=p,o=function(){"undefined"!=typeof customElements&&["pds-tabpanel"].forEach((e=>{"pds-tabpanel"===e&&(customElements.get(n(e))||customElements.define(n(e),p))}))};export{l as PdsTabpanel,o as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as e,h as a,Host as s,transformTag as n}from"@stencil/core/internal/client";import{u as i}from"./reconnected-content.js";const d=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.selected=!1,this.stretch=!1}componentDidRender(){i(this.el.querySelector(".pds-tabpanel"),".pds-tabpanel")}render(){return a(s,{key:"87b00d828c9cddbcccd5d6e89dab7541a3c5c839",slot:"tabpanels",class:this.stretch&&this.selected?"pds-tabpanel--stretch-active":void 0},a("div",{key:"d7058a727d010351c73b5287f45991d48ef71151",role:"tabpanel",id:this.parentComponentId+"__"+this.name+"-panel",tabindex:"0","aria-labelledby":this.parentComponentId+"__"+this.name,class:this.selected?"pds-tabpanel is-active":"pds-tabpanel"},a("slot",{key:"97861fcd8432206a1115135fad919d75dc327112"})))}get el(){return this}static get style(){return":host{display:block}:host(.pds-tabpanel--stretch-active){-ms-flex:1 1 auto;flex:1 1 auto;min-block-size:0}:host(.pds-tabpanel--stretch-active) .pds-tabpanel.is-active{block-size:100%}.pds-tabpanel{display:none;margin-top:var(--tabs-dimension-panel-margin-top);padding:var(--tabs-dimension-panel-padding)}.pds-tabpanel:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-tabpanel.is-active{display:block}"}},[260,"pds-tabpanel",{name:[1],parentComponentId:[1,"parent-component-id"],variant:[1],selected:[1028],stretch:[4]}]),p=d,l=function(){"undefined"!=typeof customElements&&["pds-tabpanel"].forEach((t=>{"pds-tabpanel"===t&&(customElements.get(n(t))||customElements.define(n(t),d))}))};export{p as PdsTabpanel,l as defineCustomElement}

package/components/pds-tabs.js

@@ -1 +1 @@
-import{proxyCustomElement as s,HTMLElement as t,h as i,Host as e,transformTag as a}from"@stencil/core/internal/client";const n=s(class extends t{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.divider=!1,this.stretch=!1,this.nav=!1}tabClickHandler(s){this.componentId===s.detail[1]&&(this.activeTabIndex=s.detail[0],this.activeTabName=this.tabs[this.activeTabIndex].name)}handleKeyDown(s){if(this.isNav)return;const t=s.target.closest("pds-tab"),i=t&&t.closest("pds-tabs")===this.el;["ArrowLeft","ArrowRight","Home","End"].includes(s.key)&&i&&(s.preventDefault(),this.moveActiveTab(s.key))}get isNav(){return!!this.nav}warnOnNavConfig(){var s;if(!(null===(s=this.tabs)||void 0===s?void 0:s.length))return;const t=this.tabs.filter((s=>{const t=s.getAttribute("href");return null!=t&&""!==t})).length;this.nav&&t<this.tabs.length?console.warn("pds-tabs: `nav` is set, so every pds-tab needs an `href`."):!this.nav&&t>0&&console.warn("pds-tabs: a pds-tab has an `href` but `nav` is not set — add `nav` to pds-tabs for navigation mode; the href is ignored in panel mode.")}moveActiveTab(s){const t=this.tabs.length-1;let i=null;switch(s){case"ArrowLeft":i=0===this.activeTabIndex?t:this.activeTabIndex+-1;break;case"ArrowRight":i=this.activeTabIndex===t?0:this.activeTabIndex+1;break;case"Home":i=0;break;case"End":i=t}this.tabs[i].children[0].focus(),this.activeTabName=this.tabs[i].name,this.activeTabIndex=i}findAllChildren(){const s=Array.from(this.el.querySelectorAll("pds-tab")),t=Array.from(this.el.querySelectorAll("pds-tabpanel"));this.tabs=s.filter((s=>s.closest("pds-tabs")===this.el)),this.tabPanels=t.filter((s=>s.closest("pds-tabs")===this.el))}propGeneration(s,t=0){s.parentComponentId=""+this.componentId,s.variant=""+this.variant,s.selected=this.activeTabName===s.name,s.index=t}passPropsToChildren(){var s;if(!this.nav&&null==this.activeTabName&&this.tabs.length){const t=null!==(s=this.tabs.find((s=>!s.disabled)))&&void 0!==s?s:this.tabs[0];this.activeTabName=t.name}this.tabs.forEach(((s,t)=>{this.activeTabName===s.name&&(this.activeTabIndex=t),this.propGeneration(s,t),s.navMode=this.nav})),this.tabPanels.forEach((s=>{this.propGeneration(s),s.stretch=this.stretch}))}classNames(){let s="pds-tabs";return this.variant&&"primary"!=this.variant&&(s+=" pds-tabs--"+this.variant),this.divider&&(s+=" pds-tabs--divider"),this.stretch&&(s+=" pds-tabs--stretch"),s}componentWillLoad(){this.findAllChildren(),this.warnOnNavConfig()}componentWillRender(){this.passPropsToChildren()}render(){const s=this.isNav?i("nav",{class:"pds-tabs__tablist","aria-label":this.tablistLabel||void 0,part:"tab-list"},i("slot",{name:"tabs"})):i("div",{class:"pds-tabs__tablist",role:"tablist","aria-label":this.tablistLabel,part:"tab-list"},i("slot",{name:"tabs"}));return i(e,{key:"db689b695d53916eb40a7c6f4596a20925fd4b2e","active-tab-name":this.activeTabName,class:this.classNames(),id:this.componentId},s,i("slot",{key:"d2e79967a75d4e2fc33bff5321c62cc89ac74491",name:"tabpanels"}))}get el(){return this}static get style(){return":host{--tabs-dimension-panel-margin-top:var(--pine-dimension-none);--tabs-dimension-panel-padding:0;display:block}.pds-tabs__tablist{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-md)}:host(.pds-tabs--divider) .pds-tabs__tablist{-webkit-border-after:var(--pine-border-width-thin) solid var(--pine-color-border-subtle);border-block-end:var(--pine-border-width-thin) solid var(--pine-color-border-subtle)}:host(.pds-tabs--stretch){block-size:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.pds-tabs--stretch) .pds-tabs__tablist{-ms-flex:0 0 auto;flex:0 0 auto}:host(.pds-tabs--availability) .pds-tabs__tablist{gap:var(--pine-dimension-xs)}:host(.pds-tabs--filter) .pds-tabs__tablist{gap:var(--pine-dimension-sm)}:host(.pds-tabs--pill) .pds-tabs__tablist{background-color:var(--pine-color-background-app);border:var(--pine-border-width-thin) solid var(--pine-color-border-subtle);border-radius:var(--pine-dimension-100);display:-ms-inline-flexbox;display:inline-flex;display:-ms-flexbox;display:flex;gap:0;height:var(--pine-dimension-450)}"}},[257,"pds-tabs",{tablistLabel:[1,"tablist-label"],componentId:[1,"component-id"],variant:[1],divider:[4],stretch:[4],nav:[4],activeTabName:[1025,"active-tab-name"],activeTabIndex:[1026,"active-tab-index"]},[[16,"pdsTabClick","tabClickHandler"],[0,"keydown","handleKeyDown"]]]),r=n,d=function(){"undefined"!=typeof customElements&&["pds-tabs"].forEach((s=>{"pds-tabs"===s&&(customElements.get(a(s))||customElements.define(a(s),n))}))};export{r as PdsTabs,d as defineCustomElement}
+import{proxyCustomElement as s,HTMLElement as t,h as i,Host as a,transformTag as e}from"@stencil/core/internal/client";import{H as n}from"./attributes.js";const r=s(class extends t{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.hostKeeper=new n,this.divider=!1,this.stretch=!1,this.nav=!1}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}tabClickHandler(s){this.componentId===s.detail[1]&&(this.activeTabIndex=s.detail[0],this.activeTabName=this.tabs[this.activeTabIndex].name)}handleKeyDown(s){if(this.isNav)return;const t=s.target.closest("pds-tab"),i=t&&t.closest("pds-tabs")===this.el;["ArrowLeft","ArrowRight","Home","End"].includes(s.key)&&i&&(s.preventDefault(),this.moveActiveTab(s.key))}get isNav(){return!!this.nav}warnOnNavConfig(){var s;if(!(null===(s=this.tabs)||void 0===s?void 0:s.length))return;const t=this.tabs.filter((s=>{const t=s.getAttribute("href");return null!=t&&""!==t})).length;this.nav&&t<this.tabs.length?console.warn("pds-tabs: `nav` is set, so every pds-tab needs an `href`."):!this.nav&&t>0&&console.warn("pds-tabs: a pds-tab has an `href` but `nav` is not set — add `nav` to pds-tabs for navigation mode; the href is ignored in panel mode.")}moveActiveTab(s){const t=this.tabs.length-1;let i=null;switch(s){case"ArrowLeft":i=0===this.activeTabIndex?t:this.activeTabIndex+-1;break;case"ArrowRight":i=this.activeTabIndex===t?0:this.activeTabIndex+1;break;case"Home":i=0;break;case"End":i=t}this.tabs[i].children[0].focus(),this.activeTabName=this.tabs[i].name,this.activeTabIndex=i}findAllChildren(){const s=Array.from(this.el.querySelectorAll("pds-tab")),t=Array.from(this.el.querySelectorAll("pds-tabpanel"));this.tabs=s.filter((s=>s.closest("pds-tabs")===this.el)),this.tabPanels=t.filter((s=>s.closest("pds-tabs")===this.el))}propGeneration(s,t=0){s.parentComponentId=""+this.componentId,s.variant=""+this.variant,s.selected=this.activeTabName===s.name,s.index=t}passPropsToChildren(){var s;if(!this.nav&&null==this.activeTabName&&this.tabs.length){const t=null!==(s=this.tabs.find((s=>!s.disabled)))&&void 0!==s?s:this.tabs[0];this.activeTabName=t.name}this.tabs.forEach(((s,t)=>{this.activeTabName===s.name&&(this.activeTabIndex=t),this.propGeneration(s,t),s.navMode=this.nav})),this.tabPanels.forEach((s=>{this.propGeneration(s),s.stretch=this.stretch}))}classNames(){let s="pds-tabs";return this.variant&&"primary"!=this.variant&&(s+=" pds-tabs--"+this.variant),this.divider&&(s+=" pds-tabs--divider"),this.stretch&&(s+=" pds-tabs--stretch"),s}componentWillLoad(){this.findAllChildren(),this.warnOnNavConfig()}componentWillRender(){this.passPropsToChildren()}render(){const s=this.isNav?i("nav",{class:"pds-tabs__tablist","aria-label":this.tablistLabel||void 0,part:"tab-list"},i("slot",{name:"tabs"})):i("div",{class:"pds-tabs__tablist",role:"tablist","aria-label":this.tablistLabel,part:"tab-list"},i("slot",{name:"tabs"})),t=this.classNames();return this.hostKeeper.record(t),i(a,{key:"ea26bc4e4cadd4621511afa01ca2a353a053fd0e","active-tab-name":this.activeTabName,class:t,id:this.componentId},s,i("slot",{key:"3f920708c647920af3d0d50f74b5409d30d70af8",name:"tabpanels"}))}get el(){return this}static get style(){return":host{--tabs-dimension-panel-margin-top:var(--pine-dimension-none);--tabs-dimension-panel-padding:0;display:block}.pds-tabs__tablist{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-md)}:host(.pds-tabs--divider) .pds-tabs__tablist{-webkit-border-after:var(--pine-border-width-thin) solid var(--pine-color-border-subtle);border-block-end:var(--pine-border-width-thin) solid var(--pine-color-border-subtle)}:host(.pds-tabs--stretch){block-size:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.pds-tabs--stretch) .pds-tabs__tablist{-ms-flex:0 0 auto;flex:0 0 auto}:host(.pds-tabs--availability) .pds-tabs__tablist{gap:var(--pine-dimension-xs)}:host(.pds-tabs--filter) .pds-tabs__tablist{gap:var(--pine-dimension-sm)}:host(.pds-tabs--pill) .pds-tabs__tablist{background-color:var(--pine-color-background-app);border:var(--pine-border-width-thin) solid var(--pine-color-border-subtle);border-radius:var(--pine-dimension-100);display:-ms-inline-flexbox;display:inline-flex;display:-ms-flexbox;display:flex;gap:0;height:var(--pine-dimension-450)}"}},[257,"pds-tabs",{tablistLabel:[1,"tablist-label"],componentId:[1,"component-id"],variant:[1],divider:[4],stretch:[4],nav:[4],activeTabName:[1025,"active-tab-name"],activeTabIndex:[1026,"active-tab-index"]},[[16,"pdsTabClick","tabClickHandler"],[0,"keydown","handleKeyDown"]]]),d=r,o=function(){"undefined"!=typeof customElements&&["pds-tabs"].forEach((s=>{"pds-tabs"===s&&(customElements.get(e(s))||customElements.define(e(s),r))}))};export{d as PdsTabs,o as defineCustomElement}

package/components/pds-tooltip.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as o,h as i,Host as r,transformTag as s}from"@stencil/core/internal/client";import{c as e,a as l,o as n,f as a,s as p}from"./floating-ui.dom.js";const h=t(class t extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this._isInteractiveOpen=!1,this.portalEl=null,this.resolvedPlacement="right",this.triggerEl=null,this.contentDiv=null,this.slotMutationObserver=null,this.currentPathname="",this.pathnameCheckInterval=null,this.stopAutoUpdate=null,this.hasArrow=!0,this.htmlContent=!1,this.placement="right",this.maxWidth="352px",this.opened=!1,this.hasCheckedReconnect=!1,this.handleHide=()=>{this.opened&&!this._isInteractiveOpen||(this.hideTooltip(),this._isInteractiveOpen=!1)},this.handleShow=()=>{this.opened&&!this._isInteractiveOpen||(this._isInteractiveOpen=!0,this.showTooltip())},this.handlePageShow=()=>{this.opened&&!this._isInteractiveOpen||(this.opened=!1,this._isInteractiveOpen=!1)},this.handleSpaNavigation=()=>{this.opened&&!this._isInteractiveOpen||(this.hideTooltip(),this._isInteractiveOpen=!1)},this.checkPathnameChange=()=>{window.location.pathname!==this.currentPathname&&(this.currentPathname=window.location.pathname,this.handleSpaNavigation())}}handleOpenToggle(t,o){!1===t&&!0===o&&(this._isInteractiveOpen=!1)}componentWillLoad(){this._isInteractiveOpen=!1,this.resolvedPlacement=this.placement}componentDidLoad(){window.addEventListener("pageshow",this.handlePageShow),this.currentPathname=window.location.pathname,this.triggerEl=this.el.querySelector(".pds-tooltip__trigger");const t=this.el.querySelector(".pds-tooltip__content-slot-wrapper");null!==t&&(this.slotMutationObserver=new MutationObserver((()=>{this.opened&&null!==this.portalEl&&(this.removePortal(),this.createPortal())})),this.slotMutationObserver.observe(t,{childList:!0,subtree:!1}))}connectedCallback(){this.hasCheckedReconnect=!1}disconnectedCallback(){window.removeEventListener("pageshow",this.handlePageShow),null!==this.slotMutationObserver&&(this.slotMutationObserver.disconnect(),this.slotMutationObserver=null),null!==this.portalEl&&this.removePortal(),null!==this.pathnameCheckInterval&&(clearInterval(this.pathnameCheckInterval),this.pathnameCheckInterval=null),null!==this.stopAutoUpdate&&(this.stopAutoUpdate(),this.stopAutoUpdate=null)}unwrapReconnectedSlots(){const t=Array.from(this.el.children).find((t=>t.matches(".pds-tooltip__trigger"))),o=Array.from(this.el.children).find((t=>t.matches(".pds-tooltip__content-slot-wrapper")));if(void 0===t||void 0===o)return;const i=t=>Array.from(t.children).find((t=>t.matches(".pds-tooltip__trigger, .pds-tooltip__content-slot-wrapper")));[t,o].forEach((r=>{let s=i(r);for(;void 0!==s;){const e=s.matches(".pds-tooltip__content-slot-wrapper")?o:t;Array.from(s.childNodes).forEach((t=>e===r?r.insertBefore(t,s):e.appendChild(t))),s.remove(),s=i(r)}}))}componentDidRender(){this.hasCheckedReconnect||(this.unwrapReconnectedSlots(),this.hasCheckedReconnect=!0),this.opened&&null===this.portalEl?this.createPortal():this.opened||null===this.portalEl||this.removePortal(),null!==this.portalEl&&(this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`,this.portalEl.setAttribute("aria-hidden",this.opened?"false":"true"),this.portalEl.setAttribute("aria-live",this.opened?"polite":"off"))}async showTooltip(){this.opened=!0}async hideTooltip(){this.opened=!1}determinePositioningAnchor(){let t=this.triggerEl;if(null!==this.triggerEl){const o=this.triggerEl.childNodes;for(let i=0;i<o.length;i++){const r=o[i];if(r.nodeType===Node.ELEMENT_NODE){t=r;break}}}return t}async repositionPortal(){const t=this.determinePositioningAnchor();if(null!==t&&null!==this.portalEl)try{const{x:o,y:i,placement:r}=await e(t,this.portalEl,{placement:this.placement,strategy:"fixed",middleware:[n(8),a(),p({padding:5})]});this.resolvedPlacement=r,Object.assign(this.portalEl.style,{left:o+"px",top:i+"px",position:"fixed"}),this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`}catch(o){console.warn("Failed to position tooltip:",o),this.resolvedPlacement=this.placement;const i=t.getBoundingClientRect();this.portalEl.style.left=i.right+8+"px",this.portalEl.style.top=i.top+"px",this.portalEl.style.position="fixed"}}createPortal(){if(null!==this.portalEl)return;if(this.portalEl=document.createElement("div"),this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`,this.portalEl.style.position="fixed",this.portalEl.style.zIndex="var(--pine-z-index-nuclear)",""===this.portalEl.id){const o=t.instanceCounter++;this.portalEl.id=`${this.componentId||this.el.id||"pds-tooltip"}-portal-${o}`}this.portalEl.getAttribute("id")!==this.portalEl.id&&this.portalEl.setAttribute("id",this.portalEl.id),this.portalEl.setAttribute("role","tooltip"),this.portalEl.setAttribute("aria-hidden",this.opened?"false":"true"),this.portalEl.setAttribute("aria-live",this.opened?"polite":"off"),this.portalEl.style.maxWidth=this.maxWidth,this.contentDiv=document.createElement("div"),this.contentDiv.className="pds-tooltip__content",this.contentDiv.setAttribute("aria-hidden",this.opened?"false":"true"),this.contentDiv.setAttribute("aria-live",this.opened?"polite":"off");const o=this.el.querySelector(".pds-tooltip__content-slot-wrapper"),i=null==o?void 0:o.querySelector('[slot="content"]');let r=!1;if(null!==i){const t=Array.from(i.childNodes);t.length>0&&t.some((t=>{var o;return t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&""!==(null===(o=t.textContent)||void 0===o?void 0:o.trim())}))&&(r=!0,t.forEach((t=>{var o;(t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&""!==(null===(o=t.textContent)||void 0===o?void 0:o.trim()))&&this.contentDiv.appendChild(t.cloneNode(!0))})))}r||"string"!=typeof this.content||""===this.content.trim()||(this.contentDiv.textContent=this.content),this.portalEl.appendChild(this.contentDiv),document.body.appendChild(this.portalEl),this.repositionPortal().catch((t=>{console.warn("Failed to position tooltip on creation:",t)})),this.triggerEl&&this.portalEl&&(this.stopAutoUpdate=l(this.triggerEl,this.portalEl,(()=>{this.repositionPortal().catch((t=>{console.warn("Failed to reposition tooltip on auto update:",t)}))}))),window.addEventListener("popstate",this.handleSpaNavigation,!0),window.addEventListener("hashchange",this.handleSpaNavigation,!0),this.pathnameCheckInterval=setInterval(this.checkPathnameChange,100),null!==this.triggerEl&&""!==this.portalEl.id&&this.triggerEl.setAttribute("aria-describedby",this.portalEl.id)}removePortal(){if(null!==this.stopAutoUpdate&&(this.stopAutoUpdate(),this.stopAutoUpdate=null),null!==this.pathnameCheckInterval&&(clearInterval(this.pathnameCheckInterval),this.pathnameCheckInterval=null),null!==this.portalEl){window.removeEventListener("popstate",this.handleSpaNavigation,!0),window.removeEventListener("hashchange",this.handleSpaNavigation,!0);try{this.portalEl.parentNode&&this.portalEl.parentNode.removeChild(this.portalEl)}catch(t){console.warn("Portal element could not be removed from DOM:",t)}this.portalEl=null}null!==this.triggerEl&&this.triggerEl.removeAttribute("aria-describedby"),this.contentDiv=null}render(){return i(r,{key:"d63b6632a084fbaebd2004a569fb96e0fff91f41",id:this.componentId||void 0,class:{"pds-tooltip--is-open":this.opened}},i("span",{key:"79b8b9c2bb9fc2afaf8cbb06dbc102d18c060362",class:"pds-tooltip__trigger",onMouseEnter:this.handleShow,onMouseLeave:this.handleHide,onFocusin:this.handleShow,onFocusout:this.handleHide,ref:t=>this.triggerEl=t},i("slot",{key:"9e12d130ac5f392d966f442d91673c3864962b01"})),i("div",{key:"5b83f093b2cbb2b22af0c440278ee318c456087a",class:"pds-tooltip__content-slot-wrapper",hidden:!0},i("slot",{key:"c0243ad0a833326e8daf799d41b1bf8048c6dee9",name:"content"})))}get el(){return this}static get watchers(){return{opened:[{handleOpenToggle:0}]}}static get style(){return'.pds-tooltip{--tooltip-border-width-arrow-down:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-left:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-right:var(--tooltip-sizing-arrow) 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-border-width-arrow-up:0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-sizing-arrow:6px;--tooltip-sizing-arrow-offset:14px;--tooltip-dimension-max-width:320px}.pds-tooltip__content{background-color:var(--pine-color-primary);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);color:var(--pine-color-text-primary);max-width:var(--tooltip-dimension-max-width);opacity:0;padding:var(--pine-dimension-xs) calc(var(--pine-dimension-md) / 2);position:relative;visibility:hidden;width:-webkit-max-content;width:-moz-max-content;width:max-content}.pds-tooltip--is-open .pds-tooltip__content{opacity:1;visibility:visible;z-index:var(--pine-z-index-raised)}.pds-tooltip.pds-tooltip--has-html-content .pds-tooltip__content{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.pds-tooltip__content::after{border-color:transparent;border-right-color:transparent;border-style:solid;border-width:var(--tooltip-border-width-arrow-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);bottom:var(--tooltip-sizing-arrow-offset);left:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:50%;top:initial;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--top-start .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:initial;right:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);bottom:var(--tooltip-sizing-arrow-offset);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:50%;top:calc(var(--tooltip-sizing-arrow) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:initial;right:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}'}},[260,"pds-tooltip",{content:[1],componentId:[1,"component-id"],hasArrow:[4,"has-arrow"],htmlContent:[4,"html-content"],placement:[513],maxWidth:[1,"max-width"],opened:[1540],_isInteractiveOpen:[32],showTooltip:[64],hideTooltip:[64]},void 0,{opened:[{handleOpenToggle:0}]}]);h.instanceCounter=0;const d=h,c=function(){"undefined"!=typeof customElements&&["pds-tooltip"].forEach((t=>{"pds-tooltip"===t&&(customElements.get(s(t))||customElements.define(s(t),h))}))};export{d as PdsTooltip,c as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as o,h as i,Host as r,transformTag as s}from"@stencil/core/internal/client";import{c as e,a as l,o as n,f as a,s as p}from"./floating-ui.dom.js";const h=t(class t extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this._isInteractiveOpen=!1,this.portalEl=null,this.resolvedPlacement="right",this.triggerEl=null,this.contentDiv=null,this.slotMutationObserver=null,this.currentPathname="",this.pathnameCheckInterval=null,this.stopAutoUpdate=null,this.hasArrow=!0,this.htmlContent=!1,this.placement="right",this.maxWidth="352px",this.opened=!1,this.hasCheckedReconnect=!1,this.handleHide=()=>{this.opened&&!this._isInteractiveOpen||(this.hideTooltip(),this._isInteractiveOpen=!1)},this.handleShow=()=>{this.opened&&!this._isInteractiveOpen||(this._isInteractiveOpen=!0,this.showTooltip())},this.handlePageShow=()=>{this.opened&&!this._isInteractiveOpen||(this.opened=!1,this._isInteractiveOpen=!1)},this.handleSpaNavigation=()=>{this.opened&&!this._isInteractiveOpen||(this.hideTooltip(),this._isInteractiveOpen=!1)},this.checkPathnameChange=()=>{window.location.pathname!==this.currentPathname&&(this.currentPathname=window.location.pathname,this.handleSpaNavigation())}}handleOpenToggle(t,o){!1===t&&!0===o&&(this._isInteractiveOpen=!1)}componentWillLoad(){this._isInteractiveOpen=!1,this.resolvedPlacement=this.placement}componentDidLoad(){window.addEventListener("pageshow",this.handlePageShow),this.currentPathname=window.location.pathname,this.triggerEl=this.el.querySelector(".pds-tooltip__trigger");const t=this.el.querySelector(".pds-tooltip__content-slot-wrapper");null!==t&&(this.slotMutationObserver=new MutationObserver((()=>{this.opened&&null!==this.portalEl&&(this.removePortal(),this.createPortal())})),this.slotMutationObserver.observe(t,{childList:!0,subtree:!1}))}connectedCallback(){this.hasCheckedReconnect=!1}disconnectedCallback(){window.removeEventListener("pageshow",this.handlePageShow),null!==this.slotMutationObserver&&(this.slotMutationObserver.disconnect(),this.slotMutationObserver=null),null!==this.portalEl&&this.removePortal(),null!==this.pathnameCheckInterval&&(clearInterval(this.pathnameCheckInterval),this.pathnameCheckInterval=null),null!==this.stopAutoUpdate&&(this.stopAutoUpdate(),this.stopAutoUpdate=null)}unwrapReconnectedSlots(){const t=Array.from(this.el.children).find((t=>t.matches(".pds-tooltip__trigger"))),o=Array.from(this.el.children).find((t=>t.matches(".pds-tooltip__content-slot-wrapper")));if(void 0===t||void 0===o)return;const i=t=>Array.from(t.children).find((t=>t.matches(".pds-tooltip__trigger, .pds-tooltip__content-slot-wrapper")));[t,o].forEach((r=>{let s=i(r);for(;void 0!==s;){const e=s.matches(".pds-tooltip__content-slot-wrapper")?o:t;Array.from(s.childNodes).forEach((t=>e===r?r.insertBefore(t,s):e.appendChild(t))),s.remove(),s=i(r)}}))}componentDidRender(){this.hasCheckedReconnect||(this.unwrapReconnectedSlots(),this.hasCheckedReconnect=!0),this.opened&&null===this.portalEl?this.createPortal():this.opened||null===this.portalEl||this.removePortal(),null!==this.portalEl&&(this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`,this.portalEl.setAttribute("aria-hidden",this.opened?"false":"true"),this.portalEl.setAttribute("aria-live",this.opened?"polite":"off"))}async showTooltip(){this.opened=!0}async hideTooltip(){this.opened=!1}determinePositioningAnchor(){let t=this.triggerEl;if(null!==this.triggerEl){const o=this.triggerEl.childNodes;for(let i=0;i<o.length;i++){const r=o[i];if(r.nodeType===Node.ELEMENT_NODE){t=r;break}}}return t}async repositionPortal(){const t=this.determinePositioningAnchor();if(null!==t&&null!==this.portalEl)try{const{x:o,y:i,placement:r}=await e(t,this.portalEl,{placement:this.placement,strategy:"fixed",middleware:[n(8),a(),p({padding:5})]});this.resolvedPlacement=r,Object.assign(this.portalEl.style,{left:o+"px",top:i+"px",position:"fixed"}),this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`}catch(o){console.warn("Failed to position tooltip:",o),this.resolvedPlacement=this.placement;const i=t.getBoundingClientRect();this.portalEl.style.left=i.right+8+"px",this.portalEl.style.top=i.top+"px",this.portalEl.style.position="fixed"}}createPortal(){if(null!==this.portalEl)return;if(this.portalEl=document.createElement("div"),this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`,this.portalEl.style.position="fixed",this.portalEl.style.zIndex="var(--pine-z-index-nuclear)",""===this.portalEl.id){const o=t.instanceCounter++;this.portalEl.id=`${this.componentId||this.el.id||"pds-tooltip"}-portal-${o}`}this.portalEl.getAttribute("id")!==this.portalEl.id&&this.portalEl.setAttribute("id",this.portalEl.id),this.portalEl.setAttribute("role","tooltip"),this.portalEl.setAttribute("aria-hidden",this.opened?"false":"true"),this.portalEl.setAttribute("aria-live",this.opened?"polite":"off"),this.portalEl.style.maxWidth=this.maxWidth,this.contentDiv=document.createElement("div"),this.contentDiv.className="pds-tooltip__content",this.contentDiv.setAttribute("aria-hidden",this.opened?"false":"true"),this.contentDiv.setAttribute("aria-live",this.opened?"polite":"off");const o=this.el.querySelector(".pds-tooltip__content-slot-wrapper"),i=null==o?void 0:o.querySelector('[slot="content"]');let r=!1;if(null!==i){const t=Array.from(i.childNodes);t.length>0&&t.some((t=>{var o;return t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&""!==(null===(o=t.textContent)||void 0===o?void 0:o.trim())}))&&(r=!0,t.forEach((t=>{var o;(t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&""!==(null===(o=t.textContent)||void 0===o?void 0:o.trim()))&&this.contentDiv.appendChild(t.cloneNode(!0))})))}r||"string"!=typeof this.content||""===this.content.trim()||(this.contentDiv.textContent=this.content),this.portalEl.appendChild(this.contentDiv),document.body.appendChild(this.portalEl),this.repositionPortal().catch((t=>{console.warn("Failed to position tooltip on creation:",t)})),this.triggerEl&&this.portalEl&&(this.stopAutoUpdate=l(this.triggerEl,this.portalEl,(()=>{this.repositionPortal().catch((t=>{console.warn("Failed to reposition tooltip on auto update:",t)}))}))),window.addEventListener("popstate",this.handleSpaNavigation,!0),window.addEventListener("hashchange",this.handleSpaNavigation,!0),this.pathnameCheckInterval=setInterval(this.checkPathnameChange,100),null!==this.triggerEl&&""!==this.portalEl.id&&this.triggerEl.setAttribute("aria-describedby",this.portalEl.id)}removePortal(){if(null!==this.stopAutoUpdate&&(this.stopAutoUpdate(),this.stopAutoUpdate=null),null!==this.pathnameCheckInterval&&(clearInterval(this.pathnameCheckInterval),this.pathnameCheckInterval=null),null!==this.portalEl){window.removeEventListener("popstate",this.handleSpaNavigation,!0),window.removeEventListener("hashchange",this.handleSpaNavigation,!0);try{this.portalEl.parentNode&&this.portalEl.parentNode.removeChild(this.portalEl)}catch(t){console.warn("Portal element could not be removed from DOM:",t)}this.portalEl=null}null!==this.triggerEl&&this.triggerEl.removeAttribute("aria-describedby"),this.contentDiv=null}render(){return i(r,{key:"e80abb11248d9bf6aec1ae738c61692594975630",id:this.componentId||void 0,class:{"pds-tooltip--is-open":this.opened}},i("span",{key:"9ff484925a1792302eee230a5c37a0268d536935",class:"pds-tooltip__trigger",onMouseEnter:this.handleShow,onMouseLeave:this.handleHide,onFocusin:this.handleShow,onFocusout:this.handleHide,ref:t=>this.triggerEl=t},i("slot",{key:"738c314a816e82fd81a0c0e9895d51af45b75eb2"})),i("div",{key:"5b0477cd433cae0b53c4d5ce5767dc703be28ee0",class:"pds-tooltip__content-slot-wrapper",hidden:!0},i("slot",{key:"51ad497357c1d1547bba69d07fd7fa1b675c021f",name:"content"})))}get el(){return this}static get watchers(){return{opened:[{handleOpenToggle:0}]}}static get style(){return'.pds-tooltip{--tooltip-border-width-arrow-down:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-left:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-right:var(--tooltip-sizing-arrow) 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-border-width-arrow-up:0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-sizing-arrow:6px;--tooltip-sizing-arrow-offset:14px;--tooltip-dimension-max-width:320px}.pds-tooltip__content{background-color:var(--pine-color-primary);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);color:var(--pine-color-text-primary);max-width:var(--tooltip-dimension-max-width);opacity:0;padding:var(--pine-dimension-xs) calc(var(--pine-dimension-md) / 2);position:relative;visibility:hidden;width:-webkit-max-content;width:-moz-max-content;width:max-content}.pds-tooltip--is-open .pds-tooltip__content{opacity:1;visibility:visible;z-index:var(--pine-z-index-raised)}.pds-tooltip.pds-tooltip--has-html-content .pds-tooltip__content{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.pds-tooltip__content::after{border-color:transparent;border-right-color:transparent;border-style:solid;border-width:var(--tooltip-border-width-arrow-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);bottom:var(--tooltip-sizing-arrow-offset);left:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:50%;top:initial;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--top-start .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:initial;right:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);bottom:var(--tooltip-sizing-arrow-offset);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:50%;top:calc(var(--tooltip-sizing-arrow) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:initial;right:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}'}},[260,"pds-tooltip",{content:[1],componentId:[1,"component-id"],hasArrow:[4,"has-arrow"],htmlContent:[4,"html-content"],placement:[513],maxWidth:[1,"max-width"],opened:[1540],_isInteractiveOpen:[32],showTooltip:[64],hideTooltip:[64]},void 0,{opened:[{handleOpenToggle:0}]}]);h.instanceCounter=0;const d=h,c=function(){"undefined"!=typeof customElements&&["pds-tooltip"].forEach((t=>{"pds-tooltip"===t&&(customElements.get(s(t))||customElements.define(s(t),h))}))};export{d as PdsTooltip,c as defineCustomElement}

package/components/reflected-attribute-default.js

@@ -0,0 +1 @@
+function n(n,r,l,t){return null==l||!1===l&&!n.hasAttribute(r)?(!1!==t&&null!=t&&n.setAttribute(r,!0===t?"":String(t)),t):l}export{n as r}

package/dist/cjs/attributes-DXvaSETR.js

@@ -0,0 +1,178 @@
+'use strict';
+
+var keepHydrated = require('./keep-hydrated-iLS88j1Z.js');
+
+/**
+ * Sets each attribute whose current value differs, and leaves the rest alone. A `MutationObserver`
+ * that calls this to restore attributes sees its own writes once and then settles, so it can't loop.
+ * @param el - Element to write to
+ * @param attributes - Attribute names and the values they should have
+ */
+const setAttributesIfChanged = (el, attributes) => {
+    Object.entries(attributes).forEach(([name, value]) => {
+        if (el.getAttribute(name) !== value)
+            el.setAttribute(name, value);
+    });
+};
+/**
+ * Puts back any of `expected`'s classes or style properties that are missing from `el`. It only
+ * adds what's missing, never rewrites a value that's there, because browsers normalize some style
+ * values (`flex: 1` reads back as `1 1 0%`): comparing values would rewrite them forever.
+ * @param el - Host element
+ * @param expected - Classes and style properties the component rendered
+ */
+const restoreHostStyling = (el, { classes, styles }) => {
+    const missing = classes.filter((name) => !el.classList.contains(name));
+    if (missing.length > 0)
+        el.classList.add(...missing);
+    Object.entries(styles).forEach(([name, value]) => {
+        if (value && el.style.getPropertyValue(name) === '')
+            el.style.setProperty(name, value);
+    });
+};
+/**
+ * Watches a component's own host and puts back what it rendered when something strips it. A DOM
+ * morph does: it makes the host match the server's HTML, which carries the component's props but not
+ * the classes, styles and attributes it wrote, and Stencil won't write them again because it diffs
+ * against its previous render, not the live DOM.
+ *
+ * It also means a script that removes one of these on purpose sees it come back: change them through
+ * the component's props instead.
+ * @param el - Host element
+ * @param expected - Reads what the component last rendered
+ * @returns The observer, to disconnect when the component is removed; `null` without MutationObserver
+ */
+const keepHostStyling = (el, expected) => {
+    if (typeof MutationObserver === 'undefined')
+        return null;
+    const observer = new MutationObserver((records) => {
+        const styling = expected();
+        // A strip takes Stencil's own classes too: without `hydrated` Stencil hides the component, and
+        // without its scope classes a scoped component's CSS stops matching. Put back only the ones that
+        // were there, so this never runs ahead of Stencil. `keepPineHydrated` does the same for every
+        // component, but the custom-elements build only runs it if the consumer calls it, so keep this.
+        const stencilClasses = records
+            .filter((record) => record.attributeName === 'class' && record.oldValue != null)
+            .flatMap((record) => keepHydrated.classNamesOf(record.oldValue).filter((name) => keepHydrated.isStencilClass(el, name)));
+        restoreHostStyling(el, Object.assign(Object.assign({}, styling), { classes: [...styling.classes, ...stencilClasses] }));
+        // An attribute the component still renders comes back with the value it had, which is what
+        // Stencil wrote (a boolean `true` lands as an empty value). One it stopped rendering stays
+        // removed, since that was Stencil's own write.
+        records.forEach(({ attributeName: name, oldValue }) => {
+            var _a;
+            const rendered = (_a = styling.attributes) === null || _a === void 0 ? void 0 : _a[name];
+            if (oldValue == null || rendered == null || rendered === false || el.hasAttribute(name))
+                return;
+            el.setAttribute(name, oldValue);
+        });
+    });
+    observer.observe(el, { attributes: true, attributeOldValue: true });
+    return observer;
+};
+/**
+ * Inherit attributes from the host element
+ * @param el - Host element
+ * @param attributes - Array of attributes to inherit
+ */
+const inheritAttributes = (el, attributes = []) => {
+    const attributeObject = {};
+    attributes.forEach((attr) => {
+        if (el.hasAttribute(attr)) {
+            const value = el.getAttribute(attr);
+            if (value !== null) {
+                attributeObject[attr] = el.getAttribute(attr);
+            }
+            el.removeAttribute(attr);
+        }
+    });
+    return attributeObject;
+};
+/**
+ * List of available ARIA attributes + `role`.
+ * Removed deprecated attributes.
+ * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes
+ */
+const ariaAttributes = [
+    'role',
+    'aria-activedescendant',
+    'aria-atomic',
+    'aria-autocomplete',
+    'aria-braillelabel',
+    'aria-brailleroledescription',
+    'aria-busy',
+    'aria-checked',
+    'aria-colcount',
+    'aria-colindex',
+    'aria-colindextext',
+    'aria-colspan',
+    'aria-controls',
+    'aria-current',
+    'aria-describedby',
+    'aria-description',
+    'aria-details',
+    'aria-disabled',
+    'aria-errormessage',
+    'aria-expanded',
+    'aria-flowto',
+    'aria-haspopup',
+    'aria-hidden',
+    'aria-invalid',
+    'aria-keyshortcuts',
+    'aria-label',
+    'aria-labelledby',
+    'aria-level',
+    'aria-live',
+    'aria-multiline',
+    'aria-multiselectable',
+    'aria-orientation',
+    'aria-owns',
+    'aria-placeholder',
+    'aria-posinset',
+    'aria-pressed',
+    'aria-readonly',
+    'aria-relevant',
+    'aria-required',
+    'aria-roledescription',
+    'aria-rowcount',
+    'aria-rowindex',
+    'aria-rowindextext',
+    'aria-rowspan',
+    'aria-selected',
+    'aria-setsize',
+    'aria-sort',
+    'aria-valuemax',
+    'aria-valuemin',
+    'aria-valuenow',
+    'aria-valuetext',
+];
+const inheritAriaAttributes = (el, ignoreList) => {
+    let attributesToInherit = ariaAttributes;
+    return inheritAttributes(el, attributesToInherit);
+};
+/**
+ * One component's use of `keepHostStyling`: `record` what `render()` puts on the host, `connect` in
+ * `connectedCallback` and `disconnect` in `disconnectedCallback`.
+ */
+class HostStylingKeeper {
+    constructor() {
+        this.styling = { classes: [], styles: {} };
+        this.observer = null;
+    }
+    record(classes, styles = {}, attributes = {}) {
+        this.styling = { classes: keepHydrated.classNamesOf(classes), styles, attributes };
+    }
+    connect(el) {
+        var _a;
+        (_a = this.observer) !== null && _a !== void 0 ? _a : (this.observer = keepHostStyling(el, () => this.styling));
+    }
+    disconnect() {
+        var _a;
+        (_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
+        this.observer = null;
+    }
+}
+
+exports.HostStylingKeeper = HostStylingKeeper;
+exports.inheritAriaAttributes = inheritAriaAttributes;
+exports.inheritAttributes = inheritAttributes;
+exports.setAttributesIfChanged = setAttributesIfChanged;

package/dist/cjs/{index-D8Gl0bIB.js → index-BQjWfQXw.js}

@@ -1,9 +1,18 @@
 'use strict';
 
+var keepHydrated = require('./keep-hydrated-iLS88j1Z.js');
+
 const NAMESPACE = 'pine-core';
 const BUILD = /* pine-core */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, propChangeCallback: true, slotRelocation: true, state: true, updatable: true};
 
-const globalScripts = () => {};
+// Stencil runs this when the loader loads, before any component is defined, and again for each
+// server-rendered document, where it does nothing.
+var pineGlobal = () => {
+    keepHydrated.keepPineHydrated();
+};
+
+const appGlobalScript = pineGlobal || (() => {});
+const globalScripts = appGlobalScript;
 const globalStyles = ":root{--pine-border-width-none:0px;--pine-border-width-thin:1px;--pine-border-width-thick:2px;--pine-border-width:var(--pine-border-width-thin);--pine-box-shadow-100:0 1px 3px 0 rgba(0,0,0,.1), 0 1px 2px 0 rgba(0,0,0,.06);--pine-box-shadow-150:0 4px 8px -2px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.06);--pine-box-shadow-200:0 12px 16px -4px rgba(0,0,0,.08), 0 4px 6px -2px rgba(0,0,0,.03);--pine-box-shadow-300:0 20px 24px -4px rgba(0,0,0,.08), 0 8px 8px -4px rgba(0,0,0,.03);--pine-box-shadow-400:0 24px 48px -12px rgba(0,0,0,.18);--pine-box-shadow-500:0 32px 64px -12px rgba(0,0,0,.14);--pine-box-shadow-050:0 1px 2px 0 rgba(0,0,0,.05);--pine-box-shadow:var(--pine-box-shadow-100);--pine-color-white:#ffffff;--pine-color-black:#000000;--pine-color-grey-100:#f8f8f8;--pine-color-grey-150:#f0f0f0;--pine-color-grey-200:#e4e4e4;--pine-color-grey-300:#d2d1d1;--pine-color-grey-400:#bbbab9;--pine-color-grey-500:#9b9a98;--pine-color-grey-600:#828180;--pine-color-grey-700:#6c6a69;--pine-color-grey-800:#4d4d4c;--pine-color-grey-900:#343332;--pine-color-grey-950:#1a1a19;--pine-color-grey-050:#fcfcfc;--pine-color-blue-100:#eff6ff;--pine-color-blue-150:#dbeafe;--pine-color-blue-200:#bfdbfe;--pine-color-blue-300:#93c5fd;--pine-color-blue-400:#60a5fa;--pine-color-blue-500:#3b82f6;--pine-color-blue-600:#2563eb;--pine-color-blue-700:#1d4ed8;--pine-color-blue-800:#1e40af;--pine-color-blue-900:#1e3a8a;--pine-color-blue-950:#172554;--pine-color-blue-050:#fafcff;--pine-color-green-100:#edfcf2;--pine-color-green-150:#d3f8df;--pine-color-green-200:#aaf0c4;--pine-color-green-300:#73e2a3;--pine-color-green-400:#3ccb7f;--pine-color-green-500:#16b364;--pine-color-green-600:#099250;--pine-color-green-700:#087443;--pine-color-green-800:#095c37;--pine-color-green-900:#084c2e;--pine-color-green-950:#052e1c;--pine-color-green-050:#fbfefc;--pine-color-red-100:#fef2f2;--pine-color-red-150:#fee2e2;--pine-color-red-200:#fecaca;--pine-color-red-300:#fca5a5;--pine-color-red-400:#f87171;--pine-color-red-500:#ef4444;--pine-color-red-600:#dc2626;--pine-color-red-700:#b91c1c;--pine-color-red-800:#991b1b;--pine-color-red-900:#7f1d1d;--pine-color-red-950:#450a0a;--pine-color-red-050:#fffafa;--pine-color-yellow-100:#fffbeb;--pine-color-yellow-150:#fff2c6;--pine-color-yellow-200:#fee589;--pine-color-yellow-300:#fed04b;--pine-color-yellow-400:#fdbb21;--pine-color-yellow-500:#f79a09;--pine-color-yellow-600:#db7204;--pine-color-yellow-700:#b64f07;--pine-color-yellow-800:#933d0d;--pine-color-yellow-900:#79330e;--pine-color-yellow-950:#461902;--pine-color-yellow-050:#fffefa;--pine-color-mercury-100:#fff4f1;--pine-color-mercury-150:#ffeae5;--pine-color-mercury-200:#fed4cd;--pine-color-mercury-300:#fdb1a4;--pine-color-mercury-400:#fb8271;--pine-color-mercury-500:#ff3e14;--pine-color-mercury-600:#f02006;--pine-color-mercury-700:#c71307;--pine-color-mercury-800:#9e110e;--pine-color-mercury-900:#7f120f;--pine-color-mercury-950:#450506;--pine-color-mercury-050:#fffbfa;--pine-color-purple-100:#eef1ff;--pine-color-purple-150:#e0e4ff;--pine-color-purple-200:#c7cdfe;--pine-color-purple-300:#a4acfd;--pine-color-purple-400:#8081f9;--pine-color-purple-500:#6b62f2;--pine-color-purple-600:#533be5;--pine-color-purple-700:#4f37cb;--pine-color-purple-800:#402fa4;--pine-color-purple-900:#372d82;--pine-color-purple-950:#221b4b;--pine-color-purple-050:#fafbff;--pine-color-forest-100:#effaf6;--pine-color-forest-150:#d9f2e7;--pine-color-forest-200:#b5e5d2;--pine-color-forest-300:#85d0b7;--pine-color-forest-400:#52b597;--pine-color-forest-500:#30997d;--pine-color-forest-600:#23856d;--pine-color-forest-700:#1a6253;--pine-color-forest-800:#174e43;--pine-color-forest-900:#144038;--pine-color-forest-950:#0a2420;--pine-color-forest-050:#fbfefd;--pine-color-lime-100:#f7fee7;--pine-color-lime-150:#ecfccb;--pine-color-lime-200:#d9f99d;--pine-color-lime-300:#bef264;--pine-color-lime-400:#a3e635;--pine-color-lime-500:#84cc16;--pine-color-lime-600:#65a30d;--pine-color-lime-700:#4d7c0f;--pine-color-lime-800:#3f6212;--pine-color-lime-900:#365314;--pine-color-lime-950:#1b290a;--pine-color-lime-050:#fdfffa;--pine-color-magenta-100:#fdf4ff;--pine-color-magenta-150:#fae8ff;--pine-color-magenta-200:#f5d0fe;--pine-color-magenta-300:#f0abfc;--pine-color-magenta-400:#e879f9;--pine-color-magenta-500:#d946ef;--pine-color-magenta-600:#c026d3;--pine-color-magenta-700:#a21caf;--pine-color-magenta-800:#86198f;--pine-color-magenta-900:#701a75;--pine-color-magenta-950:#4a044e;--pine-color-magenta-050:#fefaff;--pine-color-pink-100:#fdf2f8;--pine-color-pink-150:#fce7f3;--pine-color-pink-200:#fbcfe8;--pine-color-pink-300:#f9a8d4;--pine-color-pink-400:#f472b6;--pine-color-pink-500:#ec4899;--pine-color-pink-600:#db2777;--pine-color-pink-700:#be185d;--pine-color-pink-800:#9d174d;--pine-color-pink-900:#831843;--pine-color-pink-950:#500724;--pine-color-pink-050:#fffafa;--pine-color-salmon-100:#fff1f2;--pine-color-salmon-150:#ffe4e6;--pine-color-salmon-200:#fecdd3;--pine-color-salmon-300:#fda4af;--pine-color-salmon-400:#fb7185;--pine-color-salmon-500:#f43f5e;--pine-color-salmon-600:#e11d48;--pine-color-salmon-700:#be123c;--pine-color-salmon-800:#9f1239;--pine-color-salmon-900:#881337;--pine-color-salmon-950:#4c0519;--pine-color-salmon-050:#fffafa;--pine-color-sky-100:#f0f9ff;--pine-color-sky-150:#e0f2fe;--pine-color-sky-200:#bae6fd;--pine-color-sky-300:#7dd3fc;--pine-color-sky-400:#38bdf8;--pine-color-sky-500:#0ea5e9;--pine-color-sky-600:#0284c7;--pine-color-sky-700:#0369a1;--pine-color-sky-800:#075985;--pine-color-sky-900:#0c4a6e;--pine-color-sky-950:#082f49;--pine-color-sky-050:#fafdff;--pine-color-teal-100:#f0fdfa;--pine-color-teal-150:#ccfbf1;--pine-color-teal-200:#99f6e4;--pine-color-teal-300:#5eead4;--pine-color-teal-400:#2dd4bf;--pine-color-teal-500:#14b8a6;--pine-color-teal-600:#0d9488;--pine-color-teal-700:#0f766e;--pine-color-teal-800:#115e59;--pine-color-teal-900:#134e4a;--pine-color-teal-950:#042f2e;--pine-color-teal-050:#fbfefe;--pine-color-accent:var(--pine-color-grey-900);--pine-color-accent-disabled:var(--pine-color-grey-150);--pine-color-accent-hover:var(--pine-color-grey-950);--pine-color-background-app:var(--pine-color-grey-100);--pine-color-background-subtle:var(--pine-color-grey-100);--pine-color-background-muted:var(--pine-color-grey-150);--pine-color-background-inverse-app:var(--pine-color-grey-900);--pine-color-background-inverse-subtle:var(--pine-color-grey-800);--pine-color-background-inverse-muted:var(--pine-color-grey-700);--pine-color-background-inverse-container:var(--pine-color-black);--pine-color-background-inverse-inset:var(--pine-color-grey-950);--pine-color-background-container:var(--pine-color-white);--pine-color-background-container-disabled:var(--pine-color-grey-150);--pine-color-background-container-hover:var(--pine-color-grey-050);--pine-color-background-inset:var(--pine-color-grey-200);--pine-color-background-inset-emphasized:var(--pine-color-grey-300);--pine-color-background-overlay:var(--pine-color-white);--pine-color-border:var(--pine-color-grey-300);--pine-color-border-hover:var(--pine-color-grey-400);--pine-color-border-disabled:var(--pine-color-grey-200);--pine-color-border-active:var(--pine-color-grey-400);--pine-color-border-danger:var(--pine-color-red-600);--pine-color-border-danger-hover:var(--pine-color-red-700);--pine-color-border-subtle:var(--pine-color-grey-200);--pine-color-danger:var(--pine-color-red-600);--pine-color-danger-disabled:var(--pine-color-red-100);--pine-color-danger-hover:var(--pine-color-red-700);--pine-color-focus-ring:var(--pine-color-grey-400);--pine-color-focus-ring-danger:var(--pine-color-red-300);--pine-color-info:var(--pine-color-blue-500);--pine-color-info-disabled:var(--pine-color-blue-100);--pine-color-info-hover:var(--pine-color-blue-600);--pine-color-neutral:var(--pine-color-grey-500);--pine-color-neutral-disabled:var(--pine-color-grey-100);--pine-color-neutral-hover:var(--pine-color-grey-600);--pine-color-primary:var(--pine-color-grey-900);--pine-color-primary-disabled:var(--pine-color-grey-150);--pine-color-primary-hover:var(--pine-color-grey-950);--pine-color-secondary:var(--pine-color-white);--pine-color-secondary-disabled:var(--pine-color-white);--pine-color-secondary-hover:var(--pine-color-grey-050);--pine-color-success:var(--pine-color-green-500);--pine-color-success-disabled:var(--pine-color-green-100);--pine-color-success-hover:var(--pine-color-green-600);--pine-color-text:var(--pine-color-grey-900);--pine-color-text-hover:var(--pine-color-grey-950);--pine-color-text-disabled:var(--pine-color-grey-500);--pine-color-text-readonly:var(--pine-color-grey-700);--pine-color-text-active:var(--pine-color-grey-950);--pine-color-text-accent:var(--pine-color-grey-900);--pine-color-text-accent-disabled:var(--pine-color-grey-400);--pine-color-text-accent-hover:var(--pine-color-grey-950);--pine-color-text-danger:var(--pine-color-red-900);--pine-color-text-danger-disabled:var(--pine-color-red-300);--pine-color-text-danger-hover:var(--pine-color-red-950);--pine-color-text-info:var(--pine-color-blue-900);--pine-color-text-info-disabled:var(--pine-color-blue-300);--pine-color-text-info-hover:var(--pine-color-blue-950);--pine-color-text-label:var(--pine-color-grey-950);--pine-color-text-label-disabled:var(--pine-color-grey-500);--pine-color-text-label-readonly:var(--pine-color-grey-700);--pine-color-text-message:var(--pine-color-grey-800);--pine-color-text-message-danger:var(--pine-color-red-600);--pine-color-text-message-disabled:var(--pine-color-grey-600);--pine-color-text-neutral:var(--pine-color-grey-900);--pine-color-text-neutral-disabled:var(--pine-color-grey-600);--pine-color-text-neutral-hover:var(--pine-color-grey-950);--pine-color-text-placeholder:var(--pine-color-grey-600);--pine-color-text-placeholder-disabled:var(--pine-color-grey-400);--pine-color-text-primary:var(--pine-color-white);--pine-color-text-primary-disabled:var(--pine-color-grey-400);--pine-color-text-secondary:var(--pine-color-grey-800);--pine-color-text-secondary-disabled:var(--pine-color-grey-400);--pine-color-text-secondary-hover:var(--pine-color-grey-900);--pine-color-text-tertiary:var(--pine-color-grey-600);--pine-color-text-tertiary-disabled:var(--pine-color-grey-400);--pine-color-text-subtle:var(--pine-color-grey-500);--pine-color-text-subtle-disabled:var(--pine-color-grey-300);--pine-color-text-muted:var(--pine-color-grey-700);--pine-color-text-muted-disabled:var(--pine-color-grey-500);--pine-color-text-strong:var(--pine-color-grey-950);--pine-color-text-strong-disabled:var(--pine-color-grey-600);--pine-color-text-emphasis:var(--pine-color-black);--pine-color-text-inverse:var(--pine-color-grey-100);--pine-color-text-inverse-secondary:var(--pine-color-grey-150);--pine-color-text-inverse-tertiary:var(--pine-color-grey-300);--pine-color-text-inverse-emphasis:var(--pine-color-white);--pine-color-text-success:var(--pine-color-green-900);--pine-color-text-success-disabled:var(--pine-color-green-300);--pine-color-text-success-hover:var(--pine-color-green-950);--pine-color-text-warning:var(--pine-color-yellow-900);--pine-color-text-warning-disabled:var(--pine-color-yellow-300);--pine-color-text-warning-hover:var(--pine-color-yellow-950);--pine-color-warning:var(--pine-color-yellow-500);--pine-color-warning-disabled:var(--pine-color-yellow-100);--pine-color-warning-hover:var(--pine-color-yellow-600);--pine-color-icon:var(--pine-color-grey-700);--pine-color-icon-subtle:var(--pine-color-grey-500);--pine-color-icon-disabled:var(--pine-color-grey-400);--pine-color-icon-inverse:var(--pine-color-white);--pine-color-brand:var(--pine-color-black);--pine-font-family-inter:\"Inter\", system-ui, \"Segoe UI\", \"Roboto\", \"Ubuntu\", sans-serif;--pine-font-family-faire-sprig:\"FAIRE Sprig\";--pine-font-family-heading:var(--pine-font-family-inter);--pine-font-family-body:var(--pine-font-family-inter);--pine-font-size-100:14px;--pine-font-size-116:16px;--pine-font-size-128:18px;--pine-font-size-142:20px;--pine-font-size-157:22px;--pine-font-size-171:24px;--pine-font-size-185:26px;--pine-font-size-200:28px;--pine-font-size-214:30px;--pine-font-size-228:32px;--pine-font-size-242:34px;--pine-font-size-257:36px;--pine-font-size-271:38px;--pine-font-size-285:40px;--pine-font-size-057:8px;--pine-font-size-071:10px;--pine-font-size-085:12px;--pine-font-size:var(--pine-font-size-100);--pine-font-size-body-2xs:var(--pine-font-size-057);--pine-font-size-body-xs:var(--pine-font-size-071);--pine-font-size-body-sm:var(--pine-font-size-085);--pine-font-size-body-md:var(--pine-font-size-100);--pine-font-size-body-lg:var(--pine-font-size-116);--pine-font-size-body-xl:var(--pine-font-size-128);--pine-font-size-body-2xl:var(--pine-font-size-142);--pine-font-size-heading-1:var(--pine-font-size-200);--pine-font-size-heading-2:var(--pine-font-size-185);--pine-font-size-heading-3:var(--pine-font-size-157);--pine-font-size-heading-4:var(--pine-font-size-142);--pine-font-size-heading-5:var(--pine-font-size-128);--pine-font-size-heading-6:var(--pine-font-size-116);--pine-font-size-heading-caption:var(--pine-font-size-085);--pine-font-weight-100:100;--pine-font-weight-200:200;--pine-font-weight-300:300;--pine-font-weight-400:400;--pine-font-weight-500:500;--pine-font-weight-600:600;--pine-font-weight-700:700;--pine-font-weight-800:800;--pine-font-weight-900:900;--pine-font-weight-thin:var(--pine-font-weight-100);--pine-font-weight-extra-light:var(--pine-font-weight-200);--pine-font-weight-light:var(--pine-font-weight-300);--pine-font-weight-regular:var(--pine-font-weight-400);--pine-font-weight-medium:var(--pine-font-weight-500);--pine-font-weight-semi-bold:var(--pine-font-weight-600);--pine-font-weight-bold:var(--pine-font-weight-700);--pine-font-weight-extra-bold:var(--pine-font-weight-800);--pine-font-weight-heavy:var(--pine-font-weight-900);--pine-font-weight-text-message:var(--pine-font-weight-400);--pine-line-height-100:1;--pine-line-height-125:1.25;--pine-line-height-150:1.5;--pine-line-height-175:1.75;--pine-line-height-200:2;--pine-line-height-225:2.25;--pine-line-height-250:2.5;--pine-line-height-275:2.75;--pine-line-height-300:3;--pine-line-height-025:.625;--pine-line-height-050:.78125;--pine-line-height-075:.9375;--pine-line-height-text-message:var(--pine-line-height-125);--pine-line-height-heading:var(--pine-line-height-125);--pine-line-height-body:1.425;--pine-dimension-0:0px;--pine-dimension-100:8px;--pine-dimension-125:10px;--pine-dimension-150:12px;--pine-dimension-200:16px;--pine-dimension-250:20px;--pine-dimension-300:24px;--pine-dimension-350:28px;--pine-dimension-400:32px;--pine-dimension-450:36px;--pine-dimension-500:40px;--pine-dimension-550:44px;--pine-dimension-600:48px;--pine-dimension-650:52px;--pine-dimension-700:56px;--pine-dimension-750:60px;--pine-dimension-800:64px;--pine-dimension-050:4px;--pine-dimension-025:2px;--pine-dimension-none:var(--pine-dimension-0);--pine-dimension-2xs:var(--pine-dimension-050);--pine-dimension-xs:var(--pine-dimension-100);--pine-dimension-sm:var(--pine-dimension-200);--pine-dimension-md:var(--pine-dimension-300);--pine-dimension-lg:var(--pine-dimension-400);--pine-dimension-xl:var(--pine-dimension-500);--pine-dimension-2xl:var(--pine-dimension-600);--pine-letter-spacing-0:0px;--pine-letter-spacing-100:.14px;--pine-letter-spacing-114:.16px;--pine-letter-spacing-128:.18px;--pine-letter-spacing-142:.2px;--pine-letter-spacing-157:.22px;--pine-letter-spacing-171:.24px;--pine-letter-spacing-185:.26px;--pine-letter-spacing-078:.11px;--pine-letter-spacing-085:.12px;--pine-letter-spacing-n065:-.65px;--pine-letter-spacing-n070:-.7px;--pine-letter-spacing:var(--pine-letter-spacing-0);--pine-letter-spacing-heading-1:var(--pine-letter-spacing-n070);--pine-letter-spacing-heading-2:var(--pine-letter-spacing-n065);--pine-letter-spacing-heading-3:var(--pine-letter-spacing-0);--pine-letter-spacing-heading-4:var(--pine-letter-spacing-0);--pine-letter-spacing-heading-5:var(--pine-letter-spacing-0);--pine-letter-spacing-heading-6:var(--pine-letter-spacing-0);--pine-motion-duration-none:0ms;--pine-motion-duration-fast:.12s;--pine-motion-duration-base:.2s;--pine-motion-duration-slow:.3s;--pine-motion-easing-out:cubic-bezier(0, 0, .2, 1);--pine-motion-easing-in:cubic-bezier(.4, 0, 1, 1);--pine-motion-easing-in-out:cubic-bezier(.4, 0, .2, 1);--pine-z-index-0:0;--pine-z-index-1:1000;--pine-z-index-2:2000;--pine-z-index-3:3000;--pine-z-index-4:4000;--pine-z-index-5:5000;--pine-z-index-6:6000;--pine-z-index-8:8000;--pine-z-index-9:9000;--pine-z-index-n1:-1;--pine-z-index:var(--pine-z-index-0);--pine-z-index-hide:var(--pine-z-index-n1);--pine-z-index-raised:var(--pine-z-index-1);--pine-z-index-alert:var(--pine-z-index-2);--pine-z-index-underlay:var(--pine-z-index-3);--pine-z-index-navigation:var(--pine-z-index-4);--pine-z-index-overlay:var(--pine-z-index-5);--pine-z-index-modal:var(--pine-z-index-6);--pine-z-index-priority:var(--pine-z-index-8);--pine-z-index-nuclear:var(--pine-z-index-9);--pine-border:var(--pine-border-width-thin) solid var(--pine-color-grey-300);--pine-border-hover:var(--pine-border-width-thin) solid var(--pine-color-grey-400);--pine-border-none:var(--pine-border-width-none) solid var(--pine-color-grey-300);--pine-border-radius-sm:var(--pine-dimension-050);--pine-border-radius-md:var(--pine-dimension-125);--pine-border-radius-lg:var(--pine-dimension-200);--pine-border-radius-full:9999px;--pine-typography-heading-1:var(--pine-font-weight-semi-bold) var(--pine-font-size-heading-1)/var(--pine-line-height-heading) var(--pine-font-family-inter);--pine-typography-heading-2:var(--pine-font-weight-semi-bold) var(--pine-font-size-heading-2)/var(--pine-line-height-heading) var(--pine-font-family-inter);--pine-typography-heading-3:var(--pine-font-weight-semi-bold) var(--pine-font-size-heading-3)/var(--pine-line-height-heading) var(--pine-font-family-inter);--pine-typography-heading-4:var(--pine-font-weight-semi-bold) var(--pine-font-size-heading-4)/var(--pine-line-height-heading) var(--pine-font-family-inter);--pine-typography-heading-5:var(--pine-font-weight-medium) var(--pine-font-size-heading-5)/var(--pine-line-height-heading) var(--pine-font-family-inter);--pine-typography-heading-6:var(--pine-font-weight-medium) var(--pine-font-size-heading-6)/var(--pine-line-height-heading) var(--pine-font-family-inter);--pine-typography-heading-caption:var(--pine-font-weight-semi-bold) var(--pine-font-size-heading-caption)/var(--pine-line-height-heading) var(--pine-font-family-inter);--pine-typography-body:var(--pine-font-weight-regular) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-medium:var(--pine-font-weight-medium) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-mono:var(--pine-font-weight-medium) var(--pine-font-size-body-md)/var(--pine-line-height-body) monospace;--pine-typography-body-semi-bold:var(--pine-font-weight-semi-bold) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-bold:var(--pine-font-weight-bold) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-brand-label:var(--pine-font-weight-medium) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-brand-text:var(--pine-font-weight-medium) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-faire-sprig);--pine-typography-body-sm:var(--pine-font-weight-regular) var(--pine-font-size-body-sm)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-sm-medium:var(--pine-font-weight-medium) var(--pine-font-size-body-sm)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-sm-mono:var(--pine-font-weight-medium) var(--pine-font-size-body-sm)/var(--pine-line-height-body) monospace;--pine-typography-body-sm-bold:var(--pine-font-weight-bold) var(--pine-font-size-body-sm)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-sm-brand-label:var(--pine-font-weight-medium) var(--pine-font-size-body-sm)/var(--pine-line-height-body) var(--pine-font-family-inter);--pine-typography-body-sm-brand-text:var(--pine-font-weight-medium) var(--pine-font-size-body-sm)/var(--pine-line-height-body) var(--pine-font-family-faire-sprig);--pine-outline-focus:var(--pine-border-width-thick) solid var(--pine-color-focus-ring);--pine-outline-focus-danger:var(--pine-border-width-thick) solid var(--pine-color-focus-ring-danger)}@media (prefers-reduced-motion: reduce){:root{--pine-motion-duration-fast:0ms;--pine-motion-duration-base:0ms;--pine-motion-duration-slow:0ms}}[data-theme=dark]{--pine-color-accent:var(--pine-color-grey-100);--pine-color-accent-disabled:var(--pine-color-grey-800);--pine-color-accent-hover:var(--pine-color-white);--pine-color-background-app:var(--pine-color-grey-900);--pine-color-background-subtle:var(--pine-color-grey-900);--pine-color-background-muted:var(--pine-color-grey-800);--pine-color-background-inverse-app:var(--pine-color-grey-100);--pine-color-background-inverse-subtle:var(--pine-color-grey-150);--pine-color-background-inverse-muted:var(--pine-color-grey-200);--pine-color-background-inverse-container:var(--pine-color-white);--pine-color-background-inverse-inset:var(--pine-color-grey-050);--pine-color-background-container:var(--pine-color-black);--pine-color-background-container-disabled:var(--pine-color-grey-800);--pine-color-background-container-hover:var(--pine-color-grey-950);--pine-color-background-inset:var(--pine-color-grey-700);--pine-color-background-inset-emphasized:var(--pine-color-grey-600);--pine-color-background-overlay:var(--pine-color-grey-900);--pine-color-border:var(--pine-color-grey-600);--pine-color-border-hover:var(--pine-color-grey-500);--pine-color-border-disabled:var(--pine-color-grey-700);--pine-color-border-active:var(--pine-color-grey-500);--pine-color-border-danger:var(--pine-color-red-600);--pine-color-border-danger-hover:var(--pine-color-red-700);--pine-color-border-subtle:var(--pine-color-grey-700);--pine-color-danger:var(--pine-color-red-600);--pine-color-danger-disabled:var(--pine-color-red-900);--pine-color-danger-hover:var(--pine-color-red-700);--pine-color-focus-ring:var(--pine-color-grey-500);--pine-color-focus-ring-danger:var(--pine-color-red-300);--pine-color-info:var(--pine-color-blue-500);--pine-color-info-disabled:var(--pine-color-blue-900);--pine-color-info-hover:var(--pine-color-blue-600);--pine-color-neutral:var(--pine-color-grey-400);--pine-color-neutral-disabled:var(--pine-color-grey-900);--pine-color-neutral-hover:var(--pine-color-grey-300);--pine-color-primary:var(--pine-color-grey-100);--pine-color-primary-disabled:var(--pine-color-grey-800);--pine-color-primary-hover:var(--pine-color-white);--pine-color-secondary:var(--pine-color-black);--pine-color-secondary-disabled:var(--pine-color-black);--pine-color-secondary-hover:var(--pine-color-grey-950);--pine-color-success:var(--pine-color-green-500);--pine-color-success-disabled:var(--pine-color-green-900);--pine-color-success-hover:var(--pine-color-green-600);--pine-color-text:var(--pine-color-grey-100);--pine-color-text-hover:var(--pine-color-grey-050);--pine-color-text-disabled:var(--pine-color-grey-400);--pine-color-text-readonly:var(--pine-color-grey-200);--pine-color-text-active:var(--pine-color-grey-050);--pine-color-text-accent:var(--pine-color-grey-100);--pine-color-text-accent-disabled:var(--pine-color-grey-500);--pine-color-text-accent-hover:var(--pine-color-white);--pine-color-text-danger:var(--pine-color-red-900);--pine-color-text-danger-disabled:var(--pine-color-red-600);--pine-color-text-danger-hover:var(--pine-color-red-950);--pine-color-text-info:var(--pine-color-blue-900);--pine-color-text-info-disabled:var(--pine-color-blue-600);--pine-color-text-info-hover:var(--pine-color-blue-950);--pine-color-text-label:var(--pine-color-grey-050);--pine-color-text-label-disabled:var(--pine-color-grey-400);--pine-color-text-label-readonly:var(--pine-color-grey-200);--pine-color-text-message:var(--pine-color-grey-150);--pine-color-text-message-danger:var(--pine-color-red-500);--pine-color-text-message-disabled:var(--pine-color-grey-300);--pine-color-text-neutral:var(--pine-color-grey-100);--pine-color-text-neutral-disabled:var(--pine-color-grey-300);--pine-color-text-neutral-hover:var(--pine-color-grey-050);--pine-color-text-placeholder:var(--pine-color-grey-300);--pine-color-text-placeholder-disabled:var(--pine-color-grey-500);--pine-color-text-primary:var(--pine-color-black);--pine-color-text-primary-disabled:var(--pine-color-grey-500);--pine-color-text-secondary:var(--pine-color-grey-150);--pine-color-text-secondary-disabled:var(--pine-color-grey-500);--pine-color-text-secondary-hover:var(--pine-color-grey-100);--pine-color-text-tertiary:var(--pine-color-grey-300);--pine-color-text-tertiary-disabled:var(--pine-color-grey-500);--pine-color-text-subtle:var(--pine-color-grey-400);--pine-color-text-subtle-disabled:var(--pine-color-grey-600);--pine-color-text-muted:var(--pine-color-grey-200);--pine-color-text-muted-disabled:var(--pine-color-grey-400);--pine-color-text-strong:var(--pine-color-grey-050);--pine-color-text-strong-disabled:var(--pine-color-grey-300);--pine-color-text-emphasis:var(--pine-color-white);--pine-color-text-inverse:var(--pine-color-grey-900);--pine-color-text-inverse-secondary:var(--pine-color-grey-800);--pine-color-text-inverse-tertiary:var(--pine-color-grey-600);--pine-color-text-inverse-emphasis:var(--pine-color-black);--pine-color-text-success:var(--pine-color-green-900);--pine-color-text-success-disabled:var(--pine-color-green-600);--pine-color-text-success-hover:var(--pine-color-green-950);--pine-color-text-warning:var(--pine-color-yellow-900);--pine-color-text-warning-disabled:var(--pine-color-yellow-600);--pine-color-text-warning-hover:var(--pine-color-yellow-950);--pine-color-warning:var(--pine-color-yellow-500);--pine-color-warning-disabled:var(--pine-color-yellow-900);--pine-color-warning-hover:var(--pine-color-yellow-600);--pine-color-icon:var(--pine-color-grey-200);--pine-color-icon-subtle:var(--pine-color-grey-400);--pine-color-icon-disabled:var(--pine-color-grey-500);--pine-color-icon-inverse:var(--pine-color-grey-900);--pine-color-brand:var(--pine-color-grey-050);--pine-border:var(--pine-border-width-thin) solid var(--pine-color-grey-600);--pine-border-hover:var(--pine-border-width-thin) solid var(--pine-color-grey-400);--pine-border-none:var(--pine-border-width-none) solid var(--pine-color-grey-600);--pine-outline-focus:var(--pine-border-width-thick) solid var(--pine-color-focus-ring);--pine-outline-focus-danger:var(--pine-border-width-thick) solid var(--pine-color-focus-ring-danger)}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:100;src:local(\"Inter-Thin\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-Thin.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:100;src:local(\"Inter-ThinItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-ThinItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:200;src:local(\"Inter-ExtraLight\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-ExtraLight.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:200;src:local(\"Inter-ExtraLightItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-ExtraLightItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:300;src:local(\"Inter-Light\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-Light.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:300;src:local(\"Inter-LightItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-LightItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:400;src:local(\"Inter-Regular\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-Regular.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:400;src:local(\"Inter-Italic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-Italic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:500;src:local(\"Inter-Medium\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-Medium.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:500;src:local(\"Inter-MediumItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-MediumItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:600;src:local(\"Inter-SemiBold\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-SemiBold.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:600;src:local(\"Inter-SemiBoldItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-SemiBoldItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:700;src:local(\"Inter-Bold\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-Bold.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:700;src:local(\"Inter-BoldItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-BoldItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:800;src:local(\"Inter-ExtraBold\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-ExtraBold.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:800;src:local(\"Inter-ExtraBoldItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-ExtraBoldItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:normal;font-weight:900;src:local(\"Inter-Black\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-Black.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Inter\";font-style:italic;font-weight:900;src:local(\"Inter-BlackItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/inter/Inter-BlackItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:normal;font-weight:200;src:local(\"FAIRE-Sprig-Thin\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-Thin.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:italic;font-weight:200;src:local(\"FAIRE-Sprig-ThinItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-ThinItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:normal;font-weight:300;src:local(\"FAIRE-Sprig-Light\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-Light.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:italic;font-weight:300;src:local(\"FAIRE-Sprig-LightItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-LightItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:normal;font-weight:400;src:local(\"FAIRE-Sprig-Regular\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-Regular.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:italic;font-weight:400;src:local(\"FAIRE-Sprig-RegularItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-RegularItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:normal;font-weight:500;src:local(\"FAIRE-Sprig-Medium\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-Medium.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:italic;font-weight:500;src:local(\"FAIRE-Sprig-MediumItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-MediumItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:normal;font-weight:700;src:local(\"FAIRE-Sprig-Bold\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-Bold.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:italic;font-weight:700;src:local(\"FAIRE-Sprig-BoldItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-BoldItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:normal;font-weight:900;src:local(\"FAIRE-Sprig-Super\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-Super.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"FAIRE Sprig\";font-style:italic;font-weight:900;src:local(\"FAIRE-Sprig-SuperItalic\"), url(\"https://sage.kajabi-cdn.com/fonts/sprig/FAIRE-Sprig-SuperItalic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Noto Sans Arabic\";font-style:normal;font-weight:normal;src:local(\"Noto-Sans-Arabic\"), url(\"https://sage.kajabi-cdn.com/fonts/noto/Noto-Sans-Arabic.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Noto Sans Hebrew\";font-style:normal;font-weight:normal;src:local(\"Noto-Sans-Hebrew\"), url(\"https://sage.kajabi-cdn.com/fonts/noto/Noto-Sans-Hebrew.woff2?v=1\") format(\"woff2\")}@font-face{font-display:swap;font-family:\"Noto Sans Devanagari\";font-style:normal;font-weight:normal;src:local(\"Noto-Sans-Devanagari\"), url(\"https://sage.kajabi-cdn.com/fonts/noto/Noto-Sans-Devanagari.woff2?v=1\") format(\"woff2\")}:root{--pine-motion-duration-fast:120ms;--pine-motion-duration-base:200ms;--pine-motion-duration-slow:300ms;--pine-motion-easing-out:cubic-bezier(0, 0, 0.2, 1);--pine-motion-easing-in:cubic-bezier(0.4, 0, 1, 1);--pine-motion-easing-in-out:cubic-bezier(0.4, 0, 0.2, 1)}@media (prefers-reduced-motion: reduce){:root{--pine-motion-duration-fast:0ms;--pine-motion-duration-base:0ms;--pine-motion-duration-slow:0ms}}[hidden]{display:none !important}";
 
 /*

package/dist/cjs/index.cjs.js

@@ -1,5 +1,7 @@
 'use strict';
 
+var keepHydrated = require('./keep-hydrated-iLS88j1Z.js');
+
 // Single source of truth for `pds-text` `size` values. The `as const` tuple is
 // readable at runtime (for validation) and `TextSizeType` is derived from it,
 // so the supported list and the prop type cannot drift apart.
@@ -19,4 +21,5 @@ const TEXT_SIZES = [
     'h6',
 ];
 
+exports.keepPineHydrated = keepHydrated.keepPineHydrated;
 exports.TEXT_SIZES = TEXT_SIZES;

package/dist/cjs/keep-hydrated-iLS88j1Z.js

@@ -0,0 +1,67 @@
+'use strict';
+
+/**
+ * Whether a class is one Stencil itself puts on a host: its default `hydratedFlag` (Pine doesn't
+ * change it), or a scoped component's own scope classes (`sc-pds-radio`, `sc-pds-radio-h`,
+ * `sc-pds-radio-s`), which its CSS needs. Only the host's own: another `sc-` class may be a
+ * consumer's (styled-components ids).
+ * @param el - Host element
+ * @param name - Class name
+ */
+const isStencilClass = (el, name) => {
+    const scope = `sc-${el.localName}`;
+    return name === 'hydrated' || name === scope || name === `${scope}-h` || name === `${scope}-s`;
+};
+/**
+ * The class names in a rendered `class` value: a string, or Stencil's `{ name: boolean }` form.
+ */
+const classNamesOf = (classes) => typeof classes === 'string'
+    ? classes.split(/\s+/).filter(Boolean)
+    : Object.keys(classes).filter((name) => classes[name]);
+// On the global object, not in this module, so a page with two copies of Pine (the CDN build and a
+// bundled `@pine-ds/react`) still has one observer.
+const OBSERVER = Symbol.for('@pine-ds/core/keepPineHydrated');
+/**
+ * Puts Stencil's own classes back on any Pine component that loses them. Stencil hides a component
+ * until it has `hydrated`, so a DOM morph that strips a host's `class` makes it vanish, and nothing
+ * rewrites it. One observer on the whole document covers every component, including the ones with no
+ * host restore of their own. It only restores classes the element had, so it never runs ahead of
+ * Stencil. It can't see inside shadow roots, which a morph doesn't reach either.
+ *
+ * A script that removes `hydrated` on purpose sees it come back, and one that removes it every time it
+ * appears never settles: don't strip Pine's classes from a `MutationObserver`.
+ *
+ * Pine's global script calls this, so the CDN and `dist` builds get it on load. The custom-elements
+ * build (`@pine-ds/core/components/*`, `@pine-ds/react`) has no global script: call it once yourself.
+ * Calling it again does nothing, and without `MutationObserver` (server rendering) neither does the
+ * first call.
+ */
+const keepPineHydrated = () => {
+    if (typeof MutationObserver === 'undefined' || typeof document === 'undefined')
+        return;
+    const store = globalThis;
+    if (store[OBSERVER])
+        return;
+    const observer = new MutationObserver((records) => {
+        records.forEach(({ target, oldValue }) => {
+            const el = target;
+            if (oldValue == null || !el.localName.startsWith('pds-'))
+                return;
+            const missing = classNamesOf(oldValue).filter((name) => isStencilClass(el, name) && !el.classList.contains(name));
+            if (missing.length > 0)
+                el.classList.add(...missing);
+        });
+    });
+    // The document rather than its root element, so replacing `<html>` doesn't end the watch.
+    observer.observe(document, {
+        subtree: true,
+        attributes: true,
+        attributeFilter: ['class'],
+        attributeOldValue: true,
+    });
+    store[OBSERVER] = observer;
+};
+
+exports.classNamesOf = classNamesOf;
+exports.isStencilClass = isStencilClass;
+exports.keepPineHydrated = keepPineHydrated;