@ikonai/sdk-react-ui 1.0.33 → 1.0.34

package/index.js

@@ -1,7 +1,7 @@
 import { IkonUiCore as It, UiStreamStore as Ot } from "@ikonai/sdk-ui";
 import { UiStreamStore as Mo } from "@ikonai/sdk-ui";
-import _t, { useSyncExternalStore as Fe, useMemo as K, memo as W, useRef as v, useCallback as D, Fragment as Nt, useEffect as U, useState as G, createContext as ht, use as Be } from "react";
-import { createLogger as Re, getOrCreateDeviceId as Pt, deriveAuthUrl as Pe, parseUrlParams as Mt, clearSessionParamsFromUrl as jt, isCloudEnvironment as ze, extractUserIdFromToken as Ut, deriveBackendType as qe, IkonClient as Lt, AuthenticationError as xt, subscribeToLogEvents as Dt, isDebugModeEnabled as Ft, LogLevel as Ge, getLangParam as Bt } from "@ikonai/sdk";
+import _t, { useSyncExternalStore as Fe, useMemo as K, memo as z, useRef as w, useCallback as D, Fragment as Nt, useEffect as U, useState as G, createContext as ht, use as Be } from "react";
+import { createLogger as Re, getOrCreateDeviceId as Pt, deriveAuthUrl as Pe, parseUrlParams as Mt, clearSessionParamsFromUrl as jt, isCloudEnvironment as We, extractUserIdFromToken as Ut, deriveBackendType as qe, IkonClient as Lt, AuthenticationError as xt, subscribeToLogEvents as Dt, isDebugModeEnabled as Ft, LogLevel as Ge, getLangParam as Bt } from "@ikonai/sdk";
 var pe = { exports: {} }, ie = {};
 /**
  * @license React
@@ -57,11 +57,11 @@ function Vt() {
           return "Fragment";
         case g:
           return "Profiler";
-        case m:
+        case p:
           return "StrictMode";
         case M:
           return "Suspense";
-        case z:
+        case W:
           return "SuspenseList";
         case _:
           return "Activity";
@@ -74,7 +74,7 @@ function Vt() {
             return "Portal";
           case k:
             return (l.displayName || "Context") + ".Provider";
-          case w:
+          case v:
             return (l._context.displayName || "Context") + ".Consumer";
           case O:
             var b = l.render;
@@ -155,7 +155,7 @@ function Vt() {
     }
     function d(l, b, R, C, V, B, ee, se) {
       return R = B.ref, l = {
-        $$typeof: p,
+        $$typeof: m,
         type: l,
         key: b,
         props: B,
@@ -236,9 +236,9 @@ React keys must be passed directly to JSX without using spread:
       );
     }
     function h(l) {
-      typeof l == "object" && l !== null && l.$$typeof === p && l._store && (l._store.validated = 1);
+      typeof l == "object" && l !== null && l.$$typeof === m && l._store && (l._store.validated = 1);
     }
-    var f = _t, p = Symbol.for("react.transitional.element"), y = Symbol.for("react.portal"), S = Symbol.for("react.fragment"), m = Symbol.for("react.strict_mode"), g = Symbol.for("react.profiler"), w = Symbol.for("react.consumer"), k = Symbol.for("react.context"), O = Symbol.for("react.forward_ref"), M = Symbol.for("react.suspense"), z = Symbol.for("react.suspense_list"), Q = Symbol.for("react.memo"), T = Symbol.for("react.lazy"), _ = Symbol.for("react.activity"), F = Symbol.for("react.client.reference"), j = f.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, L = Object.prototype.hasOwnProperty, Y = Array.isArray, re = console.createTask ? console.createTask : function() {
+    var f = _t, m = Symbol.for("react.transitional.element"), y = Symbol.for("react.portal"), S = Symbol.for("react.fragment"), p = Symbol.for("react.strict_mode"), g = Symbol.for("react.profiler"), v = Symbol.for("react.consumer"), k = Symbol.for("react.context"), O = Symbol.for("react.forward_ref"), M = Symbol.for("react.suspense"), W = Symbol.for("react.suspense_list"), Q = Symbol.for("react.memo"), T = Symbol.for("react.lazy"), _ = Symbol.for("react.activity"), F = Symbol.for("react.client.reference"), j = f.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, L = Object.prototype.hasOwnProperty, Y = Array.isArray, re = console.createTask ? console.createTask : function() {
       return null;
     };
     f = {
@@ -310,8 +310,8 @@ function H(t, e) {
   );
   return K(() => t.getNode(e), [t, e, r]);
 }
-const Wt = Re("UIRenderer");
-function zt(t) {
+const zt = Re("UIRenderer");
+function Wt(t) {
   if (t === void 0)
     return "{}";
   if (typeof t == "string")
@@ -341,7 +341,7 @@ function Jt(t) {
     e += "," + t[r].id;
   return e;
 }
-const Me = W(function t({ nodeId: e, context: r }) {
+const Me = z(function t({ nodeId: e, context: r }) {
   const n = H(r.store, e), o = n ? Gt(n) : [], s = Jt(o), i = K(
     () => o.length === 0 ? null : o.map((h) => /* @__PURE__ */ A.jsx(t, { nodeId: h.id, context: r }, h.id)),
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -353,7 +353,7 @@ const Me = W(function t({ nodeId: e, context: r }) {
     return /* @__PURE__ */ A.jsx(Nt, { children: i }, n.id);
   const a = r.library.resolve(n);
   if (!a)
-    return Wt.warn(`No renderer for node type ${n.type}`), null;
+    return zt.warn(`No renderer for node type ${n.type}`), null;
   const c = qt(n), d = c.length > 0 ? c.join(" ") : void 0, u = a;
   return /* @__PURE__ */ A.jsx(u, { nodeId: e, context: r, className: d });
 }, Ht);
@@ -363,17 +363,17 @@ function Xt(t, e) {
 function Zt(t, e) {
   return t.store === e.store && t.library === e.library && t.viewId === e.viewId && t.emptyFallback === e.emptyFallback;
 }
-const Qt = W(function({ store: e, library: r, viewId: n, emptyFallback: o = null, onAction: s, client: i, video: a }) {
-  const { rootViewId: c, rootNodeId: d } = Yt(e, n), u = v(s);
+const Qt = z(function({ store: e, library: r, viewId: n, emptyFallback: o = null, onAction: s, client: i, video: a }) {
+  const { rootViewId: c, rootNodeId: d } = Yt(e, n), u = w(s);
   u.current = s;
-  const h = v(i);
+  const h = w(i);
   h.current = i;
-  const f = v(a);
+  const f = w(a);
   f.current = a;
-  const p = D((S, m) => {
+  const m = D((S, p) => {
     if (!S)
       return;
-    const g = zt(m);
+    const g = Wt(p);
     u.current?.(S, g);
   }, []), y = K(() => {
     const S = {
@@ -381,13 +381,13 @@ const Qt = W(function({ store: e, library: r, viewId: n, emptyFallback: o = null
       library: r,
       handlerCache: e.handlerCache,
       // Access payloads from store at call time, not captured snapshot
-      getPayload: (m) => e.getSnapshot().payloads.get(m),
-      renderChildren: (m) => Xt(m, S),
-      renderView: (m) => {
-        const g = e.getSnapshot().views.get(m);
+      getPayload: (p) => e.getSnapshot().payloads.get(p),
+      renderChildren: (p) => Xt(p, S),
+      renderView: (p) => {
+        const g = e.getSnapshot().views.get(p);
         return g ? /* @__PURE__ */ A.jsx(Me, { nodeId: g.id, context: S }) : null;
       },
-      dispatchAction: p,
+      dispatchAction: m,
       // Access client/video via refs to avoid context recreation
       get client() {
         return h.current;
@@ -397,7 +397,7 @@ const Qt = W(function({ store: e, library: r, viewId: n, emptyFallback: o = null
       }
     };
     return S;
-  }, [e, r, p]);
+  }, [e, r, m]);
   return !c || !d ? o : /* @__PURE__ */ A.jsx("div", { "data-ikon-view-id": c, style: { display: "contents" }, children: /* @__PURE__ */ A.jsx(Me, { nodeId: d, context: y }) });
 }, Zt);
 class er {
@@ -432,17 +432,17 @@ const je = "ikon-ui";
 function tr(t, e) {
   return t === e;
 }
-const yo = W(function({ stores: e, registry: r, category: n = je, onAction: o, client: s }) {
-  const i = K(() => Array.from(e.keys()).sort().join(","), [e]), a = v(o);
+const yo = z(function({ stores: e, registry: r, category: n = je, onAction: o, client: s }) {
+  const i = K(() => Array.from(e.keys()).sort().join(","), [e]), a = w(o);
   a.current = o;
-  const c = v(s);
+  const c = w(s);
   c.current = s;
   const d = K(
     () => {
       const u = [];
       for (const [h, f] of e) {
-        const p = f.store.getSnapshot();
-        tr(f.category, n) && (!p.rootViewId || !p.views.has(p.rootViewId) || u.push({ key: h, store: f.store }));
+        const m = f.store.getSnapshot();
+        tr(f.category, n) && (!m.rootViewId || !m.views.has(m.rootViewId) || u.push({ key: h, store: f.store }));
       }
       return u;
     },
@@ -564,18 +564,17 @@ function Ve(t) {
   return Ze.set(t, r), r;
 }
 function sr() {
-  const t = W(function({ nodeId: r, context: n }) {
-    const o = H(n.store, r), s = v(null), i = fe(o?.props?.targetViewId), a = o?.props?.focusOnly, c = typeof a == "boolean" ? a : void 0, d = fe(o?.props?.key), u = o?.props?.preciseGeneratedAt;
+  const t = z(function({ nodeId: r, context: n }) {
+    const o = H(n.store, r), s = w(null), i = fe(o?.props?.targetViewId), a = o?.props?.focusOnly, c = typeof a == "boolean" ? a : void 0, d = fe(o?.props?.key), u = o?.props?.preciseGeneratedAt;
     return U(() => {
       if (typeof document > "u")
         return;
       const f = s.current;
       if (!f || i && f.closest("[data-ikon-view-id]")?.getAttribute("data-ikon-view-id") !== i)
         return;
-      const p = c !== !0;
-      if (p) {
-        const g = ((w) => {
-          let k = w.parentElement;
+      if (c !== !0) {
+        const g = ((v) => {
+          let k = v.parentElement;
           for (; k; ) {
             const M = window.getComputedStyle(k).overflowY;
             if (M === "auto" || M === "scroll" || k.hasAttribute("data-radix-scroll-area-viewport"))
@@ -585,7 +584,7 @@ function sr() {
           return null;
         })(f);
         g ? requestAnimationFrame(() => {
-          const w = g.getBoundingClientRect(), k = f.getBoundingClientRect(), O = g.scrollTop + (k.bottom - w.bottom) + 16;
+          const v = g.getBoundingClientRect(), k = f.getBoundingClientRect(), O = g.scrollTop + (k.bottom - v.bottom) + 16;
           "scrollBehavior" in document.documentElement.style ? g.scrollTo({ top: O, behavior: "smooth" }) : g.scrollTop = O;
         }) : typeof f.scrollIntoView == "function" && requestAnimationFrame(() => {
           try {
@@ -598,7 +597,7 @@ function sr() {
       const y = document.activeElement;
       if (!(y instanceof HTMLInputElement || y instanceof HTMLTextAreaElement || y?.getAttribute("contenteditable") === "true") && typeof f.focus == "function")
         try {
-          f.focus({ preventScroll: !p });
+          f.focus({ preventScroll: !0 });
         } catch {
           f.focus();
         }
@@ -620,7 +619,7 @@ function sr() {
   };
 }
 function ir() {
-  const t = W(function({ nodeId: r, context: n, className: o }) {
+  const t = z(function({ nodeId: r, context: n, className: o }) {
     const s = H(n.store, r), i = nr(s?.props?.onInvokeId), a = D(() => {
       i && n.dispatchAction(i);
     }, [i, n]);
@@ -647,7 +646,7 @@ function ir() {
   };
 }
 function ar() {
-  const t = W(function({ nodeId: r, context: n, className: o }) {
+  const t = z(function({ nodeId: r, context: n, className: o }) {
     const s = H(n.store, r);
     if (!s)
       return null;
@@ -660,7 +659,7 @@ function ar() {
   };
 }
 function cr() {
-  const t = W(function({ nodeId: r, context: n, className: o }) {
+  const t = z(function({ nodeId: r, context: n, className: o }) {
     const s = H(n.store, r);
     if (!s)
       return null;
@@ -717,7 +716,7 @@ function ge(t) {
 }
 const pr = "std.audio-url-player";
 function gr() {
-  const t = W(function({
+  const t = z(function({
     nodeId: r,
     context: n,
     className: o
@@ -778,8 +777,8 @@ function Ue(t) {
 }
 const yr = "std.video-canvas", br = "std.video-url-player";
 function Sr() {
-  const t = W(function({ nodeId: r, context: n, className: o }) {
-    const s = H(n.store, r), i = v(null), a = v(null), c = n.video, d = n.client, u = s ? Ue(s.props?.streamId) : void 0, h = s ? be(s.props?.width) : void 0, f = s ? be(s.props?.height) : void 0, p = s ? pt(mt(s.props?.className), o) : o, y = d?.isWebRtcEnabled && u ? d.getWebRtcVideoStreamByStreamId(u) : null;
+  const t = z(function({ nodeId: r, context: n, className: o }) {
+    const s = H(n.store, r), i = w(null), a = w(null), c = n.video, d = n.client, u = s ? Ue(s.props?.streamId) : void 0, h = s ? be(s.props?.width) : void 0, f = s ? be(s.props?.height) : void 0, m = s ? pt(mt(s.props?.className), o) : o, y = d?.isWebRtcEnabled && u ? d.getWebRtcVideoStreamByStreamId(u) : null;
     return U(() => {
       const S = i.current;
       if (!(!c || !S || !u || y))
@@ -801,7 +800,7 @@ function Sr() {
         muted: !0,
         "data-ikon-node-id": s.id,
         "data-ikon-video-stream-id": u,
-        className: p,
+        className: m,
         ...h ? { width: h } : {},
         ...f ? { height: f } : {}
       },
@@ -812,7 +811,7 @@ function Sr() {
         ref: i,
         "data-ikon-node-id": s.id,
         "data-ikon-video-stream-id": u,
-        className: p,
+        className: m,
         ...h ? { width: h } : {},
         ...f ? { height: f } : {}
       },
@@ -837,7 +836,7 @@ function ce(t) {
   }
 }
 function vr() {
-  const t = W(function({
+  const t = z(function({
     nodeId: r,
     context: n,
     className: o
@@ -845,7 +844,7 @@ function vr() {
     const s = H(n.store, r);
     if (!s)
       return null;
-    const i = pt(mt(s.props?.className), o), a = Ue(s.props?.src), c = Ue(s.props?.poster), d = ce(s.props?.controls), u = ce(s.props?.autoplay), h = ce(s.props?.loop), f = ce(s.props?.muted), p = ce(s.props?.playsInline), y = be(s.props?.width), S = be(s.props?.height), m = s.children?.length ? n.renderChildren(s.children) : void 0;
+    const i = pt(mt(s.props?.className), o), a = Ue(s.props?.src), c = Ue(s.props?.poster), d = ce(s.props?.controls), u = ce(s.props?.autoplay), h = ce(s.props?.loop), f = ce(s.props?.muted), m = ce(s.props?.playsInline), y = be(s.props?.width), S = be(s.props?.height), p = s.children?.length ? n.renderChildren(s.children) : void 0;
     return /* @__PURE__ */ A.jsx(
       "video",
       {
@@ -855,12 +854,12 @@ function vr() {
         ...u !== void 0 ? { autoPlay: u } : {},
         ...h !== void 0 ? { loop: h } : {},
         ...f !== void 0 ? { muted: f } : {},
-        ...p !== void 0 ? { playsInline: p } : {},
+        ...m !== void 0 ? { playsInline: m } : {},
         ...y ? { width: y } : {},
         ...S ? { height: S } : {},
         "data-ikon-node-id": s.id,
         className: i,
-        children: m
+        children: p
       }
     );
   });
@@ -1023,38 +1022,38 @@ class Ir {
     h && e.uniform1i(h, this.frameCount);
     const f = this.uniformLocations.get("iMouse");
     f && e.uniform4f(f, this.mouseX, this.mouseY, this.mouseClickX, this.mouseClickY);
-    const p = this.uniformLocations.get("iDate");
-    if (p) {
+    const m = this.uniformLocations.get("iDate");
+    if (m) {
       const y = /* @__PURE__ */ new Date();
-      e.uniform4f(p, y.getFullYear(), y.getMonth(), y.getDate(), y.getHours() * 3600 + y.getMinutes() * 60 + y.getSeconds() + y.getMilliseconds() / 1e3);
+      e.uniform4f(m, y.getFullYear(), y.getMonth(), y.getDate(), y.getHours() * 3600 + y.getMinutes() * 60 + y.getSeconds() + y.getMilliseconds() / 1e3);
     }
     for (const [y, S] of Object.entries(this.customUniforms)) {
-      const m = this.uniformLocations.get(y);
-      if (m)
+      const p = this.uniformLocations.get(y);
+      if (p)
         switch (S.type) {
           case "float":
-            e.uniform1f(m, S.value);
+            e.uniform1f(p, S.value);
             break;
           case "vec2": {
             const g = S.value;
-            e.uniform2f(m, g[0], g[1]);
+            e.uniform2f(p, g[0], g[1]);
             break;
           }
           case "vec3": {
             const g = S.value;
-            e.uniform3f(m, g[0], g[1], g[2]);
+            e.uniform3f(p, g[0], g[1], g[2]);
             break;
           }
           case "vec4": {
             const g = S.value;
-            e.uniform4f(m, g[0], g[1], g[2], g[3]);
+            e.uniform4f(p, g[0], g[1], g[2], g[3]);
             break;
           }
           case "int":
-            e.uniform1i(m, S.value);
+            e.uniform1i(p, S.value);
             break;
           case "bool":
-            e.uniform1i(m, S.value ? 1 : 0);
+            e.uniform1i(p, S.value ? 1 : 0);
             break;
         }
     }
@@ -1143,14 +1142,14 @@ function jr(t, e) {
 }
 const Ur = "std.shadertoy-canvas";
 function Lr() {
-  const t = W(function({ nodeId: r, context: n, className: o }) {
-    const s = H(n.store, r), i = v(null), a = v(null), c = v(null), d = v(0), u = v(""), h = v({}), f = v({
+  const t = z(function({ nodeId: r, context: n, className: o }) {
+    const s = H(n.store, r), i = w(null), a = w(null), c = w(null), d = w(0), u = w(""), h = w({}), f = w({
       x: 0,
       y: 0,
       clickX: 0,
       clickY: 0,
       isDown: !1
-    }), p = s ? Nr(s.props?.shaderSource) : "", y = s ? ke(s.props?.fps) ?? 60 : 60, S = s?.props?.uniforms, m = K(() => Mr(S), [S]), g = s ? Pr(s.props?.enableMouse) ?? !0 : !0, w = s ? ke(s.props?.width) : void 0, k = s ? ke(s.props?.height) : void 0, O = s ? _r(Or(s.props?.className), o) : o;
+    }), m = s ? Nr(s.props?.shaderSource) : "", y = s ? ke(s.props?.fps) ?? 60 : 60, S = s?.props?.uniforms, p = K(() => Mr(S), [S]), g = s ? Pr(s.props?.enableMouse) ?? !0 : !0, v = s ? ke(s.props?.width) : void 0, k = s ? ke(s.props?.height) : void 0, O = s ? _r(Or(s.props?.className), o) : o;
     U(() => {
       const T = i.current;
       if (T) {
@@ -1166,17 +1165,17 @@ function Lr() {
       }
     }, []), U(() => {
       const T = a.current;
-      if (!(!T || !p) && u.current !== p)
-        if (T.compile(p, m))
-          u.current = p, h.current = m;
+      if (!(!T || !m) && u.current !== m)
+        if (T.compile(m, p))
+          u.current = m, h.current = p;
         else {
           const F = T.getError();
           console.error("[ShadertoyRenderer] Shader compilation failed:", F);
         }
-    }, [p, m]), U(() => {
+    }, [m, p]), U(() => {
       const T = a.current;
-      !T || !u.current || jr(h.current, m) || (T.setCustomUniforms(m), h.current = m);
-    }, [m]), U(() => {
+      !T || !u.current || jr(h.current, p) || (T.setCustomUniforms(p), h.current = p);
+    }, [p]), U(() => {
       const T = a.current;
       if (!T || !u.current) return;
       const _ = 1e3 / y, F = (j) => {
@@ -1196,7 +1195,7 @@ function Lr() {
         f.current.x = L, f.current.y = Y, F.setMouse(L, Y, f.current.clickX, f.current.clickY);
       },
       [g]
-    ), z = D(
+    ), W = D(
       (T) => {
         if (!g) return;
         const _ = i.current, F = a.current;
@@ -1214,10 +1213,10 @@ function Lr() {
         ref: i,
         "data-ikon-node-id": s.id,
         className: O,
-        ...w ? { width: w } : {},
+        ...v ? { width: v } : {},
         ...k ? { height: k } : {},
         onMouseMove: M,
-        onMouseDown: z,
+        onMouseDown: W,
         onMouseUp: Q,
         onMouseLeave: Q
       }
@@ -1346,50 +1345,50 @@ function nt(t) {
 }
 function ot(t, e, r, n) {
   const u = new Float32Array(11);
-  function h(m, g, w) {
-    return ((3 * g - 3 * w + 1) * m + (3 * w - 6 * g)) * m * m + 3 * g * m;
+  function h(p, g, v) {
+    return ((3 * g - 3 * v + 1) * p + (3 * v - 6 * g)) * p * p + 3 * g * p;
   }
-  function f(m, g, w) {
-    return 3 * (3 * g - 3 * w + 1) * m * m + 2 * (3 * w - 6 * g) * m + 3 * g;
+  function f(p, g, v) {
+    return 3 * (3 * g - 3 * v + 1) * p * p + 2 * (3 * v - 6 * g) * p + 3 * g;
   }
-  function p(m, g) {
-    for (let w = 0; w < 4; w += 1) {
+  function m(p, g) {
+    for (let v = 0; v < 4; v += 1) {
       const k = f(g, t, r);
       if (k === 0)
         return g;
-      const O = h(g, t, r) - m;
+      const O = h(g, t, r) - p;
       g -= O / k;
     }
     return g;
   }
-  function y(m, g, w) {
+  function y(p, g, v) {
     let k = 0, O = 0, M = 0;
     do
-      O = g + (w - g) / 2, k = h(O, t, r) - m, k > 0 ? w = O : g = O;
+      O = g + (v - g) / 2, k = h(O, t, r) - p, k > 0 ? v = O : g = O;
     while (Math.abs(k) > 1e-7 && ++M < 10);
     return O;
   }
-  function S(m) {
-    let g = 0, w = 1;
+  function S(p) {
+    let g = 0, v = 1;
     const k = 10;
-    for (; w !== k && u[w] <= m; w += 1)
+    for (; v !== k && u[v] <= p; v += 1)
       g += 0.1;
-    w -= 1;
-    const O = (m - u[w]) / (u[w + 1] - u[w]), M = g + O * 0.1, z = f(M, t, r);
-    return z >= 1e-3 ? p(m, M) : z === 0 ? M : y(m, g, g + 0.1);
+    v -= 1;
+    const O = (p - u[v]) / (u[v + 1] - u[v]), M = g + O * 0.1, W = f(M, t, r);
+    return W >= 1e-3 ? m(p, M) : W === 0 ? M : y(p, g, g + 0.1);
   }
-  for (let m = 0; m < 11; m += 1)
-    u[m] = h(m * 0.1, t, r);
-  return (m) => m <= 0 ? 0 : m >= 1 ? 1 : h(S(m), e, n);
+  for (let p = 0; p < 11; p += 1)
+    u[p] = h(p * 0.1, t, r);
+  return (p) => p <= 0 ? 0 : p >= 1 ? 1 : h(S(p), e, n);
 }
-function Wr(t) {
+function zr(t) {
   const e = /steps\(\s*([0-9]+)\s*(?:,\s*([a-z-]+)\s*)?\)/i.exec(t);
   if (!e)
     return (o) => $(o);
   const r = Math.max(1, parseInt(e[1], 10)), n = (e[2] ?? "end").toLowerCase();
   return n === "start" || n === "jump-start" ? (o) => $(Math.ceil(o * r) / r) : n === "none" || n === "jump-none" ? (o) => $(Math.round(o * r) / r) : n === "both" || n === "jump-both" ? (o) => $((Math.floor(o * r) + 0.5) / r) : (o) => $(Math.floor(o * r) / r);
 }
-function zr(t) {
+function Wr(t) {
   if (!t)
     return (r) => $(r);
   const e = t.trim().toLowerCase();
@@ -1407,7 +1406,7 @@ function zr(t) {
     }
   }
   if (e.startsWith("steps(") && e.endsWith(")")) {
-    const r = Wr(e);
+    const r = zr(e);
     return (n) => r($(n));
   }
   return (r) => $(r);
@@ -1467,7 +1466,7 @@ class Gr {
     const r = e.source?.trim();
     if (!r)
       return;
-    const n = rt(e.min) ?? 0, o = rt(e.max), s = o === void 0 ? n + 100 : o, i = (e.clamp ?? "clamp").trim().toLowerCase(), a = !!e.reverse, c = zr(e.ease), d = qr(e.map), u = e.targetId?.trim() || void 0;
+    const n = rt(e.min) ?? 0, o = rt(e.max), s = o === void 0 ? n + 100 : o, i = (e.clamp ?? "clamp").trim().toLowerCase(), a = !!e.reverse, c = Wr(e.ease), d = qr(e.map), u = e.targetId?.trim() || void 0;
     return Number.isNaN(n) || Number.isNaN(s) ? void 0 : {
       source: r.toLowerCase(),
       min: n,
@@ -1682,7 +1681,7 @@ class Gr {
 }
 const Ce = new Gr();
 function Hr(t) {
-  const e = v(/* @__PURE__ */ new Map()), r = D(({ styleId: s, css: i, common: a }) => {
+  const e = w(/* @__PURE__ */ new Map()), r = D(({ styleId: s, css: i, common: a }) => {
     if (!(!s || typeof document > "u")) {
       if (i) {
         let c = e.current.get(s);
@@ -1723,7 +1722,7 @@ function Jr(t) {
   return e.sort(), e.join(",");
 }
 function Xr(t) {
-  const [e, r] = G(), n = v("");
+  const [e, r] = G(), n = w("");
   return U(() => {
     if (!t) {
       r(void 0), n.current = "";
@@ -1831,7 +1830,7 @@ function wo(t) {
     const f = h.trim();
     if (!f)
       continue;
-    const p = Object.keys(d).find((S) => S.toLowerCase() === "javascript"), y = p ? d[p] : void 0;
+    const m = Object.keys(d).find((S) => S.toLowerCase() === "javascript"), y = m ? d[m] : void 0;
     typeof y == "string" && s.set(f, y), i.has(f) || (o.push(f), i.add(f));
   }
   if (!o.length && s.size === 0)
@@ -2003,9 +2002,9 @@ function An(t, e, r) {
       );
       continue;
     }
-    const f = o && yt(a) ? { "data-motion-emoji": !0 } : void 0, p = a === " " ? " " : a;
+    const f = o && yt(a) ? { "data-motion-emoji": !0 } : void 0, m = a === " " ? " " : a;
     s.push(
-      /* @__PURE__ */ A.jsx("span", { "data-motion-letter": !0, style: u, ...f, children: p }, d)
+      /* @__PURE__ */ A.jsx("span", { "data-motion-letter": !0, style: u, ...f, children: m }, d)
     );
   }
   return s;
@@ -2308,7 +2307,7 @@ function Yn(t, e, r, n) {
   const o = n ?? window.location.origin + window.location.pathname + window.location.search;
   return `${r}/oauth/${t}?space=${encodeURIComponent(e)}&return=${encodeURIComponent(o)}`;
 }
-async function Wn(t) {
+async function zn(t) {
   const e = await fetch(`${t}/passkey/registration/options`, {
     method: "POST",
     headers: { "Content-Type": "application/json" }
@@ -2319,7 +2318,7 @@ async function Wn(t) {
   }
   return e.json();
 }
-async function zn(t, e, r) {
+async function Wn(t, e, r) {
   const n = await fetch(`${t}/passkey/registration/verify`, {
     method: "POST",
     headers: { "Content-Type": "application/json" },
@@ -2569,10 +2568,10 @@ async function Qn(t) {
     } catch (y) {
       _e("getPublicKey()", y);
     }
-  let p;
+  let m;
   if (typeof c.getAuthenticatorData == "function")
     try {
-      p = q(c.getAuthenticatorData());
+      m = q(c.getAuthenticatorData());
     } catch (y) {
       _e("getAuthenticatorData()", y);
     }
@@ -2585,7 +2584,7 @@ async function Qn(t) {
       transports: u,
       publicKeyAlgorithm: h,
       publicKey: f,
-      authenticatorData: p
+      authenticatorData: m
     },
     type: d,
     clientExtensionResults: s.getClientExtensionResults(),
@@ -2669,8 +2668,8 @@ async function ro(t) {
   let a;
   try {
     a = await navigator.credentials.get(i);
-  } catch (p) {
-    throw to({ error: p, options: i });
+  } catch (m) {
+    throw to({ error: m, options: i });
   }
   if (!a)
     throw new Error("Authentication was not completed");
@@ -2690,7 +2689,7 @@ async function ro(t) {
     authenticatorAttachment: kt(a.authenticatorAttachment)
   };
 }
-const We = ht(null);
+const ze = ht(null);
 function Eo({ children: t, config: e }) {
   const [r, n] = G({
     isAuthenticated: !1,
@@ -2712,15 +2711,15 @@ function Eo({ children: t, config: e }) {
       }
       const h = Vn();
       if (h) {
-        const p = {
+        const m = {
           token: h.token,
           provider: h.provider,
           authenticatedAt: Date.now()
         };
-        Ae(p), ft(), n({
+        Ae(m), ft(), n({
           isAuthenticated: !0,
           isLoading: !1,
-          user: de(p),
+          user: de(m),
           error: null
         });
         return;
@@ -2775,11 +2774,11 @@ function Eo({ children: t, config: e }) {
       if (d === "passkey") {
         n((h) => ({ ...h, isLoading: !0, error: null }));
         try {
-          const h = await qn(u), f = await ro({ optionsJSON: h }), p = await Gn(u, f);
+          const h = await qn(u), f = await ro({ optionsJSON: h }), m = await Gn(u, f);
           n({
             isAuthenticated: !0,
             isLoading: !1,
-            user: de(p),
+            user: de(m),
             error: null
           });
         } catch (h) {
@@ -2806,11 +2805,11 @@ function Eo({ children: t, config: e }) {
       const u = Pe(e.authUrl);
       n((h) => ({ ...h, isLoading: !0, error: null }));
       try {
-        const h = await Wn(u), f = await Qn({ optionsJSON: h }), p = await zn(u, f, d);
+        const h = await zn(u), f = await Qn({ optionsJSON: h }), m = await Wn(u, f, d);
         n({
           isAuthenticated: !0,
           isLoading: !1,
-          user: de(p),
+          user: de(m),
           error: null
         });
       } catch (h) {
@@ -2832,19 +2831,19 @@ function Eo({ children: t, config: e }) {
     }),
     [r, o, s, a, i]
   );
-  return /* @__PURE__ */ A.jsx(We, { value: c, children: t });
+  return /* @__PURE__ */ A.jsx(ze, { value: c, children: t });
 }
 function no() {
-  const t = Be(We);
+  const t = Be(ze);
   if (!t)
     throw new Error("useAuth must be used within an AuthProvider");
   return t;
 }
 function oo() {
-  return Be(We);
+  return Be(ze);
 }
 function Ao(t) {
-  const { config: e, guestUrlParam: r } = t, { state: n, login: o } = no(), s = v(!1);
+  const { config: e, guestUrlParam: r } = t, { state: n, login: o } = no(), s = w(!1);
   return U(() => {
     if (!r || n.isAuthenticated || n.isLoading || s.current || !e.methods.includes("guest"))
       return;
@@ -2876,6 +2875,7 @@ function ko({
   renderOffline: h,
   renderError: f
 }) {
+  const m = w(!1);
   switch (t) {
     case "idle":
       return a();
@@ -2884,18 +2884,22 @@ function ko({
     case "connectingSlow":
       return d();
     case "connected":
-    case "reconnecting":
-      return !r || !n || !o ? null : u({
+    case "reconnecting": {
+      if (!r || !n || !o) return null;
+      t === "reconnecting" && (m.current = !0);
+      const y = n.size > 0;
+      return y && (m.current = !1), u({
         stores: n,
         registry: o,
         client: s,
         onAction: i,
-        isReconnecting: t === "reconnecting"
+        isReconnecting: t === "reconnecting" || m.current && !y
       });
+    }
     case "offline":
-      return h();
+      return m.current = !1, h();
     case "offlineError":
-      return f(e ?? s?.lastError?.message ?? null);
+      return m.current = !1, f(e ?? s?.lastError?.message ?? null);
     default:
       return null;
   }
@@ -2910,8 +2914,8 @@ function io() {
     return window.__IKON_LOCAL_IKON_SERVER_CONFIG__;
 }
 function To(t) {
-  const { authConfig: e, modules: r, timeouts: n, backgroundAudio: o, webRtc: s, audio: i, video: a, websocket: c, webtransport: d } = t, u = e === void 0 ? so() ?? null : e, h = io(), f = oo(), p = v(null), y = v(null), S = v(null), m = v(!1), g = v(!1), w = v(o), k = v(n), O = v(s), M = v(i), z = v(a), Q = v(c), T = v(d);
-  w.current = o, k.current = n, O.current = s, M.current = i, z.current = a, Q.current = c, T.current = d;
+  const { authConfig: e, modules: r, timeouts: n, backgroundAudio: o, webRtc: s, audio: i, video: a, websocket: c, webtransport: d } = t, u = e === void 0 ? so() ?? null : e, h = io(), f = oo(), m = w(null), y = w(null), S = w(null), p = w(!1), g = w(!1), v = w(o), k = w(n), O = w(s), M = w(i), W = w(a), Q = w(c), T = w(d);
+  v.current = o, k.current = n, O.current = s, M.current = i, W.current = a, Q.current = c, T.current = d;
   const [_, F] = G("idle"), [j, L] = G(null), [Y, re] = G(null), [J, he] = G(null), [ne, oe] = G(!1), [me, l] = G(0), b = K(() => {
     try {
       const I = Mt();
@@ -2921,7 +2925,7 @@ function To(t) {
     }
   }, []), R = K(() => u?.enabled ? wt() : null, [u?.enabled, me]), C = h?.enabled ?? !1, V = h?.host ?? "localhost", B = h?.port ?? 8443;
   U(() => {
-    !C && ze() && u && !u.enabled && u.spaceId && !J && !ne && (oe(!0), vt(u.spaceId, Pe(u.authUrl)).then((x) => {
+    !C && We() && u && !u.enabled && u.spaceId && !J && !ne && (oe(!0), vt(u.spaceId, Pe(u.authUrl)).then((x) => {
       he(x.token);
     }).catch((x) => {
       ye.error("Anonymous auth failed:", x), L(x instanceof Error ? x.message : "Anonymous auth failed");
@@ -2963,7 +2967,7 @@ function To(t) {
         channelKey: b.channelKey,
         parameters: b.parameters
       }
-    } : ze() ? null : {
+    } : We() ? null : {
       local: {
         host: V,
         httpsPort: B,
@@ -2977,8 +2981,8 @@ function To(t) {
   Hr(Y);
   const se = Xr(Y);
   U(() => {
-    if (!m.current) {
-      if (m.current = !0, S.current = $r(), r)
+    if (!p.current) {
+      if (p.current = !0, S.current = $r(), r)
         for (const I of r)
           I(S.current);
       S.current.loadRegisteredModules().catch((I) => {
@@ -2990,11 +2994,11 @@ function To(t) {
     const I = new Lt({
       ...ee,
       timeouts: k.current,
-      audio: M.current !== void 0 || w.current ? {
+      audio: M.current !== void 0 || v.current ? {
         enabled: M.current,
-        ...w.current ? { background: { allowOnDesktop: !0, allowOnMobile: !0 } } : {}
+        ...v.current ? { background: { allowOnDesktop: !0, allowOnMobile: !0 } } : {}
       } : void 0,
-      video: z.current !== void 0 ? { enabled: z.current } : void 0,
+      video: W.current !== void 0 ? { enabled: W.current } : void 0,
       mediaSession: { title: document.title || void 0, artist: document.title || void 0 },
       webRtc: O.current ? { enabled: !0 } : void 0,
       websocket: Q.current,
@@ -3006,35 +3010,35 @@ function To(t) {
         L(Z.message);
       }
     });
-    p.current = I;
+    m.current = I;
     const x = new rr({ client: I });
     return y.current = x, re(x), I.connect().catch((Z) => {
       ye.error("Connection failed:", Z), Z instanceof xt && !g.current && (g.current = !0, ye.warn("Auth session appears stale, clearing and retrying"), f ? f.logout() : (we(), l((Ct) => Ct + 1)));
     }), () => {
-      I.disconnect(), p.current = null, x.dispose(), y.current = null;
+      I.disconnect(), m.current = null, x.dispose(), y.current = null;
     };
   }, [ee]);
   const N = D((I, x) => {
     const Z = typeof x == "string" ? x : JSON.stringify(x ?? {});
-    p.current?.sendActionCall(I, Z);
+    m.current?.sendActionCall(I, Z);
   }, []), X = _ === "connected" || _ === "reconnecting";
   return {
     connectionState: _,
     error: j,
     stores: se,
-    client: p.current,
+    client: m.current,
     registry: S.current,
-    clientRef: p,
+    clientRef: m,
     uiRef: y,
     registryRef: S,
     onAction: N,
     isReady: X,
-    webRtcVideoStreams: p.current?.webRtcVideoStreams ?? /* @__PURE__ */ new Map(),
-    webRtcTrackMap: p.current?.webRtcTrackMap ?? /* @__PURE__ */ new Map()
+    webRtcVideoStreams: m.current?.webRtcVideoStreams ?? /* @__PURE__ */ new Map(),
+    webRtcTrackMap: m.current?.webRtcTrackMap ?? /* @__PURE__ */ new Map()
   };
 }
 function Co(t) {
-  const e = v(!1);
+  const e = w(!1);
   return D(() => {
     if (e.current) return;
     e.current = !0;
@@ -3044,7 +3048,7 @@ function Co(t) {
 }
 let ao = 0;
 function Io(t = 5, e = 5e3) {
-  const [r, n] = G([]), o = v(/* @__PURE__ */ new Map()), s = D((i) => {
+  const [r, n] = G([]), o = w(/* @__PURE__ */ new Map()), s = D((i) => {
     const a = o.current.get(i);
     a && (clearTimeout(a), o.current.delete(i)), n((c) => c.filter((d) => d.id !== i));
   }, []);
@@ -3059,7 +3063,7 @@ function Io(t = 5, e = 5e3) {
           message: c.message,
           component: c.component
         };
-        n((p) => [...p, h].slice(-t));
+        n((m) => [...m, h].slice(-t));
         const f = setTimeout(() => {
           s(d);
         }, e);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ikonai/sdk-react-ui",
-  "version": "1.0.33",
+  "version": "1.0.34",
   "type": "module",
   "main": "./index.js",
   "types": "./index.d.ts",