@eunomia/elements 1.0.0-beta.4 → 1.0.0-beta.6

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

@@ -1,4 +1,4 @@
-import{a as f}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js";import{a as t,f as l,g as p,h as o,l as d,n as r,s as u}from"./chunks/chunk-XH6NREVZ.js";var v=p`
+import{a as f}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import{a as t,f as l,h as p,j as o,n as d,p as r,u}from"./chunks/chunk-YITWLCD3.js";var v=p`
   :host {
     display: flex;
     align-items: flex-start;
@@ -96,14 +96,20 @@ import{a as f}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js
       var(--eun-content-hover, #edeff0)
     );
     color: var(--stepper-indicator-color, var(--eun-text-secondary, #484e61));
-    font-size: var(--stepper-indicator-font-size, var(--eun-font-size-xs, 12px));
+    font-size: var(
+      --stepper-indicator-font-size,
+      var(--eun-font-size-xs, 12px)
+    );
     font-weight: var(
       --stepper-indicator-font-weight,
       var(--eun-font-weight-m, 500)
     );
     transition:
-      background var(--stepper-transition-duration, 0.2s) ease-out,
-      color var(--stepper-transition-duration, 0.2s) ease-out;
+      background
+        var(--stepper-transition-duration, var(--eun-duration-m, 200ms))
+        var(--eun-easing-out, ease-out),
+      color var(--stepper-transition-duration, var(--eun-duration-m, 200ms))
+        var(--eun-easing-out, ease-out);
   }
   .indicator eun-icon {
     pointer-events: none;
@@ -153,7 +159,10 @@ import{a as f}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js
   }
   .label {
     font-size: var(--stepper-label-font-size, var(--eun-font-size-s, 14px));
-    font-weight: var(--stepper-label-font-weight, var(--eun-font-weight-m, 500));
+    font-weight: var(
+      --stepper-label-font-weight,
+      var(--eun-font-weight-m, 500)
+    );
     color: var(--stepper-label-color, var(--eun-text-color, #071621));
   }
   :host([status="current"]) .label {
@@ -193,7 +202,9 @@ import{a as f}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js
       --stepper-connector-color-active,
       var(--eun-color-primary-200, #6f94ff)
     );
-    transition: transform var(--stepper-transition-duration, 0.2s) ease-out;
+    transition: transform
+      var(--stepper-transition-duration, var(--eun-duration-m, 200ms))
+      var(--eun-easing-out, ease-out);
   }
   :host(:not([orientation="vertical"])) .connector::after {
     transform: scaleX(0);

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

@@ -1,4 +1,4 @@
-import{a as u}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js";import{a as s,f as g,g as S,h as i,l as x,n as r,p,s as y}from"./chunks/chunk-XH6NREVZ.js";var d=class c extends Event{static{this.eventName="eunstepchange"}constructor(m){super(c.eventName,{bubbles:!0,composed:!1}),this.step=m}};var $=S`
+import{a as u}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import{a as s,f as g,h as S,j as i,n as x,p as r,r as p,u as y}from"./chunks/chunk-YITWLCD3.js";var d=class c extends Event{static{this.eventName="eunstepchange"}constructor(m){super(c.eventName,{bubbles:!0,composed:!1}),this.step=m}};var $=S`
   :host {
     display: block;
     container-type: normal;
@@ -100,7 +100,9 @@ import{a as u}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js
       --stepper-connector-color-active,
       var(--eun-color-primary-200, #6f94ff)
     );
-    transition: transform var(--stepper-transition-duration, 0.2s) ease-out;
+    transition: transform
+      var(--stepper-transition-duration, var(--eun-duration-m, 200ms))
+      var(--eun-easing-out, ease-out);
   }
   li.connector::after {
     transform: scaleX(0);
@@ -169,14 +171,20 @@ import{a as u}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js
       var(--eun-content-hover, #edeff0)
     );
     color: var(--stepper-indicator-color, var(--eun-text-secondary, #484e61));
-    font-size: var(--stepper-indicator-font-size, var(--eun-font-size-xs, 12px));
+    font-size: var(
+      --stepper-indicator-font-size,
+      var(--eun-font-size-xs, 12px)
+    );
     font-weight: var(
       --stepper-indicator-font-weight,
       var(--eun-font-weight-m, 500)
     );
     transition:
-      background var(--stepper-transition-duration, 0.2s) ease-out,
-      color var(--stepper-transition-duration, 0.2s) ease-out;
+      background
+        var(--stepper-transition-duration, var(--eun-duration-m, 200ms))
+        var(--eun-easing-out, ease-out),
+      color var(--stepper-transition-duration, var(--eun-duration-m, 200ms))
+        var(--eun-easing-out, ease-out);
   }
   .indicator eun-icon {
     pointer-events: none;
@@ -268,7 +276,10 @@ import{a as u}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js
   }
   .label {
     font-size: var(--stepper-label-font-size, var(--eun-font-size-s, 14px));
-    font-weight: var(--stepper-label-font-weight, var(--eun-font-weight-m, 500));
+    font-weight: var(
+      --stepper-label-font-weight,
+      var(--eun-font-weight-m, 500)
+    );
     color: var(--stepper-label-color, var(--eun-text-color, #071621));
   }
   li.step[data-status="current"] .label {

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

@@ -1,4 +1,4 @@
-import{a as k}from"./chunks/chunk-GU6BVMFJ.js";import{a as f,c as b,d as p,e as t}from"./chunks/chunk-OAULRKHQ.js";import"./chunks/chunk-YYCEPZUN.js";import{a as h}from"./chunks/chunk-T7WABJEJ.js";import{a as u}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js";import{a as d}from"./chunks/chunk-5EVP7YNE.js";import{a as e,f as c,g as n,h as a,n as i,p as s,s as l}from"./chunks/chunk-XH6NREVZ.js";var g=n`
+import{a as k}from"./chunks/chunk-A3X4KD2X.js";import{c as f,d as v,e as b,f as t}from"./chunks/chunk-VOTRXBDS.js";import"./chunks/chunk-YYCEPZUN.js";import{a as h}from"./chunks/chunk-RS7TWEMQ.js";import{a as d}from"./chunks/chunk-PPCHQG7P.js";import{a as u}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import"./chunks/chunk-KSZRQRN4.js";import{a as e,f as n,h as c,j as a,p as i,r as s,u as l}from"./chunks/chunk-YITWLCD3.js";var g=c`
   :host {
     --_trackWidth: var(--switch-track-width, 40px);
     --_trackHeight: var(--switch-track-height, 22px);
@@ -21,7 +21,7 @@ import{a as k}from"./chunks/chunk-GU6BVMFJ.js";import{a as f,c as b,d as p,e as
     );
     --_trackBorderWidth: var(--eun-border-width-s, 1px);
     font-family: var(--eun-font-family, "Mulish", sans-serif);
-    font-size: var(--eun-font-size-s, 14px);
+    font-size: var(--field-label-font-size, var(--eun-font-size-s, 14px));
     display: flex;
     width: 100%;
     outline: none;
@@ -148,9 +148,10 @@ import{a as k}from"./chunks/chunk-GU6BVMFJ.js";import{a as f,c as b,d as p,e as
     box-sizing: border-box;
     outline: 2px solid transparent;
     transition:
-      background-color 0.15s ease,
-      outline 0.3s ease,
-      border-color 0.15s ease;
+      background-color var(--eun-duration-s, 150ms)
+        var(--eun-easing-default, ease),
+      outline var(--eun-duration-xl, 300ms) var(--eun-easing-default, ease),
+      border-color var(--eun-duration-s, 150ms) var(--eun-easing-default, ease);
   }
 
   #thumb {
@@ -165,7 +166,8 @@ import{a as k}from"./chunks/chunk-GU6BVMFJ.js";import{a as f,c as b,d as p,e as
     display: flex;
     align-items: center;
     justify-content: center;
-    transition: transform 0.15s ease;
+    transition: transform var(--eun-duration-s, 150ms)
+      var(--eun-easing-default, ease);
   }
   :host([aria-checked="true"]) #thumb {
     transform: translateX(
@@ -181,7 +183,7 @@ import{a as k}from"./chunks/chunk-GU6BVMFJ.js";import{a as f,c as b,d as p,e as
     line-height: 0;
     --icon-color: var(--switch-icon-color, var(--_trackBorder));
   }
-`,v=g;var _="eun-switch",w=k(f(b(h(p(l))))),r=class extends w{constructor(){super(...arguments);this.hideIcon=!1}get defaultValue(){return super.defaultValue}set defaultValue(o){super.defaultValue=o}connectedCallback(){this.hasAttribute("role")||this.setAttribute("role","switch"),super.connectedCallback?.()}render(){let o=!!this.description,m=this.checked?"icon-on":"icon-off",x=this.checked?"check":"close";return i`
+`,p=g;var _="eun-switch",w=k(v(f(h(b(l))))),r=class extends w{constructor(){super(...arguments);this.hideIcon=!1}get defaultValue(){return super.defaultValue}set defaultValue(o){super.defaultValue=o}connectedCallback(){this.hasAttribute("role")||this.setAttribute("role","switch"),super.connectedCallback?.()}render(){let o=!!this.description,m=this.checked?"icon-on":"icon-off",x=this.checked?"check":"close";return i`
       <div id="wrapper">
         <div
           id="clickable"
@@ -210,4 +212,4 @@ import{a as k}from"./chunks/chunk-GU6BVMFJ.js";import{a as f,c as b,d as p,e as
         </div>
         ${this.renderDescription()}
       </div>
-    `}};r.styles=[v,t.base,t.errorMessages,t.hintMessages],e([a()],r.prototype,"label",2),e([a({type:Boolean,attribute:"hide-icon",reflect:!0})],r.prototype,"hideIcon",2),e([a({attribute:"default-value"})],r.prototype,"defaultValue",1),r=e([c(_)],r);export{r as EunomiaSwitch,_ as EunomiaSwitchTagName};
+    `}};r.styles=[p,t.base,t.errorMessages,t.hintMessages],e([a()],r.prototype,"label",2),e([a({type:Boolean,attribute:"hide-icon",reflect:!0})],r.prototype,"hideIcon",2),e([a({attribute:"default-value"})],r.prototype,"defaultValue",1),r=e([n(_)],r);export{r as EunomiaSwitch,_ as EunomiaSwitchTagName};

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

@@ -1,6 +1,9 @@
-import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk-RJCJXB7Y.js";import{a as S}from"./chunks/chunk-E5LQKBFI.js";import{a as P}from"./chunks/chunk-SD2H5UDZ.js";import"./chunks/chunk-T7WABJEJ.js";import"./chunks/chunk-VRGRCYIO.js";import{a as c}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js";import{a as x}from"./chunks/chunk-5EVP7YNE.js";import{a as o,f as y,g as w,h as l,j as d,l as h,n as T,s as E}from"./chunks/chunk-XH6NREVZ.js";var p=class C extends Event{static{this.eventName="tabchange"}constructor(v){super(C.eventName),this.active=v.active}};var N=w`
+import{a as k}from"./chunks/chunk-SMTIDNGW.js";import{b as _}from"./chunks/chunk-ZKZV2YG5.js";import{a as D}from"./chunks/chunk-E5LQKBFI.js";import{a as S}from"./chunks/chunk-624VJYNA.js";import"./chunks/chunk-RS7TWEMQ.js";import"./chunks/chunk-PD62MBOJ.js";import"./chunks/chunk-BKZGTCMF.js";import{a as x}from"./chunks/chunk-PPCHQG7P.js";import{a as P}from"./chunks/chunk-SD2H5UDZ.js";import{a as c}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import{a as o,f as y,h as w,j as l,l as d,n as h,p as T,u as E}from"./chunks/chunk-YITWLCD3.js";var p=class N extends Event{static{this.eventName="tabchange"}constructor(v){super(N.eventName),this.active=v.active}};var F=w`
   :host {
-    --_swipe-duration: var(--tab-panel-swipe-duration, 200ms);
+    --_swipe-duration: var(
+      --tab-panel-swipe-duration,
+      var(--eun-duration-m, 200ms)
+    );
     --_indicator-height: var(--tab-indicator-height, 2px);
     --_indicator-color: var(
       --tab-indicator-color,
@@ -8,7 +11,7 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
     );
     --_hover-indicator-color: var(
       --tab-hover-indicator-color,
-      var(--eun-color-primary-transparent, #3d6fff33)
+      var(--eun-color-primary-alpha-20, #3d6fff33)
     );
     --_divider-gap: var(--tab-divider-gap, 0px);
     --_divider-color: var(
@@ -61,8 +64,9 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
     opacity: 0;
     z-index: 1;
     transition:
-      opacity 0.2s ease-out,
-      background-color 0.2s ease-out;
+      opacity var(--eun-duration-m, 200ms) var(--eun-easing-out, ease-out),
+      background-color var(--eun-duration-m, 200ms)
+        var(--eun-easing-out, ease-out);
   }
 
   ::slotted(eun-tab:not([disabled]):hover)::after {
@@ -73,10 +77,10 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
     height: var(--_indicator-height);
     background: var(--_indicator-color);
     position: absolute;
-    bottom: 0;
+    bottom: var(--_outline-padding);
     transition:
-      width 0.1s linear,
-      transform 0.15s ease;
+      width var(--eun-duration-xs, 100ms) linear,
+      transform var(--eun-duration-s, 150ms) var(--eun-easing-default, ease);
     will-change: width, transform;
     z-index: 1;
   }
@@ -89,10 +93,10 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
   [role="tablist"] {
     display: flex;
     gap: var(--_tabs-gap);
-    padding-bottom: var(--_divider-gap);
+    padding-bottom: calc(var(--_divider-gap) + var(--_outline-padding));
     padding-top: var(--_outline-padding);
     padding-inline: var(--_outline-padding);
-    margin-bottom: var(--_panel-gap);
+    margin-bottom: calc(var(--_panel-gap) - var(--_outline-padding));
     scrollbar-width: none;
     position: relative;
   }
@@ -118,7 +122,8 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
     opacity: 0;
     min-width: 30px;
     pointer-events: none;
-    transition: opacity 0.2s ease;
+    transition: opacity var(--eun-duration-m, 200ms)
+      var(--eun-easing-default, ease);
     display: flex;
     align-items: center;
   }
@@ -152,7 +157,7 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
     border-top: var(--_divider-size) solid var(--_divider-color);
     margin: 0;
     position: absolute;
-    bottom: 0;
+    bottom: var(--_outline-padding);
     left: 0;
     right: 0;
     width: 100%;
@@ -179,20 +184,20 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
 
   :host([animation="fade"]) slot:not([name])::slotted(eun-tab-panel),
   :host(:not([animation])) slot:not([name])::slotted(eun-tab-panel) {
-    --_animationTime: var(--tab-panel-animation, 150ms);
+    --_animationTime: var(--tab-panel-animation, var(--eun-duration-s, 150ms));
     animation: var(--_animationTime) ease-in fade-in;
   }
 
   :host([animation="slide"])
     slot:not([name])::slotted(eun-tab-panel.slide-left) {
     --_animationTime: var(--tab-panel-animation, 500ms);
-    animation: var(--_animationTime) ease-out slide-left;
+    animation: var(--_animationTime) var(--eun-easing-out, ease-out) slide-left;
   }
 
   :host([animation="slide"])
     slot:not([name])::slotted(eun-tab-panel.slide-right) {
     --_animationTime: var(--tab-panel-animation, 500ms);
-    animation: var(--_animationTime) ease-out slide-right;
+    animation: var(--_animationTime) var(--eun-easing-out, ease-out) slide-right;
   }
 
   @keyframes fade-in {
@@ -240,7 +245,7 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
       animation: none !important;
     }
   }
-`,_=N;var F="eun-tab-group";var A=4,$="eun-tab",r=class extends k(E){constructor(){super(...arguments);this.align="start";this.full=!1;this.animation="slide";this.hideIndicator=!1;this.dragActive=!1;this.dragDirection="nextElementSibling";this.dragHasTarget=!1;this.suppressSlideAnimation=!1;this.handleSwipeMove=t=>{this.dragActive||this.beginDrag(t),this.updateDragPosition(t)};this.handleSwipeEnd=(t,e)=>{this.dragActive&&this.settleDrag(e&&this.dragHasTarget)};this.handleSwipeCancel=()=>{this.dragActive&&this.settleDrag(!1)};this.handleKeydown=t=>{if(t.stopPropagation(),!this.isEunomiaTab(t.target))return;let e;switch(t.key){case"ArrowRight":{do e=this.getSiblingTab("nextElementSibling",e)||this.tabs[0];while(e.disabled);break}case"ArrowLeft":{do e=this.getSiblingTab("previousElementSibling",e)||this.tabs[this.tabs.length-1];while(e.disabled);break}case"Home":{[e]=this.tabs;break}case"End":{e=this.tabs[this.tabs.length-1];break}case"Enter":case" ":{let a=this.getRootNode();if(!this.isEunomiaTab(a.activeElement))return;t.preventDefault(),this.activate(a.activeElement);return}default:return}e&&e.focus()};this.debounceAnimation=P(()=>{this.updateIndicator()},50)}get activeTab(){return this.tabs.find(t=>t.active)}connectedCallback(){super.connectedCallback?.(),this.addEventListener("keydown",this.handleKeydown)}firstUpdated(t){super.firstUpdated?.(t),this.swipeGesture=S(this.panelViewport,{onDragMove:this.handleSwipeMove,onDragEnd:this.handleSwipeEnd,onDragCancel:this.handleSwipeCancel})}disconnectedCallback(){this.removeEventListener("keydown",this.handleKeydown),this.swipeGesture?.destroy(),super.disconnectedCallback?.()}updated(t){super.updated?.(t),t.has("full")&&this.updateIndicator()}updateIndicator(){if(!this.activeTab)return;if(this.hideIndicator){this.indicator.style.display="none";return}let{clientWidth:t,offsetLeft:e}=this.activeTab,a;this.align==="center"&&!this.overflowState&&!this.full?a=-this.scrollableContent.clientWidth+this.scrollableContent.clientWidth/2+e+t-t/2:this.align==="end"&&!this.overflowState&&!this.full?a=e-this.scrollableContent.clientWidth+t+A:a=e-A,this.indicator.style.width=`${t}px`,this.indicator.style.transform=`translateX(${a}px)`}resizeObserverCallback(){this.debounceAnimation()}activate(t){let e=typeof t=="string"?this.tabs.find(n=>n.panel===t):t,a=this.activeTab?.panel;!e||e.disabled||e.panel===a||(a&&this.animation==="slide"&&!this.suppressSlideAnimation&&this.initializeSlideAnimation(e,a),this.panels.forEach(n=>{let i=n.name!==e.panel;n.isHidden=i,i&&n.classList.remove("swipe-settled")}),this.tabs.forEach(n=>{n.active=n===e}),a&&this.dispatchEvent(new p({active:e.panel})),this.updateComplete.then(this.debounceAnimation))}initializeSlideAnimation(t,e){this.panels.forEach(i=>{i.classList.remove("slide-left","slide-right")});let a=this.tabs.findIndex(i=>i===t),n=this.panels.findIndex(i=>i.name===e);this.panels.forEach((i,s)=>{s===a&&i.classList.add(n<a?"slide-left":"slide-right")})}panelFor(t){return t&&this.panels.find(e=>e.name===t.panel)}getAdjacentEnabledTab(t){let e=this.activeTab?.[t];for(;e&&this.isEunomiaTab(e);){let a=e;if(!a.disabled)return a;e=e[t]}}beginDrag(t){this.dragActive=!0,this.dragDirection=t<0?"nextElementSibling":"previousElementSibling",this.dragTargetTab=this.getAdjacentEnabledTab(this.dragDirection),this.dragHasTarget=!!this.dragTargetTab;let e=this.panelFor(this.activeTab);e&&(this.panelViewport.style.height=`${e.getBoundingClientRect().height}px`),this.panelViewport.classList.add("dragging"),e&&(e.style.position="absolute",e.style.inset="0");let a=this.panelFor(this.dragTargetTab);a&&(a.style.display="block",a.style.position="absolute",a.style.inset="0",a.classList.add("swipe-settled"))}updateDragPosition(t){let e=this.panelFor(this.activeTab);if(!e)return;if(!this.dragHasTarget){e.style.transform=`translateX(${t*r.EDGE_RESISTANCE}px)`;return}e.style.transform=`translateX(${t}px)`;let a=this.panelFor(this.dragTargetTab);if(!a)return;let n=this.dragDirection==="nextElementSibling"?1:-1;a.style.transform=`translateX(calc(${n*100}% + ${t}px))`}settleDrag(t){let e=this.panelFor(this.activeTab),a=this.dragHasTarget?this.panelFor(this.dragTargetTab):void 0,n=this.dragDirection==="nextElementSibling"?1:-1,i=t?`${-n*100}%`:"0px",s=t?"0px":`${n*100}%`,b=getComputedStyle(this).getPropertyValue("--_swipe-duration"),f=Number.parseFloat(b)<=0;if([e,a].forEach(m=>{m&&(m.style.transition=f?"none":"transform var(--_swipe-duration) ease-out")}),e?.style.setProperty("transform",`translateX(${i})`),a?.style.setProperty("transform",`translateX(${s})`),f){this.finalizeDrag(t);return}let u=!1,g=()=>{u||(u=!0,this.finalizeDrag(t))};e?.addEventListener("transitionend",g,{once:!0}),this.updateComplete.then(()=>{window.setTimeout(g,Number.parseFloat(b)||0)})}finalizeDrag(t){let e=this.panelFor(this.activeTab),a=this.dragHasTarget?this.panelFor(this.dragTargetTab):void 0;[e,a].forEach(i=>{i&&(i.style.removeProperty("position"),i.style.removeProperty("inset"),i.style.removeProperty("transform"),i.style.removeProperty("transition"),i.style.removeProperty("display"))}),this.panelViewport.classList.remove("dragging"),this.panelViewport.style.removeProperty("height");let n=this.dragTargetTab;this.dragActive=!1,this.dragTargetTab=void 0,this.dragHasTarget=!1,t&&n?(this.suppressSlideAnimation=!0,this.activate(n),this.suppressSlideAnimation=!1):a?.classList.remove("swipe-settled")}handleTabChange(){if(this.updateScroll(),!this.activeTab){let t=this.activeTab||this.tabs[0];this.activate(t)}}getSiblingTab(t,e){let a;if(e){let i=this.tabs.findIndex(s=>s===e);a=this.tabs[i]}else{let{activeElement:i}=this.getRootNode();i instanceof D?a=i:a=this.activeTab??this.tabs[0]}let n=a?.[t];return this.isEunomiaTab(n)?n:this.tabs[t==="nextElementSibling"?0:this.tabs.length-1]}isEunomiaTab(t){return!!t&&!!t.tagName&&new RegExp(`${$}$`,"i").test(t.tagName)}arrowVisible(t){return this.overflowState?["middle",t==="start"?"end":"start"].includes(String(this.overflowState)):!1}render(){return T`
+`,A=F;var $="eun-tab-group";var C=4,L="eun-tab",r=class extends k(E){constructor(){super(...arguments);this.align="start";this.full=!1;this.animation="slide";this.hideIndicator=!1;this.dragActive=!1;this.dragDirection="nextElementSibling";this.dragHasTarget=!1;this.suppressSlideAnimation=!1;this.handleSwipeMove=t=>{this.dragActive||this.beginDrag(t),this.updateDragPosition(t)};this.handleSwipeEnd=(t,e)=>{this.dragActive&&this.settleDrag(e&&this.dragHasTarget)};this.handleSwipeCancel=()=>{this.dragActive&&this.settleDrag(!1)};this.handleKeydown=t=>{if(t.stopPropagation(),!this.isEunomiaTab(t.target))return;let e;switch(t.key){case"ArrowRight":{do e=this.getSiblingTab("nextElementSibling",e)||this.tabs[0];while(e.disabled);break}case"ArrowLeft":{do e=this.getSiblingTab("previousElementSibling",e)||this.tabs[this.tabs.length-1];while(e.disabled);break}case"Home":{[e]=this.tabs;break}case"End":{e=this.tabs[this.tabs.length-1];break}case"Enter":case" ":{let a=this.getRootNode();if(!this.isEunomiaTab(a.activeElement))return;t.preventDefault(),this.activate(a.activeElement);return}default:return}e&&e.focus()};this.debounceAnimation=P(()=>{this.updateIndicator()},50)}get activeTab(){return this.tabs.find(t=>t.active)}connectedCallback(){super.connectedCallback?.(),this.addEventListener("keydown",this.handleKeydown)}firstUpdated(t){super.firstUpdated?.(t),this.swipeGesture=D(this.panelViewport,{onDragMove:this.handleSwipeMove,onDragEnd:this.handleSwipeEnd,onDragCancel:this.handleSwipeCancel})}disconnectedCallback(){this.removeEventListener("keydown",this.handleKeydown),this.swipeGesture?.destroy(),super.disconnectedCallback?.()}updated(t){super.updated?.(t),t.has("full")&&this.updateIndicator()}updateIndicator(){if(!this.activeTab)return;if(this.hideIndicator){this.indicator.style.display="none";return}let{clientWidth:t,offsetLeft:e}=this.activeTab,a;this.align==="center"&&!this.overflowState&&!this.full?a=-this.scrollableContent.clientWidth+this.scrollableContent.clientWidth/2+e+t-t/2:this.align==="end"&&!this.overflowState&&!this.full?a=e-this.scrollableContent.clientWidth+t+C:a=e-C,this.indicator.style.width=`${t}px`,this.indicator.style.transform=`translateX(${a}px)`}resizeObserverCallback(){this.debounceAnimation()}activate(t){let e=typeof t=="string"?this.tabs.find(n=>n.panel===t):t,a=this.activeTab?.panel;!e||e.disabled||e.panel===a||(a&&this.animation==="slide"&&!this.suppressSlideAnimation&&this.initializeSlideAnimation(e,a),this.panels.forEach(n=>{let i=n.name!==e.panel;n.isHidden=i,i&&n.classList.remove("swipe-settled")}),this.tabs.forEach(n=>{n.active=n===e}),a&&this.dispatchEvent(new p({active:e.panel})),this.updateComplete.then(this.debounceAnimation))}initializeSlideAnimation(t,e){this.panels.forEach(i=>{i.classList.remove("slide-left","slide-right")});let a=this.tabs.findIndex(i=>i===t),n=this.panels.findIndex(i=>i.name===e);this.panels.forEach((i,s)=>{s===a&&i.classList.add(n<a?"slide-left":"slide-right")})}panelFor(t){return t&&this.panels.find(e=>e.name===t.panel)}getAdjacentEnabledTab(t){let e=this.activeTab?.[t];for(;e&&this.isEunomiaTab(e);){let a=e;if(!a.disabled)return a;e=e[t]}}beginDrag(t){this.dragActive=!0,this.dragDirection=t<0?"nextElementSibling":"previousElementSibling",this.dragTargetTab=this.getAdjacentEnabledTab(this.dragDirection),this.dragHasTarget=!!this.dragTargetTab;let e=this.panelFor(this.activeTab);e&&(this.panelViewport.style.height=`${e.getBoundingClientRect().height}px`),this.panelViewport.classList.add("dragging"),e&&(e.style.position="absolute",e.style.inset="0");let a=this.panelFor(this.dragTargetTab);a&&(a.style.display="block",a.style.position="absolute",a.style.inset="0",a.classList.add("swipe-settled"))}updateDragPosition(t){let e=this.panelFor(this.activeTab);if(!e)return;if(!this.dragHasTarget){e.style.transform=`translateX(${t*r.EDGE_RESISTANCE}px)`;return}e.style.transform=`translateX(${t}px)`;let a=this.panelFor(this.dragTargetTab);if(!a)return;let n=this.dragDirection==="nextElementSibling"?1:-1;a.style.transform=`translateX(calc(${n*100}% + ${t}px))`}settleDrag(t){let e=this.panelFor(this.activeTab),a=this.dragHasTarget?this.panelFor(this.dragTargetTab):void 0,n=this.dragDirection==="nextElementSibling"?1:-1,i=t?`${-n*100}%`:"0px",s=t?"0px":`${n*100}%`,u=S(getComputedStyle(this).getPropertyValue("--_swipe-duration"))??0,f=u<=0;if([e,a].forEach(m=>{m&&(m.style.transition=f?"none":"transform var(--_swipe-duration) var(--eun-easing-out, ease-out)")}),e?.style.setProperty("transform",`translateX(${i})`),a?.style.setProperty("transform",`translateX(${s})`),f){this.finalizeDrag(t);return}let b=!1,g=()=>{b||(b=!0,this.finalizeDrag(t))};e?.addEventListener("transitionend",g,{once:!0}),this.updateComplete.then(()=>{window.setTimeout(g,u)})}finalizeDrag(t){let e=this.panelFor(this.activeTab),a=this.dragHasTarget?this.panelFor(this.dragTargetTab):void 0;[e,a].forEach(i=>{i&&(i.style.removeProperty("position"),i.style.removeProperty("inset"),i.style.removeProperty("transform"),i.style.removeProperty("transition"),i.style.removeProperty("display"))}),this.panelViewport.classList.remove("dragging"),this.panelViewport.style.removeProperty("height");let n=this.dragTargetTab;this.dragActive=!1,this.dragTargetTab=void 0,this.dragHasTarget=!1,t&&n?(this.suppressSlideAnimation=!0,this.activate(n),this.suppressSlideAnimation=!1):a?.classList.remove("swipe-settled")}handleTabChange(){if(this.updateScroll(),!this.activeTab){let t=this.activeTab||this.tabs[0];this.activate(t)}}getSiblingTab(t,e){let a;if(e){let i=this.tabs.findIndex(s=>s===e);a=this.tabs[i]}else{let{activeElement:i}=this.getRootNode();i instanceof _?a=i:a=this.activeTab??this.tabs[0]}let n=a?.[t];return this.isEunomiaTab(n)?n:this.tabs[t==="nextElementSibling"?0:this.tabs.length-1]}isEunomiaTab(t){return!!t&&!!t.tagName&&new RegExp(`${L}$`,"i").test(t.tagName)}arrowVisible(t){return this.overflowState?["middle",t==="start"?"end":"start"].includes(String(this.overflowState)):!1}render(){return T`
       <div>
         <div id="scrollable-wrapper">
           <div
@@ -275,4 +280,4 @@ import{a as k}from"./chunks/chunk-EST3M4AO.js";import{b as D}from"./chunks/chunk
           <slot></slot>
         </div>
       </div>
-    `}};r.styles=_,r.EDGE_RESISTANCE=.3,o([l({reflect:!0})],r.prototype,"align",2),o([l({type:Boolean,reflect:!0})],r.prototype,"full",2),o([l({reflect:!0})],r.prototype,"animation",2),o([l({type:Boolean,reflect:!0})],r.prototype,"hideIndicator",2),o([h()],r.prototype,"panels",2),o([h({slot:"navigation"})],r.prototype,"tabs",2),o([d("#tab-indicator")],r.prototype,"indicator",2),o([d("#scrollable")],r.prototype,"scrollableContent",2),o([d("#panel-viewport")],r.prototype,"panelViewport",2),r=o([y(F)],r);export{r as EunomiaTabGroup,F as EunomiaTabGroupTagName};
+    `}};r.styles=A,r.EDGE_RESISTANCE=.3,o([l({reflect:!0})],r.prototype,"align",2),o([l({type:Boolean,reflect:!0})],r.prototype,"full",2),o([l({reflect:!0})],r.prototype,"animation",2),o([l({type:Boolean,reflect:!0})],r.prototype,"hideIndicator",2),o([h()],r.prototype,"panels",2),o([h({slot:"navigation"})],r.prototype,"tabs",2),o([d("#tab-indicator")],r.prototype,"indicator",2),o([d("#scrollable")],r.prototype,"scrollableContent",2),o([d("#panel-viewport")],r.prototype,"panelViewport",2),r=o([y($)],r);export{r as EunomiaTabGroup,$ as EunomiaTabGroupTagName};

package/dist/cdn/components/eun-tab-panel.js

@@ -1,10 +1,18 @@
-import{b as d}from"./chunks/chunk-UDOZRIJZ.js";import{a as i,f as l,g as r,h as s,n,s as o}from"./chunks/chunk-XH6NREVZ.js";var c=r`
+import{b as d}from"./chunks/chunk-UDOZRIJZ.js";import{a as i,f as l,h as r,j as s,p as n,u as o}from"./chunks/chunk-YITWLCD3.js";var c=r`
   :host {
     display: block;
     font-family: var(--eun-font-family, "Mulish", sans-serif);
-    font-size: var(--eun-font-size-s, 14px);
+    font-size: var(--tab-panel-font-size, var(--eun-font-size-s, 14px));
+    outline: var(--tab-panel-focus-outline-width, 2px) solid transparent;
+    outline-offset: var(--tab-panel-focus-outline-offset, 2px);
+  }
+  :host(:focus-visible) {
+    outline-color: var(
+      --tab-panel-focus-outline,
+      var(--eun-color-primary-500, #3d6fff)
+    );
   }
   :host([is-hidden]) {
     display: none;
   }
-`,b=c;var h="eun-tab-panel",t=class extends o{constructor(){super(...arguments);this.isHidden=!0;this.fallbackTabIndexApplied=!1;this.handleSlotChange=()=>{this.syncFallbackTabIndex()}}connectedCallback(){super.connectedCallback?.(),this.hasAttribute("id")||this.setAttribute("id",this.name),this.hasAttribute("role")||this.setAttribute("role","tabpanel"),this.hasAttribute("aria-labelledby")||this.setAttribute("aria-labelledby",`tab-${this.name}`),this.isHidden=!this.closest("eun-tab-group")?.querySelector(`[panel='${this.name}']`)?.hasAttribute("active")}firstUpdated(a){super.firstUpdated?.(a),this.syncFallbackTabIndex()}async waitForNestedRender(){let a=[...this.querySelectorAll("*")].filter(e=>e.tagName.includes("-")),p=new Set(a.map(e=>e.tagName.toLowerCase()));await Promise.all([...p].map(e=>customElements.whenDefined(e).catch(()=>{}))),await Promise.all(a.map(e=>e.updateComplete??Promise.resolve()))}hasFocusableContent(){return d(this,{requireRendered:!1})}syncFallbackTabIndex(){this.applyFallbackTabIndex()||this.waitForNestedRender().then(()=>this.applyFallbackTabIndex())}applyFallbackTabIndex(){return this.hasFocusableContent()?(this.fallbackTabIndexApplied&&(this.removeAttribute("tabindex"),this.fallbackTabIndexApplied=!1),!0):(this.hasAttribute("tabindex")||(this.setAttribute("tabindex","0"),this.fallbackTabIndexApplied=!0),!1)}render(){return n`<slot @slotchange=${this.handleSlotChange}></slot>`}};t.styles=b,i([s({reflect:!0})],t.prototype,"name",2),i([s({reflect:!0,type:Boolean,attribute:"is-hidden"})],t.prototype,"isHidden",2),t=i([l(h)],t);export{t as EunomiaTabPanel,h as EunomiaTabPanelTagName};
+`,p=c;var h="eun-tab-panel",t=class extends o{constructor(){super(...arguments);this.isHidden=!0;this.fallbackTabIndexApplied=!1;this.handleSlotChange=()=>{this.syncFallbackTabIndex()}}connectedCallback(){super.connectedCallback?.(),this.hasAttribute("id")||this.setAttribute("id",this.name),this.hasAttribute("role")||this.setAttribute("role","tabpanel"),this.hasAttribute("aria-labelledby")||this.setAttribute("aria-labelledby",`tab-${this.name}`),this.isHidden=!this.closest("eun-tab-group")?.querySelector(`[panel='${this.name}']`)?.hasAttribute("active")}firstUpdated(a){super.firstUpdated?.(a),this.syncFallbackTabIndex()}async waitForNestedRender(){let a=[...this.querySelectorAll("*")].filter(e=>e.tagName.includes("-")),b=new Set(a.map(e=>e.tagName.toLowerCase()));await Promise.all([...b].map(e=>customElements.whenDefined(e).catch(()=>{}))),await Promise.all(a.map(e=>e.updateComplete??Promise.resolve()))}hasFocusableContent(){return d(this,{requireRendered:!1})}syncFallbackTabIndex(){this.applyFallbackTabIndex()||this.waitForNestedRender().then(()=>this.applyFallbackTabIndex())}applyFallbackTabIndex(){return this.hasFocusableContent()?(this.fallbackTabIndexApplied&&(this.removeAttribute("tabindex"),this.fallbackTabIndexApplied=!1),!0):(this.hasAttribute("tabindex")||(this.setAttribute("tabindex","0"),this.fallbackTabIndexApplied=!0),!1)}render(){return n`<slot @slotchange=${this.handleSlotChange}></slot>`}};t.styles=p,i([s({reflect:!0})],t.prototype,"name",2),i([s({reflect:!0,type:Boolean,attribute:"is-hidden"})],t.prototype,"isHidden",2),t=i([l(h)],t);export{t as EunomiaTabPanel,h as EunomiaTabPanelTagName};

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

@@ -1 +1 @@
-import{a,b}from"./chunks/chunk-RJCJXB7Y.js";import"./chunks/chunk-T7WABJEJ.js";import"./chunks/chunk-VRGRCYIO.js";import"./chunks/chunk-XH6NREVZ.js";export{b as EunomiaTab,a as EunomiaTabTagName};
+import{a,b}from"./chunks/chunk-ZKZV2YG5.js";import"./chunks/chunk-RS7TWEMQ.js";import"./chunks/chunk-PD62MBOJ.js";import"./chunks/chunk-BKZGTCMF.js";import"./chunks/chunk-YITWLCD3.js";export{b as EunomiaTab,a as EunomiaTabTagName};

package/dist/cdn/components/eun-table-action-bar.js

@@ -1 +1 @@
-import{b as a,c as b}from"./chunks/chunk-EOWBYZV7.js";import"./chunks/chunk-VRGRCYIO.js";import"./chunks/chunk-5EVP7YNE.js";import"./chunks/chunk-XH6NREVZ.js";export{b as EunomiaTableActionBar,a as EunomiaTableActionBarTagName};
+import{b as a,c as b}from"./chunks/chunk-KDN4O5W2.js";import"./chunks/chunk-PD62MBOJ.js";import"./chunks/chunk-BKZGTCMF.js";import"./chunks/chunk-PPCHQG7P.js";import"./chunks/chunk-LMVW522V.js";import"./chunks/chunk-KSZRQRN4.js";import"./chunks/chunk-YITWLCD3.js";export{b as EunomiaTableActionBar,a as EunomiaTableActionBarTagName};