@editora/ui-core 0.1.25 → 0.2.1

package/dist/odometer.esm.js

@@ -16,10 +16,10 @@ const D = `
     --ui-odometer-container-bg: transparent;
     --ui-odometer-container-border: none;
     --ui-odometer-container-radius: 999px;
-    --ui-odometer-digit-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(226, 232, 240, 0.9));
-    --ui-odometer-digit-border: 1px solid rgba(148, 163, 184, 0.35);
+    --ui-odometer-digit-bg: var(--ui-color-fill, #f0f0f0);
+    --ui-odometer-digit-border: 1px solid var(--ui-color-line-subtle, rgba(148, 163, 184, 0.35));
     --ui-odometer-digit-radius: 0.18em;
-    --ui-odometer-digit-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 2px rgba(15, 23, 42, 0.12);
+    --ui-odometer-digit-shadow: none;
     --ui-odometer-separator-opacity: 0.7;
     --ui-odometer-affix-opacity: 0.82;
 
@@ -53,19 +53,19 @@ const D = `
   }
 
   :host([tone="brand"]) {
-    --ui-odometer-color: var(--ui-color-primary, #2563eb);
+    --ui-odometer-color: var(--ui-color-accent-text, var(--ui-color-primary, #2563eb));
   }
 
   :host([tone="success"]) {
-    --ui-odometer-color: var(--ui-color-success, #15803d);
+    --ui-odometer-color: var(--ui-color-success-text, var(--ui-color-success, #15803d));
   }
 
   :host([tone="warning"]) {
-    --ui-odometer-color: var(--ui-color-warning, #b45309);
+    --ui-odometer-color: var(--ui-color-warning-text, var(--ui-color-warning, #b45309));
   }
 
   :host([tone="danger"]) {
-    --ui-odometer-color: var(--ui-color-danger, #dc2626);
+    --ui-odometer-color: var(--ui-color-danger-text, var(--ui-color-danger, #dc2626));
   }
 
   :host([theme="dark"]) {
@@ -76,7 +76,7 @@ const D = `
   }
 
   :host([theme="brand"]) {
-    --ui-odometer-color: var(--ui-color-primary, #2563eb);
+    --ui-odometer-color: var(--ui-color-accent-text, var(--ui-color-primary, #2563eb));
     --ui-odometer-digit-bg: linear-gradient(180deg, rgba(219, 234, 254, 0.98), rgba(191, 219, 254, 0.94));
     --ui-odometer-digit-border: 1px solid rgba(37, 99, 235, 0.22);
   }
@@ -353,7 +353,7 @@ function A(e) {
   } : {};
 }
 function S(e, t) {
-  const i = k(n(e, "format")), r = n(e, "locale") || void 0, o = n(e, "currency") || void 0, u = C(n(e, "notation")), m = n(e, "decimal-separator"), c = n(e, "group-separator"), s = A(e), y = {
+  const i = k(n(e, "format")), r = n(e, "locale") || void 0, o = n(e, "currency") || void 0, u = C(n(e, "notation")), m = n(e, "decimal-separator"), c = n(e, "group-separator"), s = A(e), v = {
     style: i === "currency" && o ? "currency" : i === "percent" ? "percent" : "decimal",
     currency: i === "currency" && o ? o : void 0,
     notation: u,
@@ -364,14 +364,14 @@ function S(e, t) {
   };
   let p;
   try {
-    p = new Intl.NumberFormat(r, y).formatToParts(t);
+    p = new Intl.NumberFormat(r, v).formatToParts(t);
   } catch {
-    p = new Intl.NumberFormat(void 0, y).formatToParts(t);
+    p = new Intl.NumberFormat(void 0, v).formatToParts(t);
   }
   const d = [];
   for (const a of p) {
-    const v = a.type === "decimal" && m != null ? m : a.type === "group" && c != null ? c : a.value;
-    for (const f of v) {
+    const y = a.type === "decimal" && m != null ? m : a.type === "group" && c != null ? c : a.value;
+    for (const f of y) {
       if (/[0-9]/.test(f)) {
         d.push({ kind: "digit", value: f });
         continue;
@@ -509,22 +509,22 @@ class j extends T {
     return typeof window < "u" && window.matchMedia ? window.matchMedia("(prefers-reduced-motion: reduce)").matches : !1;
   }
   render() {
-    const t = M(n(this, "variant")), i = n(this, "prefix") || "", r = n(this, "suffix") || "", o = n(this, "label"), u = S(this, this._currentValue), m = o || `${i}${u.text}${r}`, c = this._animationFrame !== null, s = c ? 1 - this._animationProgress : 0, y = this._motionDirection === "down" ? -1 : this._motionDirection === "up" ? 1 : 0;
+    const t = M(n(this, "variant")), i = n(this, "prefix") || "", r = n(this, "suffix") || "", o = n(this, "label"), u = S(this, this._currentValue), m = o || `${i}${u.text}${r}`, c = this._animationFrame !== null, s = c ? 1 - this._animationProgress : 0, v = this._motionDirection === "down" ? -1 : this._motionDirection === "up" ? 1 : 0;
     let p = "value-display", d = "";
     t === "digital" ? (p += " digital-display", d = [
       `--ui-odometer-motion-intensity: ${s.toFixed(3)}`,
-      `--ui-odometer-digital-shift-y: ${(y * s * 0.16).toFixed(3)}em`,
+      `--ui-odometer-digital-shift-y: ${(v * s * 0.16).toFixed(3)}em`,
       `--ui-odometer-digital-scale-y: ${(1 + s * 0.08).toFixed(3)}`
     ].join("; ")) : t === "analog" && (p += " analog-display", d = [
       `--ui-odometer-motion-intensity: ${s.toFixed(3)}`,
-      `--ui-odometer-analog-shift-x: ${(y * s * 0.08).toFixed(3)}em`,
+      `--ui-odometer-analog-shift-x: ${(v * s * 0.08).toFixed(3)}em`,
       `--ui-odometer-analog-shift-y: ${(-s * 0.05).toFixed(3)}em`,
       `--ui-odometer-analog-scale: ${(1 + s * 0.03).toFixed(3)}`,
       `--ui-odometer-analog-blur: ${(s * 0.035).toFixed(3)}em`
     ].join("; "));
     let a = `<span class="${p}" part="value" aria-hidden="true"${d ? ` style="${d}"` : ""}>${x(u.text)}</span>`;
     if (t === "odometer") {
-      const v = N(n(this, "direction")), f = v === "auto" ? this._targetValue >= this._startValue ? "up" : "down" : v, g = P(f);
+      const y = N(n(this, "direction")), f = y === "auto" ? this._targetValue >= this._startValue ? "up" : "down" : y, g = P(f);
       a = `
         <span class="digits" part="digits" role="img" aria-label="${x(m)}">
           ${u.tokens.map((_) => {

package/dist/orbiter.cjs.js

@@ -7,40 +7,23 @@
     --ui-orbiter-center-size: ${w};
     --ui-orbiter-ring-gap: ${E};
     --ui-orbiter-padding: ${$};
-    --ui-orbiter-radius: 28px;
+    --ui-orbiter-radius: calc(var(--ui-radius, 6px) + 4px);
     --ui-orbiter-stage-size:
       calc((2 * var(--ui-orbiter-farthest-radius, ${A})) + var(--ui-orbiter-item-size));
     --ui-orbiter-accent: var(--ui-color-primary, var(--ui-primary, #2563eb));
-    --ui-orbiter-bg:
-      radial-gradient(
-        circle at 50% 50%,
-        color-mix(in srgb, var(--ui-color-surface-elevated, #f8fafc) 92%, transparent) 0%,
-        color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, transparent) 64%,
-        color-mix(in srgb, var(--ui-color-surface, #ffffff) 84%, transparent) 100%
-      );
+    --ui-orbiter-bg: var(--color-panel-solid, var(--ui-color-surface, #ffffff));
     --ui-orbiter-color: var(--ui-color-text, #0f172a);
-    --ui-orbiter-border-color:
-      color-mix(in srgb, var(--ui-color-border, rgba(15, 23, 42, 0.16)) 86%, transparent);
+    --ui-orbiter-border-color: var(--ui-color-line-subtle, color-mix(in srgb, var(--ui-color-border, #cbd5e1) 76%, transparent));
     --ui-orbiter-border: 1px solid var(--ui-orbiter-border-color);
-    --ui-orbiter-shadow:
-      0 1px 3px rgba(15, 23, 42, 0.06),
-      0 24px 44px rgba(15, 23, 42, 0.12);
+    --ui-orbiter-shadow: none;
     --ui-orbiter-backdrop: none;
     --ui-orbiter-path-color:
       color-mix(in srgb, var(--ui-orbiter-accent) 16%, var(--ui-orbiter-border-color));
     --ui-orbiter-path-opacity: 0.95;
-    --ui-orbiter-item-bg:
-      linear-gradient(
-        180deg,
-        color-mix(in srgb, #ffffff 96%, transparent),
-        color-mix(in srgb, var(--ui-orbiter-accent) 8%, rgba(255, 255, 255, 0.9))
-      );
+    --ui-orbiter-item-bg: var(--color-panel-solid, var(--ui-color-surface, #ffffff));
     --ui-orbiter-item-color: var(--ui-orbiter-color);
-    --ui-orbiter-item-border:
-      1px solid color-mix(in srgb, var(--ui-orbiter-accent) 12%, rgba(255, 255, 255, 0.82));
-    --ui-orbiter-item-shadow:
-      0 8px 14px rgba(15, 23, 42, 0.08),
-      0 1px 2px rgba(15, 23, 42, 0.05);
+    --ui-orbiter-item-border: 1px solid var(--ui-color-line-subtle, color-mix(in srgb, var(--ui-color-border, #cbd5e1) 76%, transparent));
+    --ui-orbiter-item-shadow: none;
     --ui-orbiter-item-backdrop: none;
     --ui-orbiter-center-bg:
       radial-gradient(
@@ -366,7 +349,7 @@
     outline: none;
     border-color: color-mix(in srgb, var(--ui-orbiter-focus-ring) 30%, transparent);
     box-shadow:
-      0 0 0 3px color-mix(in srgb, var(--ui-orbiter-focus-ring) 20%, transparent),
+      0 0 0 2px var(--ui-ring-color, var(--ui-orbiter-focus-ring)),
       var(--ui-orbiter-item-shadow);
   }
 
@@ -434,7 +417,7 @@
     outline: none;
     border-color: color-mix(in srgb, var(--ui-orbiter-focus-ring) 24%, transparent);
     box-shadow:
-      0 0 0 3px color-mix(in srgb, var(--ui-orbiter-focus-ring) 18%, transparent),
+      0 0 0 2px var(--ui-ring-color, var(--ui-orbiter-focus-ring)),
       var(--ui-orbiter-shadow);
   }
 
@@ -479,7 +462,7 @@
       forced-color-adjust: none;
     }
   }
-`;function h(i,t){if(i==null||i==="")return t;const e=i.trim();if(!e)return t;const s=e.split(/\s+/).filter(Boolean);if(!s.length)return t;const b=s.map(a=>/^-?\d+(\.\d+)?$/.test(a)?`${a}px`:/^-?\d*\.?\d+(px|rem|em|%|vh|vw|ch|ex|vmin|vmax)$/.test(a)?a:null);return b.some(a=>a===null)?t:b.join(" ")}function N(i,t){if(i==null||i==="")return t;const e=i.trim();return e?/^-?\d+(\.\d+)?(ms|s)$/i.test(e)?e:/^-?\d+(\.\d+)?$/i.test(e)?`${e}s`:t:t}function F(i,t){if(i==null||i==="")return t;const e=i.trim();return e?/^-?\d+(\.\d+)?ms$/i.test(e)?Number.parseFloat(e):/^-?\d+(\.\d+)?s$/i.test(e)||/^-?\d+(\.\d+)?$/i.test(e)?Number.parseFloat(e)*1e3:t:t}function g(i,t){if(i==null||i==="")return t;const e=Number.parseFloat(i);return Number.isFinite(e)?e:t}function S(i,t){const e=g(i,t);return Number.isFinite(e)&&e>0?e:t}function q(i,t){if(i==null)return t;const e=i.trim().toLowerCase();return e?e==="false"||e==="0"||e==="off"||e==="no"?!1:e==="true"||e==="1"||e==="on"||e==="yes"?!0:t:!0}function v(i,t){return`translate(-50%, -50%) rotate(${i}deg) translateX(${t}) rotate(${-i}deg)`}function z(i){const t=Math.round(g(i,1));return Math.min(X,Math.max(1,t||1))}class D extends B.ElementBase{constructor(){super(),this._itemSlot=null,this._centerSlot=null,this._pathsEl=null,this._items=[],this._centerNodes=[],this._animations=new Map,this._hovering=!1,this._itemHovering=!1,this._focusWithin=!1,this._itemHoverHandlers=new WeakMap,this._boundSlotChange=this._handleSlotChange.bind(this),this._boundPointerEnter=()=>{this._hovering=!0,this._syncState()},this._boundPointerLeave=()=>{this._hovering=!1,this._syncState()},this._boundFocusIn=()=>{this._focusWithin=!0,this._syncState()},this._boundFocusOut=()=>{this._focusWithin=this.matches(":focus-within"),this._syncState()},this.addEventListener("pointerenter",this._boundPointerEnter),this.addEventListener("pointerleave",this._boundPointerLeave),this.addEventListener("focusin",this._boundFocusIn),this.addEventListener("focusout",this._boundFocusOut)}static get observedAttributes(){return["duration","delay","speed","reverse","radius","orbit-radius","icon-size","item-size","center-size","ring-gap","rings","start-angle","direction","animation","variant","tone","size","surface-radius","elevation","padding","path","show-paths","pause-on-hover","pause-on-item-hover","pause-on-focus","paused"]}play(){this.hasAttribute("paused")&&this.removeAttribute("paused"),this._syncState()}pause(){this.hasAttribute("paused")||this.setAttribute("paused",""),this._syncState()}refresh(){this._syncRuntimeStyles(),this._syncItems(),this._renderPaths(),this._syncAnimations(),this._syncState()}disconnectedCallback(){this._cancelAllAnimations(),this._hovering=!1,this._itemHovering=!1,this._focusWithin=!1,super.disconnectedCallback()}render(){this.setContent(`
+`;function h(i,t){if(i==null||i==="")return t;const e=i.trim();if(!e)return t;const s=e.split(/\s+/).filter(Boolean);if(!s.length)return t;const c=s.map(a=>/^-?\d+(\.\d+)?$/.test(a)?`${a}px`:/^-?\d*\.?\d+(px|rem|em|%|vh|vw|ch|ex|vmin|vmax)$/.test(a)?a:null);return c.some(a=>a===null)?t:c.join(" ")}function N(i,t){if(i==null||i==="")return t;const e=i.trim();return e?/^-?\d+(\.\d+)?(ms|s)$/i.test(e)?e:/^-?\d+(\.\d+)?$/i.test(e)?`${e}s`:t:t}function F(i,t){if(i==null||i==="")return t;const e=i.trim();return e?/^-?\d+(\.\d+)?ms$/i.test(e)?Number.parseFloat(e):/^-?\d+(\.\d+)?s$/i.test(e)||/^-?\d+(\.\d+)?$/i.test(e)?Number.parseFloat(e)*1e3:t:t}function g(i,t){if(i==null||i==="")return t;const e=Number.parseFloat(i);return Number.isFinite(e)?e:t}function S(i,t){const e=g(i,t);return Number.isFinite(e)&&e>0?e:t}function q(i,t){if(i==null)return t;const e=i.trim().toLowerCase();return e?e==="false"||e==="0"||e==="off"||e==="no"?!1:e==="true"||e==="1"||e==="on"||e==="yes"?!0:t:!0}function v(i,t){return`translate(-50%, -50%) rotate(${i}deg) translateX(${t}) rotate(${-i}deg)`}function z(i){const t=Math.round(g(i,1));return Math.min(X,Math.max(1,t||1))}class D extends B.ElementBase{constructor(){super(),this._itemSlot=null,this._centerSlot=null,this._pathsEl=null,this._items=[],this._centerNodes=[],this._animations=new Map,this._hovering=!1,this._itemHovering=!1,this._focusWithin=!1,this._itemHoverHandlers=new WeakMap,this._boundSlotChange=this._handleSlotChange.bind(this),this._boundPointerEnter=()=>{this._hovering=!0,this._syncState()},this._boundPointerLeave=()=>{this._hovering=!1,this._syncState()},this._boundFocusIn=()=>{this._focusWithin=!0,this._syncState()},this._boundFocusOut=()=>{this._focusWithin=this.matches(":focus-within"),this._syncState()},this.addEventListener("pointerenter",this._boundPointerEnter),this.addEventListener("pointerleave",this._boundPointerLeave),this.addEventListener("focusin",this._boundFocusIn),this.addEventListener("focusout",this._boundFocusOut)}static get observedAttributes(){return["duration","delay","speed","reverse","radius","orbit-radius","icon-size","item-size","center-size","ring-gap","rings","start-angle","direction","animation","variant","tone","size","surface-radius","elevation","padding","path","show-paths","pause-on-hover","pause-on-item-hover","pause-on-focus","paused"]}play(){this.hasAttribute("paused")&&this.removeAttribute("paused"),this._syncState()}pause(){this.hasAttribute("paused")||this.setAttribute("paused",""),this._syncState()}refresh(){this._syncRuntimeStyles(),this._syncItems(),this._renderPaths(),this._syncAnimations(),this._syncState()}disconnectedCallback(){this._cancelAllAnimations(),this._hovering=!1,this._itemHovering=!1,this._focusWithin=!1,super.disconnectedCallback()}render(){this.setContent(`
       <style>${Q}</style>
       <div class="root" part="root">
         <div class="surface" part="surface">
@@ -492,4 +475,4 @@
           </div>
         </div>
       </div>
-    `),this._itemSlot=this.root.querySelector("slot:not([name])"),this._centerSlot=this.root.querySelector('slot[name="center"]'),this._pathsEl=this.root.querySelector(".paths"),this._itemSlot?.addEventListener("slotchange",this._boundSlotChange),this._centerSlot?.addEventListener("slotchange",this._boundSlotChange),this._syncRuntimeStyles(),this._syncItems(),this._renderPaths(),this._syncAnimations(),this._syncState()}shouldRenderOnAttributeChange(){return!1}attributeChangedCallback(t,e,s){if(!(e===s||!this.isConnected)){if(t==="paused"){this._syncState();return}this._syncRuntimeStyles(),t==="orbit-radius"||t==="radius"||t==="icon-size"||t==="item-size"||t==="center-size"||t==="ring-gap"||t==="rings"||t==="start-angle"||t==="direction"||t==="reverse"||t==="size"?(this._syncItems(),this._renderPaths(),this._syncAnimations()):(t==="duration"||t==="delay"||t==="speed"||t==="animation")&&this._syncAnimations(),this._syncState()}}_handleSlotChange(){this._syncItems(),this._renderPaths(),this._syncAnimations(),this._syncState()}_itemsFromSlot(){return this._itemSlot?this._itemSlot.assignedElements({flatten:!0}).filter(t=>t instanceof HTMLElement):[]}_centerFromSlot(){return this._centerSlot?this._centerSlot.assignedElements({flatten:!0}).filter(t=>t instanceof HTMLElement):[]}_syncItems(){const t=this._itemsFromSlot(),e=this._centerFromSlot(),s=new Set(t),b=new Set(e);for(const r of this._items)s.has(r)||(this._unbindItemHover(r),this._cancelAnimation(r),r.removeAttribute("data-ui-orbiter-managed"),r.removeAttribute("data-ui-orbit-runtime"),r.style.removeProperty("--ui-orbit-index"),r.style.removeProperty("--ui-orbit-ring"),r.style.removeProperty("--ui-orbit-radius"),r.style.removeProperty("--ui-orbit-start-angle"),r.style.removeProperty("--ui-orbit-quarter-angle"),r.style.removeProperty("--ui-orbit-half-angle"),r.style.removeProperty("--ui-orbit-three-quarter-angle"),r.style.removeProperty("--ui-orbit-end-angle"),r.style.removeProperty("--ui-orbit-start-angle-inverse"),r.style.removeProperty("--ui-orbit-quarter-angle-inverse"),r.style.removeProperty("--ui-orbit-half-angle-inverse"),r.style.removeProperty("--ui-orbit-three-quarter-angle-inverse"),r.style.removeProperty("--ui-orbit-end-angle-inverse"),r.style.removeProperty("--ui-orbit-duration"),r.style.removeProperty("--ui-orbit-duration-scale"),r.style.removeProperty("animation"),r.style.removeProperty("transform"),r.hasAttribute("data-ui-orbiter-owned")&&(r.removeAttribute("data-ui-orbiter-item"),r.removeAttribute("data-ui-orbiter-owned")));for(const r of this._centerNodes)b.has(r)||(r.removeAttribute("data-ui-orbiter-managed"),r.hasAttribute("data-ui-orbiter-owned")&&(r.removeAttribute("data-ui-orbiter-center"),r.removeAttribute("data-ui-orbiter-owned")));e.forEach(r=>{r.setAttribute("data-ui-orbiter-managed",""),r.hasAttribute("data-ui-orbiter-center")||(r.setAttribute("data-ui-orbiter-center",""),r.setAttribute("data-ui-orbiter-owned","")),r.setAttribute("slot","center")});const a=z(this.getAttribute("rings")),u=h(this._orbitRadiusValue(),this._sizePreset().orbitRadius),o=h(this.getAttribute("ring-gap"),this._sizePreset().ringGap),l=g(this.getAttribute("start-angle"),C),d=Array.from({length:a},()=>[]);t.forEach((r,c)=>{r.setAttribute("data-ui-orbiter-managed",""),r.hasAttribute("data-ui-orbiter-item")||(r.setAttribute("data-ui-orbiter-item",""),r.setAttribute("data-ui-orbiter-owned","")),this._bindItemHover(r),d[c%a].push({item:r,index:c})}),d.forEach((r,c)=>{const f=r.length?360/r.length:360,y=r.length>1&&c%2===1?f/2:0,p=c===0?u:`calc(${u} + ${c} * ${o})`,x=360*this._directionSign(c);r.forEach(({item:n,index:G},U)=>{const m=l+y+U*f,R=m+x,k=m+x*.25,I=m+x*.5,L=m+x*.75,H=1+c*.14;n.style.setProperty("--ui-orbit-index",String(G)),n.style.setProperty("--ui-orbit-ring",String(c)),n.style.setProperty("--ui-orbit-radius",p),n.style.setProperty("--ui-orbit-duration",`calc(var(--ui-orbiter-duration) * ${H})`),n.style.setProperty("--ui-orbit-duration-scale",String(H)),n.style.setProperty("--ui-orbit-start-angle",`${m}deg`),n.style.setProperty("--ui-orbit-quarter-angle",`${k}deg`),n.style.setProperty("--ui-orbit-half-angle",`${I}deg`),n.style.setProperty("--ui-orbit-three-quarter-angle",`${L}deg`),n.style.setProperty("--ui-orbit-end-angle",`${R}deg`),n.style.setProperty("--ui-orbit-start-angle-inverse",`${-m}deg`),n.style.setProperty("--ui-orbit-quarter-angle-inverse",`${-k}deg`),n.style.setProperty("--ui-orbit-half-angle-inverse",`${-I}deg`),n.style.setProperty("--ui-orbit-three-quarter-angle-inverse",`${-L}deg`),n.style.setProperty("--ui-orbit-end-angle-inverse",`${-R}deg`),n.style.setProperty("transform",v(m,p))})}),this._items=t,this._centerNodes=e,this._itemHovering=this._items.some(r=>r.matches(":hover")),this.setAttribute("data-item-count",String(this._items.length)),this.setAttribute("data-center-count",String(this._centerNodes.length)),this.setAttribute("data-ring-count",String(a))}_renderPaths(){if(!this._pathsEl)return;const t=z(this.getAttribute("rings")),e=h(this._orbitRadiusValue(),this._sizePreset().orbitRadius),s=h(this.getAttribute("ring-gap"),this._sizePreset().ringGap),b=Array.from({length:t},(a,u)=>{const o=u===0?e:`calc(${e} + ${u} * ${s})`;return`<div class="path" part="path path-${u+1}" style="inline-size:calc(2 * (${o}));block-size:calc(2 * (${o}));"></div>`}).join("");this._pathsEl.innerHTML=b,this._pathsEl.toggleAttribute("hidden",!this._pathVisible())}_bindItemHover(t){if(this._itemHoverHandlers.has(t))return;const e=()=>{this._itemHovering=!0,this._syncState()},s=b=>{const u=(b.relatedTarget instanceof HTMLElement?b.relatedTarget:null)?.closest("[data-ui-orbiter-item]");this._itemHovering=u instanceof HTMLElement?this._items.includes(u):!1,this._syncState()};t.addEventListener("pointerenter",e),t.addEventListener("pointerleave",s),this._itemHoverHandlers.set(t,{enter:e,leave:s})}_unbindItemHover(t){const e=this._itemHoverHandlers.get(t);e&&(t.removeEventListener("pointerenter",e.enter),t.removeEventListener("pointerleave",e.leave),this._itemHoverHandlers.delete(t))}_sizePreset(){switch(this.getAttribute("size")){case"xs":case"0":return _.xs;case"sm":case"1":return _.sm;case"lg":case"3":return _.lg;case"xl":case"4":return _.xl;default:return _.md}}_motionPreset(){const t=this.getAttribute("animation");return t&&Z.has(t)?M[t]:M.smooth}_direction(){const t=this.getAttribute("direction");return t&&j.has(t)?t:"clockwise"}_directionSign(t){const e=this._direction();let s=e==="counterclockwise"||e==="alternate"&&t%2===1?-1:1;return q(this.getAttribute("reverse"),this.hasAttribute("reverse"))&&(s*=-1),s}_pathVisible(){const t=this.getAttribute("path");return t!=null?q(t,!0):(this.hasAttribute("show-paths"),!0)}_orbitRadiusValue(){return this.getAttribute("radius")??this.getAttribute("orbit-radius")}_iconSizeValue(){return this.getAttribute("icon-size")??this.getAttribute("item-size")}_syncRuntimeStyles(){const t=this._sizePreset(),e=this._motionPreset(),s=N(this.getAttribute("duration"),O),b=N(this.getAttribute("delay"),V),a=h(this._orbitRadiusValue(),t.orbitRadius),u=h(this._iconSizeValue(),t.itemSize),o=h(this.getAttribute("center-size"),t.centerSize),l=h(this.getAttribute("ring-gap"),t.ringGap),d=h(this.getAttribute("padding"),t.padding),r=z(this.getAttribute("rings")),c=S(this.getAttribute("speed"),1),f=r<=1?a:`calc(${a} + ${r-1} * ${l})`,y=`calc((2 * (${f})) + ${u})`;this.style.setProperty("--ui-orbiter-duration",`calc((${s}) * ${e.durationScale} / ${c})`),this.style.setProperty("--ui-orbiter-delay",b),this.style.setProperty("--ui-orbiter-orbit-radius",a),this.style.setProperty("--ui-orbiter-item-size",u),this.style.setProperty("--ui-orbiter-center-size",o),this.style.setProperty("--ui-orbiter-ring-gap",l),this.style.setProperty("--ui-orbiter-padding",d),this.style.setProperty("--ui-orbiter-farthest-radius",f),this.style.setProperty("--ui-orbiter-stage-size",y),this.style.setProperty("--ui-orbiter-path-opacity",String(e.accentOpacity>.18?1:.95));const p=this.getAttribute("surface-radius");!p||W.has(p.trim())?this.style.removeProperty("--ui-orbiter-radius"):this.style.setProperty("--ui-orbiter-radius",h(p,t.panelRadius))}_syncAnimations(){const t=this._items,e=new Set(t);for(const[o,l]of this._animations.entries())e.has(o)||(l.cancel(),this._animations.delete(o));if(typeof window<"u"&&window.matchMedia?.("(prefers-reduced-motion: reduce)").matches){this._cancelAllAnimations(),t.forEach(o=>o.removeAttribute("data-ui-orbit-runtime"));return}if(typeof HTMLElement>"u"||typeof HTMLElement.prototype.animate!="function"){t.forEach(o=>o.removeAttribute("data-ui-orbit-runtime"));return}const s=this._motionPreset(),b=F(this.getAttribute("duration"),18e3),a=F(this.getAttribute("delay"),0),u=S(this.getAttribute("speed"),1);for(const o of t){const l=o.style.getPropertyValue("--ui-orbit-radius")||"var(--ui-orbiter-orbit-radius)",d=g(o.style.getPropertyValue("--ui-orbit-start-angle"),C),r=g(o.style.getPropertyValue("--ui-orbit-quarter-angle"),d+90),c=g(o.style.getPropertyValue("--ui-orbit-half-angle"),d+180),f=g(o.style.getPropertyValue("--ui-orbit-three-quarter-angle"),d+270),y=g(o.style.getPropertyValue("--ui-orbit-end-angle"),d+360),p=S(o.style.getPropertyValue("--ui-orbit-duration-scale"),1),T=b*s.durationScale*p/u;this._animations.get(o)?.cancel(),o.setAttribute("data-ui-orbit-runtime","");const n=o.animate([{transform:v(d,l),offset:0},{transform:v(r,l),offset:.25},{transform:v(c,l),offset:.5},{transform:v(f,l),offset:.75},{transform:v(y,l),offset:1}],{duration:Math.max(1,T),delay:Math.max(0,a),easing:"linear",iterations:Number.POSITIVE_INFINITY,fill:"both"});this._animations.set(o,n)}}_cancelAnimation(t){const e=this._animations.get(t);t.removeAttribute("data-ui-orbit-runtime"),e&&(e.cancel(),this._animations.delete(t))}_cancelAllAnimations(){for(const t of this._animations.values())t.cancel();this._animations.clear(),this._items.forEach(t=>{t.removeAttribute("data-ui-orbit-runtime"),this._unbindItemHover(t)})}_effectivePaused(){return!!(this.hasAttribute("paused")||this.hasAttribute("pause-on-hover")&&this._hovering||this.hasAttribute("pause-on-item-hover")&&this._itemHovering||this.hasAttribute("pause-on-focus")&&this._focusWithin)}_syncState(){const t=this._effectivePaused()?"paused":"running";this.setAttribute("data-state",t),this.setAttribute("data-path-visible",this._pathVisible()?"true":"false"),this.setAttribute("data-item-hovered",this._itemHovering?"true":"false");for(const e of this._animations.values())t==="paused"?e.pause():e.play()}}typeof customElements<"u"&&!customElements.get("ui-orbiter")&&customElements.define("ui-orbiter",D);exports.UIOrbiter=D;
+    `),this._itemSlot=this.root.querySelector("slot:not([name])"),this._centerSlot=this.root.querySelector('slot[name="center"]'),this._pathsEl=this.root.querySelector(".paths"),this._itemSlot?.addEventListener("slotchange",this._boundSlotChange),this._centerSlot?.addEventListener("slotchange",this._boundSlotChange),this._syncRuntimeStyles(),this._syncItems(),this._renderPaths(),this._syncAnimations(),this._syncState()}shouldRenderOnAttributeChange(){return!1}attributeChangedCallback(t,e,s){if(!(e===s||!this.isConnected)){if(t==="paused"){this._syncState();return}this._syncRuntimeStyles(),t==="orbit-radius"||t==="radius"||t==="icon-size"||t==="item-size"||t==="center-size"||t==="ring-gap"||t==="rings"||t==="start-angle"||t==="direction"||t==="reverse"||t==="size"?(this._syncItems(),this._renderPaths(),this._syncAnimations()):(t==="duration"||t==="delay"||t==="speed"||t==="animation")&&this._syncAnimations(),this._syncState()}}_handleSlotChange(){this._syncItems(),this._renderPaths(),this._syncAnimations(),this._syncState()}_itemsFromSlot(){return this._itemSlot?this._itemSlot.assignedElements({flatten:!0}).filter(t=>t instanceof HTMLElement):[]}_centerFromSlot(){return this._centerSlot?this._centerSlot.assignedElements({flatten:!0}).filter(t=>t instanceof HTMLElement):[]}_syncItems(){const t=this._itemsFromSlot(),e=this._centerFromSlot(),s=new Set(t),c=new Set(e);for(const r of this._items)s.has(r)||(this._unbindItemHover(r),this._cancelAnimation(r),r.removeAttribute("data-ui-orbiter-managed"),r.removeAttribute("data-ui-orbit-runtime"),r.style.removeProperty("--ui-orbit-index"),r.style.removeProperty("--ui-orbit-ring"),r.style.removeProperty("--ui-orbit-radius"),r.style.removeProperty("--ui-orbit-start-angle"),r.style.removeProperty("--ui-orbit-quarter-angle"),r.style.removeProperty("--ui-orbit-half-angle"),r.style.removeProperty("--ui-orbit-three-quarter-angle"),r.style.removeProperty("--ui-orbit-end-angle"),r.style.removeProperty("--ui-orbit-start-angle-inverse"),r.style.removeProperty("--ui-orbit-quarter-angle-inverse"),r.style.removeProperty("--ui-orbit-half-angle-inverse"),r.style.removeProperty("--ui-orbit-three-quarter-angle-inverse"),r.style.removeProperty("--ui-orbit-end-angle-inverse"),r.style.removeProperty("--ui-orbit-duration"),r.style.removeProperty("--ui-orbit-duration-scale"),r.style.removeProperty("animation"),r.style.removeProperty("transform"),r.hasAttribute("data-ui-orbiter-owned")&&(r.removeAttribute("data-ui-orbiter-item"),r.removeAttribute("data-ui-orbiter-owned")));for(const r of this._centerNodes)c.has(r)||(r.removeAttribute("data-ui-orbiter-managed"),r.hasAttribute("data-ui-orbiter-owned")&&(r.removeAttribute("data-ui-orbiter-center"),r.removeAttribute("data-ui-orbiter-owned")));e.forEach(r=>{r.setAttribute("data-ui-orbiter-managed",""),r.hasAttribute("data-ui-orbiter-center")||(r.setAttribute("data-ui-orbiter-center",""),r.setAttribute("data-ui-orbiter-owned","")),r.setAttribute("slot","center")});const a=z(this.getAttribute("rings")),u=h(this._orbitRadiusValue(),this._sizePreset().orbitRadius),o=h(this.getAttribute("ring-gap"),this._sizePreset().ringGap),l=g(this.getAttribute("start-angle"),C),d=Array.from({length:a},()=>[]);t.forEach((r,b)=>{r.setAttribute("data-ui-orbiter-managed",""),r.hasAttribute("data-ui-orbiter-item")||(r.setAttribute("data-ui-orbiter-item",""),r.setAttribute("data-ui-orbiter-owned","")),this._bindItemHover(r),d[b%a].push({item:r,index:b})}),d.forEach((r,b)=>{const f=r.length?360/r.length:360,y=r.length>1&&b%2===1?f/2:0,p=b===0?u:`calc(${u} + ${b} * ${o})`,x=360*this._directionSign(b);r.forEach(({item:n,index:G},U)=>{const m=l+y+U*f,R=m+x,k=m+x*.25,I=m+x*.5,L=m+x*.75,H=1+b*.14;n.style.setProperty("--ui-orbit-index",String(G)),n.style.setProperty("--ui-orbit-ring",String(b)),n.style.setProperty("--ui-orbit-radius",p),n.style.setProperty("--ui-orbit-duration",`calc(var(--ui-orbiter-duration) * ${H})`),n.style.setProperty("--ui-orbit-duration-scale",String(H)),n.style.setProperty("--ui-orbit-start-angle",`${m}deg`),n.style.setProperty("--ui-orbit-quarter-angle",`${k}deg`),n.style.setProperty("--ui-orbit-half-angle",`${I}deg`),n.style.setProperty("--ui-orbit-three-quarter-angle",`${L}deg`),n.style.setProperty("--ui-orbit-end-angle",`${R}deg`),n.style.setProperty("--ui-orbit-start-angle-inverse",`${-m}deg`),n.style.setProperty("--ui-orbit-quarter-angle-inverse",`${-k}deg`),n.style.setProperty("--ui-orbit-half-angle-inverse",`${-I}deg`),n.style.setProperty("--ui-orbit-three-quarter-angle-inverse",`${-L}deg`),n.style.setProperty("--ui-orbit-end-angle-inverse",`${-R}deg`),n.style.setProperty("transform",v(m,p))})}),this._items=t,this._centerNodes=e,this._itemHovering=this._items.some(r=>r.matches(":hover")),this.setAttribute("data-item-count",String(this._items.length)),this.setAttribute("data-center-count",String(this._centerNodes.length)),this.setAttribute("data-ring-count",String(a))}_renderPaths(){if(!this._pathsEl)return;const t=z(this.getAttribute("rings")),e=h(this._orbitRadiusValue(),this._sizePreset().orbitRadius),s=h(this.getAttribute("ring-gap"),this._sizePreset().ringGap),c=Array.from({length:t},(a,u)=>{const o=u===0?e:`calc(${e} + ${u} * ${s})`;return`<div class="path" part="path path-${u+1}" style="inline-size:calc(2 * (${o}));block-size:calc(2 * (${o}));"></div>`}).join("");this._pathsEl.innerHTML=c,this._pathsEl.toggleAttribute("hidden",!this._pathVisible())}_bindItemHover(t){if(this._itemHoverHandlers.has(t))return;const e=()=>{this._itemHovering=!0,this._syncState()},s=c=>{const u=(c.relatedTarget instanceof HTMLElement?c.relatedTarget:null)?.closest("[data-ui-orbiter-item]");this._itemHovering=u instanceof HTMLElement?this._items.includes(u):!1,this._syncState()};t.addEventListener("pointerenter",e),t.addEventListener("pointerleave",s),this._itemHoverHandlers.set(t,{enter:e,leave:s})}_unbindItemHover(t){const e=this._itemHoverHandlers.get(t);e&&(t.removeEventListener("pointerenter",e.enter),t.removeEventListener("pointerleave",e.leave),this._itemHoverHandlers.delete(t))}_sizePreset(){switch(this.getAttribute("size")){case"xs":case"0":return _.xs;case"sm":case"1":return _.sm;case"lg":case"3":return _.lg;case"xl":case"4":return _.xl;default:return _.md}}_motionPreset(){const t=this.getAttribute("animation");return t&&Z.has(t)?M[t]:M.smooth}_direction(){const t=this.getAttribute("direction");return t&&j.has(t)?t:"clockwise"}_directionSign(t){const e=this._direction();let s=e==="counterclockwise"||e==="alternate"&&t%2===1?-1:1;return q(this.getAttribute("reverse"),this.hasAttribute("reverse"))&&(s*=-1),s}_pathVisible(){const t=this.getAttribute("path");return t!=null?q(t,!0):(this.hasAttribute("show-paths"),!0)}_orbitRadiusValue(){return this.getAttribute("radius")??this.getAttribute("orbit-radius")}_iconSizeValue(){return this.getAttribute("icon-size")??this.getAttribute("item-size")}_syncRuntimeStyles(){const t=this._sizePreset(),e=this._motionPreset(),s=N(this.getAttribute("duration"),O),c=N(this.getAttribute("delay"),V),a=h(this._orbitRadiusValue(),t.orbitRadius),u=h(this._iconSizeValue(),t.itemSize),o=h(this.getAttribute("center-size"),t.centerSize),l=h(this.getAttribute("ring-gap"),t.ringGap),d=h(this.getAttribute("padding"),t.padding),r=z(this.getAttribute("rings")),b=S(this.getAttribute("speed"),1),f=r<=1?a:`calc(${a} + ${r-1} * ${l})`,y=`calc((2 * (${f})) + ${u})`;this.style.setProperty("--ui-orbiter-duration",`calc((${s}) * ${e.durationScale} / ${b})`),this.style.setProperty("--ui-orbiter-delay",c),this.style.setProperty("--ui-orbiter-orbit-radius",a),this.style.setProperty("--ui-orbiter-item-size",u),this.style.setProperty("--ui-orbiter-center-size",o),this.style.setProperty("--ui-orbiter-ring-gap",l),this.style.setProperty("--ui-orbiter-padding",d),this.style.setProperty("--ui-orbiter-farthest-radius",f),this.style.setProperty("--ui-orbiter-stage-size",y),this.style.setProperty("--ui-orbiter-path-opacity",String(e.accentOpacity>.18?1:.95));const p=this.getAttribute("surface-radius");!p||W.has(p.trim())?this.style.removeProperty("--ui-orbiter-radius"):this.style.setProperty("--ui-orbiter-radius",h(p,t.panelRadius))}_syncAnimations(){const t=this._items,e=new Set(t);for(const[o,l]of this._animations.entries())e.has(o)||(l.cancel(),this._animations.delete(o));if(typeof window<"u"&&window.matchMedia?.("(prefers-reduced-motion: reduce)").matches){this._cancelAllAnimations(),t.forEach(o=>o.removeAttribute("data-ui-orbit-runtime"));return}if(typeof HTMLElement>"u"||typeof HTMLElement.prototype.animate!="function"){t.forEach(o=>o.removeAttribute("data-ui-orbit-runtime"));return}const s=this._motionPreset(),c=F(this.getAttribute("duration"),18e3),a=F(this.getAttribute("delay"),0),u=S(this.getAttribute("speed"),1);for(const o of t){const l=o.style.getPropertyValue("--ui-orbit-radius")||"var(--ui-orbiter-orbit-radius)",d=g(o.style.getPropertyValue("--ui-orbit-start-angle"),C),r=g(o.style.getPropertyValue("--ui-orbit-quarter-angle"),d+90),b=g(o.style.getPropertyValue("--ui-orbit-half-angle"),d+180),f=g(o.style.getPropertyValue("--ui-orbit-three-quarter-angle"),d+270),y=g(o.style.getPropertyValue("--ui-orbit-end-angle"),d+360),p=S(o.style.getPropertyValue("--ui-orbit-duration-scale"),1),T=c*s.durationScale*p/u;this._animations.get(o)?.cancel(),o.setAttribute("data-ui-orbit-runtime","");const n=o.animate([{transform:v(d,l),offset:0},{transform:v(r,l),offset:.25},{transform:v(b,l),offset:.5},{transform:v(f,l),offset:.75},{transform:v(y,l),offset:1}],{duration:Math.max(1,T),delay:Math.max(0,a),easing:"linear",iterations:Number.POSITIVE_INFINITY,fill:"both"});this._animations.set(o,n)}}_cancelAnimation(t){const e=this._animations.get(t);t.removeAttribute("data-ui-orbit-runtime"),e&&(e.cancel(),this._animations.delete(t))}_cancelAllAnimations(){for(const t of this._animations.values())t.cancel();this._animations.clear(),this._items.forEach(t=>{t.removeAttribute("data-ui-orbit-runtime"),this._unbindItemHover(t)})}_effectivePaused(){return!!(this.hasAttribute("paused")||this.hasAttribute("pause-on-hover")&&this._hovering||this.hasAttribute("pause-on-item-hover")&&this._itemHovering||this.hasAttribute("pause-on-focus")&&this._focusWithin)}_syncState(){const t=this._effectivePaused()?"paused":"running";this.setAttribute("data-state",t),this.setAttribute("data-path-visible",this._pathVisible()?"true":"false"),this.setAttribute("data-item-hovered",this._itemHovering?"true":"false");for(const e of this._animations.values())t==="paused"?e.pause():e.play()}}typeof customElements<"u"&&!customElements.get("ui-orbiter")&&customElements.define("ui-orbiter",D);exports.UIOrbiter=D;

package/dist/orbiter.esm.js

@@ -66,40 +66,23 @@ const O = "18s", V = "0s", A = "88px", P = "44px", w = "128px", E = "28px", $ =
     --ui-orbiter-center-size: ${w};
     --ui-orbiter-ring-gap: ${E};
     --ui-orbiter-padding: ${$};
-    --ui-orbiter-radius: 28px;
+    --ui-orbiter-radius: calc(var(--ui-radius, 6px) + 4px);
     --ui-orbiter-stage-size:
       calc((2 * var(--ui-orbiter-farthest-radius, ${A})) + var(--ui-orbiter-item-size));
     --ui-orbiter-accent: var(--ui-color-primary, var(--ui-primary, #2563eb));
-    --ui-orbiter-bg:
-      radial-gradient(
-        circle at 50% 50%,
-        color-mix(in srgb, var(--ui-color-surface-elevated, #f8fafc) 92%, transparent) 0%,
-        color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, transparent) 64%,
-        color-mix(in srgb, var(--ui-color-surface, #ffffff) 84%, transparent) 100%
-      );
+    --ui-orbiter-bg: var(--color-panel-solid, var(--ui-color-surface, #ffffff));
     --ui-orbiter-color: var(--ui-color-text, #0f172a);
-    --ui-orbiter-border-color:
-      color-mix(in srgb, var(--ui-color-border, rgba(15, 23, 42, 0.16)) 86%, transparent);
+    --ui-orbiter-border-color: var(--ui-color-line-subtle, color-mix(in srgb, var(--ui-color-border, #cbd5e1) 76%, transparent));
     --ui-orbiter-border: 1px solid var(--ui-orbiter-border-color);
-    --ui-orbiter-shadow:
-      0 1px 3px rgba(15, 23, 42, 0.06),
-      0 24px 44px rgba(15, 23, 42, 0.12);
+    --ui-orbiter-shadow: none;
     --ui-orbiter-backdrop: none;
     --ui-orbiter-path-color:
       color-mix(in srgb, var(--ui-orbiter-accent) 16%, var(--ui-orbiter-border-color));
     --ui-orbiter-path-opacity: 0.95;
-    --ui-orbiter-item-bg:
-      linear-gradient(
-        180deg,
-        color-mix(in srgb, #ffffff 96%, transparent),
-        color-mix(in srgb, var(--ui-orbiter-accent) 8%, rgba(255, 255, 255, 0.9))
-      );
+    --ui-orbiter-item-bg: var(--color-panel-solid, var(--ui-color-surface, #ffffff));
     --ui-orbiter-item-color: var(--ui-orbiter-color);
-    --ui-orbiter-item-border:
-      1px solid color-mix(in srgb, var(--ui-orbiter-accent) 12%, rgba(255, 255, 255, 0.82));
-    --ui-orbiter-item-shadow:
-      0 8px 14px rgba(15, 23, 42, 0.08),
-      0 1px 2px rgba(15, 23, 42, 0.05);
+    --ui-orbiter-item-border: 1px solid var(--ui-color-line-subtle, color-mix(in srgb, var(--ui-color-border, #cbd5e1) 76%, transparent));
+    --ui-orbiter-item-shadow: none;
     --ui-orbiter-item-backdrop: none;
     --ui-orbiter-center-bg:
       radial-gradient(
@@ -425,7 +408,7 @@ const O = "18s", V = "0s", A = "88px", P = "44px", w = "128px", E = "28px", $ =
     outline: none;
     border-color: color-mix(in srgb, var(--ui-orbiter-focus-ring) 30%, transparent);
     box-shadow:
-      0 0 0 3px color-mix(in srgb, var(--ui-orbiter-focus-ring) 20%, transparent),
+      0 0 0 2px var(--ui-ring-color, var(--ui-orbiter-focus-ring)),
       var(--ui-orbiter-item-shadow);
   }
 
@@ -493,7 +476,7 @@ const O = "18s", V = "0s", A = "88px", P = "44px", w = "128px", E = "28px", $ =
     outline: none;
     border-color: color-mix(in srgb, var(--ui-orbiter-focus-ring) 24%, transparent);
     box-shadow:
-      0 0 0 3px color-mix(in srgb, var(--ui-orbiter-focus-ring) 18%, transparent),
+      0 0 0 2px var(--ui-ring-color, var(--ui-orbiter-focus-ring)),
       var(--ui-orbiter-shadow);
   }
 
@@ -545,8 +528,8 @@ function h(i, t) {
   if (!e) return t;
   const s = e.split(/\s+/).filter(Boolean);
   if (!s.length) return t;
-  const b = s.map((a) => /^-?\d+(\.\d+)?$/.test(a) ? `${a}px` : /^-?\d*\.?\d+(px|rem|em|%|vh|vw|ch|ex|vmin|vmax)$/.test(a) ? a : null);
-  return b.some((a) => a === null) ? t : b.join(" ");
+  const c = s.map((a) => /^-?\d+(\.\d+)?$/.test(a) ? `${a}px` : /^-?\d*\.?\d+(px|rem|em|%|vh|vw|ch|ex|vmin|vmax)$/.test(a) ? a : null);
+  return c.some((a) => a === null) ? t : c.join(" ");
 }
 function F(i, t) {
   if (i == null || i === "") return t;
@@ -671,39 +654,39 @@ class Q extends U {
     return this._centerSlot ? this._centerSlot.assignedElements({ flatten: !0 }).filter((t) => t instanceof HTMLElement) : [];
   }
   _syncItems() {
-    const t = this._itemsFromSlot(), e = this._centerFromSlot(), s = new Set(t), b = new Set(e);
+    const t = this._itemsFromSlot(), e = this._centerFromSlot(), s = new Set(t), c = new Set(e);
     for (const r of this._items)
       s.has(r) || (this._unbindItemHover(r), this._cancelAnimation(r), r.removeAttribute("data-ui-orbiter-managed"), r.removeAttribute("data-ui-orbit-runtime"), r.style.removeProperty("--ui-orbit-index"), r.style.removeProperty("--ui-orbit-ring"), r.style.removeProperty("--ui-orbit-radius"), r.style.removeProperty("--ui-orbit-start-angle"), r.style.removeProperty("--ui-orbit-quarter-angle"), r.style.removeProperty("--ui-orbit-half-angle"), r.style.removeProperty("--ui-orbit-three-quarter-angle"), r.style.removeProperty("--ui-orbit-end-angle"), r.style.removeProperty("--ui-orbit-start-angle-inverse"), r.style.removeProperty("--ui-orbit-quarter-angle-inverse"), r.style.removeProperty("--ui-orbit-half-angle-inverse"), r.style.removeProperty("--ui-orbit-three-quarter-angle-inverse"), r.style.removeProperty("--ui-orbit-end-angle-inverse"), r.style.removeProperty("--ui-orbit-duration"), r.style.removeProperty("--ui-orbit-duration-scale"), r.style.removeProperty("animation"), r.style.removeProperty("transform"), r.hasAttribute("data-ui-orbiter-owned") && (r.removeAttribute("data-ui-orbiter-item"), r.removeAttribute("data-ui-orbiter-owned")));
     for (const r of this._centerNodes)
-      b.has(r) || (r.removeAttribute("data-ui-orbiter-managed"), r.hasAttribute("data-ui-orbiter-owned") && (r.removeAttribute("data-ui-orbiter-center"), r.removeAttribute("data-ui-orbiter-owned")));
+      c.has(r) || (r.removeAttribute("data-ui-orbiter-managed"), r.hasAttribute("data-ui-orbiter-owned") && (r.removeAttribute("data-ui-orbiter-center"), r.removeAttribute("data-ui-orbiter-owned")));
     e.forEach((r) => {
       r.setAttribute("data-ui-orbiter-managed", ""), r.hasAttribute("data-ui-orbiter-center") || (r.setAttribute("data-ui-orbiter-center", ""), r.setAttribute("data-ui-orbiter-owned", "")), r.setAttribute("slot", "center");
     });
     const a = z(this.getAttribute("rings")), u = h(this._orbitRadiusValue(), this._sizePreset().orbitRadius), o = h(this.getAttribute("ring-gap"), this._sizePreset().ringGap), l = g(this.getAttribute("start-angle"), C), d = Array.from({ length: a }, () => []);
-    t.forEach((r, c) => {
-      r.setAttribute("data-ui-orbiter-managed", ""), r.hasAttribute("data-ui-orbiter-item") || (r.setAttribute("data-ui-orbiter-item", ""), r.setAttribute("data-ui-orbiter-owned", "")), this._bindItemHover(r), d[c % a].push({ item: r, index: c });
-    }), d.forEach((r, c) => {
-      const f = r.length ? 360 / r.length : 360, y = r.length > 1 && c % 2 === 1 ? f / 2 : 0, p = c === 0 ? u : `calc(${u} + ${c} * ${o})`, x = 360 * this._directionSign(c);
+    t.forEach((r, b) => {
+      r.setAttribute("data-ui-orbiter-managed", ""), r.hasAttribute("data-ui-orbiter-item") || (r.setAttribute("data-ui-orbiter-item", ""), r.setAttribute("data-ui-orbiter-owned", "")), this._bindItemHover(r), d[b % a].push({ item: r, index: b });
+    }), d.forEach((r, b) => {
+      const f = r.length ? 360 / r.length : 360, y = r.length > 1 && b % 2 === 1 ? f / 2 : 0, p = b === 0 ? u : `calc(${u} + ${b} * ${o})`, x = 360 * this._directionSign(b);
       r.forEach(({ item: n, index: D }, G) => {
-        const m = l + y + G * f, R = m + x, k = m + x * 0.25, I = m + x * 0.5, L = m + x * 0.75, H = 1 + c * 0.14;
-        n.style.setProperty("--ui-orbit-index", String(D)), n.style.setProperty("--ui-orbit-ring", String(c)), n.style.setProperty("--ui-orbit-radius", p), n.style.setProperty("--ui-orbit-duration", `calc(var(--ui-orbiter-duration) * ${H})`), n.style.setProperty("--ui-orbit-duration-scale", String(H)), n.style.setProperty("--ui-orbit-start-angle", `${m}deg`), n.style.setProperty("--ui-orbit-quarter-angle", `${k}deg`), n.style.setProperty("--ui-orbit-half-angle", `${I}deg`), n.style.setProperty("--ui-orbit-three-quarter-angle", `${L}deg`), n.style.setProperty("--ui-orbit-end-angle", `${R}deg`), n.style.setProperty("--ui-orbit-start-angle-inverse", `${-m}deg`), n.style.setProperty("--ui-orbit-quarter-angle-inverse", `${-k}deg`), n.style.setProperty("--ui-orbit-half-angle-inverse", `${-I}deg`), n.style.setProperty("--ui-orbit-three-quarter-angle-inverse", `${-L}deg`), n.style.setProperty("--ui-orbit-end-angle-inverse", `${-R}deg`), n.style.setProperty("transform", v(m, p));
+        const m = l + y + G * f, R = m + x, k = m + x * 0.25, I = m + x * 0.5, L = m + x * 0.75, H = 1 + b * 0.14;
+        n.style.setProperty("--ui-orbit-index", String(D)), n.style.setProperty("--ui-orbit-ring", String(b)), n.style.setProperty("--ui-orbit-radius", p), n.style.setProperty("--ui-orbit-duration", `calc(var(--ui-orbiter-duration) * ${H})`), n.style.setProperty("--ui-orbit-duration-scale", String(H)), n.style.setProperty("--ui-orbit-start-angle", `${m}deg`), n.style.setProperty("--ui-orbit-quarter-angle", `${k}deg`), n.style.setProperty("--ui-orbit-half-angle", `${I}deg`), n.style.setProperty("--ui-orbit-three-quarter-angle", `${L}deg`), n.style.setProperty("--ui-orbit-end-angle", `${R}deg`), n.style.setProperty("--ui-orbit-start-angle-inverse", `${-m}deg`), n.style.setProperty("--ui-orbit-quarter-angle-inverse", `${-k}deg`), n.style.setProperty("--ui-orbit-half-angle-inverse", `${-I}deg`), n.style.setProperty("--ui-orbit-three-quarter-angle-inverse", `${-L}deg`), n.style.setProperty("--ui-orbit-end-angle-inverse", `${-R}deg`), n.style.setProperty("transform", v(m, p));
       });
     }), this._items = t, this._centerNodes = e, this._itemHovering = this._items.some((r) => r.matches(":hover")), this.setAttribute("data-item-count", String(this._items.length)), this.setAttribute("data-center-count", String(this._centerNodes.length)), this.setAttribute("data-ring-count", String(a));
   }
   _renderPaths() {
     if (!this._pathsEl) return;
-    const t = z(this.getAttribute("rings")), e = h(this._orbitRadiusValue(), this._sizePreset().orbitRadius), s = h(this.getAttribute("ring-gap"), this._sizePreset().ringGap), b = Array.from({ length: t }, (a, u) => {
+    const t = z(this.getAttribute("rings")), e = h(this._orbitRadiusValue(), this._sizePreset().orbitRadius), s = h(this.getAttribute("ring-gap"), this._sizePreset().ringGap), c = Array.from({ length: t }, (a, u) => {
       const o = u === 0 ? e : `calc(${e} + ${u} * ${s})`;
       return `<div class="path" part="path path-${u + 1}" style="inline-size:calc(2 * (${o}));block-size:calc(2 * (${o}));"></div>`;
     }).join("");
-    this._pathsEl.innerHTML = b, this._pathsEl.toggleAttribute("hidden", !this._pathVisible());
+    this._pathsEl.innerHTML = c, this._pathsEl.toggleAttribute("hidden", !this._pathVisible());
   }
   _bindItemHover(t) {
     if (this._itemHoverHandlers.has(t)) return;
     const e = () => {
       this._itemHovering = !0, this._syncState();
-    }, s = (b) => {
-      const u = (b.relatedTarget instanceof HTMLElement ? b.relatedTarget : null)?.closest("[data-ui-orbiter-item]");
+    }, s = (c) => {
+      const u = (c.relatedTarget instanceof HTMLElement ? c.relatedTarget : null)?.closest("[data-ui-orbiter-item]");
       this._itemHovering = u instanceof HTMLElement ? this._items.includes(u) : !1, this._syncState();
     };
     t.addEventListener("pointerenter", e), t.addEventListener("pointerleave", s), this._itemHoverHandlers.set(t, { enter: e, leave: s });
@@ -754,8 +737,8 @@ class Q extends U {
     return this.getAttribute("icon-size") ?? this.getAttribute("item-size");
   }
   _syncRuntimeStyles() {
-    const t = this._sizePreset(), e = this._motionPreset(), s = F(this.getAttribute("duration"), O), b = F(this.getAttribute("delay"), V), a = h(this._orbitRadiusValue(), t.orbitRadius), u = h(this._iconSizeValue(), t.itemSize), o = h(this.getAttribute("center-size"), t.centerSize), l = h(this.getAttribute("ring-gap"), t.ringGap), d = h(this.getAttribute("padding"), t.padding), r = z(this.getAttribute("rings")), c = S(this.getAttribute("speed"), 1), f = r <= 1 ? a : `calc(${a} + ${r - 1} * ${l})`, y = `calc((2 * (${f})) + ${u})`;
-    this.style.setProperty("--ui-orbiter-duration", `calc((${s}) * ${e.durationScale} / ${c})`), this.style.setProperty("--ui-orbiter-delay", b), this.style.setProperty("--ui-orbiter-orbit-radius", a), this.style.setProperty("--ui-orbiter-item-size", u), this.style.setProperty("--ui-orbiter-center-size", o), this.style.setProperty("--ui-orbiter-ring-gap", l), this.style.setProperty("--ui-orbiter-padding", d), this.style.setProperty("--ui-orbiter-farthest-radius", f), this.style.setProperty("--ui-orbiter-stage-size", y), this.style.setProperty("--ui-orbiter-path-opacity", String(e.accentOpacity > 0.18 ? 1 : 0.95));
+    const t = this._sizePreset(), e = this._motionPreset(), s = F(this.getAttribute("duration"), O), c = F(this.getAttribute("delay"), V), a = h(this._orbitRadiusValue(), t.orbitRadius), u = h(this._iconSizeValue(), t.itemSize), o = h(this.getAttribute("center-size"), t.centerSize), l = h(this.getAttribute("ring-gap"), t.ringGap), d = h(this.getAttribute("padding"), t.padding), r = z(this.getAttribute("rings")), b = S(this.getAttribute("speed"), 1), f = r <= 1 ? a : `calc(${a} + ${r - 1} * ${l})`, y = `calc((2 * (${f})) + ${u})`;
+    this.style.setProperty("--ui-orbiter-duration", `calc((${s}) * ${e.durationScale} / ${b})`), this.style.setProperty("--ui-orbiter-delay", c), this.style.setProperty("--ui-orbiter-orbit-radius", a), this.style.setProperty("--ui-orbiter-item-size", u), this.style.setProperty("--ui-orbiter-center-size", o), this.style.setProperty("--ui-orbiter-ring-gap", l), this.style.setProperty("--ui-orbiter-padding", d), this.style.setProperty("--ui-orbiter-farthest-radius", f), this.style.setProperty("--ui-orbiter-stage-size", y), this.style.setProperty("--ui-orbiter-path-opacity", String(e.accentOpacity > 0.18 ? 1 : 0.95));
     const p = this.getAttribute("surface-radius");
     !p || B.has(p.trim()) ? this.style.removeProperty("--ui-orbiter-radius") : this.style.setProperty("--ui-orbiter-radius", h(p, t.panelRadius));
   }
@@ -771,15 +754,15 @@ class Q extends U {
       t.forEach((o) => o.removeAttribute("data-ui-orbit-runtime"));
       return;
     }
-    const s = this._motionPreset(), b = M(this.getAttribute("duration"), 18e3), a = M(this.getAttribute("delay"), 0), u = S(this.getAttribute("speed"), 1);
+    const s = this._motionPreset(), c = M(this.getAttribute("duration"), 18e3), a = M(this.getAttribute("delay"), 0), u = S(this.getAttribute("speed"), 1);
     for (const o of t) {
-      const l = o.style.getPropertyValue("--ui-orbit-radius") || "var(--ui-orbiter-orbit-radius)", d = g(o.style.getPropertyValue("--ui-orbit-start-angle"), C), r = g(o.style.getPropertyValue("--ui-orbit-quarter-angle"), d + 90), c = g(o.style.getPropertyValue("--ui-orbit-half-angle"), d + 180), f = g(o.style.getPropertyValue("--ui-orbit-three-quarter-angle"), d + 270), y = g(o.style.getPropertyValue("--ui-orbit-end-angle"), d + 360), p = S(o.style.getPropertyValue("--ui-orbit-duration-scale"), 1), T = b * s.durationScale * p / u;
+      const l = o.style.getPropertyValue("--ui-orbit-radius") || "var(--ui-orbiter-orbit-radius)", d = g(o.style.getPropertyValue("--ui-orbit-start-angle"), C), r = g(o.style.getPropertyValue("--ui-orbit-quarter-angle"), d + 90), b = g(o.style.getPropertyValue("--ui-orbit-half-angle"), d + 180), f = g(o.style.getPropertyValue("--ui-orbit-three-quarter-angle"), d + 270), y = g(o.style.getPropertyValue("--ui-orbit-end-angle"), d + 360), p = S(o.style.getPropertyValue("--ui-orbit-duration-scale"), 1), T = c * s.durationScale * p / u;
       this._animations.get(o)?.cancel(), o.setAttribute("data-ui-orbit-runtime", "");
       const n = o.animate(
         [
           { transform: v(d, l), offset: 0 },
           { transform: v(r, l), offset: 0.25 },
-          { transform: v(c, l), offset: 0.5 },
+          { transform: v(b, l), offset: 0.5 },
           { transform: v(f, l), offset: 0.75 },
           { transform: v(y, l), offset: 1 }
         ],

package/dist/overlay-motion-B56x1GoY.js

@@ -0,0 +1,49 @@
+"use strict";const v=`
+  [data-ui-overlay] {
+    --ui-overlay-shift: 4px;
+    --ui-overlay-from: translate3d(0, 0, 0);
+    --ui-overlay-ox: center;
+    --ui-overlay-oy: center;
+    transform-origin: var(--ui-overlay-ox) var(--ui-overlay-oy);
+  }
+
+  [data-ui-overlay][data-side="top"] { --ui-overlay-from: translate3d(0, var(--ui-overlay-shift), 0); --ui-overlay-oy: bottom; }
+  [data-ui-overlay][data-side="bottom"] { --ui-overlay-from: translate3d(0, calc(var(--ui-overlay-shift) * -1), 0); --ui-overlay-oy: top; }
+  [data-ui-overlay][data-side="left"] { --ui-overlay-from: translate3d(var(--ui-overlay-shift), 0, 0); --ui-overlay-ox: right; }
+  [data-ui-overlay][data-side="right"] { --ui-overlay-from: translate3d(calc(var(--ui-overlay-shift) * -1), 0, 0); --ui-overlay-ox: left; }
+  [data-ui-overlay][data-align="start"][data-side="top"],
+  [data-ui-overlay][data-align="start"][data-side="bottom"] { --ui-overlay-ox: left; }
+  [data-ui-overlay][data-align="end"][data-side="top"],
+  [data-ui-overlay][data-align="end"][data-side="bottom"] { --ui-overlay-ox: right; }
+  [data-ui-overlay][data-align="start"][data-side="left"],
+  [data-ui-overlay][data-align="start"][data-side="right"] { --ui-overlay-oy: top; }
+  [data-ui-overlay][data-align="end"][data-side="left"],
+  [data-ui-overlay][data-align="end"][data-side="right"] { --ui-overlay-oy: bottom; }
+
+  [data-ui-overlay][data-state="open"] {
+    animation: ui-overlay-in var(--ui-overlay-in-duration, 150ms) var(--ui-motion-enter-easing, cubic-bezier(0.16, 1, 0.3, 1)) backwards;
+  }
+
+  [data-ui-overlay][data-instant][data-state="open"] {
+    animation: none;
+  }
+
+  [data-ui-overlay][data-state="closed"] {
+    animation: ui-overlay-out var(--ui-overlay-out-duration, 100ms) var(--ui-motion-exit-easing, cubic-bezier(0.4, 0, 1, 1)) both;
+    pointer-events: none;
+  }
+
+  @keyframes ui-overlay-in {
+    from { opacity: 0; transform: var(--ui-overlay-from) scale(0.96); }
+    to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
+  }
+
+  @keyframes ui-overlay-out {
+    from { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
+    to { opacity: 0; transform: var(--ui-overlay-from) scale(0.96); }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    [data-ui-overlay][data-state] { animation: none !important; }
+  }
+`,m=()=>typeof HTMLElement<"u"&&typeof HTMLElement.prototype.showPopover=="function";function l(t,e={}){if(!(!m()||!t.isConnected))try{t.hasAttribute("popover")||t.setAttribute("popover","manual"),e.resetBox!==!1&&(t.style.setProperty("right","auto"),t.style.setProperty("bottom","auto"),t.style.setProperty("margin","0"),t.style.setProperty("border","0"),t.style.setProperty("padding","0"),t.style.setProperty("overflow","visible"),t.style.setProperty("background","transparent"),t.style.setProperty("color","inherit")),t.matches(":popover-open")||t.showPopover()}catch{}}function f(t,e={}){t.setAttribute("data-ui-overlay",""),e.animate===!1&&t.setAttribute("data-instant",""),t.setAttribute("data-state","open"),e.topLayer!==!1&&l(t)}function c(t){if(typeof getComputedStyle!="function")return null;const e=getComputedStyle(t),r=(e.animationName||"").split(",").map(a=>a.trim());if(!r.length||r.every(a=>!a||a==="none"))return null;const o=a=>{const i=parseFloat(a);return Number.isFinite(i)?/ms\s*$/.test(a)?i:i*1e3:0},s=(e.animationDuration||"0s").split(",").map(o),n=(e.animationDelay||"0s").split(",").map(o);return Math.max(0,...s.map((a,i)=>a+(n[i]??n[0]??0)))}function u(t,e){t.setAttribute("data-ui-overlay",""),t.setAttribute("data-state","closed");const r=c(t);if(r===null||r<=0)return e(),()=>{};let o=!1,s=null;const n=()=>{o||(o=!0,s&&clearTimeout(s),t.removeEventListener("animationend",a),t.removeEventListener("animationcancel",a),e())},a=i=>{i.target===t&&n()};return t.addEventListener("animationend",a),t.addEventListener("animationcancel",a),s=setTimeout(n,r+60),n}function y(t){if(t)try{t.parentElement&&t.parentElement.removeChild(t)}catch{}}function p(t){t&&u(t,()=>y(t))}const d=new WeakMap;function b(t,e,r){if(r&&t.setAttribute("data-side",r),d.get(t)?.(),d.delete(t),t.setAttribute("data-ui-overlay",""),e){const o=t.hidden;t.hidden=!1,(o||t.getAttribute("data-state")!=="open")&&t.setAttribute("data-state","open");return}if(t.hidden){t.setAttribute("data-state","closed");return}d.set(t,u(t,()=>{d.delete(t),t.hidden=!0}))}exports.OVERLAY_MOTION_CSS=v;exports.closeOverlay=u;exports.liftToTopLayer=l;exports.openOverlay=f;exports.removeOverlay=y;exports.retireOverlay=p;exports.setPanelOpen=b;

package/dist/overlay-motion-BX3dPLay.mjs

@@ -0,0 +1,120 @@
+const f = `
+  [data-ui-overlay] {
+    --ui-overlay-shift: 4px;
+    --ui-overlay-from: translate3d(0, 0, 0);
+    --ui-overlay-ox: center;
+    --ui-overlay-oy: center;
+    transform-origin: var(--ui-overlay-ox) var(--ui-overlay-oy);
+  }
+
+  [data-ui-overlay][data-side="top"] { --ui-overlay-from: translate3d(0, var(--ui-overlay-shift), 0); --ui-overlay-oy: bottom; }
+  [data-ui-overlay][data-side="bottom"] { --ui-overlay-from: translate3d(0, calc(var(--ui-overlay-shift) * -1), 0); --ui-overlay-oy: top; }
+  [data-ui-overlay][data-side="left"] { --ui-overlay-from: translate3d(var(--ui-overlay-shift), 0, 0); --ui-overlay-ox: right; }
+  [data-ui-overlay][data-side="right"] { --ui-overlay-from: translate3d(calc(var(--ui-overlay-shift) * -1), 0, 0); --ui-overlay-ox: left; }
+  [data-ui-overlay][data-align="start"][data-side="top"],
+  [data-ui-overlay][data-align="start"][data-side="bottom"] { --ui-overlay-ox: left; }
+  [data-ui-overlay][data-align="end"][data-side="top"],
+  [data-ui-overlay][data-align="end"][data-side="bottom"] { --ui-overlay-ox: right; }
+  [data-ui-overlay][data-align="start"][data-side="left"],
+  [data-ui-overlay][data-align="start"][data-side="right"] { --ui-overlay-oy: top; }
+  [data-ui-overlay][data-align="end"][data-side="left"],
+  [data-ui-overlay][data-align="end"][data-side="right"] { --ui-overlay-oy: bottom; }
+
+  [data-ui-overlay][data-state="open"] {
+    animation: ui-overlay-in var(--ui-overlay-in-duration, 150ms) var(--ui-motion-enter-easing, cubic-bezier(0.16, 1, 0.3, 1)) backwards;
+  }
+
+  [data-ui-overlay][data-instant][data-state="open"] {
+    animation: none;
+  }
+
+  [data-ui-overlay][data-state="closed"] {
+    animation: ui-overlay-out var(--ui-overlay-out-duration, 100ms) var(--ui-motion-exit-easing, cubic-bezier(0.4, 0, 1, 1)) both;
+    pointer-events: none;
+  }
+
+  @keyframes ui-overlay-in {
+    from { opacity: 0; transform: var(--ui-overlay-from) scale(0.96); }
+    to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
+  }
+
+  @keyframes ui-overlay-out {
+    from { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
+    to { opacity: 0; transform: var(--ui-overlay-from) scale(0.96); }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    [data-ui-overlay][data-state] { animation: none !important; }
+  }
+`, l = () => typeof HTMLElement < "u" && typeof HTMLElement.prototype.showPopover == "function";
+function y(t, e = {}) {
+  if (!(!l() || !t.isConnected))
+    try {
+      t.hasAttribute("popover") || t.setAttribute("popover", "manual"), e.resetBox !== !1 && (t.style.setProperty("right", "auto"), t.style.setProperty("bottom", "auto"), t.style.setProperty("margin", "0"), t.style.setProperty("border", "0"), t.style.setProperty("padding", "0"), t.style.setProperty("overflow", "visible"), t.style.setProperty("background", "transparent"), t.style.setProperty("color", "inherit")), t.matches(":popover-open") || t.showPopover();
+    } catch {
+    }
+}
+function c(t, e = {}) {
+  t.setAttribute("data-ui-overlay", ""), e.animate === !1 && t.setAttribute("data-instant", ""), t.setAttribute("data-state", "open"), e.topLayer !== !1 && y(t);
+}
+function v(t) {
+  if (typeof getComputedStyle != "function") return null;
+  const e = getComputedStyle(t), r = (e.animationName || "").split(",").map((a) => a.trim());
+  if (!r.length || r.every((a) => !a || a === "none")) return null;
+  const o = (a) => {
+    const i = parseFloat(a);
+    return Number.isFinite(i) ? /ms\s*$/.test(a) ? i : i * 1e3 : 0;
+  }, s = (e.animationDuration || "0s").split(",").map(o), n = (e.animationDelay || "0s").split(",").map(o);
+  return Math.max(0, ...s.map((a, i) => a + (n[i] ?? n[0] ?? 0)));
+}
+function u(t, e) {
+  t.setAttribute("data-ui-overlay", ""), t.setAttribute("data-state", "closed");
+  const r = v(t);
+  if (r === null || r <= 0)
+    return e(), () => {
+    };
+  let o = !1, s = null;
+  const n = () => {
+    o || (o = !0, s && clearTimeout(s), t.removeEventListener("animationend", a), t.removeEventListener("animationcancel", a), e());
+  }, a = (i) => {
+    i.target === t && n();
+  };
+  return t.addEventListener("animationend", a), t.addEventListener("animationcancel", a), s = setTimeout(n, r + 60), n;
+}
+function m(t) {
+  if (t)
+    try {
+      t.parentElement && t.parentElement.removeChild(t);
+    } catch {
+    }
+}
+function p(t) {
+  t && u(t, () => m(t));
+}
+const d = /* @__PURE__ */ new WeakMap();
+function b(t, e, r) {
+  if (r && t.setAttribute("data-side", r), d.get(t)?.(), d.delete(t), t.setAttribute("data-ui-overlay", ""), e) {
+    const o = t.hidden;
+    t.hidden = !1, (o || t.getAttribute("data-state") !== "open") && t.setAttribute("data-state", "open");
+    return;
+  }
+  if (t.hidden) {
+    t.setAttribute("data-state", "closed");
+    return;
+  }
+  d.set(
+    t,
+    u(t, () => {
+      d.delete(t), t.hidden = !0;
+    })
+  );
+}
+export {
+  f as O,
+  m as a,
+  u as c,
+  y as l,
+  c as o,
+  p as r,
+  b as s
+};