@zonetrix/viewer 2.10.8 → 2.11.0

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