@zonetrix/viewer 2.10.1 → 2.10.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,99 +1,99 @@
1
- import { jsx as y, jsxs as k } from "react/jsx-runtime";
2
- import { useState as C, useEffect as j, useRef as N, useCallback as L, useMemo as H, memo as se } from "react";
3
- import { Stage as ct, Layer as Fe, Group as lt, Rect as Le, Text as Ie, Circle as ut } from "react-konva";
4
- import { ref as we, onValue as Ne, off as Te, get as dt } from "firebase/database";
5
- import { fromFirebaseSeatMap as ht } from "@zonetrix/shared";
6
- function ft(t) {
7
- const [n, o] = C(null), [r, d] = C(!1), [l, a] = C(null), m = async () => {
1
+ import { jsx as y, jsxs as D } from "react/jsx-runtime";
2
+ import { useState as N, useEffect as W, useRef as A, useCallback as I, useMemo as $, memo as re, useSyncExternalStore as dt } from "react";
3
+ import { Stage as ut, Layer as Me, Group as ht, Rect as De, Text as Ee, Circle as ft } from "react-konva";
4
+ import { ref as ye, onValue as Le, off as Ne, get as gt } from "firebase/database";
5
+ import { fromFirebaseSeatMap as pt } from "@zonetrix/shared";
6
+ function vt(t) {
7
+ const [n, i] = N(null), [r, d] = N(!1), [c, o] = N(null), x = async () => {
8
8
  if (t) {
9
- d(!0), a(null);
9
+ d(!0), o(null);
10
10
  try {
11
11
  const f = await fetch(t);
12
12
  if (!f.ok)
13
13
  throw new Error(`Failed to fetch config: ${f.statusText}`);
14
- const i = await f.json();
15
- o(i);
14
+ const a = await f.json();
15
+ i(a);
16
16
  } catch (f) {
17
- const i = f instanceof Error ? f : new Error("Unknown error occurred");
18
- a(i), console.error("Failed to fetch seat map config:", i);
17
+ const a = f instanceof Error ? f : new Error("Unknown error occurred");
18
+ o(a), console.error("Failed to fetch seat map config:", a);
19
19
  } finally {
20
20
  d(!1);
21
21
  }
22
22
  }
23
23
  };
24
- return j(() => {
25
- m();
24
+ return W(() => {
25
+ x();
26
26
  }, [t]), {
27
27
  config: n,
28
28
  loading: r,
29
- error: l,
30
- refetch: m
29
+ error: c,
30
+ refetch: x
31
31
  };
32
32
  }
33
- function gt(t) {
34
- const [n, o] = C({ width: 0, height: 0 });
35
- return j(() => {
33
+ function bt(t) {
34
+ const [n, i] = N({ width: 0, height: 0 });
35
+ return W(() => {
36
36
  const r = t.current;
37
37
  if (!r) return;
38
- const { width: d, height: l } = r.getBoundingClientRect();
39
- d > 0 && l > 0 && o({ width: d, height: l });
40
- const a = new ResizeObserver((m) => {
41
- const f = m[0];
38
+ const { width: d, height: c } = r.getBoundingClientRect();
39
+ d > 0 && c > 0 && i({ width: d, height: c });
40
+ const o = new ResizeObserver((x) => {
41
+ const f = x[0];
42
42
  if (!f) return;
43
- const { width: i, height: s } = f.contentRect;
44
- i > 0 && s > 0 && o((u) => u.width === i && u.height === s ? u : { width: i, height: s });
43
+ const { width: a, height: s } = f.contentRect;
44
+ a > 0 && s > 0 && i((u) => u.width === a && u.height === s ? u : { width: a, height: s });
45
45
  });
46
- return a.observe(r), () => {
47
- a.disconnect();
46
+ return o.observe(r), () => {
47
+ o.disconnect();
48
48
  };
49
49
  }, [t]), n;
50
50
  }
51
- function ke(t, n) {
51
+ function Ie(t, n) {
52
52
  return Math.sqrt(Math.pow(n.x - t.x, 2) + Math.pow(n.y - t.y, 2));
53
53
  }
54
- function De(t, n) {
54
+ function Fe(t, n) {
55
55
  return {
56
56
  x: (t.x + n.x) / 2,
57
57
  y: (t.y + n.y) / 2
58
58
  };
59
59
  }
60
- function pt(t, n) {
61
- const o = N(null), r = N(null), d = N(1);
62
- j(() => {
63
- const l = t.current;
64
- if (!l || !n.enabled) return;
65
- const a = l.container(), m = (s) => {
60
+ function yt(t, n) {
61
+ const i = A(null), r = A(null), d = A(1);
62
+ W(() => {
63
+ const c = t.current;
64
+ if (!c || !n.enabled) return;
65
+ const o = c.container(), x = (s) => {
66
66
  if (s.touches.length === 2) {
67
67
  s.preventDefault();
68
- const u = { x: s.touches[0].clientX, y: s.touches[0].clientY }, h = { x: s.touches[1].clientX, y: s.touches[1].clientY };
69
- o.current = ke(u, h), r.current = De(u, h), d.current = n.currentScale;
68
+ const u = { x: s.touches[0].clientX, y: s.touches[0].clientY }, g = { x: s.touches[1].clientX, y: s.touches[1].clientY };
69
+ i.current = Ie(u, g), r.current = Fe(u, g), d.current = n.currentScale;
70
70
  }
71
71
  }, f = (s) => {
72
72
  if (s.touches.length !== 2) return;
73
73
  s.preventDefault();
74
- const u = { x: s.touches[0].clientX, y: s.touches[0].clientY }, h = { x: s.touches[1].clientX, y: s.touches[1].clientY }, x = ke(u, h), S = De(u, h);
75
- if (o.current !== null && r.current !== null) {
76
- const R = x / o.current, F = Math.min(
77
- Math.max(n.currentScale * R, n.minScale),
74
+ const u = { x: s.touches[0].clientX, y: s.touches[0].clientY }, g = { x: s.touches[1].clientX, y: s.touches[1].clientY }, h = Ie(u, g), p = Fe(u, g);
75
+ if (i.current !== null && r.current !== null) {
76
+ const w = h / i.current, R = Math.min(
77
+ Math.max(n.currentScale * w, n.minScale),
78
78
  n.maxScale
79
- ), I = a.getBoundingClientRect(), M = S.x - I.left, T = S.y - I.top, z = n.currentScale, X = {
80
- x: (M - n.currentPosition.x) / z,
81
- y: (T - n.currentPosition.y) / z
82
- }, _ = S.x - r.current.x, O = S.y - r.current.y, J = {
83
- x: M - X.x * F + _,
84
- y: T - X.y * F + O
79
+ ), F = o.getBoundingClientRect(), M = p.x - F.left, k = p.y - F.top, Y = n.currentScale, T = {
80
+ x: (M - n.currentPosition.x) / Y,
81
+ y: (k - n.currentPosition.y) / Y
82
+ }, X = p.x - r.current.x, j = p.y - r.current.y, oe = {
83
+ x: M - T.x * R + X,
84
+ y: k - T.y * R + j
85
85
  };
86
- n.onScaleChange(F, J), o.current = x, r.current = S;
86
+ n.onScaleChange(R, oe), i.current = h, r.current = p;
87
87
  }
88
- }, i = (s) => {
89
- s.touches.length < 2 && (o.current = null, r.current = null);
88
+ }, a = (s) => {
89
+ s.touches.length < 2 && (i.current = null, r.current = null);
90
90
  };
91
- return a.addEventListener("touchstart", m, { passive: !1 }), a.addEventListener("touchmove", f, { passive: !1 }), a.addEventListener("touchend", i), () => {
92
- a.removeEventListener("touchstart", m), a.removeEventListener("touchmove", f), a.removeEventListener("touchend", i);
91
+ return o.addEventListener("touchstart", x, { passive: !1 }), o.addEventListener("touchmove", f, { passive: !1 }), o.addEventListener("touchend", a), () => {
92
+ o.removeEventListener("touchstart", x), o.removeEventListener("touchmove", f), o.removeEventListener("touchend", a);
93
93
  };
94
94
  }, [t, n]);
95
95
  }
96
- const yt = {
96
+ const St = {
97
97
  canvasBackground: "#1a1a1a",
98
98
  stageColor: "#808080",
99
99
  seatAvailable: "#2C2B30",
@@ -103,25 +103,25 @@ const yt = {
103
103
  seatHidden: "#4a4a4a",
104
104
  gridLines: "#404040",
105
105
  currency: "KD"
106
- }, ze = se(({ seat: t, state: n, colors: o, onClick: r, onMouseEnter: d, onMouseLeave: l }) => {
106
+ }, Te = re(({ seat: t, state: n, colors: i, onClick: r, onMouseEnter: d, onMouseLeave: c }) => {
107
107
  const f = {
108
- available: o.seatAvailable,
109
- reserved: o.seatReserved,
110
- selected: o.seatSelected,
111
- unavailable: o.seatUnavailable,
112
- hidden: o.seatHidden
108
+ available: i.seatAvailable,
109
+ reserved: i.seatReserved,
110
+ selected: i.seatSelected,
111
+ unavailable: i.seatUnavailable,
112
+ hidden: i.seatHidden
113
113
  // Hidden seats are filtered out, but included for type safety
114
- }[n], i = n === "available" || n === "selected", s = L(() => {
115
- i && r(t);
116
- }, [t, r, i]), u = L((S) => {
117
- d(t, S);
118
- const R = S.target.getStage();
119
- R && i && (R.container().style.cursor = "pointer");
120
- }, [t, d, i]), h = L((S) => {
121
- l();
122
- const R = S.target.getStage();
123
- R && (R.container().style.cursor = "grab");
124
- }, [l]), x = {
114
+ }[n], a = n === "available" || n === "selected", s = I(() => {
115
+ a && r(t);
116
+ }, [t, r, a]), u = I((p) => {
117
+ d(t, p);
118
+ const w = p.target.getStage();
119
+ w && a && (w.container().style.cursor = "pointer");
120
+ }, [t, d, a]), g = I((p) => {
121
+ c();
122
+ const w = p.target.getStage();
123
+ w && (w.container().style.cursor = "grab");
124
+ }, [c]), h = {
125
125
  x: t.position.x,
126
126
  y: t.position.y,
127
127
  fill: f,
@@ -130,18 +130,18 @@ const yt = {
130
130
  onClick: s,
131
131
  onTap: s,
132
132
  onMouseEnter: u,
133
- onMouseLeave: h
133
+ onMouseLeave: g
134
134
  };
135
135
  return t.shape === "circle" ? /* @__PURE__ */ y(
136
- ut,
136
+ ft,
137
137
  {
138
- ...x,
138
+ ...h,
139
139
  radius: 12
140
140
  }
141
141
  ) : /* @__PURE__ */ y(
142
- Le,
142
+ De,
143
143
  {
144
- ...x,
144
+ ...h,
145
145
  width: 24,
146
146
  height: 24,
147
147
  offsetX: 12,
@@ -150,9 +150,9 @@ const yt = {
150
150
  }
151
151
  );
152
152
  });
153
- ze.displayName = "ViewerSeat";
154
- const Ae = se(({ stage: t, stageColor: n }) => {
155
- const o = (l) => ({
153
+ Te.displayName = "ViewerSeat";
154
+ const ze = re(({ stage: t, stageColor: n }) => {
155
+ const i = (c) => ({
156
156
  stage: "🎭",
157
157
  table: "⬜",
158
158
  wall: "▬",
@@ -161,10 +161,10 @@ const Ae = se(({ stage: t, stageColor: n }) => {
161
161
  bar: "🍷",
162
162
  "entry-exit": "🚪",
163
163
  custom: "➕"
164
- })[l || "stage"] || "🎭", r = t.config.color || n, d = o(t.config.objectType);
165
- return /* @__PURE__ */ k(lt, { x: t.position.x, y: t.position.y, rotation: t.config.rotation || 0, children: [
164
+ })[c || "stage"] || "🎭", r = t.config.color || n, d = i(t.config.objectType);
165
+ return /* @__PURE__ */ D(ht, { x: t.position.x, y: t.position.y, rotation: t.config.rotation || 0, children: [
166
166
  /* @__PURE__ */ y(
167
- Le,
167
+ De,
168
168
  {
169
169
  width: t.config.width,
170
170
  height: t.config.height,
@@ -175,7 +175,7 @@ const Ae = se(({ stage: t, stageColor: n }) => {
175
175
  }
176
176
  ),
177
177
  /* @__PURE__ */ y(
178
- Ie,
178
+ Ee,
179
179
  {
180
180
  text: d,
181
181
  x: 0,
@@ -189,7 +189,7 @@ const Ae = se(({ stage: t, stageColor: n }) => {
189
189
  }
190
190
  ),
191
191
  /* @__PURE__ */ y(
192
- Ie,
192
+ Ee,
193
193
  {
194
194
  text: t.config.label,
195
195
  x: 0,
@@ -205,20 +205,20 @@ const Ae = se(({ stage: t, stageColor: n }) => {
205
205
  )
206
206
  ] });
207
207
  });
208
- Ae.displayName = "ViewerStage";
209
- const Xe = se(({
208
+ ze.displayName = "ViewerStage";
209
+ const Ae = re(({
210
210
  floors: t,
211
211
  currentFloorId: n,
212
- onFloorChange: o,
212
+ onFloorChange: i,
213
213
  showAllOption: r,
214
214
  allLabel: d,
215
- position: l,
216
- className: a
215
+ position: c,
216
+ className: o
217
217
  }) => {
218
- const m = H(
219
- () => [...t].sort((h, x) => h.order - x.order),
218
+ const x = $(
219
+ () => [...t].sort((g, h) => g.order - h.order),
220
220
  [t]
221
- ), i = {
221
+ ), a = {
222
222
  position: "absolute",
223
223
  display: "flex",
224
224
  alignItems: "center",
@@ -233,7 +233,7 @@ const Xe = se(({
233
233
  "top-right": { top: 0, right: 0 },
234
234
  "bottom-left": { bottom: 0, left: 0 },
235
235
  "bottom-right": { bottom: 0, right: 0 }
236
- }[l]
236
+ }[c]
237
237
  }, s = {
238
238
  padding: "10px 16px",
239
239
  fontSize: "14px",
@@ -251,37 +251,37 @@ const Xe = se(({
251
251
  backgroundColor: "#3A7DE5",
252
252
  borderColor: "#3A7DE5"
253
253
  };
254
- return /* @__PURE__ */ k("div", { className: a, style: i, children: [
254
+ return /* @__PURE__ */ D("div", { className: o, style: a, children: [
255
255
  r && /* @__PURE__ */ y(
256
256
  "button",
257
257
  {
258
258
  type: "button",
259
- onClick: () => o(null),
259
+ onClick: () => i(null),
260
260
  style: n === null ? u : s,
261
261
  children: d
262
262
  }
263
263
  ),
264
- m.map((h) => /* @__PURE__ */ y(
264
+ x.map((g) => /* @__PURE__ */ y(
265
265
  "button",
266
266
  {
267
267
  type: "button",
268
- onClick: () => o(h.id),
269
- style: n === h.id ? u : s,
270
- children: h.name
268
+ onClick: () => i(g.id),
269
+ style: n === g.id ? u : s,
270
+ children: g.name
271
271
  },
272
- h.id
272
+ g.id
273
273
  ))
274
274
  ] });
275
275
  });
276
- Xe.displayName = "FloorSelectorBar";
277
- const Ye = se(({
276
+ Ae.displayName = "FloorSelectorBar";
277
+ const Xe = re(({
278
278
  scale: t,
279
279
  minScale: n,
280
- maxScale: o,
280
+ maxScale: i,
281
281
  onZoomIn: r,
282
282
  onZoomOut: d,
283
- position: l,
284
- className: a
283
+ position: c,
284
+ className: o
285
285
  }) => {
286
286
  const f = {
287
287
  position: "absolute",
@@ -298,8 +298,8 @@ const Ye = se(({
298
298
  "top-right": { top: 0, right: 0 },
299
299
  "bottom-left": { bottom: 0, left: 0 },
300
300
  "bottom-right": { bottom: 0, right: 0 }
301
- }[l]
302
- }, i = {
301
+ }[c]
302
+ }, a = {
303
303
  width: "44px",
304
304
  height: "44px",
305
305
  minWidth: "44px",
@@ -317,18 +317,18 @@ const Ye = se(({
317
317
  transition: "all 0.2s ease",
318
318
  touchAction: "manipulation"
319
319
  }, s = {
320
- ...i,
320
+ ...a,
321
321
  opacity: 0.4,
322
322
  cursor: "not-allowed"
323
- }, u = t < o, h = t > n;
324
- return /* @__PURE__ */ k("div", { className: a, style: f, children: [
323
+ }, u = t < i, g = t > n;
324
+ return /* @__PURE__ */ D("div", { className: o, style: f, children: [
325
325
  /* @__PURE__ */ y(
326
326
  "button",
327
327
  {
328
328
  type: "button",
329
329
  onClick: r,
330
330
  disabled: !u,
331
- style: u ? i : s,
331
+ style: u ? a : s,
332
332
  title: "Zoom In",
333
333
  children: "+"
334
334
  }
@@ -338,28 +338,28 @@ const Ye = se(({
338
338
  {
339
339
  type: "button",
340
340
  onClick: d,
341
- disabled: !h,
342
- style: h ? i : s,
341
+ disabled: !g,
342
+ style: g ? a : s,
343
343
  title: "Zoom Out",
344
344
  children: "−"
345
345
  }
346
346
  )
347
347
  ] });
348
348
  });
349
- Ye.displayName = "ZoomControls";
350
- const je = se(({
349
+ Xe.displayName = "ZoomControls";
350
+ const Ye = re(({
351
351
  visible: t,
352
352
  x: n,
353
- y: o,
353
+ y: i,
354
354
  seat: r,
355
355
  currency: d,
356
- state: l
356
+ state: c
357
357
  }) => {
358
358
  if (!t || !r) return null;
359
- const a = r.seatNumber || (r.rowLabel && r.columnLabel ? `${r.rowLabel}-${r.columnLabel}` : "N/A"), m = {
359
+ const o = r.seatNumber || (r.rowLabel && r.columnLabel ? `${r.rowLabel}-${r.columnLabel}` : "N/A"), x = {
360
360
  position: "fixed",
361
361
  left: `${n + 15}px`,
362
- top: `${o + 15}px`,
362
+ top: `${i + 15}px`,
363
363
  zIndex: 1e3,
364
364
  pointerEvents: "none"
365
365
  }, f = {
@@ -371,7 +371,7 @@ const je = se(({
371
371
  fontSize: "13px",
372
372
  boxShadow: "0 4px 12px rgba(0, 0, 0, 0.3)",
373
373
  minWidth: "140px"
374
- }, i = {
374
+ }, a = {
375
375
  color: "#9ca3af",
376
376
  marginRight: "4px"
377
377
  }, s = {
@@ -379,499 +379,532 @@ const je = se(({
379
379
  }, u = {
380
380
  color: "#4ade80",
381
381
  fontWeight: 600
382
- }, h = {
382
+ }, g = {
383
383
  fontSize: "11px",
384
384
  color: "#6b7280",
385
385
  textTransform: "capitalize",
386
386
  marginTop: "4px"
387
387
  };
388
- return /* @__PURE__ */ y("div", { style: m, children: /* @__PURE__ */ k("div", { style: f, children: [
389
- r.sectionName && /* @__PURE__ */ k("div", { style: { marginBottom: "4px" }, children: [
390
- /* @__PURE__ */ y("span", { style: i, children: "Section:" }),
388
+ return /* @__PURE__ */ y("div", { style: x, children: /* @__PURE__ */ D("div", { style: f, children: [
389
+ r.sectionName && /* @__PURE__ */ D("div", { style: { marginBottom: "4px" }, children: [
390
+ /* @__PURE__ */ y("span", { style: a, children: "Section:" }),
391
391
  /* @__PURE__ */ y("span", { style: { ...s, color: "#3b82f6" }, children: r.sectionName })
392
392
  ] }),
393
- /* @__PURE__ */ k("div", { style: { marginBottom: "4px" }, children: [
394
- /* @__PURE__ */ y("span", { style: i, children: "Seat:" }),
395
- /* @__PURE__ */ y("span", { style: s, children: a })
393
+ /* @__PURE__ */ D("div", { style: { marginBottom: "4px" }, children: [
394
+ /* @__PURE__ */ y("span", { style: a, children: "Seat:" }),
395
+ /* @__PURE__ */ y("span", { style: s, children: o })
396
396
  ] }),
397
- r.price !== void 0 && r.price > 0 && l === "available" && /* @__PURE__ */ k("div", { style: { marginBottom: "4px" }, children: [
398
- /* @__PURE__ */ y("span", { style: i, children: "Price:" }),
399
- /* @__PURE__ */ k("span", { style: u, children: [
397
+ r.price !== void 0 && r.price > 0 && c === "available" && /* @__PURE__ */ D("div", { style: { marginBottom: "4px" }, children: [
398
+ /* @__PURE__ */ y("span", { style: a, children: "Price:" }),
399
+ /* @__PURE__ */ D("span", { style: u, children: [
400
400
  d,
401
401
  " ",
402
402
  r.price.toFixed(2)
403
403
  ] })
404
404
  ] }),
405
- /* @__PURE__ */ k("div", { style: h, children: [
405
+ /* @__PURE__ */ D("div", { style: g, children: [
406
406
  "Status: ",
407
- l
407
+ c
408
408
  ] })
409
409
  ] }) });
410
410
  });
411
- je.displayName = "SeatTooltip";
412
- const Et = ({
411
+ Ye.displayName = "SeatTooltip";
412
+ const It = ({
413
413
  config: t,
414
414
  configUrl: n,
415
- floorId: o,
415
+ floorId: i,
416
416
  onFloorChange: r,
417
417
  reservedSeats: d = [],
418
- unavailableSeats: l = [],
419
- selectedSeats: a,
420
- myReservedSeats: m = [],
418
+ unavailableSeats: c = [],
419
+ selectedSeats: o,
420
+ myReservedSeats: x = [],
421
421
  onSeatSelect: f,
422
- onSeatDeselect: i,
422
+ onSeatDeselect: a,
423
423
  onSelectionChange: s,
424
424
  colorOverrides: u,
425
- showTooltip: h = !0,
426
- zoomEnabled: x = !0,
427
- className: S = "",
428
- onConfigLoad: R,
429
- onError: F,
425
+ showTooltip: g = !0,
426
+ zoomEnabled: h = !0,
427
+ className: p = "",
428
+ onConfigLoad: w,
429
+ onError: R,
430
430
  // Floor selector props
431
- showFloorSelector: I,
431
+ showFloorSelector: F,
432
432
  floorSelectorPosition: M = "top-left",
433
- floorSelectorClassName: T,
434
- showAllFloorsOption: z = !0,
435
- allFloorsLabel: X = "All",
436
- fitToView: _ = !0,
437
- fitPadding: O = 40,
433
+ floorSelectorClassName: k,
434
+ showAllFloorsOption: Y = !0,
435
+ allFloorsLabel: T = "All",
436
+ fitToView: X = !0,
437
+ fitPadding: j = 40,
438
438
  // Zoom controls
439
- showZoomControls: J = !0,
440
- zoomControlsPosition: ge = "bottom-right",
441
- zoomControlsClassName: ae,
442
- minZoom: pe,
443
- maxZoom: W = 3,
444
- zoomStep: P = 0.25,
439
+ showZoomControls: oe = !0,
440
+ zoomControlsPosition: je = "bottom-right",
441
+ zoomControlsClassName: Pe,
442
+ minZoom: xe,
443
+ maxZoom: B = 3,
444
+ zoomStep: ie = 0.25,
445
445
  // Touch gestures
446
- touchEnabled: Me = !0
446
+ touchEnabled: We = !0
447
447
  }) => {
448
- const $ = N(null), U = N(null), E = gt(U), [B, ye] = C(/* @__PURE__ */ new Set()), [D, Q] = C(1), [A, q] = C({ x: 0, y: 0 }), [We, Pe] = C(null), [$e, Be] = C(1), ce = N({ width: 0, height: 0 }), [ee, Ee] = C({ visible: !1, x: 0, y: 0, seat: null, state: "available" }), { config: Oe, loading: Ue, error: te } = ft(n), g = t || Oe, be = o !== void 0, Y = be ? o || null : We, le = a !== void 0, Ve = L((e) => {
449
- be || Pe(e), r?.(e);
450
- }, [be, r]), ve = g?.floors || [], He = I !== void 0 ? I : ve.length > 1, ue = H(
451
- () => g ? { ...g.colors, ...u } : { ...yt, ...u },
452
- [g, u]
453
- ), Z = H(() => {
454
- if (!g) return [];
455
- let e = g.seats.filter((c) => c.state !== "hidden");
456
- return Y && (e = e.filter(
457
- (c) => c.floorId === Y || !c.floorId && Y === "floor_default"
448
+ const fe = A(null), we = A(null), E = bt(we), [O, Ce] = N(/* @__PURE__ */ new Set()), [L, G] = N(1), [z, H] = N({ x: 0, y: 0 }), [Be, Ue] = N(null), [$e, He] = N(1), se = A({ width: 0, height: 0 }), [Z, Re] = N({ visible: !1, x: 0, y: 0, seat: null, state: "available" }), { config: Ve, loading: Oe, error: K } = vt(n), v = t || Ve, ge = i !== void 0, P = ge ? i || null : Be, ae = o !== void 0, _e = I((e) => {
449
+ ge || Ue(e), r?.(e);
450
+ }, [ge, r]), pe = v?.floors || [], qe = F !== void 0 ? F : pe.length > 1, ce = $(
451
+ () => v ? { ...v.colors, ...u } : { ...St, ...u },
452
+ [v, u]
453
+ ), _ = $(() => {
454
+ if (!v) return [];
455
+ let e = v.seats.filter((l) => l.state !== "hidden");
456
+ return P && (e = e.filter(
457
+ (l) => l.floorId === P || !l.floorId && P === "floor_default"
458
458
  )), e;
459
- }, [g, Y]), de = H(() => g?.stages ? Y ? g.stages.filter(
460
- (e) => e.floorId === Y || !e.floorId && Y === "floor_default"
461
- ) : g.stages : [], [g, Y]), V = H(() => {
462
- if (!g || Z.length === 0 && de.length === 0)
459
+ }, [v, P]), le = $(() => v?.stages ? P ? v.stages.filter(
460
+ (e) => e.floorId === P || !e.floorId && P === "floor_default"
461
+ ) : v.stages : [], [v, P]), U = $(() => {
462
+ if (!v || _.length === 0 && le.length === 0)
463
463
  return null;
464
464
  const e = 12;
465
- let c = 1 / 0, p = 1 / 0, b = -1 / 0, v = -1 / 0;
466
- return Z.forEach((w) => {
467
- 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);
468
- }), de.forEach((w) => {
469
- 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));
470
- }), { minX: c, minY: p, maxX: b, maxY: v, width: b - c, height: v - p };
471
- }, [g, Z, de]);
472
- j(() => {
473
- if (!_ || !g || !V || E.width === 0 || E.height === 0) return;
474
- const e = Math.abs(E.width - ce.current.width), c = Math.abs(E.height - ce.current.height);
475
- if (!(ce.current.width === 0) && e < 10 && c < 10) return;
476
- ce.current = E;
477
- const b = E.width, v = E.height, w = b - O * 2, oe = v - O * 2, he = w / V.width, xe = oe / V.height, fe = Math.min(he, xe, W), nt = V.minX + V.width / 2, rt = V.minY + V.height / 2, ot = b / 2, it = v / 2, st = ot - nt * fe, at = it - rt * fe;
478
- Q(fe), q({ x: st, y: at }), Be(fe);
479
- }, [_, g, V, O, W, E, Y]);
480
- const G = H(() => {
481
- const e = new Set(d), c = new Set(l), p = new Set(m);
482
- return { reserved: e, unavailable: c, myReserved: p };
483
- }, [d, l, m]), me = H(() => a ? new Set(a) : null, [a]), ne = L((e) => {
484
- const c = e.id, p = e.seatNumber || "";
485
- return G.unavailable.has(c) || G.unavailable.has(p) ? "unavailable" : G.reserved.has(c) || G.reserved.has(p) ? "reserved" : G.myReserved.has(c) || G.myReserved.has(p) || B.has(c) ? "selected" : e.state;
486
- }, [G, B]);
487
- j(() => {
488
- g && R && R(g);
489
- }, [g, R]), j(() => {
490
- te && F && F(te);
491
- }, [te, F]), j(() => {
492
- le && me && ye(me);
493
- }, [le, me]);
494
- const _e = L((e) => {
495
- const c = ne(e);
496
- if (c !== "available" && c !== "selected")
465
+ let l = 1 / 0, b = 1 / 0, S = -1 / 0, m = -1 / 0;
466
+ return _.forEach((C) => {
467
+ l = Math.min(l, C.position.x - e), b = Math.min(b, C.position.y - e), S = Math.max(S, C.position.x + e), m = Math.max(m, C.position.y + e);
468
+ }), le.forEach((C) => {
469
+ l = Math.min(l, C.position.x), b = Math.min(b, C.position.y), S = Math.max(S, C.position.x + (C.config?.width || 200)), m = Math.max(m, C.position.y + (C.config?.height || 100));
470
+ }), { minX: l, minY: b, maxX: S, maxY: m, width: S - l, height: m - b };
471
+ }, [v, _, le]);
472
+ W(() => {
473
+ if (!X || !v || !U || E.width === 0 || E.height === 0) return;
474
+ const e = Math.abs(E.width - se.current.width), l = Math.abs(E.height - se.current.height);
475
+ if (!(se.current.width === 0) && e < 10 && l < 10) return;
476
+ se.current = E;
477
+ const S = E.width, m = E.height, C = S - j * 2, ee = m - j * 2, de = C / U.width, be = ee / U.height, ue = Math.min(de, be, B), ot = U.minX + U.width / 2, it = U.minY + U.height / 2, st = S / 2, at = m / 2, ct = st - ot * ue, lt = at - it * ue;
478
+ G(ue), H({ x: ct, y: lt }), He(ue);
479
+ }, [X, v, U, j, B, E, P]);
480
+ const V = $(() => {
481
+ const e = new Set(d), l = new Set(c), b = new Set(x);
482
+ return { reserved: e, unavailable: l, myReserved: b };
483
+ }, [d, c, x]), ve = $(() => o ? new Set(o) : null, [o]), J = I((e) => {
484
+ const l = e.id, b = e.seatNumber || "";
485
+ 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;
486
+ }, [V, O]);
487
+ W(() => {
488
+ v && w && w(v);
489
+ }, [v, w]), W(() => {
490
+ K && R && R(K);
491
+ }, [K, R]), W(() => {
492
+ ae && ve && Ce(ve);
493
+ }, [ae, ve]);
494
+ const Ge = I((e) => {
495
+ const l = J(e);
496
+ if (l !== "available" && l !== "selected")
497
497
  return;
498
- const p = B.has(e.id);
499
- le || ye((b) => {
500
- const v = new Set(b);
501
- return p ? v.delete(e.id) : v.add(e.id), v;
502
- }), p ? i?.(e) : (f?.(e), f || console.log("Seat selected:", e));
503
- }, [ne, B, le, f, i]), re = H(() => g ? Z.filter((e) => B.has(e.id)) : [], [Z, B]);
504
- j(() => {
505
- s?.(re);
506
- }, [re, s]);
507
- const K = pe !== void 0 ? pe : $e, qe = L(() => {
508
- if (!x) return;
509
- const e = Math.min(D + P, W);
510
- if (e !== D) {
511
- const c = E.width || g?.canvas.width || 800, p = E.height || g?.canvas.height || 600, b = c / 2, v = p / 2, w = {
512
- x: (b - A.x) / D,
513
- y: (v - A.y) / D
498
+ const b = O.has(e.id);
499
+ ae || Ce((S) => {
500
+ const m = new Set(S);
501
+ return b ? m.delete(e.id) : m.add(e.id), m;
502
+ }), b ? a?.(e) : (f?.(e), f || console.log("Seat selected:", e));
503
+ }, [J, O, ae, f, a]), Q = $(() => v ? _.filter((e) => O.has(e.id)) : [], [_, O]);
504
+ W(() => {
505
+ s?.(Q);
506
+ }, [Q, s]);
507
+ const q = xe !== void 0 ? xe : $e, Ze = I(() => {
508
+ if (!h) return;
509
+ const e = Math.min(L + ie, B);
510
+ if (e !== L) {
511
+ const l = E.width || v?.canvas.width || 800, b = E.height || v?.canvas.height || 600, S = l / 2, m = b / 2, C = {
512
+ x: (S - z.x) / L,
513
+ y: (m - z.y) / L
514
514
  };
515
- Q(e), q({
516
- x: b - w.x * e,
517
- y: v - w.y * e
515
+ G(e), H({
516
+ x: S - C.x * e,
517
+ y: m - C.y * e
518
518
  });
519
519
  }
520
- }, [x, D, P, W, E, g, A]), Ge = L(() => {
521
- if (!x) return;
522
- const e = Math.max(D - P, K);
523
- if (e !== D) {
524
- const c = E.width || g?.canvas.width || 800, p = E.height || g?.canvas.height || 600, b = c / 2, v = p / 2, w = {
525
- x: (b - A.x) / D,
526
- y: (v - A.y) / D
520
+ }, [h, L, ie, B, E, v, z]), Ke = I(() => {
521
+ if (!h) return;
522
+ const e = Math.max(L - ie, q);
523
+ if (e !== L) {
524
+ const l = E.width || v?.canvas.width || 800, b = E.height || v?.canvas.height || 600, S = l / 2, m = b / 2, C = {
525
+ x: (S - z.x) / L,
526
+ y: (m - z.y) / L
527
527
  };
528
- Q(e), q({
529
- x: b - w.x * e,
530
- y: v - w.y * e
528
+ G(e), H({
529
+ x: S - C.x * e,
530
+ y: m - C.y * e
531
531
  });
532
532
  }
533
- }, [x, D, P, K, E, g, A]), Je = L((e) => {
534
- q({
533
+ }, [h, L, ie, q, E, v, z]), Je = I((e) => {
534
+ H({
535
535
  x: e.target.x(),
536
536
  y: e.target.y()
537
537
  });
538
- }, []), Ze = L((e) => {
539
- if (!x) return;
538
+ }, []), Qe = I((e) => {
539
+ if (!h) return;
540
540
  e.evt.preventDefault();
541
- const c = $.current;
542
- if (!c) return;
543
- const p = c.scaleX(), b = c.getPointerPosition();
544
- if (!b) return;
545
- const v = 1.1, w = e.evt.deltaY > 0 ? p / v : p * v, oe = Math.min(Math.max(w, K), W), he = {
546
- x: (b.x - A.x) / p,
547
- y: (b.y - A.y) / p
548
- }, xe = {
549
- x: b.x - he.x * oe,
550
- y: b.y - he.y * oe
541
+ const l = fe.current;
542
+ if (!l) return;
543
+ const b = l.scaleX(), S = l.getPointerPosition();
544
+ if (!S) return;
545
+ const m = 1.1, C = e.evt.deltaY > 0 ? b / m : b * m, ee = Math.min(Math.max(C, q), B), de = {
546
+ x: (S.x - z.x) / b,
547
+ y: (S.y - z.y) / b
548
+ }, be = {
549
+ x: S.x - de.x * ee,
550
+ y: S.y - de.y * ee
551
551
  };
552
- Q(oe), q(xe);
553
- }, [x, A, K, W]);
554
- pt($, {
555
- enabled: Me && x,
556
- minScale: K,
557
- maxScale: W,
558
- currentScale: D,
559
- currentPosition: A,
560
- onScaleChange: (e, c) => {
561
- Q(e), q(c);
552
+ G(ee), H(be);
553
+ }, [h, z, q, B]);
554
+ yt(fe, {
555
+ enabled: We && h,
556
+ minScale: q,
557
+ maxScale: B,
558
+ currentScale: L,
559
+ currentPosition: z,
560
+ onScaleChange: (e, l) => {
561
+ G(e), H(l);
562
562
  },
563
563
  onPositionChange: (e) => {
564
- q(e);
564
+ H(e);
565
565
  }
566
566
  });
567
- const Ke = L((e, c) => {
568
- if (!h) return;
569
- const p = c.target.getStage();
570
- if (!p) return;
571
- const b = p.getPointerPosition();
567
+ const et = I((e, l) => {
568
+ if (!g) return;
569
+ const b = l.target.getStage();
572
570
  if (!b) return;
573
- const v = p.container().getBoundingClientRect();
574
- Ee({
571
+ const S = b.getPointerPosition();
572
+ if (!S) return;
573
+ const m = b.container().getBoundingClientRect();
574
+ Re({
575
575
  visible: !0,
576
- x: v.left + b.x,
577
- y: v.top + b.y,
576
+ x: m.left + S.x,
577
+ y: m.top + S.y,
578
578
  seat: e,
579
- state: ne(e)
579
+ state: J(e)
580
580
  });
581
- }, [h, ne]), Qe = L(() => {
582
- Ee((e) => ({ ...e, visible: !1 }));
581
+ }, [g, J]), tt = I(() => {
582
+ Re((e) => ({ ...e, visible: !1 }));
583
583
  }, []);
584
- if (Ue)
585
- return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${S}`, children: /* @__PURE__ */ y("p", { children: "Loading seat map..." }) });
586
- if (te)
587
- return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${S}`, children: /* @__PURE__ */ k("p", { className: "text-red-500", children: [
584
+ if (Oe)
585
+ return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${p}`, children: /* @__PURE__ */ y("p", { children: "Loading seat map..." }) });
586
+ if (K)
587
+ return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${p}`, children: /* @__PURE__ */ D("p", { className: "text-red-500", children: [
588
588
  "Error loading seat map: ",
589
- te.message
589
+ K.message
590
590
  ] }) });
591
- if (!g)
592
- return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${S}`, children: /* @__PURE__ */ y("p", { children: "No configuration provided" }) });
593
- const et = E.width || g.canvas.width, tt = E.height || g.canvas.height;
594
- return /* @__PURE__ */ k(
591
+ if (!v)
592
+ return /* @__PURE__ */ y("div", { className: `flex items-center justify-center h-full ${p}`, children: /* @__PURE__ */ y("p", { children: "No configuration provided" }) });
593
+ const nt = E.width || v.canvas.width, rt = E.height || v.canvas.height;
594
+ return /* @__PURE__ */ D(
595
595
  "div",
596
596
  {
597
- ref: U,
598
- className: `relative ${S}`,
597
+ ref: we,
598
+ className: `relative ${p}`,
599
599
  style: { width: "100%", height: "100%" },
600
600
  children: [
601
- He && ve.length > 0 && /* @__PURE__ */ y(
602
- Xe,
601
+ qe && pe.length > 0 && /* @__PURE__ */ y(
602
+ Ae,
603
603
  {
604
- floors: ve,
605
- currentFloorId: Y,
606
- onFloorChange: Ve,
607
- showAllOption: z,
608
- allLabel: X,
604
+ floors: pe,
605
+ currentFloorId: P,
606
+ onFloorChange: _e,
607
+ showAllOption: Y,
608
+ allLabel: T,
609
609
  position: M,
610
- className: T
610
+ className: k
611
611
  }
612
612
  ),
613
- /* @__PURE__ */ k(
614
- ct,
613
+ /* @__PURE__ */ D(
614
+ ut,
615
615
  {
616
- ref: $,
617
- width: et,
618
- height: tt,
619
- scaleX: D,
620
- scaleY: D,
621
- x: A.x,
622
- y: A.y,
616
+ ref: fe,
617
+ width: nt,
618
+ height: rt,
619
+ scaleX: L,
620
+ scaleY: L,
621
+ x: z.x,
622
+ y: z.y,
623
623
  draggable: !0,
624
624
  onDragEnd: Je,
625
- onWheel: Ze,
626
- style: { backgroundColor: g.canvas.backgroundColor, cursor: "grab" },
625
+ onWheel: Qe,
626
+ style: { backgroundColor: v.canvas.backgroundColor, cursor: "grab" },
627
627
  children: [
628
- /* @__PURE__ */ y(Fe, { listening: !1, children: de.map((e) => /* @__PURE__ */ y(
629
- Ae,
628
+ /* @__PURE__ */ y(Me, { listening: !1, children: le.map((e) => /* @__PURE__ */ y(
629
+ ze,
630
630
  {
631
631
  stage: e,
632
- stageColor: ue.stageColor
632
+ stageColor: ce.stageColor
633
633
  },
634
634
  e.id
635
635
  )) }),
636
- /* @__PURE__ */ y(Fe, { children: Z.map((e) => /* @__PURE__ */ y(
637
- ze,
636
+ /* @__PURE__ */ y(Me, { children: _.map((e) => /* @__PURE__ */ y(
637
+ Te,
638
638
  {
639
639
  seat: e,
640
- state: ne(e),
641
- colors: ue,
642
- onClick: _e,
643
- onMouseEnter: Ke,
644
- onMouseLeave: Qe
640
+ state: J(e),
641
+ colors: ce,
642
+ onClick: Ge,
643
+ onMouseEnter: et,
644
+ onMouseLeave: tt
645
645
  },
646
646
  e.id
647
647
  )) })
648
648
  ]
649
649
  }
650
650
  ),
651
- h && /* @__PURE__ */ y(
652
- je,
651
+ g && /* @__PURE__ */ y(
652
+ Ye,
653
653
  {
654
- visible: ee.visible,
655
- x: ee.x,
656
- y: ee.y,
657
- seat: ee.seat,
658
- currency: ue.currency,
659
- state: ee.state
654
+ visible: Z.visible,
655
+ x: Z.x,
656
+ y: Z.y,
657
+ seat: Z.seat,
658
+ currency: ce.currency,
659
+ state: Z.state
660
660
  }
661
661
  ),
662
- J && x && /* @__PURE__ */ y(
663
- Ye,
662
+ oe && h && /* @__PURE__ */ y(
663
+ Xe,
664
664
  {
665
- scale: D,
666
- minScale: K,
667
- maxScale: W,
668
- onZoomIn: qe,
669
- onZoomOut: Ge,
670
- position: ge,
671
- className: ae
665
+ scale: L,
666
+ minScale: q,
667
+ maxScale: B,
668
+ onZoomIn: Ze,
669
+ onZoomOut: Ke,
670
+ position: je,
671
+ className: Pe
672
672
  }
673
673
  ),
674
- re.length > 0 && /* @__PURE__ */ k("div", { className: "absolute top-4 right-4 bg-white dark:bg-gray-800 p-4 rounded shadow-lg", children: [
675
- /* @__PURE__ */ k("h3", { className: "font-semibold mb-2", children: [
674
+ Q.length > 0 && /* @__PURE__ */ D("div", { className: "absolute top-4 right-4 bg-white dark:bg-gray-800 p-4 rounded shadow-lg", children: [
675
+ /* @__PURE__ */ D("h3", { className: "font-semibold mb-2", children: [
676
676
  "Selected Seats (",
677
- re.length,
677
+ Q.length,
678
678
  ")"
679
679
  ] }),
680
- /* @__PURE__ */ y("div", { className: "max-h-48 overflow-y-auto space-y-1", children: re.map((e) => /* @__PURE__ */ k("div", { className: "text-sm", children: [
680
+ /* @__PURE__ */ y("div", { className: "max-h-48 overflow-y-auto space-y-1", children: Q.map((e) => /* @__PURE__ */ D("div", { className: "text-sm", children: [
681
681
  e.seatNumber,
682
- e.price && ` - ${ue.currency} ${e.price.toFixed(2)}`
682
+ e.price && ` - ${ce.currency} ${e.price.toFixed(2)}`
683
683
  ] }, e.id)) })
684
684
  ] })
685
685
  ]
686
686
  }
687
687
  );
688
688
  };
689
- let ie = null;
689
+ let ne = null;
690
690
  function Ft(t) {
691
- ie = t;
691
+ ne = t;
692
692
  }
693
- function Ce() {
694
- if (!ie)
693
+ function Se() {
694
+ if (!ne)
695
695
  throw new Error(
696
696
  "Firebase database not initialized. Call initializeFirebaseForViewer(db) first."
697
697
  );
698
- return ie;
698
+ return ne;
699
699
  }
700
- function Re() {
701
- return ie !== null;
700
+ function me() {
701
+ return ne !== null;
702
702
  }
703
- function It() {
704
- ie = null;
703
+ function kt() {
704
+ ne = null;
705
705
  }
706
- function Se(t, n) {
706
+ function te(t, n) {
707
707
  if (t.length !== n.length) return !1;
708
- for (let o = 0; o < t.length; o++)
709
- if (t[o] !== n[o]) return !1;
710
- return !0;
711
- }
712
- function bt(t, n) {
713
- return Se(t.myReserved, n.myReserved) && Se(t.otherReserved, n.otherReserved) && Se(t.unavailable, n.unavailable);
708
+ const i = [...t].sort(), r = [...n].sort();
709
+ return i.every((d, c) => d === r[c]);
714
710
  }
715
- function vt(t, n) {
716
- const o = [], r = [], d = [];
717
- return Object.entries(t).forEach(([l, a]) => {
718
- a && typeof a == "object" && a.state && (a.state === "unavailable" ? d.push(l) : a.state === "reserved" && (n && a.userId === n ? o.push(l) : r.push(l)));
719
- }), { myReserved: o, otherReserved: r, unavailable: d };
711
+ function ke(t, n) {
712
+ const i = [], r = [], d = [];
713
+ return Object.entries(t).forEach(([c, o]) => {
714
+ 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)));
715
+ }), {
716
+ myReserved: i.sort(),
717
+ otherReserved: r.sort(),
718
+ unavailable: d.sort()
719
+ };
720
720
  }
721
+ const he = {
722
+ states: null,
723
+ loading: !0,
724
+ error: null,
725
+ lastUpdated: null,
726
+ myReservedSeats: [],
727
+ otherReservedSeats: [],
728
+ unavailableSeats: []
729
+ };
721
730
  function mt(t) {
722
- const { seatMapId: n, currentUserId: o, enabled: r = !0, onStateChange: d, onError: l } = t, [a, m] = C(null), [f, i] = C(!0), [s, u] = C(null), [h, x] = C(null), [S, R] = C([]), [F, I] = C([]), [M, T] = C([]), z = N(d), X = N(l), _ = N(o);
723
- z.current = d, X.current = l, _.current = o;
724
- const O = N({
725
- myReserved: [],
726
- otherReserved: [],
727
- unavailable: []
728
- }), J = N(null);
729
- return j(() => {
730
- if (!r || !n) {
731
- i(!1);
732
- return;
733
- }
734
- if (!Re()) {
735
- i(!1), u(new Error("Firebase not initialized. Call initializeFirebaseForViewer first."));
736
- return;
731
+ const { seatMapId: n, currentUserId: i, enabled: r = !0, onStateChange: d, onError: c } = t, o = A({ ...he }), x = A(d), f = A(c), a = A(i);
732
+ x.current = d, f.current = c, a.current = i;
733
+ const s = I(
734
+ (p) => {
735
+ if (!r || !n)
736
+ return o.current = { ...he, loading: !1 }, () => {
737
+ };
738
+ if (!me())
739
+ return o.current = {
740
+ ...he,
741
+ loading: !1,
742
+ error: new Error("Firebase not initialized. Call initializeFirebaseForViewer first.")
743
+ }, () => {
744
+ };
745
+ const w = Se(), R = ye(w, `seat_states/${n}`);
746
+ return Le(R, (k) => {
747
+ const T = k.val() || {}, X = ke(T, a.current), j = o.current;
748
+ (j.loading || !te(j.myReservedSeats, X.myReserved) || !te(j.otherReservedSeats, X.otherReserved) || !te(j.unavailableSeats, X.unavailable)) && (o.current = {
749
+ states: T,
750
+ loading: !1,
751
+ error: null,
752
+ lastUpdated: Date.now(),
753
+ myReservedSeats: X.myReserved,
754
+ otherReservedSeats: X.otherReserved,
755
+ unavailableSeats: X.unavailable
756
+ }, x.current?.(T), p());
757
+ }, (k) => {
758
+ o.current = {
759
+ ...o.current,
760
+ loading: !1,
761
+ error: k
762
+ }, f.current?.(k), p();
763
+ }), () => {
764
+ Ne(R);
765
+ };
766
+ },
767
+ [n, r]
768
+ ), u = I(() => o.current, []), g = I(() => he, []), h = dt(s, u, g);
769
+ return W(() => {
770
+ if (h.states && i !== void 0) {
771
+ const p = ke(h.states, i), w = o.current;
772
+ (!te(w.myReservedSeats, p.myReserved) || !te(w.otherReservedSeats, p.otherReserved)) && (o.current = {
773
+ ...w,
774
+ myReservedSeats: p.myReserved,
775
+ otherReservedSeats: p.otherReserved,
776
+ unavailableSeats: p.unavailable,
777
+ lastUpdated: Date.now()
778
+ });
737
779
  }
738
- const ge = Ce(), ae = we(ge, `seat_states/${n}`);
739
- return i(!0), u(null), Ne(ae, (P) => {
740
- const $ = P.val() || {}, U = vt($, _.current), E = O.current, B = JSON.stringify(J.current) !== JSON.stringify($);
741
- B && (m($), J.current = $), i(!1), !bt(E, U) && (x(Date.now()), R(U.myReserved), I(U.otherReserved), T(U.unavailable), O.current = U), B && z.current?.($);
742
- }, (P) => {
743
- u(P), i(!1), X.current?.(P);
744
- }), () => {
745
- Te(ae);
746
- };
747
- }, [n, r]), {
748
- states: a,
749
- loading: f,
750
- error: s,
751
- lastUpdated: h,
752
- myReservedSeats: S,
753
- otherReservedSeats: F,
754
- unavailableSeats: M,
780
+ }, [i]), {
781
+ states: h.states,
782
+ loading: h.loading,
783
+ error: h.error,
784
+ lastUpdated: h.lastUpdated,
785
+ myReservedSeats: h.myReservedSeats,
786
+ otherReservedSeats: h.otherReservedSeats,
787
+ unavailableSeats: h.unavailableSeats,
755
788
  // Legacy alias
756
- reservedSeats: F
789
+ reservedSeats: h.otherReservedSeats
757
790
  };
758
791
  }
759
792
  function xt(t) {
760
793
  const {
761
794
  seatMapId: n,
762
- enabled: o = !0,
795
+ enabled: i = !0,
763
796
  subscribeToChanges: r = !1,
764
797
  onConfigLoad: d,
765
- onError: l
766
- } = t, [a, m] = C(null), [f, i] = C(!0), [s, u] = C(null), h = N(d), x = N(l);
767
- h.current = d, x.current = l;
768
- const S = L(async () => {
798
+ onError: c
799
+ } = t, [o, x] = N(null), [f, a] = N(!0), [s, u] = N(null), g = A(d), h = A(c);
800
+ g.current = d, h.current = c;
801
+ const p = I(async () => {
769
802
  if (!n) return;
770
- if (!Re()) {
771
- u(new Error("Firebase not initialized. Call initializeFirebaseForViewer first.")), i(!1);
803
+ if (!me()) {
804
+ u(new Error("Firebase not initialized. Call initializeFirebaseForViewer first.")), a(!1);
772
805
  return;
773
806
  }
774
- const R = Ce(), F = we(R, `seatmaps/${n}`);
807
+ const w = Se(), R = ye(w, `seatmaps/${n}`);
775
808
  try {
776
- i(!0), u(null);
777
- const M = (await dt(F)).val();
809
+ a(!0), u(null);
810
+ const M = (await gt(R)).val();
778
811
  if (M) {
779
- const T = ht(M);
780
- m(T), h.current?.(T);
812
+ const k = pt(M);
813
+ x(k), g.current?.(k);
781
814
  } else
782
815
  u(new Error(`Seat map ${n} not found in Firebase`));
783
- } catch (I) {
784
- const M = I instanceof Error ? I : new Error("Unknown error");
785
- u(M), x.current?.(M);
816
+ } catch (F) {
817
+ const M = F instanceof Error ? F : new Error("Unknown error");
818
+ u(M), h.current?.(M);
786
819
  } finally {
787
- i(!1);
820
+ a(!1);
788
821
  }
789
822
  }, [n]);
790
- return j(() => {
791
- if (!o || !n) {
792
- i(!1);
823
+ return W(() => {
824
+ if (!i || !n) {
825
+ a(!1);
793
826
  return;
794
827
  }
795
- if (S(), r && Re()) {
796
- const R = Ce(), F = we(R, `seatmaps/${n}/meta/updated_at`);
797
- let I = !0, M = null;
798
- return Ne(F, (z) => {
799
- if (I) {
800
- I = !1, M = z.val();
828
+ if (p(), r && me()) {
829
+ const w = Se(), R = ye(w, `seatmaps/${n}/meta/updated_at`);
830
+ let F = !0, M = null;
831
+ return Le(R, (Y) => {
832
+ if (F) {
833
+ F = !1, M = Y.val();
801
834
  return;
802
835
  }
803
- const X = z.val();
804
- z.exists() && X !== M && (M = X, S());
836
+ const T = Y.val();
837
+ Y.exists() && T !== M && (M = T, p());
805
838
  }), () => {
806
- Te(F);
839
+ Ne(R);
807
840
  };
808
841
  }
809
- }, [n, o, r]), {
810
- config: a,
842
+ }, [n, i, r]), {
843
+ config: o,
811
844
  loading: f,
812
845
  error: s,
813
- refetch: S
846
+ refetch: p
814
847
  };
815
848
  }
816
- function kt(t) {
849
+ function Dt(t) {
817
850
  const {
818
851
  seatMapId: n,
819
- userId: o,
852
+ userId: i,
820
853
  enabled: r = !0,
821
854
  subscribeToDesignChanges: d = !1,
822
- onConfigLoad: l,
823
- onStateChange: a,
824
- onError: m
855
+ onConfigLoad: c,
856
+ onStateChange: o,
857
+ onError: x
825
858
  } = t, {
826
859
  config: f,
827
- loading: i,
860
+ loading: a,
828
861
  error: s,
829
862
  refetch: u
830
863
  } = xt({
831
864
  seatMapId: n,
832
865
  enabled: r,
833
866
  subscribeToChanges: d,
834
- onConfigLoad: l,
835
- onError: m
867
+ onConfigLoad: c,
868
+ onError: x
836
869
  }), {
837
- states: h,
838
- loading: x,
839
- error: S,
840
- lastUpdated: R,
841
- myReservedSeats: F,
842
- otherReservedSeats: I,
870
+ states: g,
871
+ loading: h,
872
+ error: p,
873
+ lastUpdated: w,
874
+ myReservedSeats: R,
875
+ otherReservedSeats: F,
843
876
  unavailableSeats: M,
844
- reservedSeats: T
877
+ reservedSeats: k
845
878
  } = mt({
846
879
  seatMapId: n,
847
- currentUserId: o,
880
+ currentUserId: i,
848
881
  enabled: r,
849
- onStateChange: a,
850
- onError: m
882
+ onStateChange: o,
883
+ onError: x
851
884
  });
852
885
  return {
853
886
  config: f,
854
- loading: i || x,
855
- error: s || S,
856
- myReservedSeats: F,
857
- otherReservedSeats: I,
887
+ loading: a || h,
888
+ error: s || p,
889
+ myReservedSeats: R,
890
+ otherReservedSeats: F,
858
891
  unavailableSeats: M,
859
- reservedSeats: T,
860
- seatStates: h,
861
- lastUpdated: R,
892
+ reservedSeats: k,
893
+ seatStates: g,
894
+ lastUpdated: w,
862
895
  refetch: u
863
896
  };
864
897
  }
865
898
  export {
866
- yt as DEFAULT_COLORS,
867
- Et as SeatMapViewer,
868
- It as clearFirebaseInstance,
899
+ St as DEFAULT_COLORS,
900
+ It as SeatMapViewer,
901
+ kt as clearFirebaseInstance,
869
902
  Ft as initializeFirebaseForViewer,
870
- Re as isFirebaseInitialized,
871
- ft as useConfigFetcher,
872
- gt as useContainerSize,
903
+ me as isFirebaseInitialized,
904
+ vt as useConfigFetcher,
905
+ bt as useContainerSize,
873
906
  xt as useFirebaseConfig,
874
907
  mt as useFirebaseSeatStates,
875
- kt as useRealtimeSeatMap,
876
- pt as useTouchGestures
908
+ Dt as useRealtimeSeatMap,
909
+ yt as useTouchGestures
877
910
  };