@nika-js/onlymap 0.6.26 → 0.7.1

package/dist/react.js

@@ -1,259 +1,278 @@
-var Re = Object.defineProperty;
-var Fe = (t, e, s) => e in t ? Re(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
-var oe = (t, e, s) => Fe(t, typeof e != "symbol" ? e + "" : e, s);
-import { jsxs as U, jsx as O } from "react/jsx-runtime";
-import { createContext as Pe, useContext as xe, forwardRef as Ce, useRef as b, useState as $, useId as ce, useCallback as se, useMemo as M, useLayoutEffect as ie, useEffect as F, useImperativeHandle as Te, useSyncExternalStore as de } from "react";
-import { MANAGED_SLOTS as ke, slotContainerStyle as Me, FOLD_SIDES as A, MapController as je, parseWidgetStyle as Le, foldToggleSlot as $e, foldToggleStyle as De, foldPanelStyle as _e, foldDrawerStyle as Ae, resolveFoldBreakpointPx as Ie, shouldFoldAtWidth as Ke, DEFAULT_FOLD_BREAKPOINT_PX as ze, resolveSlot as He, foldSideForSlot as Ne, isStoreToken as We } from "@nika-js/onlymap";
-import { createPortal as ue } from "react-dom";
-const fe = Pe(null);
-function W(t) {
-  const e = xe(fe);
+var xe = Object.defineProperty;
+var Te = (t, e, s) => e in t ? xe(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
+var le = (t, e, s) => Te(t, typeof e != "symbol" ? e + "" : e, s);
+import { jsxs as ee, jsx as E } from "react/jsx-runtime";
+import { createContext as ke, useContext as Le, forwardRef as Me, useRef as h, useState as M, useId as me, useCallback as ce, useMemo as _, useLayoutEffect as de, useEffect as P, useImperativeHandle as _e, useSyncExternalStore as pe } from "react";
+import { MANAGED_SLOTS as $e, slotContainerStyle as je, FOLD_SIDES as K, MapController as De, parseWidgetStyle as Ae, foldToggleSlot as Ie, foldToggleStyle as ze, foldPanelStyle as Be, foldDrawerStyle as Ke, resolveFoldBreakpointPx as He, shouldFoldAtWidth as Ne, DEFAULT_FOLD_BREAKPOINT_PX as We, bottomEndLiftPx as Ve, FOLD_BOTTOM_CLEARANCE_PX as qe, resolveSlot as Je, foldSideForSlot as Ye, isStoreToken as Ge } from "@nika-js/onlymap";
+import { createPortal as ye } from "react-dom";
+const ge = ke(null);
+function Y(t) {
+  const e = Le(ge);
   if (!e) throw new Error(`[onlymapjs] ${t} must be rendered inside <OmMap>.`);
   return e;
 }
-function X(t, e) {
+function te(t, e) {
   if (t === e) return !0;
-  const s = Object.keys(t ?? {}), n = Object.keys(e ?? {});
-  return s.length !== n.length ? !1 : s.every((i) => t[i] === e[i]);
+  const s = Object.keys(t ?? {}), o = Object.keys(e ?? {});
+  return s.length !== o.length ? !1 : s.every((i) => t[i] === e[i]);
 }
-function Be(t, e) {
-  const { props: s, updateTriggers: n, ...i } = t, { props: p, updateTriggers: c, ...l } = e;
-  return X(i, l) && X(s, p) && X(n, c);
+function Xe(t, e) {
+  const { props: s, updateTriggers: o, ...i } = t, { props: m, updateTriggers: u, ...c } = e;
+  return te(i, c) && te(s, m) && te(o, u);
 }
-class qe {
+class Ze {
   constructor(e) {
-    oe(this, "descriptors", /* @__PURE__ */ new Map());
+    le(this, "descriptors", /* @__PURE__ */ new Map());
     this.controller = e;
   }
   upsert(e) {
     const s = this.descriptors.get(e.id);
-    s && Be(s, e) || (this.descriptors.set(e.id, e), this.controller.setLayers([...this.descriptors.values()]));
+    s && Xe(s, e) || (this.descriptors.set(e.id, e), this.controller.setLayers([...this.descriptors.values()]));
   }
   remove(e) {
     this.descriptors.delete(e) && this.controller.setLayers([...this.descriptors.values()]);
   }
 }
-const N = ke, Ve = Object.fromEntries(N.map((t) => [t, Me(t)])), ae = { display: "flex", pointerEvents: "none", order: 2147483647 }, Je = Object.fromEntries(A.map((t) => [t, null]));
-function Ye(t) {
+const J = $e, Ue = Object.fromEntries(J.map((t) => [t, je(t)])), ue = { display: "flex", pointerEvents: "none", order: 2147483647 }, Qe = Object.fromEntries(K.map((t) => [t, null]));
+function et(t) {
   const e = t.querySelector(
     'button:not([disabled]),a[href],input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex="-1"])'
   );
   e ? e.focus() : (t.tabIndex = -1, t.focus());
 }
-function Ge(t, e) {
-  return Object.entries(e).some(([s, n]) => n !== void 0 && t[s] !== n);
+function tt(t, e) {
+  return Object.entries(e).some(([s, o]) => o !== void 0 && t[s] !== o);
 }
-const ot = Ce(function(e, s) {
-  const { center: n, zoom: i, pitch: p, bearing: c, basemap: l, basemapKey: m, attribution: h, headless: d, widgetStyle: P, widgetsHidden: v, widgetsFold: g = !0, className: y, style: x, children: w } = e, E = b(null), T = b(null), [a, j] = $(null), [k, B] = $(null), [C, D] = $(
-    () => Object.fromEntries(N.map((r) => [r, null]))
-  ), [R, I] = $(!1), [q, me] = $(Je), [ye, ge] = $(
-    () => Object.fromEntries(A.map((r) => [r, 0]))
-  ), [be, V] = $(null), Q = `om-react-fold-${ce().replaceAll(":", "")}`, he = b(new Map(A.map((r) => [r, /* @__PURE__ */ new Set()]))), ee = d ? JSON.stringify(d) : "", K = b({
+const dt = Me(function(e, s) {
+  const { center: o, zoom: i, pitch: m, bearing: u, basemap: c, basemapKey: p, attribution: v, headless: f, widgetStyle: F, widgetsHidden: S, widgetsFold: b = !0, className: y, style: x, children: C } = e, O = h(null), k = h(null), [l, $] = M(null), [L, G] = M(null), [w, I] = M(
+    () => Object.fromEntries(J.map((r) => [r, null]))
+  ), [R, H] = M(!1), [z, he] = M({ lift: 0, shift: 0 }), [re, ve] = M(Qe), [Se, Oe] = M(
+    () => Object.fromEntries(K.map((r) => [r, 0]))
+  ), [we, X] = M(null), ne = `om-react-fold-${me().replaceAll(":", "")}`, Re = h(new Map(K.map((r) => [r, /* @__PURE__ */ new Set()]))), oe = f ? JSON.stringify(f) : "", N = h({
     badge: null,
     attribution: null
-  }), ve = se((r) => {
-    B((o) => o === r ? o : r);
-  }, []), Se = M(
+  }), Ee = ce((r) => {
+    G((n) => n === r ? n : r);
+  }, []), Pe = _(
     () => Object.fromEntries(
-      N.map((r) => [
+      J.map((r) => [
         r,
-        (o) => {
-          D((u) => u[r] === o ? u : { ...u, [r]: o });
+        (n) => {
+          I((a) => a[r] === n ? a : { ...a, [r]: n });
         }
       ])
     ),
     []
-  ), Oe = M(
+  ), Ce = _(
     () => Object.fromEntries(
-      A.map((r) => [
+      K.map((r) => [
         r,
-        (o) => {
-          me((u) => u[r] === o ? u : { ...u, [r]: o });
+        (n) => {
+          ve((a) => a[r] === n ? a : { ...a, [r]: n });
         }
       ])
     ),
     []
-  ), te = se((r, o, u) => {
-    const f = he.current.get(r), S = f.size;
-    u ? f.add(o) : f.delete(o), f.size !== S && ge((_) => ({ ..._, [r]: f.size }));
+  ), se = ce((r, n, a) => {
+    const d = Re.current.get(r), g = d.size;
+    a ? d.add(n) : d.delete(n), d.size !== g && Oe((T) => ({ ...T, [r]: d.size }));
   }, []);
-  ie(() => {
-    const r = E.current;
+  de(() => {
+    const r = O.current;
     if (!r) return;
-    let o, u = ze;
-    const f = (_) => {
-      const Z = getComputedStyle(r).getPropertyValue("--om-widget-fold-breakpoint").trim();
-      Z !== o && (o = Z, u = Ie(Z, r)), I((Ee) => g && Ke(_, u, Ee));
+    let n, a = We;
+    const d = (T) => {
+      const A = getComputedStyle(r).getPropertyValue("--om-widget-fold-breakpoint").trim();
+      A !== n && (n = A, a = He(A, r)), H((B) => b && Ne(T, a, B));
     };
-    if (f(r.getBoundingClientRect().width || (d ? d === !0 ? 800 : d.width ?? 800 : 0)), typeof ResizeObserver > "u") return;
-    const S = new ResizeObserver(([_]) => f(_.contentRect.width));
-    return S.observe(r), () => S.disconnect();
-  }, [g, ee]), F(() => {
-    (!R || v) && V(null);
-  }, [R, v]);
-  const re = b({ center: n, zoom: i, pitch: p, bearing: c });
-  re.current = { center: n, zoom: i, pitch: p, bearing: c };
-  const z = b(e.onReady);
-  z.current = e.onReady;
-  const L = b(e.onViewStateChange);
-  L.current = e.onViewStateChange;
-  const H = b(e.onRuntimeError);
-  H.current = e.onRuntimeError;
-  const J = b(l);
-  J.current = l;
-  const Y = b(void 0);
-  ie(() => {
-    if (!T.current) return;
-    const r = re.current;
-    Y.current = J.current;
-    const o = new je(T.current, {
+    if (d(r.getBoundingClientRect().width || (f ? f === !0 ? 800 : f.width ?? 800 : 0)), typeof ResizeObserver > "u") return;
+    const g = new ResizeObserver(([T]) => d(T.contentRect.width));
+    return g.observe(r), () => g.disconnect();
+  }, [b, oe]), P(() => {
+    (!R || S) && X(null);
+  }, [R, S]);
+  const ie = h({ center: o, zoom: i, pitch: m, bearing: u });
+  ie.current = { center: o, zoom: i, pitch: m, bearing: u };
+  const W = h(e.onReady);
+  W.current = e.onReady;
+  const j = h(e.onViewStateChange);
+  j.current = e.onViewStateChange;
+  const V = h(e.onRuntimeError);
+  V.current = e.onRuntimeError;
+  const Z = h(c);
+  Z.current = c;
+  const U = h(void 0);
+  de(() => {
+    if (!k.current) return;
+    const r = ie.current;
+    U.current = Z.current;
+    const n = new De(k.current, {
       center: r.center,
       zoom: r.zoom,
       pitch: r.pitch,
       bearing: r.bearing,
-      basemap: J.current,
-      basemapKey: m,
-      attribution: h,
-      headless: d ? d === !0 ? {} : d : void 0,
+      basemap: Z.current,
+      basemapKey: p,
+      attribution: v,
+      headless: f ? f === !0 ? {} : f : void 0,
       chromeHosts: {
-        badge: K.current.badge ?? void 0,
-        attribution: K.current.attribution ?? void 0
+        badge: N.current.badge ?? void 0,
+        attribution: N.current.attribution ?? void 0
       },
-      onRuntimeError: (f) => {
-        var S;
-        return (S = H.current) == null ? void 0 : S.call(H, f);
+      onRuntimeError: (d) => {
+        var g;
+        return (g = V.current) == null ? void 0 : g.call(V, d);
       }
     });
-    j(o);
-    let u = !0;
-    return o.ready.then(() => {
-      var f;
-      u && ((f = z.current) == null || f.call(z));
+    $(n);
+    let a = !0;
+    return n.ready.then(() => {
+      var d;
+      a && ((d = W.current) == null || d.call(W));
     }), () => {
-      u = !1, j(null), o.destroy();
+      a = !1, $(null), n.destroy();
     };
-  }, [ee]), F(() => {
-    !a || Y.current === l || (Y.current = l, a.setBasemap(l ?? null));
-  }, [a, l]), Te(s, () => a, [a]), F(() => {
-    if (!a) return;
-    const r = { longitude: n == null ? void 0 : n[0], latitude: n == null ? void 0 : n[1], zoom: i, pitch: p, bearing: c };
-    Ge(a.getViewState(), r) && a.setView(r);
-  }, [a, n == null ? void 0 : n[0], n == null ? void 0 : n[1], i, p, c]), F(() => {
+  }, [oe]), P(() => {
+    !l || U.current === c || (U.current = c, l.setBasemap(c ?? null));
+  }, [l, c]), _e(s, () => l, [l]), P(() => {
+    if (!l) return;
+    const r = { longitude: o == null ? void 0 : o[0], latitude: o == null ? void 0 : o[1], zoom: i, pitch: m, bearing: u };
+    tt(l.getViewState(), r) && l.setView(r);
+  }, [l, o == null ? void 0 : o[0], o == null ? void 0 : o[1], i, m, u]), P(() => {
     var r;
-    if (a)
-      return (r = L.current) == null || r.call(L, a.getViewState()), a.getStore("viewport").subscribe(() => {
-        var o;
-        return (o = L.current) == null ? void 0 : o.call(L, a.getViewState());
+    if (l)
+      return (r = j.current) == null || r.call(j, l.getViewState()), l.getStore("viewport").subscribe(() => {
+        var n;
+        return (n = j.current) == null ? void 0 : n.call(j, l.getViewState());
       });
-  }, [a]);
-  const we = M(
+  }, [l]);
+  const D = w["bottom-start"], q = w["bottom-end"];
+  P(() => {
+    const r = O.current;
+    if (!r || !q || typeof ResizeObserver > "u") return;
+    const n = () => {
+      const d = parseFloat(getComputedStyle(r).getPropertyValue("--om-widget-gap-y")) || 8, g = q.getBoundingClientRect(), T = Ve(
+        (D == null ? void 0 : D.getBoundingClientRect()) ?? null,
+        g,
+        R ? qe : 0,
+        d
+      ), A = T + Math.ceil(g.height) + d;
+      he((B) => B.lift === T && B.shift === A ? B : { lift: T, shift: A });
+    }, a = new ResizeObserver(n);
+    return a.observe(r), a.observe(q), D && a.observe(D), n(), () => a.disconnect();
+  }, [D, q, R]);
+  const Fe = _(
     () => ({
       position: "absolute",
       inset: 0,
       zIndex: 20,
       pointerEvents: "none",
       opacity: "var(--om-widget-opacity, 1)",
-      ...P ? Le(P).properties : void 0
+      // Measured clearance for the floating bottom drawer toggle — the
+      // drawer root reads it through foldDrawerStyle's max() (same wiring
+      // as the HTML lane's widget layer).
+      "--om-fold-bottom-shift": `${z.shift}px`,
+      ...F ? Ae(F).properties : void 0
     }),
-    [P]
-  ), G = M(() => a ? new qe(a) : null, [a]), ne = M(
-    () => a && G && k ? { controller: a, layers: G, overlayPane: k, corners: C, widgetsHidden: !!v, widgetsFolded: R, foldPanels: q, registerFoldedWidget: te } : null,
-    [a, G, k, C, v, R, q, te]
+    [F, z.shift]
+  ), Q = _(() => l ? new Ze(l) : null, [l]), ae = _(
+    () => l && Q && L ? { controller: l, layers: Q, overlayPane: L, corners: w, widgetsHidden: !!S, widgetsFolded: R, foldPanels: re, registerFoldedWidget: se } : null,
+    [l, Q, L, w, S, R, re, se]
   );
-  return /* @__PURE__ */ U("div", { ref: E, className: y, style: { position: "relative", overflow: "hidden", ...x }, children: [
-    /* @__PURE__ */ O("div", { ref: T, style: { position: "absolute", inset: 0 } }),
-    /* @__PURE__ */ O(
+  return /* @__PURE__ */ ee("div", { ref: O, className: y, style: { position: "relative", overflow: "hidden", ...x }, children: [
+    /* @__PURE__ */ E("div", { ref: k, style: { position: "absolute", inset: 0 } }),
+    /* @__PURE__ */ E(
       "div",
       {
-        ref: ve,
+        ref: Ee,
         style: { position: "absolute", top: 0, left: 0, zIndex: 10, pointerEvents: "none" }
       }
     ),
-    /* @__PURE__ */ O("div", { "data-om-widget-layer": "", style: we, children: N.map((r) => /* @__PURE__ */ U(
+    /* @__PURE__ */ E("div", { "data-om-widget-layer": "", style: Fe, children: J.map((r) => /* @__PURE__ */ ee(
       "div",
       {
         "data-om-widget-slot": r,
-        ref: Se[r],
+        ref: Pe[r],
         style: {
-          ...Ve[r],
-          ...R && r === "bottom-end" ? { bottom: "calc(var(--om-widget-inset-y, 12px) + 28px)" } : void 0
+          ...Ue[r],
+          ...z.lift > 0 && r === "bottom-end" ? { bottom: `calc(var(--om-widget-inset-y, 12px) + ${z.lift}px)` } : void 0
         },
         children: [
-          R && A.filter((o) => $e(o) === r && ye[o] > 0).map((o) => {
-            const u = be === o;
-            return /* @__PURE__ */ U(
+          R && K.filter((n) => Ie(n) === r && Se[n] > 0).map((n) => {
+            const a = we === n;
+            return /* @__PURE__ */ ee(
               "div",
               {
-                "data-om-fold-drawer": o,
-                style: { ...Ae(o), display: v ? "none" : "flex" },
-                onKeyDown: (f) => {
-                  var S;
-                  f.key !== "Escape" || !u || (V(null), (S = f.currentTarget.querySelector("[data-om-fold-toggle]")) == null || S.focus(), f.preventDefault(), f.stopPropagation());
+                "data-om-fold-drawer": n,
+                style: { ...Ke(n), display: S ? "none" : "flex" },
+                onKeyDown: (d) => {
+                  var g;
+                  d.key !== "Escape" || !a || (X(null), (g = d.currentTarget.querySelector("[data-om-fold-toggle]")) == null || g.focus(), d.preventDefault(), d.stopPropagation());
                 },
                 children: [
-                  /* @__PURE__ */ O(
+                  /* @__PURE__ */ E(
                     "button",
                     {
                       type: "button",
-                      "data-om-fold-toggle": o,
-                      "aria-expanded": u,
-                      "aria-controls": `${Q}-${o}`,
-                      "aria-label": `${u ? "Close" : "Open"} ${o} map controls`,
-                      style: De(),
+                      "data-om-fold-toggle": n,
+                      "aria-expanded": a,
+                      "aria-controls": `${ne}-${n}`,
+                      "aria-label": `${a ? "Close" : "Open"} ${n} map controls`,
+                      style: ze(),
                       onClick: () => {
-                        V(u ? null : o), u || requestAnimationFrame(() => {
-                          var S;
-                          const f = (S = E.current) == null ? void 0 : S.querySelector(`[data-om-fold-panel="${o}"]`);
-                          f && Ye(f);
+                        X(a ? null : n), a || requestAnimationFrame(() => {
+                          var g;
+                          const d = (g = O.current) == null ? void 0 : g.querySelector(`[data-om-fold-panel="${n}"]`);
+                          d && et(d);
                         });
                       },
                       children: "⋯"
                     }
                   ),
-                  /* @__PURE__ */ O(
+                  /* @__PURE__ */ E(
                     "div",
                     {
-                      id: `${Q}-${o}`,
-                      ref: Oe[o],
-                      "data-om-fold-panel": o,
+                      id: `${ne}-${n}`,
+                      ref: Ce[n],
+                      "data-om-fold-panel": n,
                       role: "region",
-                      "aria-label": `${o} map controls`,
-                      hidden: !u,
-                      style: { ..._e(o), display: u ? "flex" : "none" }
+                      "aria-label": `${n} map controls`,
+                      hidden: !a,
+                      style: { ...Be(n), display: a ? "flex" : "none" }
                     }
                   )
                 ]
               },
-              `fold-${o}`
+              `fold-${n}`
             );
           }),
-          r === "bottom-start" && /* @__PURE__ */ O(
+          r === "bottom-start" && /* @__PURE__ */ E(
             "div",
             {
               "data-om-mandated-chrome": "badge",
-              ref: (o) => {
-                K.current.badge = o;
+              ref: (n) => {
+                N.current.badge = n;
               },
-              style: ae
+              style: ue
             }
           ),
-          r === "bottom-end" && /* @__PURE__ */ O(
+          r === "bottom-end" && /* @__PURE__ */ E(
             "div",
             {
               "data-om-mandated-chrome": "attribution",
-              ref: (o) => {
-                K.current.attribution = o;
+              ref: (n) => {
+                N.current.attribution = n;
               },
-              style: ae
+              style: ue
             }
           )
         ]
       },
       r
     )) }),
-    ne && /* @__PURE__ */ O(fe.Provider, { value: ne, children: w })
+    ae && /* @__PURE__ */ E(ge.Provider, { value: ae, children: C })
   ] });
-}), pe = {
+}), be = {
   id: "id",
   type: "type",
   data: "data",
@@ -279,67 +298,67 @@ const ot = Ce(function(e, s) {
   terrain: "terrain",
   visibleZoomRange: "visibleZoomRange",
   updateTriggers: "updateTriggers"
-}, Ze = /* @__PURE__ */ new Set([...Object.keys(pe), "onClick", "onHover"]);
-function Ue(t) {
+}, rt = /* @__PURE__ */ new Set([...Object.keys(be), "onClick", "onHover"]);
+function nt(t) {
   const e = {};
-  for (const [n, i] of Object.entries(t))
-    !Ze.has(n) && i !== void 0 && (e[n] = i);
+  for (const [o, i] of Object.entries(t))
+    !rt.has(o) && i !== void 0 && (e[o] = i);
   const s = {};
-  for (const [n, i] of Object.entries(pe))
-    s[i] = t[n];
+  for (const [o, i] of Object.entries(be))
+    s[i] = t[o];
   return Object.keys(e).length > 0 && (s.props = e), s;
 }
-function st(t) {
-  const { controller: e, layers: s } = W("OmLayer"), { id: n } = t, i = Ue(t);
-  F(() => {
+function ut(t) {
+  const { controller: e, layers: s } = Y("OmLayer"), { id: o } = t, i = nt(t);
+  P(() => {
     s.upsert(i);
-  }), F(() => () => s.remove(n), [s, n]);
-  const p = b(t.onClick);
-  p.current = t.onClick;
-  const c = b(t.onHover);
-  return c.current = t.onHover, F(
-    () => e.watchPicks((l) => {
-      var m, h, d;
-      if (l === null) {
-        (m = c.current) == null || m.call(c, null);
+  }), P(() => () => s.remove(o), [s, o]);
+  const m = h(t.onClick);
+  m.current = t.onClick;
+  const u = h(t.onHover);
+  return u.current = t.onHover, P(
+    () => e.watchPicks((c) => {
+      var p, v, f;
+      if (c === null) {
+        (p = u.current) == null || p.call(u, null);
         return;
       }
-      l.layerId === n && (l.type === "click" ? (h = p.current) == null || h.call(p, l) : (d = c.current) == null || d.call(c, l));
+      c.layerId === o && (c.type === "click" ? (v = m.current) == null || v.call(m, c) : (f = u.current) == null || f.call(u, c));
     }),
-    [e, n]
+    [e, o]
   ), null;
 }
-function it({ position: t = "top-start", order: e, fold: s, className: n, style: i, children: p }) {
-  const { corners: c, widgetsHidden: l, widgetsFolded: m, foldPanels: h, registerFoldedWidget: d } = W("OmWidget"), P = ce(), v = He(t) ?? "top-start", g = m && v !== "manual" && s !== "never", y = v === "manual" ? null : Ne(v);
-  if (F(() => {
+function ft({ position: t = "top-start", order: e, fold: s, className: o, style: i, children: m }) {
+  const { corners: u, widgetsHidden: c, widgetsFolded: p, foldPanels: v, registerFoldedWidget: f } = Y("OmWidget"), F = me(), S = Je(t) ?? "top-start", b = p && S !== "manual" && s !== "never", y = S === "manual" ? null : Ye(S);
+  if (P(() => {
     if (y)
-      return d(y, P, g), () => d(y, P, !1);
-  }, [y, P, g, d]), v === "manual")
-    return /* @__PURE__ */ O("div", { className: n, style: { pointerEvents: "auto", ...i }, children: p });
-  const x = g && y ? h[y] : c[v];
-  return x ? ue(
-    /* @__PURE__ */ O(
+      return f(y, F, b), () => f(y, F, !1);
+  }, [y, F, b, f]), S === "manual")
+    return /* @__PURE__ */ E("div", { className: o, style: { pointerEvents: "auto", ...i }, children: m });
+  const x = b && y ? v[y] : u[S];
+  return x ? ye(
+    /* @__PURE__ */ E(
       "div",
       {
         "data-om-react-widget": "",
-        "data-om-fold-origin-slot": g ? v : void 0,
-        className: n,
+        "data-om-fold-origin-slot": b ? S : void 0,
+        className: o,
         style: {
           ...e !== void 0 ? { order: e } : void 0,
           ...i,
-          pointerEvents: l ? "none" : (i == null ? void 0 : i.pointerEvents) ?? "auto",
-          visibility: l ? "hidden" : i == null ? void 0 : i.visibility
+          pointerEvents: c ? "none" : (i == null ? void 0 : i.pointerEvents) ?? "auto",
+          visibility: c ? "hidden" : i == null ? void 0 : i.visibility
         },
-        children: p
+        children: m
       }
     ),
     x
   ) : null;
 }
-function le(t, e, s, n) {
-  return e && (t == null ? void 0 : t.layerId) !== e ? !1 : !s || (t ? t.type : n) === s;
+function fe(t, e, s, o) {
+  return e && (t == null ? void 0 : t.layerId) !== e ? !1 : !s || (t ? t.type : o) === s;
 }
-const Xe = {
+const ot = {
   "top-left": "translate(0, 0)",
   "top-center": "translate(-50%, 0)",
   "top-right": "translate(-100%, 0)",
@@ -350,52 +369,52 @@ const Xe = {
   "bottom-center": "translate(-50%, -100%)",
   "bottom-right": "translate(-100%, -100%)"
 };
-function at(t) {
-  const { controller: e, overlayPane: s } = W("OmOverlay"), n = b(null), i = b(void 0), p = b(t);
-  p.current = t;
-  const c = M(() => {
-    const g = e.getStore("selection");
-    let y, x, w = null;
+function mt(t) {
+  const { controller: e, overlayPane: s } = Y("OmOverlay"), o = h(null), i = h(void 0), m = h(t);
+  m.current = t;
+  const u = _(() => {
+    const b = e.getStore("selection");
+    let y, x, C = null;
     return {
-      subscribe: g.subscribe,
+      subscribe: b.subscribe,
       getSnapshot: () => {
-        const E = g.getSnapshot(), { anchorFrom: T, layer: a, selectionType: j } = p.current, k = `${T ?? ""}|${a ?? ""}|${j ?? ""}`;
-        return (E !== y || k !== x) && (y = E, x = k, T === "selection" && le(E, a, j, e.getLastPickType()) && (w = E)), w;
+        const O = b.getSnapshot(), { anchorFrom: k, layer: l, selectionType: $ } = m.current, L = `${k ?? ""}|${l ?? ""}|${$ ?? ""}`;
+        return (O !== y || L !== x) && (y = O, x = L, k === "selection" && fe(O, l, $, e.getLastPickType()) && (C = O)), C;
       }
     };
-  }, [e]), l = de(
-    c.subscribe,
-    c.getSnapshot,
-    c.getSnapshot
+  }, [e]), c = pe(
+    u.subscribe,
+    u.getSnapshot,
+    u.getSnapshot
   );
-  F(
-    () => e.registerOverlay((g, y, x) => {
-      const w = n.current;
-      if (!w) return;
-      const { anchor: E, anchorFrom: T, layer: a, selectionType: j, visible: k = !0, anchorOffset: B } = p.current;
-      let C;
-      if (T === "selection" ? (le(y, a, j, x) && (i.current = (y == null ? void 0 : y.coordinate) ?? void 0), C = i.current) : C = E, !k || !C || !g) {
-        w.style.visibility = "hidden";
+  P(
+    () => e.registerOverlay((b, y, x) => {
+      const C = o.current;
+      if (!C) return;
+      const { anchor: O, anchorFrom: k, layer: l, selectionType: $, visible: L = !0, anchorOffset: G } = m.current;
+      let w;
+      if (k === "selection" ? (fe(y, l, $, x) && (i.current = (y == null ? void 0 : y.coordinate) ?? void 0), w = i.current) : w = O, !L || !w || !b) {
+        C.style.visibility = "hidden";
         return;
       }
-      const [D, R, I] = g.project([C[0], C[1], C[2] ?? 0]);
-      if (!(D >= 0 && D <= g.width && R >= 0 && R <= g.height) || I !== void 0 && I < 0) {
-        w.style.visibility = "hidden";
+      const [I, R, H] = b.project([w[0], w[1], w[2] ?? 0]);
+      if (!(I >= 0 && I <= b.width && R >= 0 && R <= b.height) || H !== void 0 && H < 0) {
+        C.style.visibility = "hidden";
         return;
       }
-      w.style.visibility = "visible", w.style.transform = `translate(${D}px, ${R}px) ${Xe[B ?? "bottom-center"]}`;
+      C.style.visibility = "visible", C.style.transform = `translate(${I}px, ${R}px) ${ot[G ?? "bottom-center"]}`;
     }),
     [e]
-  ), F(() => {
+  ), P(() => {
     e.refreshOverlays();
   });
-  const { children: m, className: h, style: d, interactive: P = !0 } = t, v = typeof m == "function" ? m(l) : m;
-  return ue(
-    /* @__PURE__ */ O(
+  const { children: p, className: v, style: f, interactive: F = !0 } = t, S = typeof p == "function" ? p(c) : p;
+  return ye(
+    /* @__PURE__ */ E(
       "div",
       {
-        ref: n,
-        className: h,
+        ref: o,
+        className: v,
         style: {
           position: "absolute",
           top: 0,
@@ -403,38 +422,38 @@ function at(t) {
           visibility: "hidden",
           // hidden until the first flush positions it — never flashes at the origin
           willChange: "transform",
-          pointerEvents: P ? "auto" : "none",
-          ...d
+          pointerEvents: F ? "auto" : "none",
+          ...f
         },
-        children: v
+        children: S
       }
     ),
     s
   );
 }
-function lt(t = []) {
-  const { controller: e } = W("useOmMap"), s = t.join(" "), n = M(() => {
-    const c = (s ? s.split(" ") : []).flatMap((m) => We(m) ? [e.getStore(m)] : (console.warn(`[onlymapjs] useOmMap: "${m}" is not a watch token on the React front-end — expected viewport, selection, layers, or data:<layerId>.`), []));
-    let l;
+function pt(t = []) {
+  const { controller: e } = Y("useOmMap"), s = t.join(" "), o = _(() => {
+    const u = (s ? s.split(" ") : []).flatMap((p) => Ge(p) ? [e.getStore(p)] : (console.warn(`[onlymapjs] useOmMap: "${p}" is not a watch token on the React front-end — expected viewport, selection, layers, or data:<layerId>.`), []));
+    let c;
     return {
-      subscribe: (m) => {
-        const h = c.map((d) => d.subscribe(m));
+      subscribe: (p) => {
+        const v = u.map((f) => f.subscribe(p));
         return () => {
-          for (const d of h) d();
+          for (const f of v) f();
         };
       },
       getSnapshot: () => {
-        const m = c.map((h) => h.getSnapshot());
-        return (!l || m.some((h, d) => h !== l[d])) && (l = m), l;
+        const p = u.map((v) => v.getSnapshot());
+        return (!c || p.some((v, f) => v !== c[f])) && (c = p), c;
       }
     };
-  }, [e, s]), i = de(n.subscribe, n.getSnapshot, n.getSnapshot);
-  return M(() => e.buildCtx(), [e, i]);
+  }, [e, s]), i = pe(o.subscribe, o.getSnapshot, o.getSnapshot);
+  return _(() => e.buildCtx(), [e, i]);
 }
 export {
-  st as OmLayer,
-  ot as OmMap,
-  at as OmOverlay,
-  it as OmWidget,
-  lt as useOmMap
+  ut as OmLayer,
+  dt as OmMap,
+  mt as OmOverlay,
+  ft as OmWidget,
+  pt as useOmMap
 };