@editora/ui-core 0.1.19 → 0.1.21

package/dist/animated-beam.esm.js

@@ -1,4 +1,4 @@
-import { E as pe } from "./ElementBase-909688f3.mjs";
+import { E as pe } from "./ElementBase-YlTLMsGk.mjs";
 const ie = 3200, ne = 0, oe = 0, se = 3, re = 4, de = 0.18, me = 3, D = "#8b5cf6", q = "#f59e0b", fe = "rgba(148, 163, 184, 0.34)", j = 2, ge = /* @__PURE__ */ new Set(["none", "sm", "md", "lg", "full"]), ue = /* @__PURE__ */ new Set(["brand", "neutral", "info", "success", "warning", "danger"]), xe = /* @__PURE__ */ new Set(["calm", "smooth", "snappy", "surge", "pulse", "heartbeat"]), Y = /* @__PURE__ */ new Set(["auto", "straight", "soft", "arc"]), X = /* @__PURE__ */ new Set(["forward", "reverse"]), ye = /* @__PURE__ */ new Set(["none", "glow", "pulse", "ring", "shake"]), K = [
   "node-id",
   "column",
@@ -18,7 +18,7 @@ const ie = 3200, ne = 0, oe = 0, se = 3, re = 4, de = 0.18, me = 3, D = "#8b5cf6
   "trail-width",
   "beam-width",
   "id"
-], b = {
+], c = {
   xxs: {
     nodeSize: 36,
     hubSize: 50,
@@ -120,14 +120,14 @@ const ie = 3200, ne = 0, oe = 0, se = 3, re = 4, de = 0.18, me = 3, D = "#8b5cf6
     --ui-animated-beam-duration: ${ie}ms;
     --ui-animated-beam-delay: ${ne}ms;
     --ui-animated-beam-stagger: ${oe}ms;
-    --ui-animated-beam-padding: ${b.md.padding}px;
-    --ui-animated-beam-column-gap: ${b.md.columnGap}px;
-    --ui-animated-beam-row-gap: ${b.md.rowGap}px;
-    --ui-animated-beam-node-size: ${b.md.nodeSize}px;
-    --ui-animated-beam-hub-size: ${b.md.hubSize}px;
-    --ui-animated-beam-min-height: ${b.md.minHeight}px;
+    --ui-animated-beam-padding: ${c.md.padding}px;
+    --ui-animated-beam-column-gap: ${c.md.columnGap}px;
+    --ui-animated-beam-row-gap: ${c.md.rowGap}px;
+    --ui-animated-beam-node-size: ${c.md.nodeSize}px;
+    --ui-animated-beam-hub-size: ${c.md.hubSize}px;
+    --ui-animated-beam-min-height: ${c.md.minHeight}px;
     --ui-animated-beam-columns: ${me};
-    --ui-animated-beam-radius: ${b.md.radius}px;
+    --ui-animated-beam-radius: ${c.md.radius}px;
     --ui-animated-beam-trail-width: ${se}px;
     --ui-animated-beam-beam-width: ${re}px;
     --ui-animated-beam-beam-factor: ${de};
@@ -172,57 +172,57 @@ const ie = 3200, ne = 0, oe = 0, se = 3, re = 4, de = 0.18, me = 3, D = "#8b5cf6
 
   :host([size="xxs"]),
   :host([size="0"]) {
-    --ui-animated-beam-padding: ${b.xxs.padding}px;
-    --ui-animated-beam-column-gap: ${b.xxs.columnGap}px;
-    --ui-animated-beam-row-gap: ${b.xxs.rowGap}px;
-    --ui-animated-beam-node-size: ${b.xxs.nodeSize}px;
-    --ui-animated-beam-hub-size: ${b.xxs.hubSize}px;
-    --ui-animated-beam-min-height: ${b.xxs.minHeight}px;
-    --ui-animated-beam-radius: ${b.xxs.radius}px;
+    --ui-animated-beam-padding: ${c.xxs.padding}px;
+    --ui-animated-beam-column-gap: ${c.xxs.columnGap}px;
+    --ui-animated-beam-row-gap: ${c.xxs.rowGap}px;
+    --ui-animated-beam-node-size: ${c.xxs.nodeSize}px;
+    --ui-animated-beam-hub-size: ${c.xxs.hubSize}px;
+    --ui-animated-beam-min-height: ${c.xxs.minHeight}px;
+    --ui-animated-beam-radius: ${c.xxs.radius}px;
   }
 
   :host([size="xs"]) {
-    --ui-animated-beam-padding: ${b.xs.padding}px;
-    --ui-animated-beam-column-gap: ${b.xs.columnGap}px;
-    --ui-animated-beam-row-gap: ${b.xs.rowGap}px;
-    --ui-animated-beam-node-size: ${b.xs.nodeSize}px;
-    --ui-animated-beam-hub-size: ${b.xs.hubSize}px;
-    --ui-animated-beam-min-height: ${b.xs.minHeight}px;
-    --ui-animated-beam-radius: ${b.xs.radius}px;
+    --ui-animated-beam-padding: ${c.xs.padding}px;
+    --ui-animated-beam-column-gap: ${c.xs.columnGap}px;
+    --ui-animated-beam-row-gap: ${c.xs.rowGap}px;
+    --ui-animated-beam-node-size: ${c.xs.nodeSize}px;
+    --ui-animated-beam-hub-size: ${c.xs.hubSize}px;
+    --ui-animated-beam-min-height: ${c.xs.minHeight}px;
+    --ui-animated-beam-radius: ${c.xs.radius}px;
   }
 
   :host([size="sm"]),
   :host([size="1"]) {
-    --ui-animated-beam-padding: ${b.sm.padding}px;
-    --ui-animated-beam-column-gap: ${b.sm.columnGap}px;
-    --ui-animated-beam-row-gap: ${b.sm.rowGap}px;
-    --ui-animated-beam-node-size: ${b.sm.nodeSize}px;
-    --ui-animated-beam-hub-size: ${b.sm.hubSize}px;
-    --ui-animated-beam-min-height: ${b.sm.minHeight}px;
-    --ui-animated-beam-radius: ${b.sm.radius}px;
+    --ui-animated-beam-padding: ${c.sm.padding}px;
+    --ui-animated-beam-column-gap: ${c.sm.columnGap}px;
+    --ui-animated-beam-row-gap: ${c.sm.rowGap}px;
+    --ui-animated-beam-node-size: ${c.sm.nodeSize}px;
+    --ui-animated-beam-hub-size: ${c.sm.hubSize}px;
+    --ui-animated-beam-min-height: ${c.sm.minHeight}px;
+    --ui-animated-beam-radius: ${c.sm.radius}px;
   }
 
   :host(:not([size])),
   :host([size="md"]),
   :host([size="2"]) {
-    --ui-animated-beam-padding: ${b.md.padding}px;
-    --ui-animated-beam-column-gap: ${b.md.columnGap}px;
-    --ui-animated-beam-row-gap: ${b.md.rowGap}px;
-    --ui-animated-beam-node-size: ${b.md.nodeSize}px;
-    --ui-animated-beam-hub-size: ${b.md.hubSize}px;
-    --ui-animated-beam-min-height: ${b.md.minHeight}px;
-    --ui-animated-beam-radius: ${b.md.radius}px;
+    --ui-animated-beam-padding: ${c.md.padding}px;
+    --ui-animated-beam-column-gap: ${c.md.columnGap}px;
+    --ui-animated-beam-row-gap: ${c.md.rowGap}px;
+    --ui-animated-beam-node-size: ${c.md.nodeSize}px;
+    --ui-animated-beam-hub-size: ${c.md.hubSize}px;
+    --ui-animated-beam-min-height: ${c.md.minHeight}px;
+    --ui-animated-beam-radius: ${c.md.radius}px;
   }
 
   :host([size="lg"]),
   :host([size="3"]) {
-    --ui-animated-beam-padding: ${b.lg.padding}px;
-    --ui-animated-beam-column-gap: ${b.lg.columnGap}px;
-    --ui-animated-beam-row-gap: ${b.lg.rowGap}px;
-    --ui-animated-beam-node-size: ${b.lg.nodeSize}px;
-    --ui-animated-beam-hub-size: ${b.lg.hubSize}px;
-    --ui-animated-beam-min-height: ${b.lg.minHeight}px;
-    --ui-animated-beam-radius: ${b.lg.radius}px;
+    --ui-animated-beam-padding: ${c.lg.padding}px;
+    --ui-animated-beam-column-gap: ${c.lg.columnGap}px;
+    --ui-animated-beam-row-gap: ${c.lg.rowGap}px;
+    --ui-animated-beam-node-size: ${c.lg.nodeSize}px;
+    --ui-animated-beam-hub-size: ${c.lg.hubSize}px;
+    --ui-animated-beam-min-height: ${c.lg.minHeight}px;
+    --ui-animated-beam-radius: ${c.lg.radius}px;
   }
 
   :host([tone="neutral"]) {
@@ -668,11 +668,10 @@ class ve extends pe {
     super.connectedCallback(), this._bindReducedMotionWatcher(), this._ensureResizeObserver(), this._ensureMutationObserver();
   }
   disconnectedCallback() {
-    var e, t, s, o;
-    this._clearNodeEffectAnimations(), this._disconnectResizeObserver(), this._disconnectMutationObserver(), (t = (e = this._mediaQuery) == null ? void 0 : e.removeEventListener) == null || t.call(e, "change", this._boundReducedMotionChange), (o = (s = this._mediaQuery) == null ? void 0 : s.removeListener) == null || o.call(s, this._boundReducedMotionChange), this._mediaQuery = null, super.disconnectedCallback();
+    this._clearNodeEffectAnimations(), this._disconnectResizeObserver(), this._disconnectMutationObserver(), this._mediaQuery?.removeEventListener?.("change", this._boundReducedMotionChange), this._mediaQuery?.removeListener?.(this._boundReducedMotionChange), this._mediaQuery = null, super.disconnectedCallback();
   }
-  attributeChangedCallback(e, t, s) {
-    if (!(t === s || !this.isConnected)) {
+  attributeChangedCallback(e, t, r) {
+    if (!(t === r || !this.isConnected)) {
       if (e === "paused") {
         this._syncState();
         return;
@@ -690,7 +689,6 @@ class ve extends pe {
     this._clearNodeEffectAnimations(), this._syncRuntimeStyles(), this._syncNodes(), this._syncConnections(), this._layoutNodes(), this._renderConnections(), this._syncObservedResizeElements(), this._syncState();
   }
   render() {
-    var e, t, s;
     this.setContent(`
       <style>${_e}</style>
       <style data-ui-animated-beam-animations></style>
@@ -709,7 +707,7 @@ class ve extends pe {
           </div>
         </div>
       </div>
-    `), this._surfaceEl = this.root.querySelector(".surface"), this._canvasEl = this.root.querySelector(".canvas"), this._svgEl = this.root.querySelector(".svg"), this._defsEl = this.root.querySelector("defs"), this._pathsEl = this.root.querySelector(".paths"), this._animationStyleEl = this.root.querySelector("style[data-ui-animated-beam-animations]"), this._nodeSlot = this.root.querySelector("slot:not([name])"), this._hubSlot = this.root.querySelector('slot[name="hub"]'), this._connectionSlot = this.root.querySelector('slot[name="connections"]'), (e = this._nodeSlot) == null || e.addEventListener("slotchange", this._boundSlotChange), (t = this._hubSlot) == null || t.addEventListener("slotchange", this._boundSlotChange), (s = this._connectionSlot) == null || s.addEventListener("slotchange", this._boundSlotChange), this._syncRuntimeStyles(), this.refresh();
+    `), this._surfaceEl = this.root.querySelector(".surface"), this._canvasEl = this.root.querySelector(".canvas"), this._svgEl = this.root.querySelector(".svg"), this._defsEl = this.root.querySelector("defs"), this._pathsEl = this.root.querySelector(".paths"), this._animationStyleEl = this.root.querySelector("style[data-ui-animated-beam-animations]"), this._nodeSlot = this.root.querySelector("slot:not([name])"), this._hubSlot = this.root.querySelector('slot[name="hub"]'), this._connectionSlot = this.root.querySelector('slot[name="connections"]'), this._nodeSlot?.addEventListener("slotchange", this._boundSlotChange), this._hubSlot?.addEventListener("slotchange", this._boundSlotChange), this._connectionSlot?.addEventListener("slotchange", this._boundSlotChange), this._syncRuntimeStyles(), this.refresh();
   }
   shouldRenderOnAttributeChange() {
     return !1;
@@ -729,12 +727,10 @@ class ve extends pe {
     }));
   }
   _bindReducedMotionWatcher() {
-    var e, t, s, o;
-    typeof window > "u" || typeof window.matchMedia != "function" || this._mediaQuery || (this._mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)"), (t = (e = this._mediaQuery).addEventListener) == null || t.call(e, "change", this._boundReducedMotionChange), (o = (s = this._mediaQuery).addListener) == null || o.call(s, this._boundReducedMotionChange));
+    typeof window > "u" || typeof window.matchMedia != "function" || this._mediaQuery || (this._mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)"), this._mediaQuery.addEventListener?.("change", this._boundReducedMotionChange), this._mediaQuery.addListener?.(this._boundReducedMotionChange));
   }
   _prefersReducedMotion() {
-    var e;
-    return !!((e = this._mediaQuery) != null && e.matches);
+    return !!this._mediaQuery?.matches;
   }
   _ensureResizeObserver() {
     this._resizeObserver || typeof ResizeObserver > "u" || (this._resizeObserver = new ResizeObserver(this._boundResize), this._syncObservedResizeElements());
@@ -743,12 +739,10 @@ class ve extends pe {
     this._resizeObserver && (this._resizeObserver.disconnect(), this._resizeObserver = null, this._observedResizeElements.clear());
   }
   _syncObservedResizeElements() {
-    if (!this._resizeObserver)
-      return;
+    if (!this._resizeObserver) return;
     const e = /* @__PURE__ */ new Set();
     this._canvasEl && e.add(this._canvasEl), e.add(this);
-    for (const t of this._nodes)
-      e.add(t.el);
+    for (const t of this._nodes) e.add(t.el);
     for (const t of this._observedResizeElements)
       e.has(t) || this._resizeObserver.unobserve(t);
     for (const t of e)
@@ -775,22 +769,21 @@ class ve extends pe {
     }));
   }
   _disconnectMutationObserver() {
-    var e;
-    (e = this._mutationObserver) == null || e.disconnect(), this._mutationObserver = null;
+    this._mutationObserver?.disconnect(), this._mutationObserver = null;
   }
   _syncRuntimeStyles() {
     const e = this._sizePreset(), t = this._motionPreset();
     this.style.setProperty("--ui-animated-beam-required-width", `${this._autoFit() ? 0 : this._requiredWidthPx(e)}px`), this.style.setProperty("--ui-animated-beam-duration", `${this._durationMs() * t.durationScale}ms`), this.style.setProperty("--ui-animated-beam-delay", `${this._delayMs()}ms`), this.style.setProperty("--ui-animated-beam-stagger", `${this._staggerMs()}ms`), this.style.setProperty("--ui-animated-beam-columns", String(this._columns())), this.style.setProperty("--ui-animated-beam-padding", `${this._paddingPx(e)}px`), this.style.setProperty("--ui-animated-beam-column-gap", `${this._columnGapPx(e)}px`), this.style.setProperty("--ui-animated-beam-row-gap", `${this._rowGapPx(e)}px`), this.style.setProperty("--ui-animated-beam-node-size", `${this._nodeSizePx(e)}px`), this.style.setProperty("--ui-animated-beam-hub-size", `${this._hubSizePx(e)}px`), this.style.setProperty("--ui-animated-beam-min-height", `${this._minHeightPx(e)}px`), this.style.setProperty("--ui-animated-beam-trail-width", `${this._trailWidthPx()}px`), this.style.setProperty("--ui-animated-beam-beam-width", `${this._beamWidthPx()}px`), this.style.setProperty("--ui-animated-beam-beam-factor", String(this._beamFactor(t))), this.style.setProperty("--ui-animated-beam-glow-opacity", String(t.glowOpacity)), this.style.setProperty("--ui-animated-beam-glow-blur", `${t.glowBlur}px`);
-    const s = this.getAttribute("radius");
-    if (s && !ge.has(s.trim())) {
-      const i = le(s);
+    const r = this.getAttribute("radius");
+    if (r && !ge.has(r.trim())) {
+      const i = le(r);
       i ? this.style.setProperty("--ui-animated-beam-radius", i) : this.style.removeProperty("--ui-animated-beam-radius");
     } else
       this.style.removeProperty("--ui-animated-beam-radius");
     const o = this.getAttribute("color-start"), n = this.getAttribute("color-end");
     o ? this.style.setProperty("--ui-animated-beam-accent", o) : this.style.removeProperty("--ui-animated-beam-accent"), n ? this.style.setProperty("--ui-animated-beam-accent-end", n) : this.style.removeProperty("--ui-animated-beam-accent-end");
-    const r = this.getAttribute("trail-color");
-    r ? this.style.setProperty("--ui-animated-beam-path-color", r) : this.style.removeProperty("--ui-animated-beam-path-color");
+    const s = this.getAttribute("trail-color");
+    s ? this.style.setProperty("--ui-animated-beam-path-color", s) : this.style.removeProperty("--ui-animated-beam-path-color");
   }
   _nodesFromSlot() {
     return this._nodeSlot ? this._nodeSlot.assignedElements({ flatten: !0 }).filter((e) => e instanceof HTMLElement) : [];
@@ -802,136 +795,129 @@ class ve extends pe {
     return this._connectionSlot ? this._connectionSlot.assignedElements({ flatten: !0 }).filter((e) => e instanceof HTMLElement) : [];
   }
   _syncNodes() {
-    const e = this._sizePreset(), t = this._columns(), s = this._declaredRows(), o = this._nodesFromSlot(), n = this._hubsFromSlot(), r = /* @__PURE__ */ new Set([...o, ...n]);
+    const e = this._sizePreset(), t = this._columns(), r = this._declaredRows(), o = this._nodesFromSlot(), n = this._hubsFromSlot(), s = /* @__PURE__ */ new Set([...o, ...n]);
     for (const p of this._nodes)
-      r.has(p.el) || Pe(p.el);
+      s.has(p.el) || Pe(p.el);
     const i = [];
-    o.forEach((p, h) => {
-      i.push(this._buildNodeRecord(p, "node", h, t, s, e));
-    }), n.forEach((p, h) => {
-      i.push(this._buildNodeRecord(p, "hub", h, t, s, e));
+    o.forEach((p, l) => {
+      i.push(this._buildNodeRecord(p, "node", l, t, r, e));
+    }), n.forEach((p, l) => {
+      i.push(this._buildNodeRecord(p, "hub", l, t, r, e));
     }), this._nodes = i, this.setAttribute("data-node-count", String(o.length)), this.setAttribute("data-hub-count", String(n.length));
   }
-  _buildNodeRecord(e, t, s, o, n, r) {
+  _buildNodeRecord(e, t, r, o, n, s) {
     const i = t === "hub" ? "data-ui-animated-beam-hub" : "data-ui-animated-beam-node";
     e.hasAttribute(i) || e.setAttribute(i, ""), e.hasAttribute("data-ui-animated-beam-managed") || e.setAttribute("data-ui-animated-beam-managed", ""), e.hasAttribute("data-ui-animated-beam-node-id-owned") || e.removeAttribute("data-ui-animated-beam-node-id-owned"), t === "hub" && e.getAttribute("slot") !== "hub" && e.setAttribute("slot", "hub");
-    const p = this._nodeIdForElement(e, t, s), h = n ? Math.max(1, Math.ceil(n / 2)) : t === "hub" ? 2 : s + 1, d = O(L(e.getAttribute("row"), h), 1, Math.max(n || h, h)), m = t === "hub" ? Math.ceil(o / 2) : O(s + 1, 1, o), c = O(L(e.getAttribute("column"), m), 1, o), f = t === "hub" ? r.hubSize : r.nodeSize, g = P(e.getAttribute("size"), f);
+    const p = this._nodeIdForElement(e, t, r), l = n ? Math.max(1, Math.ceil(n / 2)) : t === "hub" ? 2 : r + 1, d = O(L(e.getAttribute("row"), l), 1, Math.max(n || l, l)), u = t === "hub" ? Math.ceil(o / 2) : O(r + 1, 1, o), h = O(L(e.getAttribute("column"), u), 1, o), g = t === "hub" ? s.hubSize : s.nodeSize, f = P(e.getAttribute("size"), g);
     return {
       el: e,
       nodeId: p,
       kind: t,
-      column: c,
+      column: h,
       row: d,
-      sizePx: g,
+      sizePx: f,
       centerX: 0,
       centerY: 0,
-      radiusPx: g / 2
+      radiusPx: f / 2
     };
   }
-  _nodeIdForElement(e, t, s) {
+  _nodeIdForElement(e, t, r) {
     const o = e.getAttribute("node-id") || e.id;
-    if (o)
-      return o;
-    const n = `${t}-${s + 1}`;
+    if (o) return o;
+    const n = `${t}-${r + 1}`;
     return e.setAttribute("node-id", n), e.setAttribute("data-ui-animated-beam-node-id-owned", ""), n;
   }
   _syncConnections() {
-    const e = this._motionPreset(), t = this._connectionsFromSlot(), s = new Set(t);
+    const e = this._motionPreset(), t = this._connectionsFromSlot(), r = new Set(t);
     for (const i of this._connections)
-      s.has(i.el) || ke(i.el);
-    const o = this._tone(), n = [], r = /* @__PURE__ */ new Map();
+      r.has(i.el) || ke(i.el);
+    const o = this._tone(), n = [], s = /* @__PURE__ */ new Map();
     t.forEach((i, p) => {
       i.getAttribute("slot") !== "connections" && i.setAttribute("slot", "connections"), i.hasAttribute("data-ui-animated-beam-connection") || i.setAttribute("data-ui-animated-beam-connection", ""), i.hasAttribute("data-ui-animated-beam-managed") || i.setAttribute("data-ui-animated-beam-managed", "");
-      const h = i.getAttribute("from"), d = i.getAttribute("to");
-      if (!h || !d)
-        return;
-      const m = Ce(i.getAttribute("tone")), c = F(i.getAttribute("duration"), this._durationMs()), f = i.getAttribute("delay"), g = r.get(h) || 0;
-      r.set(h, g + 1), n.push({
+      const l = i.getAttribute("from"), d = i.getAttribute("to");
+      if (!l || !d) return;
+      const u = Ce(i.getAttribute("tone")), h = F(i.getAttribute("duration"), this._durationMs()), g = i.getAttribute("delay"), f = s.get(l) || 0;
+      s.set(l, f + 1), n.push({
         el: i,
-        from: h,
+        from: l,
         to: d,
         index: p,
         curve: this._curveForConnection(i),
         reverse: this._directionForConnection(i) === "reverse",
-        tone: m,
-        durationMs: c * e.durationScale,
-        hasExplicitDelay: f != null && f.trim() !== "",
-        localDelayMs: F(f, 0),
+        tone: u,
+        durationMs: h * e.durationScale,
+        hasExplicitDelay: g != null && g.trim() !== "",
+        localDelayMs: F(g, 0),
         delayMs: 0,
-        siblingIndex: g,
+        siblingIndex: f,
         beamFactor: _(ae(i.getAttribute("beam-factor"), this._beamFactor(e)), 0.06, 0.48),
         trailWidthPx: P(i.getAttribute("trail-width"), this._trailWidthPx()),
         beamWidthPx: P(i.getAttribute("beam-width"), this._beamWidthPx()),
-        colorStart: i.getAttribute("color-start") || E[m || o].start,
-        colorEnd: i.getAttribute("color-end") || E[m || o].end
+        colorStart: i.getAttribute("color-start") || E[u || o].start,
+        colorEnd: i.getAttribute("color-end") || E[u || o].end
       });
     }), this._connections = n, this.setAttribute("data-connection-count", String(this._connections.length));
   }
   _curveForConnection(e) {
     const t = e.getAttribute("curve");
-    if (t && Y.has(t))
-      return t;
-    const s = this.getAttribute("curve");
-    return s && Y.has(s) ? s : "auto";
+    if (t && Y.has(t)) return t;
+    const r = this.getAttribute("curve");
+    return r && Y.has(r) ? r : "auto";
   }
   _directionForConnection(e) {
     const t = e.getAttribute("direction");
     if (t && X.has(t))
       return t;
-    if (e.hasAttribute("reverse"))
-      return "reverse";
-    const s = this.getAttribute("direction");
-    return s && X.has(s) ? s : this.hasAttribute("reverse") ? "reverse" : "forward";
+    if (e.hasAttribute("reverse")) return "reverse";
+    const r = this.getAttribute("direction");
+    return r && X.has(r) ? r : this.hasAttribute("reverse") ? "reverse" : "forward";
   }
   _layoutNodes() {
-    if (!this._canvasEl || !this._svgEl)
-      return;
+    if (!this._canvasEl || !this._svgEl) return;
     const e = this._layoutMetrics();
     this._lastLayoutMetrics = e;
-    const t = this._resolvedRowCount(), s = e.columns > 1 ? (e.width - e.padding * 2 - e.columnGap * (e.columns - 1)) / e.columns : e.width - e.padding * 2, o = t > 1 ? (e.height - e.padding * 2 - e.rowGap * (t - 1)) / t : e.height - e.padding * 2;
+    const t = this._resolvedRowCount(), r = e.columns > 1 ? (e.width - e.padding * 2 - e.columnGap * (e.columns - 1)) / e.columns : e.width - e.padding * 2, o = t > 1 ? (e.height - e.padding * 2 - e.rowGap * (t - 1)) / t : e.height - e.padding * 2;
     for (const n of this._nodes) {
-      const r = n.sizePx * e.scale, i = e.padding + s * (n.column - 0.5) + e.columnGap * (n.column - 1), p = e.padding + o * (n.row - 0.5) + e.rowGap * (n.row - 1);
-      n.centerX = i, n.centerY = p, n.radiusPx = r / 2, n.el.style.left = `${i}px`, n.el.style.top = `${p}px`, n.el.style.inlineSize = `${r}px`, n.el.style.blockSize = `${r}px`, n.el.style.zIndex = n.kind === "hub" ? "2" : "1", n.el.style.setProperty("--ui-animated-beam-render-size", `${r}px`);
+      const s = n.sizePx * e.scale, i = e.padding + r * (n.column - 0.5) + e.columnGap * (n.column - 1), p = e.padding + o * (n.row - 0.5) + e.rowGap * (n.row - 1);
+      n.centerX = i, n.centerY = p, n.radiusPx = s / 2, n.el.style.left = `${i}px`, n.el.style.top = `${p}px`, n.el.style.inlineSize = `${s}px`, n.el.style.blockSize = `${s}px`, n.el.style.zIndex = n.kind === "hub" ? "2" : "1", n.el.style.setProperty("--ui-animated-beam-render-size", `${s}px`);
     }
     this._svgEl.setAttribute("viewBox", `0 0 ${e.width} ${e.height}`), this._canvasEl.style.minHeight = `${e.height}px`, this.setAttribute("data-row-count", String(t)), this.setAttribute("data-column-count", String(e.columns));
   }
   _renderConnections() {
-    if (!this._defsEl || !this._pathsEl || !this._animationStyleEl)
-      return;
-    const e = this._lastLayoutMetrics || this._layoutMetrics(), t = _(e.scale, 0.72, 1), s = this._nodeEffect(), o = this._motionPreset(), n = new Map(this._nodes.map((y) => [y.nodeId, y])), r = [], i = [], p = [];
+    if (!this._defsEl || !this._pathsEl || !this._animationStyleEl) return;
+    const e = this._lastLayoutMetrics || this._layoutMetrics(), t = _(e.scale, 0.72, 1), r = this._nodeEffect(), o = this._motionPreset(), n = new Map(this._nodes.map((y) => [y.nodeId, y])), s = [], i = [], p = [];
     this._connections.forEach((y) => {
-      const u = n.get(y.from), w = n.get(y.to);
-      if (!u || !w)
-        return;
-      const x = we(u, w, y.curve);
-      r.push({
+      const m = n.get(y.from), w = n.get(y.to);
+      if (!m || !w) return;
+      const x = we(m, w, y.curve);
+      s.push({
         connection: y,
         geometry: x,
         travelDistance: x.length
       });
     });
-    const h = Se(r, this._delayMs(), this._staggerMs()), d = Math.max(
+    const l = Se(s, this._delayMs(), this._staggerMs()), d = Math.max(
       1,
-      ...r.map((y) => (h.get(y.connection) ?? this._delayMs()) + y.connection.durationMs)
-    ), m = s === "none" ? 0 : J(d), c = this._repeat() ? "infinite" : "1", f = [], g = /* @__PURE__ */ new Map();
-    r.forEach((y) => {
-      const w = (h.get(y.connection) ?? this._delayMs()) + y.connection.durationMs, x = ce(y.connection);
-      g.set(x, Math.max(g.get(x) ?? 0, w));
+      ...s.map((y) => (l.get(y.connection) ?? this._delayMs()) + y.connection.durationMs)
+    ), u = r === "none" ? 0 : J(d), h = this._repeat() ? "infinite" : "1", g = [], f = /* @__PURE__ */ new Map();
+    s.forEach((y) => {
+      const w = (l.get(y.connection) ?? this._delayMs()) + y.connection.durationMs, x = ce(y.connection);
+      f.set(x, Math.max(f.get(x) ?? 0, w));
     });
     const $ = Math.max(
       d,
-      ...Array.from(g.values(), (y) => y + m)
+      ...Array.from(f.values(), (y) => y + u)
     );
-    r.forEach((y) => {
-      const { connection: u, geometry: w, travelDistance: x } = y, z = u.reverse ? $e(w) : w, k = `${this._uid}-gradient-${u.index}`, A = Math.max(1, u.trailWidthPx * t), M = Math.max(1.5, u.beamWidthPx * t), C = A.toFixed(2), T = M.toFixed(2), R = Math.max(M * 2, M + 4 * t), H = R.toFixed(2), N = z.start, G = z.end, I = 0, U = _(x * u.beamFactor, M * 6, x * 0.72);
-      u.delayMs = h.get(u) ?? this._delayMs();
-      const V = `${this._uid}-glow-${u.index}`, Q = `${this._uid}-core-${u.index}`;
-      f.push(
+    s.forEach((y) => {
+      const { connection: m, geometry: w, travelDistance: x } = y, z = m.reverse ? $e(w) : w, k = `${this._uid}-gradient-${m.index}`, A = Math.max(1, m.trailWidthPx * t), M = Math.max(1.5, m.beamWidthPx * t), C = A.toFixed(2), T = M.toFixed(2), R = Math.max(M * 2, M + 4 * t), H = R.toFixed(2), N = z.start, G = z.end, I = 0, U = _(x * m.beamFactor, M * 6, x * 0.72);
+      m.delayMs = l.get(m) ?? this._delayMs();
+      const V = `${this._uid}-glow-${m.index}`, Q = `${this._uid}-core-${m.index}`;
+      g.push(
         Z(
           V,
           $,
-          u.delayMs,
-          u.durationMs,
+          m.delayMs,
+          m.durationMs,
           "var(--ui-animated-beam-glow-opacity)",
           o.pattern,
           x,
@@ -939,12 +925,12 @@ class ve extends pe {
           R * 1.18,
           U
         )
-      ), f.push(
+      ), g.push(
         Z(
           Q,
           $,
-          u.delayMs,
-          u.durationMs,
+          m.delayMs,
+          m.durationMs,
           "var(--ui-animated-beam-core-opacity)",
           o.pattern,
           x,
@@ -954,21 +940,21 @@ class ve extends pe {
         )
       ), i.push(`
         <linearGradient id="${k}" gradientUnits="userSpaceOnUse" x1="${N.x}" y1="${N.y}" x2="${G.x}" y2="${G.y}">
-          <stop offset="0%" stop-color="${B(u.colorStart || D)}"></stop>
-          <stop offset="100%" stop-color="${B(u.colorEnd || q)}"></stop>
+          <stop offset="0%" stop-color="${B(m.colorStart || D)}"></stop>
+          <stop offset="100%" stop-color="${B(m.colorEnd || q)}"></stop>
         </linearGradient>
       `), p.push(`
         <g
           class="connection"
           part="connection"
-          data-from="${B(u.from)}"
-          data-to="${B(u.to)}"
+          data-from="${B(m.from)}"
+          data-to="${B(m.to)}"
           style="
             --ui-animated-beam-travel-distance:${x};
-            --ui-animated-beam-connection-duration:${u.durationMs}ms;
-            --ui-animated-beam-connection-delay:${u.delayMs}ms;
+            --ui-animated-beam-connection-duration:${m.durationMs}ms;
+            --ui-animated-beam-connection-delay:${m.delayMs}ms;
             --ui-animated-beam-cycle-duration:${$}ms;
-            --ui-animated-beam-iteration-count:${c};
+            --ui-animated-beam-iteration-count:${h};
             --ui-animated-beam-progress-offset:${I};
           "
         >
@@ -996,39 +982,36 @@ class ve extends pe {
           ></path>
         </g>
       `);
-    }), this._applyNodeEffectStyles(s, g, $, c, f), this._defsEl.innerHTML = i.join(""), this._pathsEl.innerHTML = p.join(""), this._animationStyleEl.textContent = f.join(`
+    }), this._applyNodeEffectStyles(r, f, $, h, g), this._defsEl.innerHTML = i.join(""), this._pathsEl.innerHTML = p.join(""), this._animationStyleEl.textContent = g.join(`
 `), this.setAttribute("data-path-visible", this._pathVisible() ? "true" : "false");
   }
-  _applyNodeEffectStyles(e, t, s, o, n) {
-    const r = J(s);
+  _applyNodeEffectStyles(e, t, r, o, n) {
+    const s = J(r);
     this._nodes.forEach((i, p) => {
-      var m;
-      const h = t.get(i.nodeId);
-      if (e === "none" || h == null) {
-        (m = this._nodeEffectAnimations.get(i.el)) == null || m.cancel(), this._nodeEffectAnimations.delete(i.el), be(i.el);
+      const l = t.get(i.nodeId);
+      if (e === "none" || l == null) {
+        this._nodeEffectAnimations.get(i.el)?.cancel(), this._nodeEffectAnimations.delete(i.el), be(i.el);
         return;
       }
       const d = `${this._uid}-node-effect-${p}`;
-      n.push(Ae(d, s, h, r, e)), i.el.style.setProperty("--ui-animated-beam-node-effect-name", d), i.el.style.setProperty("--ui-animated-beam-node-effect-cycle", `${s}ms`), i.el.style.setProperty("--ui-animated-beam-node-effect-iterations", o), this._startNodeEffectAnimation(i.el, e, s, h, r, o);
+      n.push(Ae(d, r, l, s, e)), i.el.style.setProperty("--ui-animated-beam-node-effect-name", d), i.el.style.setProperty("--ui-animated-beam-node-effect-cycle", `${r}ms`), i.el.style.setProperty("--ui-animated-beam-node-effect-iterations", o), this._startNodeEffectAnimation(i.el, e, r, l, s, o);
     });
   }
   _syncState() {
     const e = this.hasAttribute("paused") || this._prefersReducedMotion();
     this.setAttribute("data-state", e ? "paused" : "running"), this.setAttribute("data-reduced-motion", this._prefersReducedMotion() ? "true" : "false"), this.setAttribute("data-path-visible", this._pathVisible() ? "true" : "false"), this._syncNodeEffectAnimationState(e);
   }
-  _startNodeEffectAnimation(e, t, s, o, n, r) {
-    var f;
-    if (typeof e.animate != "function" || this._prefersReducedMotion() || t === "none")
-      return;
-    (f = this._nodeEffectAnimations.get(e)) == null || f.cancel();
-    const i = Math.max(s, 1), p = _(o / i, 0, 1), h = _((o + n * 0.35) / i, p, 1), d = _((o + n * 0.72) / i, h, 1), m = _((o + n) / i, d, 1), c = e.animate(Me(t, p, h, d, m), {
-      duration: s,
-      iterations: r === "infinite" ? 1 / 0 : 1,
+  _startNodeEffectAnimation(e, t, r, o, n, s) {
+    if (typeof e.animate != "function" || this._prefersReducedMotion() || t === "none") return;
+    this._nodeEffectAnimations.get(e)?.cancel();
+    const i = Math.max(r, 1), p = _(o / i, 0, 1), l = _((o + n * 0.35) / i, p, 1), d = _((o + n * 0.72) / i, l, 1), u = _((o + n) / i, d, 1), h = e.animate(Me(t, p, l, d, u), {
+      duration: r,
+      iterations: s === "infinite" ? 1 / 0 : 1,
       fill: "both",
       easing: "linear",
       delay: 0
     });
-    (this.hasAttribute("paused") || this._prefersReducedMotion()) && c.pause(), this._nodeEffectAnimations.set(e, c);
+    (this.hasAttribute("paused") || this._prefersReducedMotion()) && h.pause(), this._nodeEffectAnimations.set(e, h);
   }
   _syncNodeEffectAnimationState(e) {
     this._nodeEffectAnimations.forEach((t) => {
@@ -1039,26 +1022,25 @@ class ve extends pe {
     this._nodeEffectAnimations.forEach((e) => e.cancel()), this._nodeEffectAnimations.clear();
   }
   _layoutMetrics() {
-    var C;
-    const e = this._sizePreset(), t = this._columns(), s = this._resolvedRowCount(), o = this._paddingPx(e), n = this._columnGapPx(e), r = this._rowGapPx(e), i = this._nodeSizePx(e), p = this._hubSizePx(e), h = this._minHeightPx(e), d = Math.max(i, Math.round(p * 0.86)), m = o * 2 + t * d + Math.max(0, t - 1) * n, c = (C = this._canvasEl) == null ? void 0 : C.getBoundingClientRect(), f = (c == null ? void 0 : c.width) || this.clientWidth || 0, g = this._autoFit() && f > 0 && m > 0 ? _(f / m, 0.2, 1) : 1, $ = o * g, y = n * g, u = r * g, w = i * g, x = p * g, z = h * g, k = Math.max(
+    const e = this._sizePreset(), t = this._columns(), r = this._resolvedRowCount(), o = this._paddingPx(e), n = this._columnGapPx(e), s = this._rowGapPx(e), i = this._nodeSizePx(e), p = this._hubSizePx(e), l = this._minHeightPx(e), d = Math.max(i, Math.round(p * 0.86)), u = o * 2 + t * d + Math.max(0, t - 1) * n, h = this._canvasEl?.getBoundingClientRect(), g = h?.width || this.clientWidth || 0, f = this._autoFit() && g > 0 && u > 0 ? _(g / u, 0.2, 1) : 1, $ = o * f, y = n * f, m = s * f, w = i * f, x = p * f, z = l * f, k = Math.max(
       z,
-      $ * 2 + s * Math.max(w, Math.round(x * 0.86)) + Math.max(0, s - 1) * u
-    ), A = this._autoFit() && f > 0 ? f : Math.max(f, m), M = Math.max((c == null ? void 0 : c.height) || this.clientHeight || 0, k);
+      $ * 2 + r * Math.max(w, Math.round(x * 0.86)) + Math.max(0, r - 1) * m
+    ), A = this._autoFit() && g > 0 ? g : Math.max(g, u), M = Math.max(h?.height || this.clientHeight || 0, k);
     return {
       width: A,
       height: M,
-      scale: g,
+      scale: f,
       padding: $,
       columns: t,
-      rows: s,
+      rows: r,
       columnGap: y,
-      rowGap: u,
+      rowGap: m,
       nodeSize: w,
       hubSize: x
     };
   }
   _resolvedRowCount() {
-    const e = this._declaredRows(), t = this._nodes.reduce((s, o) => Math.max(s, o.row), 1);
+    const e = this._declaredRows(), t = this._nodes.reduce((r, o) => Math.max(r, o.row), 1);
     return Math.max(1, e || t);
   }
   _declaredRows() {
@@ -1087,8 +1069,8 @@ class ve extends pe {
     return P(this.getAttribute("min-height"), e.minHeight);
   }
   _requiredWidthPx(e) {
-    const t = this._columns(), s = this._paddingPx(e), o = this._columnGapPx(e), n = this._nodeSizePx(e), r = this._hubSizePx(e), i = Math.max(n, Math.round(r * 0.86));
-    return s * 2 + t * i + Math.max(0, t - 1) * o;
+    const t = this._columns(), r = this._paddingPx(e), o = this._columnGapPx(e), n = this._nodeSizePx(e), s = this._hubSizePx(e), i = Math.max(n, Math.round(s * 0.86));
+    return r * 2 + t * i + Math.max(0, t - 1) * o;
   }
   _autoFit() {
     const e = this.getAttribute("auto-fit");
@@ -1114,7 +1096,7 @@ class ve extends pe {
   }
   _sizePreset() {
     const e = this.getAttribute("size");
-    return e === "xxs" || e === "0" ? b.xxs : e === "xs" ? b.xs : e === "sm" || e === "1" ? b.sm : e === "lg" || e === "3" ? b.lg : b.md;
+    return e === "xxs" || e === "0" ? c.xxs : e === "xs" ? c.xs : e === "sm" || e === "1" ? c.sm : e === "lg" || e === "3" ? c.lg : c.md;
   }
   _motionPreset() {
     const e = this.getAttribute("animation");
@@ -1138,37 +1120,37 @@ class ve extends pe {
   }
 }
 function we(a, e, t) {
-  const s = { x: a.centerX, y: a.centerY }, o = { x: e.centerX, y: e.centerY }, n = Math.atan2(o.y - s.y, o.x - s.x), r = te(s, n, Math.max(0, a.radiusPx - j)), i = te(o, n + Math.PI, Math.max(0, e.radiusPx - j)), p = i.x - r.x, h = i.y - r.y, d = Math.abs(p), m = Math.abs(h);
-  if (t === "straight" || t === "auto" && m < Math.max(8, Math.min(a.radiusPx, e.radiusPx) * 0.28))
+  const r = { x: a.centerX, y: a.centerY }, o = { x: e.centerX, y: e.centerY }, n = Math.atan2(o.y - r.y, o.x - r.x), s = te(r, n, Math.max(0, a.radiusPx - j)), i = te(o, n + Math.PI, Math.max(0, e.radiusPx - j)), p = i.x - s.x, l = i.y - s.y, d = Math.abs(p), u = Math.abs(l);
+  if (t === "straight" || t === "auto" && u < Math.max(8, Math.min(a.radiusPx, e.radiusPx) * 0.28))
     return {
       kind: "line",
-      start: r,
+      start: s,
       end: i,
-      d: `M ${l(r.x)} ${l(r.y)} L ${l(i.x)} ${l(i.y)}`,
-      length: he(r, i)
+      d: `M ${b(s.x)} ${b(s.y)} L ${b(i.x)} ${b(i.y)}`,
+      length: he(s, i)
     };
-  const c = t === "arc" ? 0.56 : t === "soft" ? 0.34 : m > d * 0.45 ? 0.48 : 0.4;
-  if (d >= m) {
-    const y = Math.max(d * c, 44), u = { x: r.x + Math.sign(p || 1) * y, y: r.y }, w = { x: i.x - Math.sign(p || 1) * y, y: i.y };
+  const h = t === "arc" ? 0.56 : t === "soft" ? 0.34 : u > d * 0.45 ? 0.48 : 0.4;
+  if (d >= u) {
+    const y = Math.max(d * h, 44), m = { x: s.x + Math.sign(p || 1) * y, y: s.y }, w = { x: i.x - Math.sign(p || 1) * y, y: i.y };
     return {
       kind: "cubic",
-      start: r,
+      start: s,
       end: i,
-      c1: u,
+      c1: m,
       c2: w,
-      d: `M ${l(r.x)} ${l(r.y)} C ${l(u.x)} ${l(u.y)} ${l(w.x)} ${l(w.y)} ${l(i.x)} ${l(i.y)}`,
-      length: ee(r, u, w, i)
+      d: `M ${b(s.x)} ${b(s.y)} C ${b(m.x)} ${b(m.y)} ${b(w.x)} ${b(w.y)} ${b(i.x)} ${b(i.y)}`,
+      length: ee(s, m, w, i)
     };
   }
-  const f = Math.max(m * c, 44), g = { x: r.x, y: r.y + Math.sign(h || 1) * f }, $ = { x: i.x, y: i.y - Math.sign(h || 1) * f };
+  const g = Math.max(u * h, 44), f = { x: s.x, y: s.y + Math.sign(l || 1) * g }, $ = { x: i.x, y: i.y - Math.sign(l || 1) * g };
   return {
     kind: "cubic",
-    start: r,
+    start: s,
     end: i,
-    c1: g,
+    c1: f,
     c2: $,
-    d: `M ${l(r.x)} ${l(r.y)} C ${l(g.x)} ${l(g.y)} ${l($.x)} ${l($.y)} ${l(i.x)} ${l(i.y)}`,
-    length: ee(r, g, $, i)
+    d: `M ${b(s.x)} ${b(s.y)} C ${b(f.x)} ${b(f.y)} ${b($.x)} ${b($.y)} ${b(i.x)} ${b(i.y)}`,
+    length: ee(s, f, $, i)
   };
 }
 function $e(a) {
@@ -1177,7 +1159,7 @@ function $e(a) {
       kind: "line",
       start: a.end,
       end: a.start,
-      d: `M ${l(a.end.x)} ${l(a.end.y)} L ${l(a.start.x)} ${l(a.start.y)}`,
+      d: `M ${b(a.end.x)} ${b(a.end.y)} L ${b(a.start.x)} ${b(a.start.y)}`,
       length: a.length
     };
   const e = a.c2, t = a.c1;
@@ -1187,149 +1169,145 @@ function $e(a) {
     end: a.start,
     c1: e,
     c2: t,
-    d: `M ${l(a.end.x)} ${l(a.end.y)} C ${l(e.x)} ${l(e.y)} ${l(t.x)} ${l(t.y)} ${l(a.start.x)} ${l(a.start.y)}`,
+    d: `M ${b(a.end.x)} ${b(a.end.y)} C ${b(e.x)} ${b(e.y)} ${b(t.x)} ${b(t.y)} ${b(a.start.x)} ${b(a.start.y)}`,
     length: a.length
   };
 }
 function Se(a, e, t) {
-  const s = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map(), r = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set();
+  const r = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set();
   for (const d of a) {
-    const m = ce(d.connection), c = s.get(m);
-    c ? c.push(d) : s.set(m, [d]);
+    const u = ce(d.connection), h = r.get(u);
+    h ? h.push(d) : r.set(u, [d]);
   }
   const p = (d) => {
-    const m = o.get(d);
-    if (m != null)
-      return m;
-    if (r.has(d))
-      return e;
-    r.add(d);
-    const c = s.get(d);
-    let f = e;
-    return c != null && c.length && (f = c.reduce((g, $) => {
-      const y = h($.connection);
-      return Math.max(g, y + $.connection.durationMs);
-    }, e)), r.delete(d), o.set(d, f), f;
-  }, h = (d) => {
-    const m = n.get(d);
-    if (m != null)
-      return m;
-    if (i.has(d))
-      return e;
+    const u = o.get(d);
+    if (u != null) return u;
+    if (s.has(d)) return e;
+    s.add(d);
+    const h = r.get(d);
+    let g = e;
+    return h?.length && (g = h.reduce((f, $) => {
+      const y = l($.connection);
+      return Math.max(f, y + $.connection.durationMs);
+    }, e)), s.delete(d), o.set(d, g), g;
+  }, l = (d) => {
+    const u = n.get(d);
+    if (u != null) return u;
+    if (i.has(d)) return e;
     i.add(d);
-    const c = p(ze(d)), f = d.hasExplicitDelay ? 0 : d.siblingIndex * t, g = c + f + d.localDelayMs;
-    return i.delete(d), n.set(d, g), g;
+    const h = p(ze(d)), g = d.hasExplicitDelay ? 0 : d.siblingIndex * t, f = h + g + d.localDelayMs;
+    return i.delete(d), n.set(d, f), f;
   };
   for (const d of a)
-    n.set(d.connection, h(d.connection));
+    n.set(d.connection, l(d.connection));
   return n;
 }
-function Z(a, e, t, s, o, n, r, i, p, h) {
-  const d = Math.max(e, 1), m = _(t / d * 100, 0, 100), c = _((t + s) / d * 100, m, 100), f = _(m + Math.max(s / d * 100 * 0.02, 0.01), m, c), g = S(m), $ = S(f), y = S(c), u = l(i), w = l(p), x = l(r), z = l(h);
+function Z(a, e, t, r, o, n, s, i, p, l) {
+  const d = Math.max(e, 1), u = _(t / d * 100, 0, 100), h = _((t + r) / d * 100, u, 100), g = _(u + Math.max(r / d * 100 * 0.02, 0.01), u, h), f = S(u), $ = S(g), y = S(h), m = b(i), w = b(p), x = b(s), z = b(l);
   if (n === "pulse") {
-    const k = _(m + (c - m) * 0.42, f, c), A = _(m + (c - m) * 0.82, k, c), M = S(k), C = S(A);
+    const k = _(u + (h - u) * 0.42, g, h), A = _(u + (h - u) * 0.82, k, h), M = S(k), C = S(A);
     return `
       @keyframes ${a} {
-        0%, ${g}% {
+        0%, ${f}% {
           opacity: 0;
           stroke-dasharray: ${z} ${x};
           stroke-dashoffset: 0;
-          stroke-width: ${u};
+          stroke-width: ${m};
         }
         ${$}% {
           opacity: calc(${o} * 0.72);
           stroke-dasharray: ${z} ${x};
           stroke-dashoffset: 0;
-          stroke-width: ${u};
+          stroke-width: ${m};
         }
         ${M}% {
           opacity: ${o};
           stroke-dasharray: ${z} ${x};
-          stroke-dashoffset: ${l(-r * 0.44)};
+          stroke-dashoffset: ${b(-s * 0.44)};
           stroke-width: ${w};
         }
         ${C}% {
           opacity: calc(${o} * 0.68);
           stroke-dasharray: ${z} ${x};
-          stroke-dashoffset: ${l(-r * 0.84)};
-          stroke-width: ${u};
+          stroke-dashoffset: ${b(-s * 0.84)};
+          stroke-width: ${m};
         }
         ${y}%,
         100% {
           opacity: 0;
           stroke-dasharray: ${z} ${x};
-          stroke-dashoffset: ${l(-r)};
-          stroke-width: ${u};
+          stroke-dashoffset: ${b(-s)};
+          stroke-width: ${m};
         }
       }
     `;
   }
   if (n === "heartbeat") {
-    const k = _(h * 0.72, i * 4.5, r * 0.42), A = l(k), M = _(m + (c - m) * 0.24, f, c), C = _(m + (c - m) * 0.34, M, c), T = _(m + (c - m) * 0.48, C, c), R = _(m + (c - m) * 0.82, T, c), H = S(M), N = S(C), G = S(T), I = S(R);
+    const k = _(l * 0.72, i * 4.5, s * 0.42), A = b(k), M = _(u + (h - u) * 0.24, g, h), C = _(u + (h - u) * 0.34, M, h), T = _(u + (h - u) * 0.48, C, h), R = _(u + (h - u) * 0.82, T, h), H = S(M), N = S(C), G = S(T), I = S(R);
     return `
       @keyframes ${a} {
-        0%, ${g}% {
+        0%, ${f}% {
           opacity: 0;
           stroke-dasharray: ${A} ${x};
           stroke-dashoffset: 0;
-          stroke-width: ${u};
+          stroke-width: ${m};
         }
         ${$}% {
           opacity: calc(${o} * 0.7);
           stroke-dasharray: ${A} ${x};
           stroke-dashoffset: 0;
-          stroke-width: ${u};
+          stroke-width: ${m};
         }
         ${H}% {
           opacity: calc(${o} * 0.88);
           stroke-dasharray: ${A} ${x};
-          stroke-dashoffset: ${l(-r * 0.24)};
-          stroke-width: ${l(i * 1.08)};
+          stroke-dashoffset: ${b(-s * 0.24)};
+          stroke-width: ${b(i * 1.08)};
         }
         ${N}% {
           opacity: calc(${o} * 0.5);
           stroke-dasharray: ${A} ${x};
-          stroke-dashoffset: ${l(-r * 0.34)};
-          stroke-width: ${u};
+          stroke-dashoffset: ${b(-s * 0.34)};
+          stroke-width: ${m};
         }
         ${G}% {
           opacity: ${o};
           stroke-dasharray: ${A} ${x};
-          stroke-dashoffset: ${l(-r * 0.5)};
+          stroke-dashoffset: ${b(-s * 0.5)};
           stroke-width: ${w};
         }
         ${I}% {
           opacity: calc(${o} * 0.7);
           stroke-dasharray: ${A} ${x};
-          stroke-dashoffset: ${l(-r * 0.84)};
-          stroke-width: ${u};
+          stroke-dashoffset: ${b(-s * 0.84)};
+          stroke-width: ${m};
         }
         ${y}%,
         100% {
           opacity: 0;
           stroke-dasharray: ${A} ${x};
-          stroke-dashoffset: ${l(-r)};
-          stroke-width: ${u};
+          stroke-dashoffset: ${b(-s)};
+          stroke-width: ${m};
         }
       }
     `;
   }
   return `
     @keyframes ${a} {
-      0%, ${g}% {
+      0%, ${f}% {
         opacity: 0;
         stroke-dasharray: 0 ${x};
-        stroke-width: ${u};
+        stroke-width: ${m};
       }
       ${$}% {
         opacity: ${o};
         stroke-dasharray: 0 ${x};
-        stroke-width: ${u};
+        stroke-width: ${m};
       }
       ${y}%, 100% {
         opacity: ${o};
         stroke-dasharray: ${x} 0;
-        stroke-width: ${u};
+        stroke-width: ${m};
       }
     }
   `;
@@ -1343,10 +1321,10 @@ function ce(a) {
 function J(a) {
   return _(a * 0.16, 360, 900);
 }
-function Ae(a, e, t, s, o) {
-  const n = Math.max(e, 1), r = _(t / n * 100, 0, 100), i = _((t + s * 0.35) / n * 100, r, 100), p = _((t + s * 0.72) / n * 100, i, 100), h = _((t + s) / n * 100, p, 100), d = S(r), m = S(i), c = S(p), f = S(h);
+function Ae(a, e, t, r, o) {
+  const n = Math.max(e, 1), s = _(t / n * 100, 0, 100), i = _((t + r * 0.35) / n * 100, s, 100), p = _((t + r * 0.72) / n * 100, i, 100), l = _((t + r) / n * 100, p, 100), d = S(s), u = S(i), h = S(p), g = S(l);
   if (o === "shake") {
-    const u = _(r + (i - r) * 0.3, r, i), w = _(r + (i - r) * 0.65, u, i), x = S(u), z = S(w);
+    const m = _(s + (i - s) * 0.3, s, i), w = _(s + (i - s) * 0.65, m, i), x = S(m), z = S(w);
     return `
       @keyframes ${a} {
         0%, ${d}%, 100% {
@@ -1364,15 +1342,15 @@ function Ae(a, e, t, s, o) {
         ${z}% {
           transform: translate(calc(-50% + 2px), calc(-50% - 1px)) scale(1.03) rotate(2deg);
         }
-        ${m}% {
+        ${u}% {
           transform: translate(-50%, -50%) scale(1.03);
           box-shadow:
             var(--ui-animated-beam-node-base-shadow),
             0 0 0 6px var(--ui-animated-beam-node-effect-ring),
             0 0 24px var(--ui-animated-beam-node-effect-glow);
         }
-        ${c}%,
-        ${f}% {
+        ${h}%,
+        ${g}% {
           transform: translate(-50%, -50%) scale(1);
           box-shadow: var(--ui-animated-beam-node-base-shadow);
           border-color: color-mix(in srgb, var(--ui-animated-beam-accent) 12%, rgba(15, 23, 42, 0.1));
@@ -1387,13 +1365,13 @@ function Ae(a, e, t, s, o) {
         box-shadow: var(--ui-animated-beam-node-base-shadow);
         border-color: color-mix(in srgb, var(--ui-animated-beam-accent) 12%, rgba(15, 23, 42, 0.1));
       }
-      ${m}% {
+      ${u}% {
         transform: ${o === "pulse" ? "translate(-50%, -50%) scale(1.08)" : o === "ring" ? "translate(-50%, -50%) scale(1.04)" : "translate(-50%, -50%) scale(1.03)"};
         box-shadow: ${o === "ring" ? "var(--ui-animated-beam-node-base-shadow), 0 0 0 7px var(--ui-animated-beam-node-effect-ring)" : o === "pulse" ? "var(--ui-animated-beam-node-base-shadow), 0 0 0 6px var(--ui-animated-beam-node-effect-ring), 0 0 20px var(--ui-animated-beam-node-effect-glow)" : "var(--ui-animated-beam-node-base-shadow), 0 0 0 5px var(--ui-animated-beam-node-effect-ring), 0 0 28px var(--ui-animated-beam-node-effect-glow)"};
         border-color: ${o === "ring" ? "color-mix(in srgb, var(--ui-animated-beam-accent-end) 34%, transparent)" : "color-mix(in srgb, var(--ui-animated-beam-accent) 28%, transparent)"};
       }
-      ${c}%,
-      ${f}% {
+      ${h}%,
+      ${g}% {
         transform: translate(-50%, -50%) scale(1);
         box-shadow: var(--ui-animated-beam-node-base-shadow);
         border-color: color-mix(in srgb, var(--ui-animated-beam-accent) 12%, rgba(15, 23, 42, 0.1));
@@ -1401,7 +1379,7 @@ function Ae(a, e, t, s, o) {
     }
   `;
 }
-function Me(a, e = 0, t = 0.1, s = 0.16, o = 0.2) {
+function Me(a, e = 0, t = 0.1, r = 0.16, o = 0.2) {
   const n = {
     offset: 0,
     transform: "translate(-50%, -50%) scale(1)",
@@ -1409,12 +1387,12 @@ function Me(a, e = 0, t = 0.1, s = 0.16, o = 0.2) {
     borderColor: "color-mix(in srgb, var(--ui-animated-beam-accent) 12%, rgba(15, 23, 42, 0.1))"
   };
   if (a === "shake") {
-    const h = e + (t - e) * 0.3, d = e + (t - e) * 0.65;
+    const l = e + (t - e) * 0.3, d = e + (t - e) * 0.65;
     return [
       { ...n, offset: 0 },
       { ...n, offset: e },
       {
-        offset: h,
+        offset: l,
         transform: "translate(calc(-50% - 2px), calc(-50% + 1px)) scale(1.02) rotate(-2deg)",
         boxShadow: "var(--ui-animated-beam-node-base-shadow), 0 0 0 5px var(--ui-animated-beam-node-effect-ring)",
         borderColor: "color-mix(in srgb, var(--ui-animated-beam-accent-end) 30%, transparent)"
@@ -1431,38 +1409,38 @@ function Me(a, e = 0, t = 0.1, s = 0.16, o = 0.2) {
         boxShadow: "var(--ui-animated-beam-node-base-shadow), 0 0 0 6px var(--ui-animated-beam-node-effect-ring), 0 0 24px var(--ui-animated-beam-node-effect-glow)",
         borderColor: "color-mix(in srgb, var(--ui-animated-beam-accent-end) 30%, transparent)"
       },
-      { ...n, offset: s },
+      { ...n, offset: r },
       { ...n, offset: o },
       { ...n, offset: 1 }
     ];
   }
-  const r = a === "pulse" ? "translate(-50%, -50%) scale(1.08)" : a === "ring" ? "translate(-50%, -50%) scale(1.04)" : "translate(-50%, -50%) scale(1.03)", i = a === "ring" ? "var(--ui-animated-beam-node-base-shadow), 0 0 0 7px var(--ui-animated-beam-node-effect-ring)" : a === "pulse" ? "var(--ui-animated-beam-node-base-shadow), 0 0 0 6px var(--ui-animated-beam-node-effect-ring), 0 0 20px var(--ui-animated-beam-node-effect-glow)" : "var(--ui-animated-beam-node-base-shadow), 0 0 0 5px var(--ui-animated-beam-node-effect-ring), 0 0 28px var(--ui-animated-beam-node-effect-glow)", p = a === "ring" ? "color-mix(in srgb, var(--ui-animated-beam-accent-end) 34%, transparent)" : "color-mix(in srgb, var(--ui-animated-beam-accent) 28%, transparent)";
+  const s = a === "pulse" ? "translate(-50%, -50%) scale(1.08)" : a === "ring" ? "translate(-50%, -50%) scale(1.04)" : "translate(-50%, -50%) scale(1.03)", i = a === "ring" ? "var(--ui-animated-beam-node-base-shadow), 0 0 0 7px var(--ui-animated-beam-node-effect-ring)" : a === "pulse" ? "var(--ui-animated-beam-node-base-shadow), 0 0 0 6px var(--ui-animated-beam-node-effect-ring), 0 0 20px var(--ui-animated-beam-node-effect-glow)" : "var(--ui-animated-beam-node-base-shadow), 0 0 0 5px var(--ui-animated-beam-node-effect-ring), 0 0 28px var(--ui-animated-beam-node-effect-glow)", p = a === "ring" ? "color-mix(in srgb, var(--ui-animated-beam-accent-end) 34%, transparent)" : "color-mix(in srgb, var(--ui-animated-beam-accent) 28%, transparent)";
   return [
     { ...n, offset: 0 },
     { ...n, offset: e },
     {
       offset: t,
-      transform: r,
+      transform: s,
       boxShadow: i,
       borderColor: p
     },
-    { ...n, offset: s },
+    { ...n, offset: r },
     { ...n, offset: o },
     { ...n, offset: 1 }
   ];
 }
-function ee(a, e, t, s) {
+function ee(a, e, t, r) {
   let o = 0, n = a;
-  const r = 18;
-  for (let i = 1; i <= r; i += 1) {
-    const p = i / r, h = Ee(a, e, t, s, p);
-    o += he(n, h), n = h;
+  const s = 18;
+  for (let i = 1; i <= s; i += 1) {
+    const p = i / s, l = Ee(a, e, t, r, p);
+    o += he(n, l), n = l;
   }
   return o;
 }
-function Ee(a, e, t, s, o) {
-  const n = 1 - o, r = n * n * n * a.x + 3 * n * n * o * e.x + 3 * n * o * o * t.x + o * o * o * s.x, i = n * n * n * a.y + 3 * n * n * o * e.y + 3 * n * o * o * t.y + o * o * o * s.y;
-  return { x: r, y: i };
+function Ee(a, e, t, r, o) {
+  const n = 1 - o, s = n * n * n * a.x + 3 * n * n * o * e.x + 3 * n * o * o * t.x + o * o * o * r.x, i = n * n * n * a.y + 3 * n * n * o * e.y + 3 * n * o * o * t.y + o * o * o * r.y;
+  return { x: s, y: i };
 }
 function te(a, e, t) {
   return {
@@ -1487,32 +1465,27 @@ function le(a) {
 }
 function P(a, e) {
   const t = le(a);
-  if (!t)
-    return e;
-  const s = t.match(/-?\d+(\.\d+)?/);
-  return s ? Number.parseFloat(s[0]) : e;
+  if (!t) return e;
+  const r = t.match(/-?\d+(\.\d+)?/);
+  return r ? Number.parseFloat(r[0]) : e;
 }
 function F(a, e) {
-  if (!a)
-    return e;
+  if (!a) return e;
   const t = a.trim();
   return t ? /^-?\d+(\.\d+)?$/.test(t) ? Number.parseFloat(t) : t.endsWith("ms") ? Number.parseFloat(t.slice(0, -2)) || e : t.endsWith("s") ? (Number.parseFloat(t.slice(0, -1)) || e / 1e3) * 1e3 : e : e;
 }
 function W(a, e) {
-  if (a == null)
-    return e;
+  if (a == null) return e;
   const t = a.trim().toLowerCase();
   return t ? t === "false" || t === "0" || t === "off" || t === "no" ? !1 : t === "true" || t === "1" || t === "on" || t === "yes" ? !0 : e : !0;
 }
 function L(a, e) {
-  if (a == null)
-    return e;
+  if (a == null) return e;
   const t = Number.parseInt(a, 10);
   return Number.isFinite(t) ? t : e;
 }
 function ae(a, e) {
-  if (a == null)
-    return e;
+  if (a == null) return e;
   const t = Number.parseFloat(a);
   return Number.isFinite(t) ? t : e;
 }
@@ -1525,7 +1498,7 @@ function _(a, e, t) {
 function he(a, e) {
   return Math.hypot(e.x - a.x, e.y - a.y);
 }
-function l(a) {
+function b(a) {
   return a.toFixed(2);
 }
 function S(a) {