@zonetrix/viewer 2.10.2 → 2.10.4

package/dist/index.mjs

@@ -1,95 +1,95 @@
-import { jsx as y, jsxs as D } from "react/jsx-runtime";
-import { useState as R, useEffect as Y, useRef as T, useCallback as N, useMemo as _, memo as ce } from "react";
-import { Stage as dt, Layer as Fe, Group as ut, Rect as Te, Text as Ie, Circle as ht } from "react-konva";
-import { ref as we, onValue as ze, off as Ae, get as ft } from "firebase/database";
+import { jsx as y, jsxs as L } from "react/jsx-runtime";
+import { useState as N, useEffect as W, useRef as A, useCallback as I, useMemo as U, memo as ne, useSyncExternalStore as lt } from "react";
+import { Stage as dt, Layer as Me, Group as ut, Rect as ke, Text as Ee, Circle as ht } from "react-konva";
+import { ref as ve, onValue as Le, off as De, get as ft } from "firebase/database";
 import { fromFirebaseSeatMap as gt } from "@zonetrix/shared";
 function pt(t) {
-  const [n, o] = R(null), [r, u] = R(!1), [l, s] = R(null), x = async () => {
+  const [n, i] = N(null), [r, d] = N(!1), [c, o] = N(null), S = async () => {
     if (t) {
-      u(!0), s(null);
+      d(!0), o(null);
       try {
-        const f = await fetch(t);
-        if (!f.ok)
-          throw new Error(`Failed to fetch config: ${f.statusText}`);
-        const i = await f.json();
-        o(i);
-      } catch (f) {
-        const i = f instanceof Error ? f : new Error("Unknown error occurred");
-        s(i), console.error("Failed to fetch seat map config:", i);
+        const h = await fetch(t);
+        if (!h.ok)
+          throw new Error(`Failed to fetch config: ${h.statusText}`);
+        const a = await h.json();
+        i(a);
+      } catch (h) {
+        const a = h instanceof Error ? h : new Error("Unknown error occurred");
+        o(a), console.error("Failed to fetch seat map config:", a);
       } finally {
-        u(!1);
+        d(!1);
       }
     }
   };
-  return Y(() => {
-    x();
+  return W(() => {
+    S();
   }, [t]), {
     config: n,
     loading: r,
-    error: l,
-    refetch: x
+    error: c,
+    refetch: S
   };
 }
-function yt(t) {
-  const [n, o] = R({ width: 0, height: 0 });
-  return Y(() => {
+function bt(t) {
+  const [n, i] = N({ width: 0, height: 0 });
+  return W(() => {
     const r = t.current;
     if (!r) return;
-    const { width: u, height: l } = r.getBoundingClientRect();
-    u > 0 && l > 0 && o({ width: u, height: l });
-    const s = new ResizeObserver((x) => {
-      const f = x[0];
-      if (!f) return;
-      const { width: i, height: a } = f.contentRect;
-      i > 0 && a > 0 && o((d) => d.width === i && d.height === a ? d : { width: i, height: a });
+    const { width: d, height: c } = r.getBoundingClientRect();
+    d > 0 && c > 0 && i({ width: d, height: c });
+    const o = new ResizeObserver((S) => {
+      const h = S[0];
+      if (!h) return;
+      const { width: a, height: s } = h.contentRect;
+      a > 0 && s > 0 && i((u) => u.width === a && u.height === s ? u : { width: a, height: s });
     });
-    return s.observe(r), () => {
-      s.disconnect();
+    return o.observe(r), () => {
+      o.disconnect();
     };
   }, [t]), n;
 }
-function De(t, n) {
+function Ie(t, n) {
   return Math.sqrt(Math.pow(n.x - t.x, 2) + Math.pow(n.y - t.y, 2));
 }
-function ke(t, n) {
+function Fe(t, n) {
   return {
     x: (t.x + n.x) / 2,
     y: (t.y + n.y) / 2
   };
 }
-function bt(t, n) {
-  const o = T(null), r = T(null), u = T(1);
-  Y(() => {
-    const l = t.current;
-    if (!l || !n.enabled) return;
-    const s = l.container(), x = (a) => {
-      if (a.touches.length === 2) {
-        a.preventDefault();
-        const d = { x: a.touches[0].clientX, y: a.touches[0].clientY }, h = { x: a.touches[1].clientX, y: a.touches[1].clientY };
-        o.current = De(d, h), r.current = ke(d, h), u.current = n.currentScale;
+function yt(t, n) {
+  const i = A(null), r = A(null), d = A(1);
+  W(() => {
+    const c = t.current;
+    if (!c || !n.enabled) return;
+    const o = c.container(), S = (s) => {
+      if (s.touches.length === 2) {
+        s.preventDefault();
+        const u = { x: s.touches[0].clientX, y: s.touches[0].clientY }, f = { x: s.touches[1].clientX, y: s.touches[1].clientY };
+        i.current = Ie(u, f), r.current = Fe(u, f), d.current = n.currentScale;
       }
-    }, f = (a) => {
-      if (a.touches.length !== 2) return;
-      a.preventDefault();
-      const d = { x: a.touches[0].clientX, y: a.touches[0].clientY }, h = { x: a.touches[1].clientX, y: a.touches[1].clientY }, m = De(d, h), S = ke(d, h);
-      if (o.current !== null && r.current !== null) {
-        const C = m / o.current, F = Math.min(
+    }, h = (s) => {
+      if (s.touches.length !== 2) return;
+      s.preventDefault();
+      const u = { x: s.touches[0].clientX, y: s.touches[0].clientY }, f = { x: s.touches[1].clientX, y: s.touches[1].clientY }, g = Ie(u, f), x = Fe(u, f);
+      if (i.current !== null && r.current !== null) {
+        const C = g / i.current, R = Math.min(
           Math.max(n.currentScale * C, n.minScale),
           n.maxScale
-        ), I = s.getBoundingClientRect(), M = S.x - I.left, L = S.y - I.top, z = n.currentScale, X = {
-          x: (M - n.currentPosition.x) / z,
-          y: (L - n.currentPosition.y) / z
-        }, q = S.x - r.current.x, j = S.y - r.current.y, Z = {
-          x: M - X.x * F + q,
-          y: L - X.y * F + j
+        ), F = o.getBoundingClientRect(), M = x.x - F.left, k = x.y - F.top, Y = n.currentScale, T = {
+          x: (M - n.currentPosition.x) / Y,
+          y: (k - n.currentPosition.y) / Y
+        }, X = x.x - r.current.x, j = x.y - r.current.y, re = {
+          x: M - T.x * R + X,
+          y: k - T.y * R + j
         };
-        n.onScaleChange(F, Z), o.current = m, r.current = S;
+        n.onScaleChange(R, re), i.current = g, r.current = x;
       }
-    }, i = (a) => {
-      a.touches.length < 2 && (o.current = null, r.current = null);
+    }, a = (s) => {
+      s.touches.length < 2 && (i.current = null, r.current = null);
     };
-    return s.addEventListener("touchstart", x, { passive: !1 }), s.addEventListener("touchmove", f, { passive: !1 }), s.addEventListener("touchend", i), () => {
-      s.removeEventListener("touchstart", x), s.removeEventListener("touchmove", f), s.removeEventListener("touchend", i);
+    return o.addEventListener("touchstart", S, { passive: !1 }), o.addEventListener("touchmove", h, { passive: !1 }), o.addEventListener("touchend", a), () => {
+      o.removeEventListener("touchstart", S), o.removeEventListener("touchmove", h), o.removeEventListener("touchend", a);
     };
   }, [t, n]);
 }
@@ -103,45 +103,45 @@ const vt = {
   seatHidden: "#4a4a4a",
   gridLines: "#404040",
   currency: "KD"
-}, Xe = ce(({ seat: t, state: n, colors: o, onClick: r, onMouseEnter: u, onMouseLeave: l }) => {
-  const f = {
-    available: o.seatAvailable,
-    reserved: o.seatReserved,
-    selected: o.seatSelected,
-    unavailable: o.seatUnavailable,
-    hidden: o.seatHidden
+}, Ne = ne(({ seat: t, state: n, colors: i, onClick: r, onMouseEnter: d, onMouseLeave: c }) => {
+  const h = {
+    available: i.seatAvailable,
+    reserved: i.seatReserved,
+    selected: i.seatSelected,
+    unavailable: i.seatUnavailable,
+    hidden: i.seatHidden
     // Hidden seats are filtered out, but included for type safety
-  }[n], i = n === "available" || n === "selected", a = N(() => {
-    i && r(t);
-  }, [t, r, i]), d = N((S) => {
-    u(t, S);
-    const C = S.target.getStage();
-    C && i && (C.container().style.cursor = "pointer");
-  }, [t, u, i]), h = N((S) => {
-    l();
-    const C = S.target.getStage();
+  }[n], a = n === "available" || n === "selected", s = I(() => {
+    a && r(t);
+  }, [t, r, a]), u = I((x) => {
+    d(t, x);
+    const C = x.target.getStage();
+    C && a && (C.container().style.cursor = "pointer");
+  }, [t, d, a]), f = I((x) => {
+    c();
+    const C = x.target.getStage();
     C && (C.container().style.cursor = "grab");
-  }, [l]), m = {
+  }, [c]), g = {
     x: t.position.x,
     y: t.position.y,
-    fill: f,
+    fill: h,
     stroke: "#ffffff",
     strokeWidth: 1,
-    onClick: a,
-    onTap: a,
-    onMouseEnter: d,
-    onMouseLeave: h
+    onClick: s,
+    onTap: s,
+    onMouseEnter: u,
+    onMouseLeave: f
   };
   return t.shape === "circle" ? /* @__PURE__ */ y(
     ht,
     {
-      ...m,
+      ...g,
       radius: 12
     }
   ) : /* @__PURE__ */ y(
-    Te,
+    ke,
     {
-      ...m,
+      ...g,
       width: 24,
       height: 24,
       offsetX: 12,
@@ -150,9 +150,9 @@ const vt = {
     }
   );
 });
-Xe.displayName = "ViewerSeat";
-const Ye = ce(({ stage: t, stageColor: n }) => {
-  const o = (l) => ({
+Ne.displayName = "ViewerSeat";
+const Te = ne(({ stage: t, stageColor: n }) => {
+  const i = (c) => ({
     stage: "🎭",
     table: "⬜",
     wall: "▬",
@@ -161,10 +161,10 @@ const Ye = ce(({ stage: t, stageColor: n }) => {
     bar: "🍷",
     "entry-exit": "🚪",
     custom: "➕"
-  })[l || "stage"] || "🎭", r = t.config.color || n, u = o(t.config.objectType);
-  return /* @__PURE__ */ D(ut, { x: t.position.x, y: t.position.y, rotation: t.config.rotation || 0, children: [
+  })[c || "stage"] || "🎭", r = t.config.color || n, d = i(t.config.objectType);
+  return /* @__PURE__ */ L(ut, { x: t.position.x, y: t.position.y, rotation: t.config.rotation || 0, children: [
     /* @__PURE__ */ y(
-      Te,
+      ke,
       {
         width: t.config.width,
         height: t.config.height,
@@ -175,9 +175,9 @@ const Ye = ce(({ stage: t, stageColor: n }) => {
       }
     ),
     /* @__PURE__ */ y(
-      Ie,
+      Ee,
       {
-        text: u,
+        text: d,
         x: 0,
         y: 0,
         width: t.config.width,
@@ -189,7 +189,7 @@ const Ye = ce(({ stage: t, stageColor: n }) => {
       }
     ),
     /* @__PURE__ */ y(
-      Ie,
+      Ee,
       {
         text: t.config.label,
         x: 0,
@@ -205,20 +205,20 @@ const Ye = ce(({ stage: t, stageColor: n }) => {
     )
   ] });
 });
-Ye.displayName = "ViewerStage";
-const je = ce(({
+Te.displayName = "ViewerStage";
+const ze = ne(({
   floors: t,
   currentFloorId: n,
-  onFloorChange: o,
+  onFloorChange: i,
   showAllOption: r,
-  allLabel: u,
-  position: l,
-  className: s
+  allLabel: d,
+  position: c,
+  className: o
 }) => {
-  const x = _(
-    () => [...t].sort((h, m) => h.order - m.order),
+  const S = U(
+    () => [...t].sort((f, g) => f.order - g.order),
     [t]
-  ), i = {
+  ), a = {
     position: "absolute",
     display: "flex",
     alignItems: "center",
@@ -233,8 +233,8 @@ const je = ce(({
       "top-right": { top: 0, right: 0 },
       "bottom-left": { bottom: 0, left: 0 },
       "bottom-right": { bottom: 0, right: 0 }
-    }[l]
-  }, a = {
+    }[c]
+  }, s = {
     padding: "10px 16px",
     fontSize: "14px",
     fontWeight: 500,
@@ -246,44 +246,44 @@ const je = ce(({
     transition: "all 0.2s ease",
     minHeight: "44px",
     touchAction: "manipulation"
-  }, d = {
-    ...a,
+  }, u = {
+    ...s,
     backgroundColor: "#3A7DE5",
     borderColor: "#3A7DE5"
   };
-  return /* @__PURE__ */ D("div", { className: s, style: i, children: [
+  return /* @__PURE__ */ L("div", { className: o, style: a, children: [
     r && /* @__PURE__ */ y(
       "button",
       {
         type: "button",
-        onClick: () => o(null),
-        style: n === null ? d : a,
-        children: u
+        onClick: () => i(null),
+        style: n === null ? u : s,
+        children: d
       }
     ),
-    x.map((h) => /* @__PURE__ */ y(
+    S.map((f) => /* @__PURE__ */ y(
       "button",
       {
         type: "button",
-        onClick: () => o(h.id),
-        style: n === h.id ? d : a,
-        children: h.name
+        onClick: () => i(f.id),
+        style: n === f.id ? u : s,
+        children: f.name
       },
-      h.id
+      f.id
     ))
   ] });
 });
-je.displayName = "FloorSelectorBar";
-const We = ce(({
+ze.displayName = "FloorSelectorBar";
+const Ae = ne(({
   scale: t,
   minScale: n,
-  maxScale: o,
+  maxScale: i,
   onZoomIn: r,
-  onZoomOut: u,
-  position: l,
-  className: s
+  onZoomOut: d,
+  position: c,
+  className: o
 }) => {
-  const f = {
+  const h = {
     position: "absolute",
     display: "flex",
     flexDirection: "column",
@@ -298,8 +298,8 @@ const We = ce(({
       "top-right": { top: 0, right: 0 },
       "bottom-left": { bottom: 0, left: 0 },
       "bottom-right": { bottom: 0, right: 0 }
-    }[l]
-  }, i = {
+    }[c]
+  }, a = {
     width: "44px",
     height: "44px",
     minWidth: "44px",
@@ -316,19 +316,19 @@ const We = ce(({
     justifyContent: "center",
     transition: "all 0.2s ease",
     touchAction: "manipulation"
-  }, a = {
-    ...i,
+  }, s = {
+    ...a,
     opacity: 0.4,
     cursor: "not-allowed"
-  }, d = t < o, h = t > n;
-  return /* @__PURE__ */ D("div", { className: s, style: f, children: [
+  }, u = t < i, f = t > n;
+  return /* @__PURE__ */ L("div", { className: o, style: h, children: [
     /* @__PURE__ */ y(
       "button",
       {
         type: "button",
         onClick: r,
-        disabled: !d,
-        style: d ? i : a,
+        disabled: !u,
+        style: u ? a : s,
         title: "Zoom In",
         children: "+"
       }
@@ -337,32 +337,32 @@ const We = ce(({
       "button",
       {
         type: "button",
-        onClick: u,
-        disabled: !h,
-        style: h ? i : a,
+        onClick: d,
+        disabled: !f,
+        style: f ? a : s,
         title: "Zoom Out",
         children: "−"
       }
     )
   ] });
 });
-We.displayName = "ZoomControls";
-const Pe = ce(({
+Ae.displayName = "ZoomControls";
+const Xe = ne(({
   visible: t,
   x: n,
-  y: o,
+  y: i,
   seat: r,
-  currency: u,
-  state: l
+  currency: d,
+  state: c
 }) => {
   if (!t || !r) return null;
-  const s = r.seatNumber || (r.rowLabel && r.columnLabel ? `${r.rowLabel}-${r.columnLabel}` : "N/A"), x = {
+  const o = r.seatNumber || (r.rowLabel && r.columnLabel ? `${r.rowLabel}-${r.columnLabel}` : "N/A"), S = {
     position: "fixed",
     left: `${n + 15}px`,
-    top: `${o + 15}px`,
+    top: `${i + 15}px`,
     zIndex: 1e3,
     pointerEvents: "none"
-  }, f = {
+  }, h = {
     backgroundColor: "rgba(26, 26, 26, 0.95)",
     color: "#fff",
     border: "1px solid #444",
@@ -371,512 +371,530 @@ const Pe = ce(({
     fontSize: "13px",
     boxShadow: "0 4px 12px rgba(0, 0, 0, 0.3)",
     minWidth: "140px"
-  }, i = {
+  }, a = {
     color: "#9ca3af",
     marginRight: "4px"
-  }, a = {
+  }, s = {
     fontWeight: 600
-  }, d = {
+  }, u = {
     color: "#4ade80",
     fontWeight: 600
-  }, h = {
+  }, f = {
     fontSize: "11px",
     color: "#6b7280",
     textTransform: "capitalize",
     marginTop: "4px"
   };
-  return /* @__PURE__ */ y("div", { style: x, children: /* @__PURE__ */ D("div", { style: f, children: [
-    r.sectionName && /* @__PURE__ */ D("div", { style: { marginBottom: "4px" }, children: [
-      /* @__PURE__ */ y("span", { style: i, children: "Section:" }),
-      /* @__PURE__ */ y("span", { style: { ...a, color: "#3b82f6" }, children: r.sectionName })
+  return /* @__PURE__ */ y("div", { style: S, children: /* @__PURE__ */ L("div", { style: h, children: [
+    r.sectionName && /* @__PURE__ */ L("div", { style: { marginBottom: "4px" }, children: [
+      /* @__PURE__ */ y("span", { style: a, children: "Section:" }),
+      /* @__PURE__ */ y("span", { style: { ...s, color: "#3b82f6" }, children: r.sectionName })
     ] }),
-    /* @__PURE__ */ D("div", { style: { marginBottom: "4px" }, children: [
-      /* @__PURE__ */ y("span", { style: i, children: "Seat:" }),
-      /* @__PURE__ */ y("span", { style: a, children: s })
+    /* @__PURE__ */ L("div", { style: { marginBottom: "4px" }, children: [
+      /* @__PURE__ */ y("span", { style: a, children: "Seat:" }),
+      /* @__PURE__ */ y("span", { style: s, children: o })
     ] }),
-    r.price !== void 0 && r.price > 0 && l === "available" && /* @__PURE__ */ D("div", { style: { marginBottom: "4px" }, children: [
-      /* @__PURE__ */ y("span", { style: i, children: "Price:" }),
-      /* @__PURE__ */ D("span", { style: d, children: [
-        u,
+    r.price !== void 0 && r.price > 0 && c === "available" && /* @__PURE__ */ L("div", { style: { marginBottom: "4px" }, children: [
+      /* @__PURE__ */ y("span", { style: a, children: "Price:" }),
+      /* @__PURE__ */ L("span", { style: u, children: [
+        d,
         " ",
         r.price.toFixed(2)
       ] })
     ] }),
-    /* @__PURE__ */ D("div", { style: h, children: [
+    /* @__PURE__ */ L("div", { style: f, children: [
       "Status: ",
-      l
+      c
     ] })
   ] }) });
 });
-Pe.displayName = "SeatTooltip";
-const Et = ({
+Xe.displayName = "SeatTooltip";
+const It = ({
   config: t,
   configUrl: n,
-  floorId: o,
+  floorId: i,
   onFloorChange: r,
-  reservedSeats: u = [],
-  unavailableSeats: l = [],
-  selectedSeats: s,
-  myReservedSeats: x = [],
-  onSeatSelect: f,
-  onSeatDeselect: i,
-  onSelectionChange: a,
-  colorOverrides: d,
-  showTooltip: h = !0,
-  zoomEnabled: m = !0,
-  className: S = "",
+  reservedSeats: d = [],
+  unavailableSeats: c = [],
+  selectedSeats: o,
+  myReservedSeats: S = [],
+  onSeatSelect: h,
+  onSeatDeselect: a,
+  onSelectionChange: s,
+  colorOverrides: u,
+  showTooltip: f = !0,
+  zoomEnabled: g = !0,
+  className: x = "",
   onConfigLoad: C,
-  onError: F,
+  onError: R,
   // Floor selector props
-  showFloorSelector: I,
+  showFloorSelector: F,
   floorSelectorPosition: M = "top-left",
-  floorSelectorClassName: L,
-  showAllFloorsOption: z = !0,
-  allFloorsLabel: X = "All",
-  fitToView: q = !0,
+  floorSelectorClassName: k,
+  showAllFloorsOption: Y = !0,
+  allFloorsLabel: T = "All",
+  fitToView: X = !0,
   fitPadding: j = 40,
   // Zoom controls
-  showZoomControls: Z = !0,
-  zoomControlsPosition: P = "bottom-right",
-  zoomControlsClassName: K,
-  minZoom: le,
-  maxZoom: $ = 3,
-  zoomStep: B = 0.25,
+  showZoomControls: re = !0,
+  zoomControlsPosition: Ye = "bottom-right",
+  zoomControlsClassName: je,
+  minZoom: xe,
+  maxZoom: B = 3,
+  zoomStep: oe = 0.25,
   // Touch gestures
-  touchEnabled: Me = !0
+  touchEnabled: Pe = !0
 }) => {
-  const O = T(null), V = T(null), E = yt(V), [U, ye] = R(/* @__PURE__ */ new Set()), [k, te] = R(1), [A, G] = R({ x: 0, y: 0 }), [$e, Be] = R(null), [Oe, Ue] = R(1), de = T({ width: 0, height: 0 }), [ne, Ee] = R({ visible: !1, x: 0, y: 0, seat: null, state: "available" }), { config: Ve, loading: He, error: re } = pt(n), g = t || Ve, be = o !== void 0, W = be ? o || null : $e, ue = s !== void 0, _e = N((e) => {
-    be || Be(e), r?.(e);
-  }, [be, r]), ve = g?.floors || [], qe = I !== void 0 ? I : ve.length > 1, he = _(
-    () => g ? { ...g.colors, ...d } : { ...vt, ...d },
-    [g, d]
-  ), Q = _(() => {
-    if (!g) return [];
-    let e = g.seats.filter((c) => c.state !== "hidden");
-    return W && (e = e.filter(
-      (c) => c.floorId === W || !c.floorId && W === "floor_default"
+  const he = A(null), we = A(null), E = bt(we), [O, Ce] = N(/* @__PURE__ */ new Set()), [D, G] = N(1), [z, H] = N({ x: 0, y: 0 }), [We, Be] = N(null), [$e, Ue] = N(1), ie = A({ width: 0, height: 0 }), [Z, Re] = N({ visible: !1, x: 0, y: 0, seat: null, state: "available" }), { config: He, loading: Ve, error: K } = pt(n), p = t || He, fe = i !== void 0, P = fe ? i || null : We, se = o !== void 0, Oe = I((e) => {
+    fe || Be(e), r?.(e);
+  }, [fe, r]), ge = p?.floors || [], _e = F !== void 0 ? F : ge.length > 1, ae = U(
+    () => p ? { ...p.colors, ...u } : { ...vt, ...u },
+    [p, u]
+  ), _ = U(() => {
+    if (!p) return [];
+    let e = p.seats.filter((l) => l.state !== "hidden");
+    return P && (e = e.filter(
+      (l) => l.floorId === P || !l.floorId && P === "floor_default"
     )), e;
-  }, [g, W]), fe = _(() => g?.stages ? W ? g.stages.filter(
-    (e) => e.floorId === W || !e.floorId && W === "floor_default"
-  ) : g.stages : [], [g, W]), H = _(() => {
-    if (!g || Q.length === 0 && fe.length === 0)
+  }, [p, P]), ce = U(() => p?.stages ? P ? p.stages.filter(
+    (e) => e.floorId === P || !e.floorId && P === "floor_default"
+  ) : p.stages : [], [p, P]), $ = U(() => {
+    if (!p || _.length === 0 && ce.length === 0)
       return null;
     const e = 12;
-    let c = 1 / 0, p = 1 / 0, b = -1 / 0, v = -1 / 0;
-    return Q.forEach((w) => {
-      c = Math.min(c, w.position.x - e), p = Math.min(p, w.position.y - e), b = Math.max(b, w.position.x + e), v = Math.max(v, w.position.y + e);
-    }), fe.forEach((w) => {
-      c = Math.min(c, w.position.x), p = Math.min(p, w.position.y), b = Math.max(b, w.position.x + (w.config?.width || 200)), v = Math.max(v, w.position.y + (w.config?.height || 100));
-    }), { minX: c, minY: p, maxX: b, maxY: v, width: b - c, height: v - p };
-  }, [g, Q, fe]);
-  Y(() => {
-    if (!q || !g || !H || E.width === 0 || E.height === 0) return;
-    const e = Math.abs(E.width - de.current.width), c = Math.abs(E.height - de.current.height);
-    if (!(de.current.width === 0) && e < 10 && c < 10) return;
-    de.current = E;
-    const b = E.width, v = E.height, w = b - j * 2, se = v - j * 2, ge = w / H.width, xe = se / H.height, pe = Math.min(ge, xe, $), ot = H.minX + H.width / 2, it = H.minY + H.height / 2, st = b / 2, at = v / 2, ct = st - ot * pe, lt = at - it * pe;
-    te(pe), G({ x: ct, y: lt }), Ue(pe);
-  }, [q, g, H, j, $, E, W]);
-  const J = _(() => {
-    const e = new Set(u), c = new Set(l), p = new Set(x);
-    return { reserved: e, unavailable: c, myReserved: p };
-  }, [u, l, x]), me = _(() => s ? new Set(s) : null, [s]), oe = N((e) => {
-    const c = e.id, p = e.seatNumber || "";
-    return J.unavailable.has(c) || J.unavailable.has(p) ? "unavailable" : J.reserved.has(c) || J.reserved.has(p) ? "reserved" : J.myReserved.has(c) || J.myReserved.has(p) || U.has(c) ? "selected" : e.state;
-  }, [J, U]);
-  Y(() => {
-    g && C && C(g);
-  }, [g, C]), Y(() => {
-    re && F && F(re);
-  }, [re, F]), Y(() => {
-    ue && me && ye(me);
-  }, [ue, me]);
-  const Ge = N((e) => {
-    const c = oe(e);
-    if (c !== "available" && c !== "selected")
+    let l = 1 / 0, b = 1 / 0, v = -1 / 0, m = -1 / 0;
+    return _.forEach((w) => {
+      l = Math.min(l, w.position.x - e), b = Math.min(b, w.position.y - e), v = Math.max(v, w.position.x + e), m = Math.max(m, w.position.y + e);
+    }), ce.forEach((w) => {
+      l = Math.min(l, w.position.x), b = Math.min(b, w.position.y), v = Math.max(v, w.position.x + (w.config?.width || 200)), m = Math.max(m, w.position.y + (w.config?.height || 100));
+    }), { minX: l, minY: b, maxX: v, maxY: m, width: v - l, height: m - b };
+  }, [p, _, ce]);
+  W(() => {
+    if (!X || !p || !$ || E.width === 0 || E.height === 0) return;
+    const e = Math.abs(E.width - ie.current.width), l = Math.abs(E.height - ie.current.height);
+    if (!(ie.current.width === 0) && e < 10 && l < 10) return;
+    ie.current = E;
+    const v = E.width, m = E.height, w = v - j * 2, ee = m - j * 2, le = w / $.width, be = ee / $.height, de = Math.min(le, be, B), rt = $.minX + $.width / 2, ot = $.minY + $.height / 2, it = v / 2, st = m / 2, at = it - rt * de, ct = st - ot * de;
+    G(de), H({ x: at, y: ct }), Ue(de);
+  }, [X, p, $, j, B, E, P]);
+  const V = U(() => {
+    const e = new Set(d), l = new Set(c), b = new Set(S);
+    return { reserved: e, unavailable: l, myReserved: b };
+  }, [d, c, S]), pe = U(() => o ? new Set(o) : null, [o]), J = I((e) => {
+    const l = e.id, b = e.seatNumber || "";
+    return V.unavailable.has(l) || V.unavailable.has(b) ? "unavailable" : V.reserved.has(l) || V.reserved.has(b) ? "reserved" : V.myReserved.has(l) || V.myReserved.has(b) || O.has(l) ? "selected" : e.state;
+  }, [V, O]);
+  W(() => {
+    p && C && C(p);
+  }, [p, C]), W(() => {
+    K && R && R(K);
+  }, [K, R]), W(() => {
+    se && pe && Ce(pe);
+  }, [se, pe]);
+  const qe = I((e) => {
+    const l = J(e);
+    if (l !== "available" && l !== "selected")
       return;
-    const p = U.has(e.id);
-    ue || ye((b) => {
-      const v = new Set(b);
-      return p ? v.delete(e.id) : v.add(e.id), v;
-    }), p ? i?.(e) : (f?.(e), f || console.log("Seat selected:", e));
-  }, [oe, U, ue, f, i]), ie = _(() => g ? Q.filter((e) => U.has(e.id)) : [], [Q, U]);
-  Y(() => {
-    a?.(ie);
-  }, [ie, a]);
-  const ee = le !== void 0 ? le : Oe, Je = N(() => {
-    if (!m) return;
-    const e = Math.min(k + B, $);
-    if (e !== k) {
-      const c = E.width || g?.canvas.width || 800, p = E.height || g?.canvas.height || 600, b = c / 2, v = p / 2, w = {
-        x: (b - A.x) / k,
-        y: (v - A.y) / k
+    const b = O.has(e.id);
+    se || Ce((v) => {
+      const m = new Set(v);
+      return b ? m.delete(e.id) : m.add(e.id), m;
+    }), b ? a?.(e) : (h?.(e), h || console.log("Seat selected:", e));
+  }, [J, O, se, h, a]), Q = U(() => p ? _.filter((e) => O.has(e.id)) : [], [_, O]);
+  W(() => {
+    s?.(Q);
+  }, [Q, s]);
+  const q = xe !== void 0 ? xe : $e, Ge = I(() => {
+    if (!g) return;
+    const e = Math.min(D + oe, B);
+    if (e !== D) {
+      const l = E.width || p?.canvas.width || 800, b = E.height || p?.canvas.height || 600, v = l / 2, m = b / 2, w = {
+        x: (v - z.x) / D,
+        y: (m - z.y) / D
       };
-      te(e), G({
-        x: b - w.x * e,
-        y: v - w.y * e
+      G(e), H({
+        x: v - w.x * e,
+        y: m - w.y * e
       });
     }
-  }, [m, k, B, $, E, g, A]), Ze = N(() => {
-    if (!m) return;
-    const e = Math.max(k - B, ee);
-    if (e !== k) {
-      const c = E.width || g?.canvas.width || 800, p = E.height || g?.canvas.height || 600, b = c / 2, v = p / 2, w = {
-        x: (b - A.x) / k,
-        y: (v - A.y) / k
+  }, [g, D, oe, B, E, p, z]), Ze = I(() => {
+    if (!g) return;
+    const e = Math.max(D - oe, q);
+    if (e !== D) {
+      const l = E.width || p?.canvas.width || 800, b = E.height || p?.canvas.height || 600, v = l / 2, m = b / 2, w = {
+        x: (v - z.x) / D,
+        y: (m - z.y) / D
       };
-      te(e), G({
-        x: b - w.x * e,
-        y: v - w.y * e
+      G(e), H({
+        x: v - w.x * e,
+        y: m - w.y * e
       });
     }
-  }, [m, k, B, ee, E, g, A]), Ke = N((e) => {
-    G({
+  }, [g, D, oe, q, E, p, z]), Ke = I((e) => {
+    H({
       x: e.target.x(),
       y: e.target.y()
     });
-  }, []), Qe = N((e) => {
-    if (!m) return;
+  }, []), Je = I((e) => {
+    if (!g) return;
     e.evt.preventDefault();
-    const c = O.current;
-    if (!c) return;
-    const p = c.scaleX(), b = c.getPointerPosition();
-    if (!b) return;
-    const v = 1.1, w = e.evt.deltaY > 0 ? p / v : p * v, se = Math.min(Math.max(w, ee), $), ge = {
-      x: (b.x - A.x) / p,
-      y: (b.y - A.y) / p
-    }, xe = {
-      x: b.x - ge.x * se,
-      y: b.y - ge.y * se
+    const l = he.current;
+    if (!l) return;
+    const b = l.scaleX(), v = l.getPointerPosition();
+    if (!v) return;
+    const m = 1.1, w = e.evt.deltaY > 0 ? b / m : b * m, ee = Math.min(Math.max(w, q), B), le = {
+      x: (v.x - z.x) / b,
+      y: (v.y - z.y) / b
+    }, be = {
+      x: v.x - le.x * ee,
+      y: v.y - le.y * ee
     };
-    te(se), G(xe);
-  }, [m, A, ee, $]);
-  bt(O, {
-    enabled: Me && m,
-    minScale: ee,
-    maxScale: $,
-    currentScale: k,
-    currentPosition: A,
-    onScaleChange: (e, c) => {
-      te(e), G(c);
+    G(ee), H(be);
+  }, [g, z, q, B]);
+  yt(he, {
+    enabled: Pe && g,
+    minScale: q,
+    maxScale: B,
+    currentScale: D,
+    currentPosition: z,
+    onScaleChange: (e, l) => {
+      G(e), H(l);
     },
     onPositionChange: (e) => {
-      G(e);
+      H(e);
     }
   });
-  const et = N((e, c) => {
-    if (!h) return;
-    const p = c.target.getStage();
-    if (!p) return;
-    const b = p.getPointerPosition();
+  const Qe = I((e, l) => {
+    if (!f) return;
+    const b = l.target.getStage();
     if (!b) return;
-    const v = p.container().getBoundingClientRect();
-    Ee({
+    const v = b.getPointerPosition();
+    if (!v) return;
+    const m = b.container().getBoundingClientRect();
+    Re({
       visible: !0,
-      x: v.left + b.x,
-      y: v.top + b.y,
+      x: m.left + v.x,
+      y: m.top + v.y,
       seat: e,
-      state: oe(e)
+      state: J(e)
     });
-  }, [h, oe]), tt = N(() => {
-    Ee((e) => ({ ...e, visible: !1 }));
+  }, [f, J]), et = I(() => {
+    Re((e) => ({ ...e, visible: !1 }));
   }, []);
-  if (He)
-    return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${S}`, children: /* @__PURE__ */ y("p", { children: "Loading seat map..." }) });
-  if (re)
-    return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${S}`, children: /* @__PURE__ */ D("p", { className: "text-red-500", children: [
+  if (Ve)
+    return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${x}`, children: /* @__PURE__ */ y("p", { children: "Loading seat map..." }) });
+  if (K)
+    return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${x}`, children: /* @__PURE__ */ L("p", { className: "text-red-500", children: [
       "Error loading seat map: ",
-      re.message
+      K.message
     ] }) });
-  if (!g)
-    return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${S}`, children: /* @__PURE__ */ y("p", { children: "No configuration provided" }) });
-  const nt = E.width || g.canvas.width, rt = E.height || g.canvas.height;
-  return /* @__PURE__ */ D(
+  if (!p)
+    return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${x}`, children: /* @__PURE__ */ y("p", { children: "No configuration provided" }) });
+  const tt = E.width || p.canvas.width, nt = E.height || p.canvas.height;
+  return /* @__PURE__ */ L(
     "div",
     {
-      ref: V,
-      className: `relative ${S}`,
+      ref: we,
+      className: `relative ${x}`,
       style: { width: "100%", height: "100%" },
       children: [
-        qe && ve.length > 0 && /* @__PURE__ */ y(
-          je,
+        _e && ge.length > 0 && /* @__PURE__ */ y(
+          ze,
           {
-            floors: ve,
-            currentFloorId: W,
-            onFloorChange: _e,
-            showAllOption: z,
-            allLabel: X,
+            floors: ge,
+            currentFloorId: P,
+            onFloorChange: Oe,
+            showAllOption: Y,
+            allLabel: T,
             position: M,
-            className: L
+            className: k
           }
         ),
-        /* @__PURE__ */ D(
+        /* @__PURE__ */ L(
           dt,
           {
-            ref: O,
-            width: nt,
-            height: rt,
-            scaleX: k,
-            scaleY: k,
-            x: A.x,
-            y: A.y,
+            ref: he,
+            width: tt,
+            height: nt,
+            scaleX: D,
+            scaleY: D,
+            x: z.x,
+            y: z.y,
             draggable: !0,
             onDragEnd: Ke,
-            onWheel: Qe,
-            style: { backgroundColor: g.canvas.backgroundColor, cursor: "grab" },
+            onWheel: Je,
+            style: { backgroundColor: p.canvas.backgroundColor, cursor: "grab" },
             children: [
-              /* @__PURE__ */ y(Fe, { listening: !1, children: fe.map((e) => /* @__PURE__ */ y(
-                Ye,
+              /* @__PURE__ */ y(Me, { listening: !1, children: ce.map((e) => /* @__PURE__ */ y(
+                Te,
                 {
                   stage: e,
-                  stageColor: he.stageColor
+                  stageColor: ae.stageColor
                 },
                 e.id
               )) }),
-              /* @__PURE__ */ y(Fe, { children: Q.map((e) => /* @__PURE__ */ y(
-                Xe,
+              /* @__PURE__ */ y(Me, { children: _.map((e) => /* @__PURE__ */ y(
+                Ne,
                 {
                   seat: e,
-                  state: oe(e),
-                  colors: he,
-                  onClick: Ge,
-                  onMouseEnter: et,
-                  onMouseLeave: tt
+                  state: J(e),
+                  colors: ae,
+                  onClick: qe,
+                  onMouseEnter: Qe,
+                  onMouseLeave: et
                 },
                 e.id
               )) })
             ]
           }
         ),
-        h && /* @__PURE__ */ y(
-          Pe,
+        f && /* @__PURE__ */ y(
+          Xe,
           {
-            visible: ne.visible,
-            x: ne.x,
-            y: ne.y,
-            seat: ne.seat,
-            currency: he.currency,
-            state: ne.state
+            visible: Z.visible,
+            x: Z.x,
+            y: Z.y,
+            seat: Z.seat,
+            currency: ae.currency,
+            state: Z.state
           }
         ),
-        Z && m && /* @__PURE__ */ y(
-          We,
+        re && g && /* @__PURE__ */ y(
+          Ae,
           {
-            scale: k,
-            minScale: ee,
-            maxScale: $,
-            onZoomIn: Je,
+            scale: D,
+            minScale: q,
+            maxScale: B,
+            onZoomIn: Ge,
             onZoomOut: Ze,
-            position: P,
-            className: K
+            position: Ye,
+            className: je
           }
         ),
-        ie.length > 0 && /* @__PURE__ */ D("div", { className: "absolute top-4 right-4 bg-white dark:bg-gray-800 p-4 rounded shadow-lg", children: [
-          /* @__PURE__ */ D("h3", { className: "font-semibold mb-2", children: [
+        Q.length > 0 && /* @__PURE__ */ L("div", { className: "absolute top-4 right-4 bg-white dark:bg-gray-800 p-4 rounded shadow-lg", children: [
+          /* @__PURE__ */ L("h3", { className: "font-semibold mb-2", children: [
             "Selected Seats (",
-            ie.length,
+            Q.length,
             ")"
           ] }),
-          /* @__PURE__ */ y("div", { className: "max-h-48 overflow-y-auto space-y-1", children: ie.map((e) => /* @__PURE__ */ D("div", { className: "text-sm", children: [
+          /* @__PURE__ */ y("div", { className: "max-h-48 overflow-y-auto space-y-1", children: Q.map((e) => /* @__PURE__ */ L("div", { className: "text-sm", children: [
             e.seatNumber,
-            e.price && ` - ${he.currency} ${e.price.toFixed(2)}`
+            e.price && ` - ${ae.currency} ${e.price.toFixed(2)}`
           ] }, e.id)) })
         ] })
       ]
     }
   );
 };
-let ae = null;
+let te = null;
 function Ft(t) {
-  ae = t;
+  te = t;
 }
-function Ce() {
-  if (!ae)
+function me() {
+  if (!te)
     throw new Error(
       "Firebase database not initialized. Call initializeFirebaseForViewer(db) first."
     );
-  return ae;
+  return te;
 }
-function Re() {
-  return ae !== null;
+function Se() {
+  return te !== null;
 }
-function It() {
-  ae = null;
+function kt() {
+  te = null;
 }
-function Se(t, n) {
+function ye(t, n) {
   if (t.length !== n.length) return !1;
-  for (let o = 0; o < t.length; o++)
-    if (t[o] !== n[o]) return !1;
-  return !0;
+  const i = [...t].sort(), r = [...n].sort();
+  return i.every((d, c) => d === r[c]);
 }
-function Le(t, n) {
-  return Se(t.myReserved, n.myReserved) && Se(t.otherReserved, n.otherReserved) && Se(t.unavailable, n.unavailable);
-}
-function Ne(t, n) {
-  const o = [], r = [], u = [];
-  return Object.entries(t).forEach(([l, s]) => {
-    s && typeof s == "object" && s.state && (s.state === "unavailable" ? u.push(l) : s.state === "reserved" && (n && s.userId === n ? o.push(l) : r.push(l)));
-  }), { myReserved: o, otherReserved: r, unavailable: u };
+function mt(t, n) {
+  const i = [], r = [], d = [];
+  return Object.entries(t).forEach(([c, o]) => {
+    o && typeof o == "object" && o.state && (o.state === "unavailable" ? d.push(c) : o.state === "reserved" && (n && o.userId === n ? i.push(c) : r.push(c)));
+  }), {
+    myReserved: i.sort(),
+    otherReserved: r.sort(),
+    unavailable: d.sort()
+  };
 }
-function mt(t) {
-  const { seatMapId: n, currentUserId: o, enabled: r = !0, onStateChange: u, onError: l } = t, [s, x] = R(null), [f, i] = R(!0), [a, d] = R(null), [h, m] = R(null), [S, C] = R([]), [F, I] = R([]), [M, L] = R([]), z = T(u), X = T(l), q = T(o);
-  z.current = u, X.current = l, q.current = o;
-  const j = T({
-    myReserved: [],
-    otherReserved: [],
-    unavailable: []
-  }), Z = T(null);
-  return Y(() => {
-    if (!r || !n) {
-      i(!1);
-      return;
-    }
-    if (!Re()) {
-      i(!1), d(new Error("Firebase not initialized. Call initializeFirebaseForViewer first."));
-      return;
-    }
-    const P = Ce(), K = we(P, `seat_states/${n}`);
-    return i(!0), d(null), ze(K, (B) => {
-      const O = B.val() || {}, V = Ne(O, q.current), E = j.current, U = JSON.stringify(Z.current) !== JSON.stringify(O);
-      U && (x(O), Z.current = O), i(!1), !Le(E, V) && (m(Date.now()), C(V.myReserved), I(V.otherReserved), L(V.unavailable), j.current = V), U && z.current?.(O);
-    }, (B) => {
-      d(B), i(!1), X.current?.(B);
-    }), () => {
-      Ae(K);
-    };
-  }, [n, r]), Y(() => {
-    if (s) {
-      const P = Ne(s, o), K = j.current;
-      !Le(K, P) && (C(P.myReserved), I(P.otherReserved), L(P.unavailable), j.current = P, m(Date.now()));
-    }
-  }, [o]), {
-    states: s,
-    loading: f,
-    error: a,
-    lastUpdated: h,
-    myReservedSeats: S,
-    otherReservedSeats: F,
-    unavailableSeats: M,
+const ue = {
+  states: null,
+  loading: !0,
+  error: null,
+  lastUpdated: null,
+  myReservedSeats: [],
+  otherReservedSeats: [],
+  unavailableSeats: []
+};
+function St(t) {
+  const { seatMapId: n, currentUserId: i, enabled: r = !0, onStateChange: d, onError: c } = t, o = A({ ...ue }), S = A(d), h = A(c), a = A(i);
+  S.current = d, h.current = c, a.current = i;
+  const s = I(
+    (x) => {
+      if (!r || !n)
+        return o.current = { ...ue, loading: !1 }, () => {
+        };
+      if (!Se())
+        return o.current = {
+          ...ue,
+          loading: !1,
+          error: new Error("Firebase not initialized. Call initializeFirebaseForViewer first.")
+        }, () => {
+        };
+      const C = me(), R = ve(C, `seatmaps/${n}/seat_states`);
+      return Le(R, (k) => {
+        const T = k.val() || {}, X = mt(T, a.current), j = o.current;
+        (j.loading || !ye(j.myReservedSeats, X.myReserved) || !ye(j.otherReservedSeats, X.otherReserved) || !ye(j.unavailableSeats, X.unavailable)) && (o.current = {
+          states: T,
+          loading: !1,
+          error: null,
+          lastUpdated: Date.now(),
+          myReservedSeats: X.myReserved,
+          otherReservedSeats: X.otherReserved,
+          unavailableSeats: X.unavailable
+        }, S.current?.(T), x());
+      }, (k) => {
+        o.current = {
+          ...o.current,
+          loading: !1,
+          error: k
+        }, h.current?.(k), x();
+      }), () => {
+        De(R);
+      };
+    },
+    [n, r, i]
+    // Include currentUserId to re-derive on user change
+  ), u = I(() => o.current, []), f = I(() => ue, []), g = lt(s, u, f);
+  return {
+    states: g.states,
+    loading: g.loading,
+    error: g.error,
+    lastUpdated: g.lastUpdated,
+    myReservedSeats: g.myReservedSeats,
+    otherReservedSeats: g.otherReservedSeats,
+    unavailableSeats: g.unavailableSeats,
     // Legacy alias
-    reservedSeats: F
+    reservedSeats: g.otherReservedSeats
   };
 }
 function xt(t) {
   const {
     seatMapId: n,
-    enabled: o = !0,
+    enabled: i = !0,
     subscribeToChanges: r = !1,
-    onConfigLoad: u,
-    onError: l
-  } = t, [s, x] = R(null), [f, i] = R(!0), [a, d] = R(null), h = T(u), m = T(l);
-  h.current = u, m.current = l;
-  const S = N(async () => {
+    onConfigLoad: d,
+    onError: c
+  } = t, [o, S] = N(null), [h, a] = N(!0), [s, u] = N(null), f = A(d), g = A(c);
+  f.current = d, g.current = c;
+  const x = I(async () => {
     if (!n) return;
-    if (!Re()) {
-      d(new Error("Firebase not initialized. Call initializeFirebaseForViewer first.")), i(!1);
+    if (!Se()) {
+      u(new Error("Firebase not initialized. Call initializeFirebaseForViewer first.")), a(!1);
       return;
     }
-    const C = Ce(), F = we(C, `seatmaps/${n}`);
+    const C = me(), R = ve(C, `seatmaps/${n}`);
     try {
-      i(!0), d(null);
-      const M = (await ft(F)).val();
+      a(!0), u(null);
+      const M = (await ft(R)).val();
       if (M) {
-        const L = gt(M);
-        x(L), h.current?.(L);
+        const k = gt(M);
+        S(k), f.current?.(k);
       } else
-        d(new Error(`Seat map ${n} not found in Firebase`));
-    } catch (I) {
-      const M = I instanceof Error ? I : new Error("Unknown error");
-      d(M), m.current?.(M);
+        u(new Error(`Seat map ${n} not found in Firebase`));
+    } catch (F) {
+      const M = F instanceof Error ? F : new Error("Unknown error");
+      u(M), g.current?.(M);
     } finally {
-      i(!1);
+      a(!1);
     }
   }, [n]);
-  return Y(() => {
-    if (!o || !n) {
-      i(!1);
+  return W(() => {
+    if (!i || !n) {
+      a(!1);
       return;
     }
-    if (S(), r && Re()) {
-      const C = Ce(), F = we(C, `seatmaps/${n}/meta/updated_at`);
-      let I = !0, M = null;
-      return ze(F, (z) => {
-        if (I) {
-          I = !1, M = z.val();
+    if (x(), r && Se()) {
+      const C = me(), R = ve(C, `seatmaps/${n}/meta/updated_at`);
+      let F = !0, M = null;
+      return Le(R, (Y) => {
+        if (F) {
+          F = !1, M = Y.val();
           return;
         }
-        const X = z.val();
-        z.exists() && X !== M && (M = X, S());
+        const T = Y.val();
+        Y.exists() && T !== M && (M = T, x());
       }), () => {
-        Ae(F);
+        De(R);
       };
     }
-  }, [n, o, r]), {
-    config: s,
-    loading: f,
-    error: a,
-    refetch: S
+  }, [n, i, r]), {
+    config: o,
+    loading: h,
+    error: s,
+    refetch: x
   };
 }
-function Dt(t) {
+function Lt(t) {
   const {
     seatMapId: n,
-    userId: o,
+    userId: i,
     enabled: r = !0,
-    subscribeToDesignChanges: u = !1,
-    onConfigLoad: l,
-    onStateChange: s,
-    onError: x
+    subscribeToDesignChanges: d = !1,
+    onConfigLoad: c,
+    onStateChange: o,
+    onError: S
   } = t, {
-    config: f,
-    loading: i,
-    error: a,
-    refetch: d
+    config: h,
+    loading: a,
+    error: s,
+    refetch: u
   } = xt({
     seatMapId: n,
     enabled: r,
-    subscribeToChanges: u,
-    onConfigLoad: l,
-    onError: x
+    subscribeToChanges: d,
+    onConfigLoad: c,
+    onError: S
   }), {
-    states: h,
-    loading: m,
-    error: S,
+    states: f,
+    loading: g,
+    error: x,
     lastUpdated: C,
-    myReservedSeats: F,
-    otherReservedSeats: I,
+    myReservedSeats: R,
+    otherReservedSeats: F,
     unavailableSeats: M,
-    reservedSeats: L
-  } = mt({
+    reservedSeats: k
+  } = St({
     seatMapId: n,
-    currentUserId: o,
+    currentUserId: i,
     enabled: r,
-    onStateChange: s,
-    onError: x
+    onStateChange: o,
+    onError: S
   });
   return {
-    config: f,
-    loading: i || m,
-    error: a || S,
-    myReservedSeats: F,
-    otherReservedSeats: I,
+    config: h,
+    loading: a || g,
+    error: s || x,
+    myReservedSeats: R,
+    otherReservedSeats: F,
     unavailableSeats: M,
-    reservedSeats: L,
-    seatStates: h,
+    reservedSeats: k,
+    seatStates: f,
     lastUpdated: C,
-    refetch: d
+    refetch: u
   };
 }
 export {
   vt as DEFAULT_COLORS,
-  Et as SeatMapViewer,
-  It as clearFirebaseInstance,
+  It as SeatMapViewer,
+  kt as clearFirebaseInstance,
   Ft as initializeFirebaseForViewer,
-  Re as isFirebaseInitialized,
+  Se as isFirebaseInitialized,
   pt as useConfigFetcher,
-  yt as useContainerSize,
+  bt as useContainerSize,
   xt as useFirebaseConfig,
-  mt as useFirebaseSeatStates,
-  Dt as useRealtimeSeatMap,
-  bt as useTouchGestures
+  St as useFirebaseSeatStates,
+  Lt as useRealtimeSeatMap,
+  yt as useTouchGestures
 };