@eunomia/elements 1.0.0-beta.7 → 1.0.0-beta.8

package/dist/cdn/components/eun-toggle-group.js

@@ -1,4 +1,4 @@
-import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk-YYCEPZUN.js";import{a as T}from"./chunks/chunk-3BMACIDO.js";import{a as p}from"./chunks/chunk-PPCHQG7P.js";import{a as A}from"./chunks/chunk-SD2H5UDZ.js";import{a as h}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import{a as s,b,c as w,d as y,f as k,h as _,j as c,k as E,l as x,n as C,p as d,r as v,u as I}from"./chunks/chunk-YITWLCD3.js";var B=_`
+import{a as z}from"./chunks/chunk-SMTIDNGW.js";import{a as S}from"./chunks/chunk-P6LGU3FT.js";import{a as T}from"./chunks/chunk-YYCEPZUN.js";import{a as C}from"./chunks/chunk-3BMACIDO.js";import{a as v}from"./chunks/chunk-PPCHQG7P.js";import{a as R}from"./chunks/chunk-SD2H5UDZ.js";import{a as p}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import{a as s,b,c as x,d as w,f as _,h as k,j as c,k as I,l as y,n as E,p as d,r as g,u as B}from"./chunks/chunk-YITWLCD3.js";var A=k`
   :host {
     display: inline-flex;
     width: fit-content;
@@ -11,20 +11,64 @@ import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk
       --toggle-group-arrows-color,
       var(--eun-surface-color, #ffffff)
     );
+    --_toggleDefaultRadius: var(--eun-border-radius-m, 8px);
+    --_toggleRadius: var(
+      --toggle-group-border-radius,
+      var(--_toggleDefaultRadius)
+    );
+    --_toggleFontSize: var(--eun-font-size-s, 14px);
+    --_toggleButtonPaddingBlock: var(--eun-space-s, 8px);
+    --_toggleOptionPaddingInline: calc(var(--eun-space-l, 32px) / 2);
+    --_toggleLineHeight: 1rem;
     --_trackPaddingBlock: var(
       --toggle-group-padding,
-      var(--toggle-group-padding-block, 4px)
+      var(
+        --toggle-group-padding-block,
+        calc(var(--_toggleButtonPaddingBlock) / 2)
+      )
     );
     --_trackPaddingInline: var(
       --toggle-group-padding,
       var(--toggle-group-padding-inline, 4px)
     );
+    --_toggleOptionPaddingBlock: max(
+      0px,
+      calc(var(--_toggleButtonPaddingBlock) - var(--_trackPaddingBlock))
+    );
     --_focusRoom: 0px;
     font-family: var(--eun-font-family, "Mulish", sans-serif);
-    font-size: var(--eun-font-size-s, 14px);
+    font-size: var(--_toggleFontSize);
+  }
+  :host([rounded]) {
+    --_toggleDefaultRadius: var(--eun-border-radius-xl, 999px);
+  }
+  :host([size="xs"]) {
+    --_toggleFontSize: var(--eun-font-size-xs, 10px);
+    --_toggleButtonPaddingBlock: var(--eun-space-xxs, 1.6px);
+    --_toggleOptionPaddingInline: var(--eun-space-xs, 4px);
+    --_toggleLineHeight: 10px;
+  }
+  :host([size="s"]) {
+    --_toggleFontSize: var(--eun-font-size-xs, 10px);
+    --_toggleButtonPaddingBlock: calc(var(--eun-space-s, 8px) / 2);
+    --_toggleOptionPaddingInline: var(--eun-space-s, 8px);
+    --_toggleLineHeight: 10px;
+  }
+  :host([size="l"]) {
+    --_toggleFontSize: var(--eun-font-size-m, 16px);
+    --_toggleButtonPaddingBlock: calc(var(--eun-space-s, 8px) * 1.25);
+    --_toggleOptionPaddingInline: calc(var(--eun-space-m, 16px) * 1.25);
+    --_toggleLineHeight: 1.1rem;
+  }
+  :host([size="xl"]) {
+    --_toggleFontSize: var(--eun-font-size-l, 1.3rem);
+    --_toggleButtonPaddingBlock: calc(var(--eun-space-s, 8px) * 1.5);
+    --_toggleOptionPaddingInline: calc(var(--eun-space-m, 16px) * 1.5);
+    --_toggleLineHeight: 1.3rem;
   }
   :host([appearance="outline"]),
   :host([appearance="flat"]) {
+    --_toggleOptionPaddingBlock: var(--_toggleButtonPaddingBlock);
     --_focusRoom: 4px;
     --_arrowsColor: var(
       --toggle-group-arrows-color,
@@ -52,10 +96,7 @@ import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk
     max-width: 100%;
     gap: var(--toggle-group-gap, var(--eun-space-xs, 4px));
     padding: var(--_trackPaddingBlock) var(--_trackPaddingInline);
-    border-radius: var(
-      --toggle-group-border-radius,
-      var(--eun-border-radius-m, 8px)
-    );
+    border-radius: var(--_toggleRadius);
     background: var(
       --toggle-group-background,
       var(--eun-surface-sunken, #f7f8fa)
@@ -156,9 +197,7 @@ import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk
     width: 0;
     opacity: 0;
     z-index: 0;
-    border-radius: calc(
-      var(--toggle-group-border-radius, var(--eun-border-radius-m, 8px)) - 3px
-    );
+    border-radius: calc(var(--_toggleRadius) - 3px);
     background: var(
       --toggle-group-active-background,
       var(--eun-color-primary-500, #3d6fff)
@@ -210,12 +249,12 @@ import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk
     border: none;
     background: transparent;
     color: var(--toggle-group-color, var(--eun-color-grey-600, #666e8a));
-    padding: calc(var(--eun-space-xs, 4px) * 1.5) var(--eun-space-m, 16px);
+    --icon-size: var(--_toggleLineHeight);
+    padding: var(--_toggleOptionPaddingBlock) var(--_toggleOptionPaddingInline);
+    line-height: var(--_toggleLineHeight);
     font-weight: var(--eun-font-weight-m, 500);
     outline: 2px solid transparent;
-    border-radius: calc(
-      var(--toggle-group-border-radius, var(--eun-border-radius-m, 8px)) - 3px
-    );
+    border-radius: calc(var(--_toggleRadius) - 3px);
     box-shadow: var(--_boxShadow);
     transition: var(
       --_toggleTransition,
@@ -272,7 +311,7 @@ import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk
   }
   button.icon-only {
     justify-content: center;
-    padding: 6px;
+    padding: var(--_toggleOptionPaddingBlock);
   }
 
   button[data-color="secondary"] {
@@ -293,10 +332,7 @@ import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk
   }
   :host([appearance="outline"]) button,
   :host([appearance="flat"]) button {
-    border-radius: var(
-      --toggle-group-border-radius,
-      var(--eun-border-radius-m, 8px)
-    );
+    border-radius: var(--_toggleRadius);
   }
   :host([appearance="outline"]) button {
     border: var(--eun-border-width-s, 1px) solid
@@ -324,14 +360,14 @@ import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk
     outline-color: var(--_variantColor);
     color: var(--toggle-group-hover-color, var(--_variantColor));
   }
-`;var m=28,D="eun-toggle-group",u,g,i=class extends $(T(I)){constructor(){super(...arguments);this.options=[];this.value=[];this.single=!1;this.appearance="default";this.full=!1;w(this,u);w(this,g,!1);this.settled=!1;this.debounceMoveIndicator=A(()=>this.moveIndicator(!0),50);this.handleSlotChange=()=>{this.settleAndSync(!1)}}get totalCount(){return this.options.length+(this.items?.length??0)}get exclusive(){return this.single||this.totalCount===2}get entries(){let e=Array.from(this.trackEl?.querySelectorAll("button")??[]),t=this.options.map((r,o)=>({value:r.value,disabled:!!this.disabled,element:e[o]})),a=(this.items??[]).map(r=>({value:r.value,disabled:!!this.disabled||!!r.disabled,element:r}));return[...t,...a]}connectedCallback(){super.connectedCallback?.(),y(this,u,new ResizeObserver(this.debounceMoveIndicator)),b(this,u).observe(this)}disconnectedCallback(){b(this,u)?.disconnect(),super.disconnectedCallback?.()}firstUpdated(e){super.firstUpdated(e),this.settleAndSync(!1).then(()=>Promise.all((this.items??[]).map(t=>this.whenItemReady(t)))).then(()=>{requestAnimationFrame(()=>requestAnimationFrame(()=>{this.settled=!0}))})}updated(e){super.updated(e),e.has("disabled")&&this.removeAttribute("tabindex"),(e.has("value")||e.has("options")||e.has("single")||e.has("appearance")||e.has("full"))&&this.settleAndSync(!0),e.has("disabled")&&this.disabled&&this.items?.forEach(t=>{t.disabled=!0})}whenItemsReady(){let e=new Set((this.items??[]).filter(t=>!customElements.get(t.tagName.toLowerCase())).map(t=>t.tagName.toLowerCase()));return e.size?Promise.all([...e].map(t=>customElements.whenDefined(t))):Promise.resolve()}settleAndSync(e){return this.whenItemsReady().then(()=>{this.seedInitialValue(),this.applyExclusiveDefault(),this.syncItems(),this.refreshIndicator(e),this.updateScroll()})}seedInitialValue(){if(b(this,g)||(y(this,g,!0),this.value.length))return;let e=(this.items??[]).filter(t=>t.checked).map(t=>t.value);e.length&&(this.value=this.exclusive?[e[0]]:e)}applyExclusiveDefault(){if(!this.exclusive||this.value.length)return;let[e]=this.entries;e&&(this.value=[e.value])}activateValue(e){if(!this.disabled){if(this.exclusive){if(this.value[0]===e)return;this.value=[e]}else this.value=this.value.includes(e)?this.value.filter(t=>t!==e):[...this.value,e];this.dispatchEvent(new R(this.value))}}activateItem(e){this.disabled||e.disabled||this.activateValue(e.value)}syncItems(){this.items?.length&&(this.items.forEach(e=>{e.checked=this.value.includes(e.value),e.toggleAttribute("exclusive",this.exclusive),e.setAttribute("appearance",this.appearance),e.toggleAttribute("full",this.full)}),this.exclusive&&this.applyRovingTabindex())}whenItemReady(e){return typeof e.updateComplete?.then=="function"?e.updateComplete:customElements.whenDefined(e.tagName.toLowerCase()).then(()=>e.updateComplete)}applyRovingTabindex(){let e=this.entries,t=Math.max(0,e.findIndex(a=>a.value===this.value[0]));e.forEach((a,r)=>{if(a.element.tagName==="BUTTON")return;let o=a.element,n=r===t?"0":"-1";this.whenItemReady(o).then(()=>{o.setAttribute("tabindex",n)})})}refreshIndicator(e){if(!this.exclusive)return;let t=()=>{this.appearance==="default"&&this.moveIndicator(e),this.revealActive(e)},a=this.entries.find(r=>r.value===this.value[0]);if(a&&a.element.tagName!=="BUTTON"){this.whenItemReady(a.element).then(t);return}t()}revealActive(e){let t=this.trackEl,a=this.entries.find(S=>S.value===this.value[0]);if(!t||!a||t.scrollWidth<=t.clientWidth)return;let r=t.getBoundingClientRect(),o=a.element.getBoundingClientRect(),n=o.left-r.left-t.clientLeft,l=n+o.width,f=0;n<m?f=n-m:l>t.clientWidth-m&&(f=l-(t.clientWidth-m)),f&&t.scrollBy({left:f,behavior:e?"smooth":"instant"})}moveIndicator(e){let t=this.indicatorEl;if(!this.exclusive||!t||!this.trackEl)return;let a=this.entries.find(l=>l.value===this.value[0]);if(!a){t.style.opacity="0";return}let r=this.trackEl.getBoundingClientRect(),o=a.element.getBoundingClientRect(),n=o.left-r.left-this.trackEl.clientLeft+this.trackEl.scrollLeft;e||(t.style.transition="none"),t.style.opacity="1",t.style.width=`${o.width}px`,t.style.transform=`translateX(${n}px)`,e||(t.getBoundingClientRect(),t.style.transition="")}exclusiveTabIndex(e,t){let a=this.value[0]===e,r=this.value.length===0;return a||r&&t===0?0:-1}handleKeydown(e){if(this.disabled)return;if(!this.exclusive){let l=e.target;this.items?.includes(l)&&(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),this.activateItem(l));return}let t=this.entries;if(!t.length)return;let a=t.findIndex(l=>l.value===this.value[0]),r,o;switch(e.key){case"ArrowRight":case"ArrowDown":r=1,o=a===-1?0:(a+1)%t.length;break;case"ArrowLeft":case"ArrowUp":r=-1,o=a===-1?t.length-1:(a-1+t.length)%t.length;break;case"Home":r=1,o=0;break;case"End":r=-1,o=t.length-1;break;default:return}e.preventDefault();for(let l=0;l<t.length&&t[o]?.disabled;l+=1)o=(o+r+t.length)%t.length;let n=t[o];!n||n.disabled||(this.activateValue(n.value),n.element.focus())}arrowVisible(e){return this.overflowState?["middle",e==="start"?"end":"start"].includes(String(this.overflowState)):!1}isOnOverflow(){let e=this.trackEl;return!!e&&e.scrollWidth>e.clientWidth}render(){let e=this.exclusive,t=e&&this.appearance==="default";return d`
+`;var m=28,$="eun-toggle-group",u,h,i=class extends z(S(C(B))){constructor(){super(...arguments);this.options=[];this.value=[];this.single=!1;this.appearance="default";this.size="m";this.full=!1;x(this,u);x(this,h,!1);this.settled=!1;this.debounceMoveIndicator=R(()=>this.moveIndicator(!0),50);this.handleSlotChange=()=>{this.settleAndSync(!1)}}get totalCount(){return this.options.length+(this.items?.length??0)}get exclusive(){return this.single||this.totalCount===2}get entries(){let e=Array.from(this.trackEl?.querySelectorAll("button")??[]),t=this.options.map((o,r)=>({value:o.value,disabled:!!this.disabled,element:e[r]})),a=(this.items??[]).map(o=>({value:o.value,disabled:!!this.disabled||!!o.disabled,element:o}));return[...t,...a]}connectedCallback(){super.connectedCallback?.(),w(this,u,new ResizeObserver(this.debounceMoveIndicator)),b(this,u).observe(this)}disconnectedCallback(){b(this,u)?.disconnect(),super.disconnectedCallback?.()}firstUpdated(e){super.firstUpdated(e),this.settleAndSync(!1).then(()=>Promise.all((this.items??[]).map(t=>this.whenItemReady(t)))).then(()=>{requestAnimationFrame(()=>requestAnimationFrame(()=>{this.settled=!0}))})}updated(e){super.updated(e),e.has("disabled")&&this.removeAttribute("tabindex"),(e.has("value")||e.has("options")||e.has("single")||e.has("appearance")||e.has("size")||e.has("full"))&&this.settleAndSync(!0),e.has("disabled")&&this.disabled&&this.items?.forEach(t=>{t.disabled=!0})}whenItemsReady(){let e=new Set((this.items??[]).filter(t=>!customElements.get(t.tagName.toLowerCase())).map(t=>t.tagName.toLowerCase()));return e.size?Promise.all([...e].map(t=>customElements.whenDefined(t))):Promise.resolve()}settleAndSync(e){return this.whenItemsReady().then(()=>{this.seedInitialValue(),this.applyExclusiveDefault(),this.syncItems(),this.refreshIndicator(e),this.updateScroll()})}seedInitialValue(){if(b(this,h)||(w(this,h,!0),this.value.length))return;let e=(this.items??[]).filter(t=>t.checked).map(t=>t.value);e.length&&(this.value=this.exclusive?[e[0]]:e)}applyExclusiveDefault(){if(!this.exclusive||this.value.length)return;let[e]=this.entries;e&&(this.value=[e.value])}activateValue(e){if(!this.disabled){if(this.exclusive){if(this.value[0]===e)return;this.value=[e]}else this.value=this.value.includes(e)?this.value.filter(t=>t!==e):[...this.value,e];this.dispatchEvent(new T(this.value))}}activateItem(e){this.disabled||e.disabled||this.activateValue(e.value)}syncItems(){this.items?.length&&(this.items.forEach(e=>{e.checked=this.value.includes(e.value),e.toggleAttribute("exclusive",this.exclusive),e.setAttribute("appearance",this.appearance),e.toggleAttribute("full",this.full)}),this.exclusive&&this.applyRovingTabindex())}whenItemReady(e){return typeof e.updateComplete?.then=="function"?e.updateComplete:customElements.whenDefined(e.tagName.toLowerCase()).then(()=>e.updateComplete)}applyRovingTabindex(){let e=this.entries,t=Math.max(0,e.findIndex(a=>a.value===this.value[0]));e.forEach((a,o)=>{if(a.element.tagName==="BUTTON")return;let r=a.element,n=o===t?"0":"-1";this.whenItemReady(r).then(()=>{r.setAttribute("tabindex",n)})})}refreshIndicator(e){if(!this.exclusive)return;let t=()=>{this.appearance==="default"&&this.moveIndicator(e),this.revealActive(e)},a=this.entries.find(o=>o.value===this.value[0]);if(a&&a.element.tagName!=="BUTTON"){this.whenItemReady(a.element).then(t);return}t()}revealActive(e){let t=this.trackEl,a=this.entries.find(P=>P.value===this.value[0]);if(!t||!a||t.scrollWidth<=t.clientWidth)return;let o=t.getBoundingClientRect(),r=a.element.getBoundingClientRect(),n=r.left-o.left-t.clientLeft,l=n+r.width,f=0;n<m?f=n-m:l>t.clientWidth-m&&(f=l-(t.clientWidth-m)),f&&t.scrollBy({left:f,behavior:e?"smooth":"instant"})}moveIndicator(e){let t=this.indicatorEl;if(!this.exclusive||!t||!this.trackEl)return;let a=this.entries.find(l=>l.value===this.value[0]);if(!a){t.style.opacity="0";return}let o=this.trackEl.getBoundingClientRect(),r=a.element.getBoundingClientRect(),n=r.left-o.left-this.trackEl.clientLeft+this.trackEl.scrollLeft;e||(t.style.transition="none"),t.style.opacity="1",t.style.width=`${r.width}px`,t.style.transform=`translateX(${n}px)`,e||(t.getBoundingClientRect(),t.style.transition="")}exclusiveTabIndex(e,t){let a=this.value[0]===e,o=this.value.length===0;return a||o&&t===0?0:-1}handleKeydown(e){if(this.disabled)return;if(!this.exclusive){let l=e.target;this.items?.includes(l)&&(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),this.activateItem(l));return}let t=this.entries;if(!t.length)return;let a=t.findIndex(l=>l.value===this.value[0]),o,r;switch(e.key){case"ArrowRight":case"ArrowDown":o=1,r=a===-1?0:(a+1)%t.length;break;case"ArrowLeft":case"ArrowUp":o=-1,r=a===-1?t.length-1:(a-1+t.length)%t.length;break;case"Home":o=1,r=0;break;case"End":o=-1,r=t.length-1;break;default:return}e.preventDefault();for(let l=0;l<t.length&&t[r]?.disabled;l+=1)r=(r+o+t.length)%t.length;let n=t[r];!n||n.disabled||(this.activateValue(n.value),n.element.focus())}arrowVisible(e){return this.overflowState?["middle",e==="start"?"end":"start"].includes(String(this.overflowState)):!1}isOnOverflow(){let e=this.trackEl;return!!e&&e.scrollWidth>e.clientWidth}render(){let e=this.exclusive,t=e&&this.appearance==="default";return d`
       <div id="scrollable-wrapper">
         <div
           id="scrollable"
-          class=${h({settled:this.settled})}
+          class=${p({settled:this.settled})}
           role=${e?"radiogroup":"group"}
           part="track"
-          aria-label=${this.ariaLabel??v}
+          aria-label=${this.ariaLabel??g}
           aria-disabled=${this.disabled?"true":"false"}
           @keydown=${a=>this.handleKeydown(a)}
           @scroll=${this.updateScroll}
@@ -340,40 +376,40 @@ import{a as $}from"./chunks/chunk-SMTIDNGW.js";import{a as R}from"./chunks/chunk
                 id="indicator"
                 part="indicator"
                 aria-hidden="true"
-              ></span>`:v}
-          ${this.options.map((a,r)=>{let o=this.value.includes(a.value),n=!!a.icon&&!a.showLabel;return d`
+              ></span>`:g}
+          ${this.options.map((a,o)=>{let r=this.value.includes(a.value),n=!!a.icon&&!a.showLabel;return d`
               <button
                 type="button"
-                class=${h({active:o,"icon-only":n})}
+                class=${p({active:r,"icon-only":n})}
                 data-value=${a.value}
-                data-color=${p(a.color)}
+                data-color=${v(a.color)}
                 role=${e?"radio":"checkbox"}
-                aria-checked=${o?"true":"false"}
-                aria-label=${p(n?a.label:void 0)}
-                title=${p(n?a.label:void 0)}
-                tabindex=${p(e?this.exclusiveTabIndex(a.value,r):void 0)}
+                aria-checked=${r?"true":"false"}
+                aria-label=${v(n?a.label:void 0)}
+                title=${v(n?a.label:void 0)}
+                tabindex=${v(e?this.exclusiveTabIndex(a.value,o):void 0)}
                 ?disabled=${this.disabled}
                 @click=${()=>this.activateValue(a.value)}
               >
-                ${a.icon?d`<eun-icon name=${a.icon} size="16"></eun-icon>`:v}
-                ${n?v:a.label}
+                ${a.icon?d`<eun-icon name=${a.icon}></eun-icon>`:g}
+                ${n?g:a.label}
               </button>
             `})}
           <slot @slotchange=${this.handleSlotChange}></slot>
         </div>
         <div id="arrows">
           <arrow-container
-            class=${h({visible:this.arrowVisible("start")})}
+            class=${p({visible:this.arrowVisible("start")})}
             @click=${this.scrollItem("back")}
           >
             <eun-icon name="chevron_left"></eun-icon>
           </arrow-container>
           <arrow-container
-            class=${h({visible:this.arrowVisible("end")})}
+            class=${p({visible:this.arrowVisible("end")})}
             @click=${this.scrollItem("front")}
           >
             <eun-icon name="chevron_right"></eun-icon>
           </arrow-container>
         </div>
       </div>
-    `}};u=new WeakMap,g=new WeakMap,i.styles=[B],s([c({type:Array,reflect:!0,converter:{toAttribute:e=>e?.length?JSON.stringify(e):null}})],i.prototype,"options",2),s([c({type:Array,reflect:!0,converter:{toAttribute:e=>e?.length?JSON.stringify(e):null}})],i.prototype,"value",2),s([c({type:Boolean,reflect:!0})],i.prototype,"single",2),s([c({reflect:!0,useDefault:!0})],i.prototype,"appearance",2),s([c({type:Boolean,reflect:!0})],i.prototype,"full",2),s([C()],i.prototype,"items",2),s([x("#scrollable")],i.prototype,"trackEl",2),s([x("#indicator")],i.prototype,"indicatorEl",2),s([E()],i.prototype,"settled",2),i=s([k(D)],i);export{i as EunomiaToggleGroup,D as EunomiaToggleGroupTagName};
+    `}};u=new WeakMap,h=new WeakMap,i.styles=[A],s([c({type:Array,reflect:!0,converter:{toAttribute:e=>e?.length?JSON.stringify(e):null}})],i.prototype,"options",2),s([c({type:Array,reflect:!0,converter:{toAttribute:e=>e?.length?JSON.stringify(e):null}})],i.prototype,"value",2),s([c({type:Boolean,reflect:!0})],i.prototype,"single",2),s([c({reflect:!0,useDefault:!0})],i.prototype,"appearance",2),s([c({reflect:!0,useDefault:!0})],i.prototype,"size",2),s([c({type:Boolean,reflect:!0})],i.prototype,"full",2),s([E()],i.prototype,"items",2),s([y("#scrollable")],i.prototype,"trackEl",2),s([y("#indicator")],i.prototype,"indicatorEl",2),s([I()],i.prototype,"settled",2),i=s([_($)],i);export{i as EunomiaToggleGroup,$ as EunomiaToggleGroupTagName};

package/dist/cdn/components/eun-toggle-item.js

@@ -22,15 +22,18 @@ import{a as s}from"./chunks/chunk-3BMACIDO.js";import{a as e,f as i,h as n,j as
     display: inline-flex;
     align-items: center;
     gap: var(--eun-space-xs, 4px);
+    --icon-size: var(--_toggleLineHeight, 1rem);
     font-family: var(--eun-font-family, "Mulish", sans-serif);
-    font-size: var(--eun-font-size-s, 14px);
+    font-size: var(--_toggleFontSize, var(--eun-font-size-s, 14px));
+    line-height: var(--_toggleLineHeight, 1rem);
     font-weight: var(--eun-font-weight-m, 500);
     white-space: nowrap;
     cursor: pointer;
     color: var(--toggle-group-color, var(--eun-color-grey-600, #666e8a));
-    padding: 6px 14px;
+    padding: var(--_toggleOptionPaddingBlock, calc(var(--eun-space-s, 8px) / 2))
+      var(--_toggleOptionPaddingInline, calc(var(--eun-space-l, 32px) / 2));
     border-radius: calc(
-      var(--toggle-group-border-radius, var(--eun-border-radius-m, 8px)) - 3px
+      var(--_toggleRadius, var(--eun-border-radius-m, 8px)) - 3px
     );
     outline: 2px solid transparent;
     box-shadow: var(--_boxShadow);
@@ -110,10 +113,7 @@ import{a as s}from"./chunks/chunk-3BMACIDO.js";import{a as e,f as i,h as n,j as
   }
   :host([appearance="outline"]) #item,
   :host([appearance="flat"]) #item {
-    border-radius: var(
-      --toggle-group-border-radius,
-      var(--eun-border-radius-m, 8px)
-    );
+    border-radius: var(--_toggleRadius, var(--eun-border-radius-m, 8px));
   }
   :host([appearance="outline"]) #item {
     border: var(--eun-border-width-s, 1px) solid
@@ -148,7 +148,7 @@ import{a as s}from"./chunks/chunk-3BMACIDO.js";import{a as e,f as i,h as n,j as
 `;var v="eun-toggle-item",d="eun-toggle-group",o=class extends s(c){constructor(){super(...arguments);this.checked=!1;this.activate=()=>{this.disabled||this.closest(d)?.activateItem(this)}}connectedCallback(){super.connectedCallback?.(),this.hasAttribute("role")||this.setAttribute("role","checkbox"),this.hasAttribute("tabindex")||this.setAttribute("tabindex","0"),this.addEventListener("click",this.activate)}disconnectedCallback(){this.removeEventListener("click",this.activate),super.disconnectedCallback?.()}updated(t){super.updated(t),t.has("checked")&&this.setAttribute("aria-checked",String(this.checked))}render(){return a`
       <div id="item" part="item">
         <slot name="icon">
-          ${this.icon?a`<eun-icon name=${this.icon} size="16"></eun-icon>`:l}
+          ${this.icon?a`<eun-icon name=${this.icon}></eun-icon>`:l}
         </slot>
         <slot></slot>
       </div>

package/dist/cdn/components/eun-toolbar.js

@@ -1,4 +1,4 @@
-import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js";import"./chunks/chunk-UDOZRIJZ.js";import{a as s}from"./chunks/chunk-YYCEPZUN.js";import{a as b}from"./chunks/chunk-BKZGTCMF.js";import{a as v}from"./chunks/chunk-62RLISRD.js";import"./chunks/chunk-QL5GSW2A.js";import{a as r,f as c,h,j as i,l as d,n as p,p as n,r as l,u}from"./chunks/chunk-YITWLCD3.js";var f=h`
+import{a as k}from"./chunks/chunk-TCSB2MLU.js";import"./chunks/chunk-RGC3I6MK.js";import"./chunks/chunk-5LXGJVJR.js";import{a as s}from"./chunks/chunk-YYCEPZUN.js";import{a as b}from"./chunks/chunk-BKZGTCMF.js";import{a as g}from"./chunks/chunk-6TIEBY34.js";import{a as v}from"./chunks/chunk-62RLISRD.js";import"./chunks/chunk-QL5GSW2A.js";import{a as r,f as c,h,j as i,l as d,n as p,p as n,r as l,u}from"./chunks/chunk-YITWLCD3.js";var y=h`
   :host {
     --_height: var(--toolbar-height, 72px);
     --_heightCollapsed: var(--toolbar-height-collapsed, 56px);
@@ -50,6 +50,10 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
       --toolbar-panel-padding,
       var(--toolbar-panel-padding-inline, 14px)
     );
+    --_panelOffset: var(
+      --toolbar-panel-offset,
+      calc(var(--_currentHeight) - var(--eun-border-width-s, 1px))
+    );
     --_burgerAlign: var(--toolbar-burger-align, center);
     --_burgerPadding: var(
       --toolbar-burger-padding,
@@ -149,6 +153,12 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     min-width: 0;
   }
 
+  :host([mobile][mobile-hide~="start"]) #start,
+  :host([mobile][mobile-hide~="center"]) #center,
+  :host([mobile][mobile-hide~="end"]) #end {
+    display: none;
+  }
+
   #start ::slotted(*),
   #center ::slotted(*),
   #end ::slotted(*) {
@@ -278,22 +288,6 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     pointer-events: none;
     transition-duration: var(--_transitionDuration);
   }
-  #panel[data-direction="top"] {
-    inset-block-end: auto;
-    height: var(--_panelSize);
-  }
-  #panel[data-direction="bottom"] {
-    inset-block-start: auto;
-    height: var(--_panelSize);
-  }
-  #panel[data-direction="left"] {
-    inset-inline-end: auto;
-    width: var(--_panelSize);
-  }
-  #panel[data-direction="right"] {
-    inset-inline-start: auto;
-    width: var(--_panelSize);
-  }
   #panel::backdrop {
     background: transparent;
   }
@@ -318,7 +312,8 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     inset: 0;
     display: flex;
     flex-direction: column;
-    padding: var(--_panelPaddingBlock) var(--_panelPaddingInline);
+    padding: calc(var(--_panelOffset) + var(--_panelPaddingBlock))
+      var(--_panelPaddingInline) var(--_panelPaddingBlock);
     background: var(--_panelBackground);
     backdrop-filter: blur(var(--_panelBackdropBlur));
     -webkit-backdrop-filter: blur(var(--_panelBackdropBlur));
@@ -331,15 +326,20 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
       transform var(--_transitionDuration) var(--eun-easing-default, ease);
   }
   #panel[data-direction="top"] #panel-body {
+    inset-block-end: calc(100% - var(--_panelSize));
     transform: translateY(-100%);
   }
   #panel[data-direction="bottom"] #panel-body {
+    --_panelOffset: var(--toolbar-panel-offset, 0px);
+    inset-block-start: calc(100% - var(--_panelSize));
     transform: translateY(100%);
   }
   #panel[data-direction="left"] #panel-body {
+    inset-inline-end: calc(100% - var(--_panelSize));
     transform: translateX(-100%);
   }
   #panel[data-direction="right"] #panel-body {
+    inset-inline-start: calc(100% - var(--_panelSize));
     transform: translateX(100%);
   }
   #panel:popover-open #panel-body {
@@ -381,7 +381,7 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
       transition-duration: 0.01ms;
     }
   }
-`,k=f;var y="eun-toolbar",t=class extends g(v(u)){constructor(){super(...arguments);this.position="sticky";this.mobileBreakpoint=b.tablet;this.open=!1;this.panelDirection="top";this.closeOnBackdrop=!0;this.collapseOnScroll=!1;this.collapseThreshold=24;this.collapsed=!1;this.transparentAtTop=!1;this.atTop=!0;this.adaptiveTheme=!1;this.adaptiveThemeSelector="[data-toolbar-theme]";this.theme="light";this.defaultTheme="light";this.skipLinkLabel="Skip to main content";this.mobile=!1;this.handleIconSlotChange=()=>{this.requestUpdate()};this.scrollTargetEl=window;this.scrollListenerAttached=!1;this.intersectingThemeEls=new Set;this.handleMediaChange=e=>{this.mobile=e.matches,!this.mobile&&this.open&&this.hide()};this.handleScroll=()=>{this.scrollRafId===void 0&&(this.scrollRafId=requestAnimationFrame(()=>{this.scrollRafId=void 0,this.updateScrollState()}))};this.handleThemeIntersect=e=>{for(let a of e)a.isIntersecting?this.intersectingThemeEls.add(a.target):this.intersectingThemeEls.delete(a.target);this.resolveAdaptiveTheme()};this.handlePanelToggle=e=>{let a=e;if(this.syncingFromPopover=!0,this.open=a.newState==="open",this.syncingFromPopover=!1,this.open){this.openDialogSurface({surfaceEl:this.panelEl,onEscape:()=>this.hide(),onOutsideClick:()=>{this.closeOnBackdrop&&this.hide()}}),this.dispatchEvent(new s),this.updateComplete.then(()=>this.focusInitialElement());return}this.closeDialogSurface(this.burgerEl),this.dispatchEvent(new s)};this.handleSkipLinkClick=e=>{let o=e.composedPath().find(m=>m instanceof HTMLAnchorElement)?.getAttribute("href");!o||!o.startsWith("#")||o.length<2||document.getElementById(o.slice(1))?.focus()}}connectedCallback(){super.connectedCallback(),this.updateMediaQuery(),this.syncScrollListener()}disconnectedCallback(){this.mediaQueryList?.removeEventListener("change",this.handleMediaChange),this.detachScrollListener(),this.teardownAdaptiveThemeObserver(),this.teardownDialogSurface(this.open),super.disconnectedCallback()}updated(e){super.updated(e),e.has("mobileBreakpoint")&&this.updateMediaQuery(),e.has("open")&&this.syncPopoverOpenState(this.open,this.panelEl),e.has("panelSize")&&(this.panelSize?this.style.setProperty("--toolbar-panel-size",this.panelSize):this.style.removeProperty("--toolbar-panel-size")),this.updateScrollListenerFor(e),this.updateAdaptiveThemeObserverFor(e)}updateScrollListenerFor(e){(e.has("collapseOnScroll")||e.has("transparentAtTop"))&&this.syncScrollListener(),e.has("scrollTarget")&&this.scrollListenerAttached&&this.attachScrollListener()}updateAdaptiveThemeObserverFor(e){if(e.has("adaptiveTheme")){this.adaptiveTheme?this.setupAdaptiveThemeObserver():e.get("adaptiveTheme")===!0&&(this.teardownAdaptiveThemeObserver(),this.theme=this.defaultTheme);return}this.adaptiveTheme&&(e.has("adaptiveThemeSelector")||e.has("collapsed")||e.has("scrollTarget"))&&this.setupAdaptiveThemeObserver()}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}refreshAdaptiveTheme(){this.themeObserver&&(this.themeObserver.disconnect(),this.intersectingThemeEls.clear(),document.querySelectorAll(this.adaptiveThemeSelector).forEach(e=>this.themeObserver?.observe(e)),this.resolveAdaptiveTheme())}updateMediaQuery(){this.mediaQueryList?.removeEventListener("change",this.handleMediaChange),this.mediaQueryList=window.matchMedia(`(width < ${this.mobileBreakpoint}px)`),this.mediaQueryList.addEventListener("change",this.handleMediaChange),this.mobile=this.mediaQueryList.matches}resolveScrollTarget(){if(this.scrollTarget){let e=document.querySelector(this.scrollTarget);if(e)return e}return window}resolveIntersectionRoot(){if(this.scrollTarget){let e=document.querySelector(this.scrollTarget);if(e)return e}return null}syncScrollListener(){let e=this.collapseOnScroll||this.transparentAtTop;e&&!this.scrollListenerAttached?(this.attachScrollListener(),this.scrollListenerAttached=!0):!e&&this.scrollListenerAttached&&(this.detachScrollListener(),this.scrollListenerAttached=!1)}attachScrollListener(){this.scrollTargetEl?.removeEventListener("scroll",this.handleScroll),this.scrollTargetEl=this.resolveScrollTarget(),this.scrollTargetEl.addEventListener("scroll",this.handleScroll,{passive:!0}),this.updateScrollState()}detachScrollListener(){this.scrollTargetEl?.removeEventListener("scroll",this.handleScroll),this.scrollRafId!==void 0&&(cancelAnimationFrame(this.scrollRafId),this.scrollRafId=void 0)}currentScrollY(){return this.scrollTargetEl instanceof Element?this.scrollTargetEl.scrollTop:window.scrollY}updateScrollState(){let e=this.currentScrollY();this.collapseOnScroll&&this.setCollapsed(e>this.collapseThreshold),this.transparentAtTop&&(this.atTop=e<=0)}setCollapsed(e){this.collapsed!==e&&(this.collapsed=e,this.dispatchEvent(new s))}setTheme(e){this.theme!==e&&(this.theme=e,this.dispatchEvent(new s))}barHeightPx(){return this.barEl?.getBoundingClientRect().height??(this.collapsed?56:72)}setupAdaptiveThemeObserver(){this.teardownAdaptiveThemeObserver();let e=this.barHeightPx();this.themeObserver=new IntersectionObserver(this.handleThemeIntersect,{root:this.resolveIntersectionRoot(),rootMargin:`-${e}px 0px -85% 0px`}),document.querySelectorAll(this.adaptiveThemeSelector).forEach(a=>this.themeObserver?.observe(a)),this.resolveAdaptiveTheme()}teardownAdaptiveThemeObserver(){this.themeObserver?.disconnect(),this.themeObserver=void 0,this.intersectingThemeEls.clear()}resolveAdaptiveTheme(){if(this.intersectingThemeEls.size===0){this.setTheme(this.defaultTheme);return}let e=document.querySelectorAll(this.adaptiveThemeSelector);for(let a=e.length-1;a>=0;a-=1)if(this.intersectingThemeEls.has(e[a])){this.setTheme(e[a].getAttribute("data-toolbar-theme")==="dark"?"dark":"light");return}this.setTheme(this.defaultTheme)}focusInitialElement(){let e=this.querySelector("[autofocus]");if(e){e.focus();return}this.panelEl?.focus()}hasSkipLinksContent(){return this.skipLinkTarget!==void 0||this.querySelector('[slot="skip-links"]')!==null}renderSkipLinks(){return n`
+`,m=y;var _="eun-toolbar",t=class extends k(v(u)){constructor(){super(...arguments);this.position="sticky";this.mobileBreakpoint=b.tablet;this.open=!1;this.panelDirection="top";this.closeOnBackdrop=!0;this.collapseOnScroll=!1;this.collapseThreshold=24;this.collapsed=!1;this.transparentAtTop=!1;this.atTop=!0;this.adaptiveTheme=!1;this.adaptiveThemeSelector="[data-toolbar-theme]";this.theme="light";this.defaultTheme="light";this.skipLinkLabel="Skip to main content";this.mobile=!1;this.handleIconSlotChange=()=>{this.requestUpdate()};this.scrollTargetEl=window;this.scrollListenerAttached=!1;this.intersectingThemeEls=new Set;this.handleMediaChange=e=>{this.mobile=e.matches,!this.mobile&&this.open&&this.hide()};this.handleScroll=()=>{this.scrollRafId===void 0&&(this.scrollRafId=requestAnimationFrame(()=>{this.scrollRafId=void 0,this.updateScrollState()}))};this.handleThemeIntersect=e=>{for(let a of e)a.isIntersecting?this.intersectingThemeEls.add(a.target):this.intersectingThemeEls.delete(a.target);this.resolveAdaptiveTheme()};this.handlePanelToggle=e=>{let a=e;if(this.syncingFromPopover=!0,this.open=a.newState==="open",this.syncingFromPopover=!1,this.open){this.openDialogSurface({surfaceEl:this.panelEl,onEscape:()=>this.hide(),onOutsideClick:()=>{this.closeOnBackdrop&&this.hide()}}),this.dispatchEvent(new s),this.updateComplete.then(()=>this.focusInitialElement());return}this.closeDialogSurface(this.burgerEl),this.dispatchEvent(new s)};this.handleSkipLinkClick=e=>{let o=e.composedPath().find(f=>f instanceof HTMLAnchorElement)?.getAttribute("href");!o||!o.startsWith("#")||o.length<2||document.getElementById(o.slice(1))?.focus()}}connectedCallback(){super.connectedCallback(),this.updateMediaQuery(),this.syncScrollListener()}disconnectedCallback(){this.mediaQueryList?.removeEventListener("change",this.handleMediaChange),this.detachScrollListener(),this.teardownAdaptiveThemeObserver(),this.teardownDialogSurface(this.open),super.disconnectedCallback()}updated(e){super.updated(e),e.has("mobileBreakpoint")&&this.updateMediaQuery(),e.has("open")&&this.syncPopoverOpenState(this.open,this.panelEl),e.has("panelSize")&&(this.panelSize?this.style.setProperty("--toolbar-panel-size",this.panelSize):this.style.removeProperty("--toolbar-panel-size")),this.updateScrollListenerFor(e),this.updateAdaptiveThemeObserverFor(e)}updateScrollListenerFor(e){(e.has("collapseOnScroll")||e.has("transparentAtTop"))&&this.syncScrollListener(),e.has("scrollTarget")&&this.scrollListenerAttached&&this.attachScrollListener()}updateAdaptiveThemeObserverFor(e){if(e.has("adaptiveTheme")){this.adaptiveTheme?this.setupAdaptiveThemeObserver():e.get("adaptiveTheme")===!0&&(this.teardownAdaptiveThemeObserver(),this.theme=this.defaultTheme);return}this.adaptiveTheme&&(e.has("adaptiveThemeSelector")||e.has("collapsed")||e.has("scrollTarget"))&&this.setupAdaptiveThemeObserver()}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}refreshAdaptiveTheme(){this.themeObserver&&(this.themeObserver.disconnect(),this.intersectingThemeEls.clear(),document.querySelectorAll(this.adaptiveThemeSelector).forEach(e=>this.themeObserver?.observe(e)),this.resolveAdaptiveTheme())}updateMediaQuery(){this.mediaQueryList?.removeEventListener("change",this.handleMediaChange),this.mediaQueryList=window.matchMedia(`(width < ${this.mobileBreakpoint}px)`),this.mediaQueryList.addEventListener("change",this.handleMediaChange),this.mobile=this.mediaQueryList.matches}resolveScrollTarget(){if(this.scrollTarget){let e=document.querySelector(this.scrollTarget);if(e)return e}return window}resolveIntersectionRoot(){if(this.scrollTarget){let e=document.querySelector(this.scrollTarget);if(e)return e}return null}syncScrollListener(){let e=this.collapseOnScroll||this.transparentAtTop;e&&!this.scrollListenerAttached?(this.attachScrollListener(),this.scrollListenerAttached=!0):!e&&this.scrollListenerAttached&&(this.detachScrollListener(),this.scrollListenerAttached=!1)}attachScrollListener(){this.scrollTargetEl?.removeEventListener("scroll",this.handleScroll),this.scrollTargetEl=this.resolveScrollTarget(),this.scrollTargetEl.addEventListener("scroll",this.handleScroll,{passive:!0}),this.updateScrollState()}detachScrollListener(){this.scrollTargetEl?.removeEventListener("scroll",this.handleScroll),this.scrollRafId!==void 0&&(cancelAnimationFrame(this.scrollRafId),this.scrollRafId=void 0)}currentScrollY(){return this.scrollTargetEl instanceof Element?this.scrollTargetEl.scrollTop:window.scrollY}updateScrollState(){let e=this.currentScrollY();this.collapseOnScroll&&this.setCollapsed(e>this.collapseThreshold),this.transparentAtTop&&(this.atTop=e<=0)}setCollapsed(e){this.collapsed!==e&&(this.collapsed=e,this.dispatchEvent(new s))}setTheme(e){this.theme!==e&&(this.theme=e,this.dispatchEvent(new s))}barHeightPx(){return this.barEl?.getBoundingClientRect().height??(this.collapsed?56:72)}setupAdaptiveThemeObserver(){this.teardownAdaptiveThemeObserver();let e=this.barHeightPx();this.themeObserver=new IntersectionObserver(this.handleThemeIntersect,{root:this.resolveIntersectionRoot(),rootMargin:`-${e}px 0px -85% 0px`}),document.querySelectorAll(this.adaptiveThemeSelector).forEach(a=>this.themeObserver?.observe(a)),this.resolveAdaptiveTheme()}teardownAdaptiveThemeObserver(){this.themeObserver?.disconnect(),this.themeObserver=void 0,this.intersectingThemeEls.clear()}resolveAdaptiveTheme(){if(this.intersectingThemeEls.size===0){this.setTheme(this.defaultTheme);return}let e=document.querySelectorAll(this.adaptiveThemeSelector);for(let a=e.length-1;a>=0;a-=1)if(this.intersectingThemeEls.has(e[a])){this.setTheme(e[a].getAttribute("data-toolbar-theme")==="dark"?"dark":"light");return}this.setTheme(this.defaultTheme)}focusInitialElement(){let e=this.querySelector("[autofocus]");if(e){e.focus();return}this.panelEl?.focus()}hasSkipLinksContent(){return this.skipLinkTarget!==void 0||this.querySelector('[slot="skip-links"]')!==null}renderSkipLinks(){return n`
       <div id="skip-links" @click=${this.handleSkipLinkClick}>
         <slot name="skip-links">
           ${this.skipLinkTarget?n`
@@ -437,4 +437,4 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
         ${this.renderEnd()}
       </nav>
       ${this.mobile?this.renderPanel():l}
-    `}};t.styles=k,r([i({reflect:!0,useDefault:!0})],t.prototype,"position",2),r([i({type:Number,attribute:"mobile-breakpoint"})],t.prototype,"mobileBreakpoint",2),r([i({type:Boolean,reflect:!0})],t.prototype,"open",2),r([i({reflect:!0,attribute:"panel-direction",useDefault:!0})],t.prototype,"panelDirection",2),r([i({attribute:"panel-size"})],t.prototype,"panelSize",2),r([i({type:Boolean,attribute:"close-on-backdrop"})],t.prototype,"closeOnBackdrop",2),r([i({attribute:"menu-open-label"})],t.prototype,"menuOpenLabel",2),r([i({attribute:"menu-close-label"})],t.prototype,"menuCloseLabel",2),r([i({attribute:"menu-label"})],t.prototype,"menuLabel",2),r([i({type:Boolean,attribute:"collapse-on-scroll"})],t.prototype,"collapseOnScroll",2),r([i({type:Number,attribute:"collapse-threshold"})],t.prototype,"collapseThreshold",2),r([i({type:Boolean,reflect:!0})],t.prototype,"collapsed",2),r([i({type:Boolean,attribute:"transparent-at-top"})],t.prototype,"transparentAtTop",2),r([i({type:Boolean,reflect:!0,attribute:"at-top"})],t.prototype,"atTop",2),r([i({attribute:"scroll-target"})],t.prototype,"scrollTarget",2),r([i({type:Boolean,attribute:"adaptive-theme"})],t.prototype,"adaptiveTheme",2),r([i({attribute:"adaptive-theme-selector"})],t.prototype,"adaptiveThemeSelector",2),r([i({reflect:!0,useDefault:!0})],t.prototype,"theme",2),r([i({attribute:"default-theme"})],t.prototype,"defaultTheme",2),r([i({attribute:"skip-link-target"})],t.prototype,"skipLinkTarget",2),r([i({attribute:"skip-link-label"})],t.prototype,"skipLinkLabel",2),r([i({type:Boolean,reflect:!0})],t.prototype,"mobile",2),r([d("#bar")],t.prototype,"barEl",2),r([d("#panel")],t.prototype,"panelEl",2),r([d("#burger")],t.prototype,"burgerEl",2),r([p({slot:"menu-icon"})],t.prototype,"menuIconSlotEls",2),r([p({slot:"close-icon"})],t.prototype,"closeIconSlotEls",2),t=r([c(y)],t);export{t as EunomiaToolbar,y as EunomiaToolbarTagName};
+    `}};t.styles=m,r([i({reflect:!0,useDefault:!0})],t.prototype,"position",2),r([i({type:Number,attribute:"mobile-breakpoint"})],t.prototype,"mobileBreakpoint",2),r([i({type:Boolean,reflect:!0})],t.prototype,"open",2),r([i({reflect:!0,attribute:"panel-direction",useDefault:!0})],t.prototype,"panelDirection",2),r([i({attribute:"panel-size"})],t.prototype,"panelSize",2),r([i({reflect:!0,attribute:"mobile-hide"})],t.prototype,"mobileHide",2),r([i({converter:g,attribute:"close-on-backdrop"})],t.prototype,"closeOnBackdrop",2),r([i({attribute:"menu-open-label"})],t.prototype,"menuOpenLabel",2),r([i({attribute:"menu-close-label"})],t.prototype,"menuCloseLabel",2),r([i({attribute:"menu-label"})],t.prototype,"menuLabel",2),r([i({type:Boolean,attribute:"collapse-on-scroll"})],t.prototype,"collapseOnScroll",2),r([i({type:Number,attribute:"collapse-threshold"})],t.prototype,"collapseThreshold",2),r([i({type:Boolean,reflect:!0})],t.prototype,"collapsed",2),r([i({type:Boolean,attribute:"transparent-at-top"})],t.prototype,"transparentAtTop",2),r([i({type:Boolean,reflect:!0,attribute:"at-top"})],t.prototype,"atTop",2),r([i({attribute:"scroll-target"})],t.prototype,"scrollTarget",2),r([i({type:Boolean,attribute:"adaptive-theme"})],t.prototype,"adaptiveTheme",2),r([i({attribute:"adaptive-theme-selector"})],t.prototype,"adaptiveThemeSelector",2),r([i({reflect:!0,useDefault:!0})],t.prototype,"theme",2),r([i({attribute:"default-theme"})],t.prototype,"defaultTheme",2),r([i({attribute:"skip-link-target"})],t.prototype,"skipLinkTarget",2),r([i({attribute:"skip-link-label"})],t.prototype,"skipLinkLabel",2),r([i({type:Boolean,reflect:!0})],t.prototype,"mobile",2),r([d("#bar")],t.prototype,"barEl",2),r([d("#panel")],t.prototype,"panelEl",2),r([d("#burger")],t.prototype,"burgerEl",2),r([p({slot:"menu-icon"})],t.prototype,"menuIconSlotEls",2),r([p({slot:"close-icon"})],t.prototype,"closeIconSlotEls",2),t=r([c(_)],t);export{t as EunomiaToolbar,_ as EunomiaToolbarTagName};

package/dist/cdn/components/eun-tooltip.js

@@ -1,8 +1,8 @@
-import{c as g}from"./chunks/chunk-EUWUDCBZ.js";import{a as C}from"./chunks/chunk-LK5BJ4SH.js";import{b as D,c as y}from"./chunks/chunk-624VJYNA.js";import{a as m}from"./chunks/chunk-LYYQAALT.js";import{e as L}from"./chunks/chunk-GDBPWZN6.js";import{a as v}from"./chunks/chunk-PPCHQG7P.js";import{a as f}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import{a,f as S,h as c,j as l,n as A,o as u,p as h,r as _,t as P,u as T}from"./chunks/chunk-YITWLCD3.js";var k=c`
+import{c as g}from"./chunks/chunk-EUWUDCBZ.js";import{b as C}from"./chunks/chunk-5LXGJVJR.js";import{a as D}from"./chunks/chunk-LK5BJ4SH.js";import{b as k,c as y}from"./chunks/chunk-624VJYNA.js";import{a as m}from"./chunks/chunk-LYYQAALT.js";import{e as L}from"./chunks/chunk-GDBPWZN6.js";import{a as v}from"./chunks/chunk-PPCHQG7P.js";import{a as f}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import{a,f as A,h as c,j as l,n as S,o as u,p as h,r as _,t as P,u as T}from"./chunks/chunk-YITWLCD3.js";var R=c`
   :host {
     display: contents;
   }
-`,N=c`
+`,$=c`
   /*
    * Step 1 : the palette (severity, else color) fills --_solid (strong
    * color), --_onSolid (text on it) and --_accent (text on a pale or neutral
@@ -143,7 +143,7 @@ import{c as g}from"./chunks/chunk-EUWUDCBZ.js";import{a as C}from"./chunks/chunk
     display: grid;
     row-gap: var(--tooltip-row-gap, var(--eun-space-xs, 4px));
     width: max-content;
-    min-width: var(--tooltip-min-width, 160px);
+    min-width: var(--tooltip-min-width, 0px);
     max-width: var(--tooltip-max-width, 280px);
     padding: var(
       --tooltip-padding,
@@ -225,7 +225,7 @@ import{c as g}from"./chunks/chunk-EUWUDCBZ.js";import{a as C}from"./chunks/chunk
     margin: 0;
     color: inherit;
   }
-`,b=N,$=c`
+`,b=$,B=c`
   @supports (anchor-name: --a) {
     .eun-tooltip-panel[data-placement="top"]:popover-open {
       position-try-fallbacks: --eun-tooltip-try-bottom;
@@ -279,7 +279,7 @@ import{c as g}from"./chunks/chunk-EUWUDCBZ.js";import{a as C}from"./chunks/chunk
       right: calc(anchor(left) + var(--tooltip-gap, 8px));
     }
   }
-`,w=$;var M="eun-tooltip",B=0,V=0,R=new WeakSet,I=["--tooltip-z-index","--tooltip-gap","--tooltip-viewport-gap","--tooltip-min-width","--tooltip-max-width","--tooltip-background-color","--tooltip-color","--tooltip-content-color","--tooltip-border-color","--tooltip-border-width","--tooltip-font-weight","--tooltip-border-radius","--tooltip-padding","--tooltip-padding-block","--tooltip-padding-inline","--tooltip-row-gap","--tooltip-shadow","--tooltip-transition-duration"],F=C(T),o=class extends F{constructor(){super(...arguments);this.color="primary";this.appearance="default";this.fixedColor=!1;this.placement="top";this.open=!1;this.lazy=!1;this.showDelay=100;this.hideDelay=150;this.pinned=!1;this.panelId=`eun-tooltip-panel-${++V}`;this.headingId=`${this.panelId}-heading`;this.ariaDescribedByApplied=!1;this.handleReposition=()=>{this.reposition()};this.handleDocumentKeydown=e=>{e.key==="Escape"&&this.hide()};this.handleDocumentPointerDown=e=>{if(!this.pinned)return;let t=e.composedPath();this.anchorEl&&t.includes(this.anchorEl)||this.panelEl&&t.includes(this.panelEl)||this.hide()};this.handleAnchorSlotChange=()=>{this.rebindAnchorListeners()};this.handleAnchorPointerEnter=()=>{this.scheduleShow()};this.handleAnchorPointerLeave=()=>{this.scheduleHide()};this.handleAnchorFocusIn=()=>{this.clearShowTimer(),this.clearHideTimer(),this.show()};this.handleAnchorFocusOut=()=>{this.pinned=!1,this.hide()};this.handleAnchorClick=()=>{this.pinned=!this.pinned,this.pinned?(this.clearShowTimer(),this.clearHideTimer(),this.show()):this.scheduleHide()};this.handlePanelPointerEnter=()=>{this.clearHideTimer()};this.handlePanelPointerLeave=()=>{this.scheduleHide()};this.handleSlotChange=()=>{this.requestUpdate()}}supportsAnchorPositioning(){return o.nativeAnchorPositioningSupported}connectedCallback(){super.connectedCallback(),this.hasUpdated&&!this.lazy&&this.ensurePortal()}firstUpdated(e){super.firstUpdated(e),this.rebindAnchorListeners(),this.lazy||this.ensurePortal()}disconnectedCallback(){this.unbindAnchorListeners(),this.clearShowTimer(),this.clearHideTimer(),this.panelAnimation?.cancel(),this.panelAnimation=void 0,this.removeGlobalListeners(),this.portalContainer?.remove(),this.portalContainer=void 0,this.portalRoot=void 0,this.panelEl=void 0,super.disconnectedCallback?.()}updated(e){if(super.updated(e),this.portalContainer&&this.renderPortal(),e.has("open")){this.open?this.openTooltip():this.closeTooltip();return}e.has("placement")&&this.open&&this.reposition()}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}get anchorEl(){return this.anchorSlotEls[0]}ensurePortal(){if(this.portalContainer||!this.anchorEl)return;let e=this.anchorEl.getRootNode();this.portalRoot=e,this.installPanelStyles(e);let t=document.createElement("div");t.style.display="contents",(e===document?document.body:e).appendChild(t),this.portalContainer=t,this.renderPortal()}installPanelStyles(e){if(R.has(e)||!b.styleSheet)return;R.add(e);let t=[b.styleSheet];!m&&w.styleSheet&&t.push(w.styleSheet),e.adoptedStyleSheets=[...e.adoptedStyleSheets,...t]}renderPortal(){this.portalContainer&&(P(this.renderPanel(),this.portalContainer,{host:this}),this.panelEl=this.portalContainer.querySelector(".eun-tooltip-panel")??void 0,this.forwardCssVariables(),this.mirrorSlottedContent())}forwardCssVariables(){if(!this.panelEl)return;let e=getComputedStyle(this);for(let t of I)this.panelEl.style.setProperty(t,e.getPropertyValue(t))}openTooltip(){if(this.ensurePortal(),!this.anchorEl||!this.panelEl)return;this.applyAriaDescribedBy();let e=this.panelEl,t=this.panelAnimation!==void 0;this.panelAnimation?.cancel(),this.panelAnimation=void 0;let r=!e.matches(":popover-open");r&&e.showPopover(),this.reposition(),(r||t)&&this.playEnterAnimation(e),window.addEventListener("resize",this.handleReposition),window.addEventListener("scroll",this.handleReposition,!0),document.addEventListener("keydown",this.handleDocumentKeydown),document.addEventListener("pointerdown",this.handleDocumentPointerDown,!0),this.observeAnchorVisibility(this.anchorEl,()=>this.hide())}closeTooltip(){this.pinned=!1;let e=this.panelEl;this.panelAnimation?.cancel(),this.panelAnimation=void 0,e?.matches(":popover-open")&&this.playExitAnimation(e),this.removeGlobalListeners(),this.unobserveAnchorVisibility()}static panelAnimationDuration(e){return window.matchMedia("(prefers-reduced-motion: reduce)").matches?0:D(e,"--tooltip-transition-duration","s",150)}playEnterAnimation(e){e.style.removeProperty("pointer-events");let t=o.panelAnimationDuration(e);t!==0&&(this.panelAnimation=e.animate([{opacity:0,scale:.96},{opacity:1,scale:1}],{duration:t,easing:y(e),fill:"forwards"}))}playExitAnimation(e){e.style.pointerEvents="none";let t=o.panelAnimationDuration(e);if(t===0){e.hidePopover();return}let r=e.animate([{opacity:1,scale:1},{opacity:0,scale:.96}],{duration:t,easing:y(e),fill:"forwards"});this.panelAnimation=r,r.finished.then(()=>{this.panelAnimation===r&&(this.panelAnimation=void 0),e.hidePopover()}).catch(()=>{})}removeGlobalListeners(){window.removeEventListener("resize",this.handleReposition),window.removeEventListener("scroll",this.handleReposition,!0),document.removeEventListener("keydown",this.handleDocumentKeydown),document.removeEventListener("pointerdown",this.handleDocumentPointerDown,!0)}reposition(){!this.anchorEl||!this.panelEl||(this.supportsAnchorPositioning()?(this.anchorPositionName??=`--eun-tooltip-anchor-${++B}`,this.anchorEl.style.setProperty("anchor-name",this.anchorPositionName),this.panelEl.style.setProperty("position-anchor",this.anchorPositionName)):this.updateFallbackPosition(),this.clampPanelToViewport())}getEffectivePlacementFallback(e,t,r,i){let n=this.readGap();if(this.placement==="left"||this.placement==="right"){let H=window.innerWidth,x=e.right+n+t.width<=H,E=e.left-n-t.width>=0;return this.placement==="right"&&!x&&E?"left":this.placement==="left"&&!E&&x?"right":this.placement}let p=window.innerHeight,d=e.bottom+n+t.height<=p-i,s=e.top-n-t.height>=r;return this.placement==="top"&&!s&&d?"bottom":this.placement==="bottom"&&!d&&s?"top":this.placement}updateFallbackPosition(){if(!this.anchorEl||!this.panelEl)return;let e=this.readGap(),t=this.readViewportInset(this.panelEl,"--eun-viewport-inset-top"),r=this.readViewportInset(this.panelEl,"--eun-viewport-inset-bottom"),i=this.anchorEl.getBoundingClientRect(),n=this.panelEl.getBoundingClientRect(),p=this.getEffectivePlacementFallback(i,n,t,r),d,s;p==="top"||p==="bottom"?(d=p==="top"?i.top-n.height-e:i.bottom+e,s=g(i.left+i.width/2-n.width/2,n.width,window.innerWidth,e)):(s=p==="left"?i.left-n.width-e:i.right+e,d=g(i.top+i.height/2-n.height/2,n.height,window.innerHeight,e)),this.panelEl.style.setProperty("--_panelTop",`${d}px`),this.panelEl.style.setProperty("--_panelLeft",`${s}px`)}clampPanelToViewport(){if(!this.panelEl)return;let e=this.readPixelVar("--tooltip-viewport-gap",8),t=this.readViewportInset(this.panelEl,"--eun-viewport-inset-top"),r=this.readViewportInset(this.panelEl,"--eun-viewport-inset-bottom"),i=this.panelEl.getBoundingClientRect(),n=0;i.left<e?n=e-i.left:i.right>window.innerWidth-e&&(n=window.innerWidth-e-i.right);let p=t+e,d=window.innerHeight-r-e,s=0;i.top<p?s=p-i.top:i.bottom>d&&(s=d-i.bottom),this.panelEl.style.transform=n||s?`translate(${n}px, ${s}px)`:""}readPixelVar(e,t){if(!this.panelEl)return t;let r=getComputedStyle(this.panelEl).getPropertyValue(e),i=Number.parseFloat(r);return Number.isFinite(i)?i:t}readGap(){return this.readPixelVar("--tooltip-gap",8)}applyAriaDescribedBy(){if(this.ariaDescribedByApplied||!this.anchorEl)return;this.ariaDescribedByApplied=!0;let e=this.anchorEl.getAttribute("aria-describedby"),t=e?e.split(/\s+/):[];t.includes(this.panelId)||(t.push(this.panelId),this.anchorEl.setAttribute("aria-describedby",t.join(" ")))}clearShowTimer(){this.showTimer!==void 0&&(clearTimeout(this.showTimer),this.showTimer=void 0)}clearHideTimer(){this.hideTimer!==void 0&&(clearTimeout(this.hideTimer),this.hideTimer=void 0)}scheduleShow(){this.clearHideTimer(),!this.open&&(this.clearShowTimer(),this.showTimer=setTimeout(()=>{this.showTimer=void 0,this.show()},this.showDelay))}scheduleHide(){this.clearShowTimer(),!this.pinned&&(this.clearHideTimer(),this.hideTimer=setTimeout(()=>{this.hideTimer=void 0,this.pinned||this.hide()},this.hideDelay))}rebindAnchorListeners(){let e=this.anchorEl;this.boundAnchorEl!==e&&(this.unbindAnchorListeners(),this.boundAnchorEl=e,this.ariaDescribedByApplied=!1,e&&(e.addEventListener("pointerenter",this.handleAnchorPointerEnter),e.addEventListener("pointerleave",this.handleAnchorPointerLeave),e.addEventListener("focusin",this.handleAnchorFocusIn),e.addEventListener("focusout",this.handleAnchorFocusOut),e.addEventListener("click",this.handleAnchorClick)))}unbindAnchorListeners(){this.boundAnchorEl?.removeEventListener("pointerenter",this.handleAnchorPointerEnter),this.boundAnchorEl?.removeEventListener("pointerleave",this.handleAnchorPointerLeave),this.boundAnchorEl?.removeEventListener("focusin",this.handleAnchorFocusIn),this.boundAnchorEl?.removeEventListener("focusout",this.handleAnchorFocusOut),this.boundAnchorEl?.removeEventListener("click",this.handleAnchorClick)}hasDescription(){return!!this.richText||this.descriptionSlotNodes.length>0}hasHeading(){return!!this.heading||this.defaultSlotNodes.some(e=>e.nodeType!==Node.TEXT_NODE||!!e.textContent?.trim())}mirrorSlottedContent(){if(!this.panelEl)return;this.heading||this.panelEl.querySelector(".eun-tooltip-heading-mirror")?.replaceChildren(...this.defaultSlotNodes.map(r=>r.cloneNode(!0))),this.panelEl.querySelector(".eun-tooltip-description-mirror")?.replaceChildren(...this.descriptionSlotNodes.map(t=>t.cloneNode(!0)))}renderPanel(){let e=this.heading?this.heading:h`<span class="eun-tooltip-heading-mirror"></span>`;return h`
+`,w=B;var M="eun-tooltip",V=0,I=0,H=new WeakSet,F=["--tooltip-z-index","--tooltip-gap","--tooltip-viewport-gap","--tooltip-min-width","--tooltip-max-width","--tooltip-background-color","--tooltip-color","--tooltip-content-color","--tooltip-border-color","--tooltip-border-width","--tooltip-font-weight","--tooltip-border-radius","--tooltip-padding","--tooltip-padding-block","--tooltip-padding-inline","--tooltip-row-gap","--tooltip-shadow","--tooltip-transition-duration"],z=D(T),i=class extends z{constructor(){super(...arguments);this.color="primary";this.appearance="default";this.fixedColor=!1;this.placement="top";this.open=!1;this.lazy=!1;this.showDelay=100;this.hideDelay=150;this.pinned=!1;this.panelId=`eun-tooltip-panel-${++I}`;this.headingId=`${this.panelId}-heading`;this.ariaDescribedByApplied=!1;this.handleReposition=()=>{this.reposition()};this.handleDocumentKeydown=e=>{e.key==="Escape"&&this.hide()};this.handleDocumentPointerDown=e=>{if(!this.pinned)return;let t=e.composedPath();this.anchorEl&&t.includes(this.anchorEl)||this.panelEl&&t.includes(this.panelEl)||this.hide()};this.handleAnchorSlotChange=()=>{this.rebindAnchorListeners()};this.handleAnchorPointerEnter=()=>{this.scheduleShow()};this.handleAnchorPointerLeave=()=>{this.scheduleHide()};this.handleAnchorFocusIn=()=>{this.clearShowTimer(),this.clearHideTimer(),this.show()};this.handleAnchorFocusOut=()=>{this.pinned=!1,this.hide()};this.handleAnchorClick=()=>{this.pinned=!this.pinned,this.pinned?(this.clearShowTimer(),this.clearHideTimer(),this.show()):this.scheduleHide()};this.handlePanelPointerEnter=()=>{this.clearHideTimer()};this.handlePanelPointerLeave=()=>{this.scheduleHide()};this.handleSlotChange=()=>{this.requestUpdate()}}supportsAnchorPositioning(){return i.nativeAnchorPositioningSupported}connectedCallback(){super.connectedCallback(),this.hasUpdated&&!this.lazy&&this.ensurePortal()}firstUpdated(e){super.firstUpdated(e),this.rebindAnchorListeners(),this.lazy||this.ensurePortal()}disconnectedCallback(){this.unbindAnchorListeners(),this.clearShowTimer(),this.clearHideTimer(),this.panelAnimation?.cancel(),this.panelAnimation=void 0,this.removeGlobalListeners(),this.portalContainer?.remove(),this.portalContainer=void 0,this.portalRoot=void 0,this.panelEl=void 0,super.disconnectedCallback?.()}updated(e){if(super.updated(e),this.portalContainer&&this.renderPortal(),e.has("open")){this.open?this.openTooltip():this.closeTooltip();return}e.has("placement")&&this.open&&this.reposition()}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}get anchorEl(){return this.anchorSlotEls[0]}ensurePortal(){if(this.portalContainer||!this.anchorEl)return;let e=this.anchorEl.getRootNode();this.portalRoot=e,this.installPanelStyles(e);let t=document.createElement("div");t.style.display="contents",(e===document?document.body:e).appendChild(t),this.portalContainer=t,this.renderPortal()}installPanelStyles(e){if(H.has(e)||!b.styleSheet)return;H.add(e);let t=[b.styleSheet];!m&&w.styleSheet&&t.push(w.styleSheet),e.adoptedStyleSheets=[...e.adoptedStyleSheets,...t]}renderPortal(){this.portalContainer&&(P(this.renderPanel(),this.portalContainer,{host:this}),this.panelEl=this.portalContainer.querySelector(".eun-tooltip-panel")??void 0,this.forwardCssVariables(),this.mirrorSlottedContent())}forwardCssVariables(){if(!this.panelEl)return;let e=getComputedStyle(this);for(let t of F)this.panelEl.style.setProperty(t,e.getPropertyValue(t))}openTooltip(){if(this.ensurePortal(),!this.anchorEl||!this.panelEl)return;this.applyAriaDescribedBy();let e=this.panelEl,t=this.panelAnimation!==void 0;this.panelAnimation?.cancel(),this.panelAnimation=void 0;let n=!e.matches(":popover-open");n&&e.showPopover(),this.reposition(),(n||t)&&this.playEnterAnimation(e),window.addEventListener("resize",this.handleReposition),window.addEventListener("scroll",this.handleReposition,!0),document.addEventListener("keydown",this.handleDocumentKeydown),document.addEventListener("pointerdown",this.handleDocumentPointerDown,!0),this.observeAnchorVisibility(this.anchorEl,()=>this.hide())}closeTooltip(){this.pinned=!1;let e=this.panelEl;this.panelAnimation?.cancel(),this.panelAnimation=void 0,e?.matches(":popover-open")&&this.playExitAnimation(e),this.removeGlobalListeners(),this.unobserveAnchorVisibility()}static panelAnimationDuration(e){return window.matchMedia("(prefers-reduced-motion: reduce)").matches?0:k(e,"--tooltip-transition-duration","s",150)}playEnterAnimation(e){e.style.removeProperty("pointer-events");let t=i.panelAnimationDuration(e);t!==0&&(this.panelAnimation=e.animate([{opacity:0,scale:.96},{opacity:1,scale:1}],{duration:t,easing:y(e),fill:"forwards"}))}playExitAnimation(e){e.style.pointerEvents="none";let t=i.panelAnimationDuration(e);if(t===0){e.hidePopover();return}let n=e.animate([{opacity:1,scale:1},{opacity:0,scale:.96}],{duration:t,easing:y(e),fill:"forwards"});this.panelAnimation=n,n.finished.then(()=>{this.panelAnimation===n&&(this.panelAnimation=void 0),e.hidePopover()}).catch(()=>{})}removeGlobalListeners(){window.removeEventListener("resize",this.handleReposition),window.removeEventListener("scroll",this.handleReposition,!0),document.removeEventListener("keydown",this.handleDocumentKeydown),document.removeEventListener("pointerdown",this.handleDocumentPointerDown,!0)}reposition(){!this.anchorEl||!this.panelEl||(this.supportsAnchorPositioning()?(this.anchorPositionName??=`--eun-tooltip-anchor-${++V}`,this.anchorEl.style.setProperty("anchor-name",this.anchorPositionName),this.panelEl.style.setProperty("position-anchor",this.anchorPositionName)):this.updateFallbackPosition(),this.clampPanelToViewport())}getEffectivePlacementFallback(e,t,n,o){let r=this.readGap();if(this.placement==="left"||this.placement==="right"){let N=window.innerWidth,E=e.right+r+t.width<=N,x=e.left-r-t.width>=0;return this.placement==="right"&&!E&&x?"left":this.placement==="left"&&!x&&E?"right":this.placement}let p=window.innerHeight,d=e.bottom+r+t.height<=p-o,s=e.top-r-t.height>=n;return this.placement==="top"&&!s&&d?"bottom":this.placement==="bottom"&&!d&&s?"top":this.placement}updateFallbackPosition(){if(!this.anchorEl||!this.panelEl)return;let e=this.readGap(),t=this.readViewportInset(this.panelEl,"--eun-viewport-inset-top"),n=this.readViewportInset(this.panelEl,"--eun-viewport-inset-bottom"),o=this.anchorEl.getBoundingClientRect(),r=this.panelEl.getBoundingClientRect(),p=this.getEffectivePlacementFallback(o,r,t,n),d,s;p==="top"||p==="bottom"?(d=p==="top"?o.top-r.height-e:o.bottom+e,s=g(o.left+o.width/2-r.width/2,r.width,window.innerWidth,e)):(s=p==="left"?o.left-r.width-e:o.right+e,d=g(o.top+o.height/2-r.height/2,r.height,window.innerHeight,e)),this.panelEl.style.setProperty("--_panelTop",`${d}px`),this.panelEl.style.setProperty("--_panelLeft",`${s}px`)}clampPanelToViewport(){if(!this.panelEl)return;let e=this.readPixelVar("--tooltip-viewport-gap",8),t=this.readViewportInset(this.panelEl,"--eun-viewport-inset-top"),n=this.readViewportInset(this.panelEl,"--eun-viewport-inset-bottom"),o=this.panelEl.getBoundingClientRect(),r=0;o.left<e?r=e-o.left:o.right>window.innerWidth-e&&(r=window.innerWidth-e-o.right);let p=t+e,d=window.innerHeight-n-e,s=0;o.top<p?s=p-o.top:o.bottom>d&&(s=d-o.bottom),this.panelEl.style.transform=r||s?`translate(${r}px, ${s}px)`:""}readPixelVar(e,t){if(!this.panelEl)return t;let n=getComputedStyle(this.panelEl).getPropertyValue(e),o=Number.parseFloat(n);return Number.isFinite(o)?o:t}readGap(){return this.readPixelVar("--tooltip-gap",8)}applyAriaDescribedBy(){if(this.ariaDescribedByApplied||!this.anchorEl||!this.panelEl)return;this.ariaDescribedByApplied=!0;let e=C(this.anchorEl);if(e.getRootNode()!==this.portalRoot){let o=e.ariaDescribedByElements??[];o.includes(this.panelEl)||(e.ariaDescribedByElements=[...o,this.panelEl]);return}let t=e.getAttribute("aria-describedby"),n=t?t.split(/\s+/):[];n.includes(this.panelId)||(n.push(this.panelId),e.setAttribute("aria-describedby",n.join(" ")))}clearShowTimer(){this.showTimer!==void 0&&(clearTimeout(this.showTimer),this.showTimer=void 0)}clearHideTimer(){this.hideTimer!==void 0&&(clearTimeout(this.hideTimer),this.hideTimer=void 0)}scheduleShow(){this.clearHideTimer(),!this.open&&(this.clearShowTimer(),this.showTimer=setTimeout(()=>{this.showTimer=void 0,this.show()},this.showDelay))}scheduleHide(){this.clearShowTimer(),!this.pinned&&(this.clearHideTimer(),this.hideTimer=setTimeout(()=>{this.hideTimer=void 0,this.pinned||this.hide()},this.hideDelay))}rebindAnchorListeners(){let e=this.anchorEl;this.boundAnchorEl!==e&&(this.unbindAnchorListeners(),this.boundAnchorEl=e,this.ariaDescribedByApplied=!1,e&&(e.addEventListener("pointerenter",this.handleAnchorPointerEnter),e.addEventListener("pointerleave",this.handleAnchorPointerLeave),e.addEventListener("focusin",this.handleAnchorFocusIn),e.addEventListener("focusout",this.handleAnchorFocusOut),e.addEventListener("click",this.handleAnchorClick)))}unbindAnchorListeners(){this.boundAnchorEl?.removeEventListener("pointerenter",this.handleAnchorPointerEnter),this.boundAnchorEl?.removeEventListener("pointerleave",this.handleAnchorPointerLeave),this.boundAnchorEl?.removeEventListener("focusin",this.handleAnchorFocusIn),this.boundAnchorEl?.removeEventListener("focusout",this.handleAnchorFocusOut),this.boundAnchorEl?.removeEventListener("click",this.handleAnchorClick)}hasDescription(){return!!this.richText||this.descriptionSlotNodes.length>0}hasHeading(){return!!this.heading||this.defaultSlotNodes.some(e=>e.nodeType!==Node.TEXT_NODE||!!e.textContent?.trim())}mirrorSlottedContent(){if(!this.panelEl)return;this.heading||this.panelEl.querySelector(".eun-tooltip-heading-mirror")?.replaceChildren(...this.defaultSlotNodes.map(n=>n.cloneNode(!0))),this.panelEl.querySelector(".eun-tooltip-description-mirror")?.replaceChildren(...this.descriptionSlotNodes.map(t=>t.cloneNode(!0)))}renderPanel(){let e=this.heading?this.heading:h`<span class="eun-tooltip-heading-mirror"></span>`;return h`
       <div
         id=${this.panelId}
         class=${f({"eun-tooltip-panel":!0,"no-heading":!this.hasHeading()})}
@@ -314,4 +314,4 @@ import{c as g}from"./chunks/chunk-EUWUDCBZ.js";import{a as C}from"./chunks/chunk
         hidden
         @slotchange=${this.handleSlotChange}
       ></slot>
-    `}};o.styles=k,o.nativeAnchorPositioningSupported=typeof CSS<"u"&&CSS.supports("anchor-name: --a")&&!m,a([l({reflect:!0})],o.prototype,"severity",2),a([l({reflect:!0,useDefault:!0})],o.prototype,"color",2),a([l({reflect:!0,useDefault:!0})],o.prototype,"appearance",2),a([l({type:Boolean,reflect:!0,attribute:"fixed-color"})],o.prototype,"fixedColor",2),a([l({reflect:!0,useDefault:!0})],o.prototype,"placement",2),a([l()],o.prototype,"heading",2),a([l({attribute:"rich-text"})],o.prototype,"richText",2),a([l({type:Boolean,reflect:!0})],o.prototype,"open",2),a([l({type:Boolean,reflect:!0})],o.prototype,"lazy",2),a([l({type:Number,attribute:"show-delay"})],o.prototype,"showDelay",2),a([l({type:Number,attribute:"hide-delay"})],o.prototype,"hideDelay",2),a([A({slot:"anchor"})],o.prototype,"anchorSlotEls",2),a([u()],o.prototype,"defaultSlotNodes",2),a([u({slot:"description"})],o.prototype,"descriptionSlotNodes",2),o=a([S(M)],o);export{o as EunomiaTooltip,M as EunomiaTooltipTagName};
+    `}};i.styles=R,i.nativeAnchorPositioningSupported=typeof CSS<"u"&&CSS.supports("anchor-name: --a")&&!m,a([l({reflect:!0})],i.prototype,"severity",2),a([l({reflect:!0,useDefault:!0})],i.prototype,"color",2),a([l({reflect:!0,useDefault:!0})],i.prototype,"appearance",2),a([l({type:Boolean,reflect:!0,attribute:"fixed-color"})],i.prototype,"fixedColor",2),a([l({reflect:!0,useDefault:!0})],i.prototype,"placement",2),a([l()],i.prototype,"heading",2),a([l({attribute:"rich-text"})],i.prototype,"richText",2),a([l({type:Boolean,reflect:!0})],i.prototype,"open",2),a([l({type:Boolean,reflect:!0})],i.prototype,"lazy",2),a([l({type:Number,attribute:"show-delay"})],i.prototype,"showDelay",2),a([l({type:Number,attribute:"hide-delay"})],i.prototype,"hideDelay",2),a([S({slot:"anchor"})],i.prototype,"anchorSlotEls",2),a([u()],i.prototype,"defaultSlotNodes",2),a([u({slot:"description"})],i.prototype,"descriptionSlotNodes",2),i=a([A(M)],i);export{i as EunomiaTooltip,M as EunomiaTooltipTagName};