@nika-js/onlymap 0.7.3 → 0.7.5

package/dist/react.js

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