@seatlayer/core 0.10.2 → 0.11.0

package/dist/index.d.cts

@@ -383,6 +383,13 @@ interface RendererCallbacks {
     onDeckTap?: (floorId: string) => void;
     /** Fired after any pan/zoom/resize settles — re-anchor screen-space overlays. */
     onViewChange?: () => void;
+    /**
+     * Organizer manage-mode only (`manageMode` + `marqueeSelect`): fired on
+     * pointer-UP after a rubber-band marquee drag, or a ⌘A/Escape bulk shortcut,
+     * with the FULL current selection (selectable seats only). The host toolbar
+     * reads this to drive bulk block/unblock. Never fires when manageMode is off.
+     */
+    onMarquee?: (seats: ExpandedSeat[]) => void;
 }
 /** Far-zoom level-of-detail rung: whole zones → section blocks → individual seats. */
 type LodRung = 'zones' | 'sections' | 'seats';
@@ -402,6 +409,21 @@ interface RendererOptions extends RendererCallbacks {
     /** ISO 4217 currency for on-map prices ("FROM …"); defaults to money.DEFAULT_CURRENCY.
      *  Locale for grouping/symbol placement comes from the active i18n locale. */
     currency?: string;
+    /**
+     * Organizer manage surface (SDK SeatManager). Opt-in — enables the manage-mode
+     * gestures (marquee, ⌘A/Escape) and the bulk-selection helpers. Buyer pan /
+     * pinch / tap and every existing code path are byte-identical when this is
+     * false (every manage branch is gated on it). Default false.
+     */
+    manageMode?: boolean;
+    /**
+     * When `manageMode` is on, a mouse/pen primary-button drag at the seats rung
+     * draws a rubber-band marquee that bulk-selects the seats it covers (emitting
+     * `onMarquee` on pointer-up) instead of panning. Touch keeps single-finger
+     * pan (pinch to zoom); a middle-button drag pans with a mouse. Disabled below
+     * the seats rung (zoom in first). No effect unless `manageMode` is also set.
+     */
+    marqueeSelect?: boolean;
 }
 interface ISeatmapRenderer {
     /** Replace the chart. Resets selection and statuses, zooms to fit.
@@ -426,6 +448,17 @@ interface ISeatmapRenderer {
     getStatus(seatId: string): SeatStatus;
     getSelection(): ExpandedSeat[];
     clearSelection(): void;
+    /**
+     * Manage-mode bulk selection helpers (no-op / empty unless `manageMode`).
+     * They select the matching SELECTABLE seats (respecting `selectableStatuses`
+     * + closed sections), union with the current selection, and return the seats
+     * they added — the SDK SeatManager expands category/row/section picks to
+     * labels and drives one batched block/unblock from them.
+     */
+    selectAllSelectable?(): ExpandedSeat[];
+    selectByLabels?(labels: string[]): ExpandedSeat[];
+    /** Selectable seats belonging to a section OR zone id (no selection side-effect). */
+    getSelectableInSection?(sectionId: string): ExpandedSeat[];
     /** Programmatic deselect of specific seats (e.g. chip × in the cart). */
     deselect(seatIds: string[]): void;
     /**
@@ -806,6 +839,13 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     private panLast;
     /** Cumulative gesture movement in px — clicks are suppressed after a real pan/pinch. */
     private moved;
+    /**
+     * Manage-mode rubber-band marquee (option-gated). `start`/`cur` are WORLD-space
+     * points (overlayLayer rides the stage transform); `rect` is the on-canvas
+     * selection band. Null except during an active manage-mode drag.
+     */
+    private marquee;
+    private marqueeCur;
     constructor(container: HTMLDivElement, options?: RendererOptions);
     setChart(doc: ChartDoc, opts?: {
         floorId?: string;
@@ -830,6 +870,30 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     getSelection(): ExpandedSeat[];
     clearSelection(): void;
     deselect(seatIds: string[]): void;
+    /** Select every selectable seat on the chart (⌘A). Returns the added seats. */
+    selectAllSelectable(): ExpandedSeat[];
+    /** Select the selectable seats matching these public labels (category/row/
+     *  section bulk resolves to labels host-side). Returns the newly added seats. */
+    selectByLabels(labels: string[]): ExpandedSeat[];
+    /** Selectable seats in a section OR zone id — pure read (no selection change). */
+    getSelectableInSection(sectionId: string): ExpandedSeat[];
+    /**
+     * Union `ids` into the selection in one batched pass. Beyond MARQUEE_RING_CAP
+     * total selected we skip the per-seat ring nodes (fill paint still marks the
+     * seats) so a whole-arena select doesn't spawn thousands of Konva shapes.
+     * Returns the full current selection.
+     */
+    private selectMany;
+    private beginMarquee;
+    private updateMarquee;
+    private cancelMarquee;
+    /**
+     * Pointer-up: hit-test the marquee world-rect against the in-memory seat
+     * centres (NOT the Konva hit-graph — that's a cached bitmap when zoomed and
+     * far slower), keep only SELECTABLE seats, union them into the selection and
+     * fire `onMarquee`. A near-zero drag reads as a click: clear the selection.
+     */
+    private finishMarquee;
     flashSeat(seatId: string, color?: string): void;
     private onKeyDown;
     /** Nearest seat from `fromId` in a cardinal direction (aligned + close wins). */

package/dist/index.d.ts

@@ -383,6 +383,13 @@ interface RendererCallbacks {
     onDeckTap?: (floorId: string) => void;
     /** Fired after any pan/zoom/resize settles — re-anchor screen-space overlays. */
     onViewChange?: () => void;
+    /**
+     * Organizer manage-mode only (`manageMode` + `marqueeSelect`): fired on
+     * pointer-UP after a rubber-band marquee drag, or a ⌘A/Escape bulk shortcut,
+     * with the FULL current selection (selectable seats only). The host toolbar
+     * reads this to drive bulk block/unblock. Never fires when manageMode is off.
+     */
+    onMarquee?: (seats: ExpandedSeat[]) => void;
 }
 /** Far-zoom level-of-detail rung: whole zones → section blocks → individual seats. */
 type LodRung = 'zones' | 'sections' | 'seats';
@@ -402,6 +409,21 @@ interface RendererOptions extends RendererCallbacks {
     /** ISO 4217 currency for on-map prices ("FROM …"); defaults to money.DEFAULT_CURRENCY.
      *  Locale for grouping/symbol placement comes from the active i18n locale. */
     currency?: string;
+    /**
+     * Organizer manage surface (SDK SeatManager). Opt-in — enables the manage-mode
+     * gestures (marquee, ⌘A/Escape) and the bulk-selection helpers. Buyer pan /
+     * pinch / tap and every existing code path are byte-identical when this is
+     * false (every manage branch is gated on it). Default false.
+     */
+    manageMode?: boolean;
+    /**
+     * When `manageMode` is on, a mouse/pen primary-button drag at the seats rung
+     * draws a rubber-band marquee that bulk-selects the seats it covers (emitting
+     * `onMarquee` on pointer-up) instead of panning. Touch keeps single-finger
+     * pan (pinch to zoom); a middle-button drag pans with a mouse. Disabled below
+     * the seats rung (zoom in first). No effect unless `manageMode` is also set.
+     */
+    marqueeSelect?: boolean;
 }
 interface ISeatmapRenderer {
     /** Replace the chart. Resets selection and statuses, zooms to fit.
@@ -426,6 +448,17 @@ interface ISeatmapRenderer {
     getStatus(seatId: string): SeatStatus;
     getSelection(): ExpandedSeat[];
     clearSelection(): void;
+    /**
+     * Manage-mode bulk selection helpers (no-op / empty unless `manageMode`).
+     * They select the matching SELECTABLE seats (respecting `selectableStatuses`
+     * + closed sections), union with the current selection, and return the seats
+     * they added — the SDK SeatManager expands category/row/section picks to
+     * labels and drives one batched block/unblock from them.
+     */
+    selectAllSelectable?(): ExpandedSeat[];
+    selectByLabels?(labels: string[]): ExpandedSeat[];
+    /** Selectable seats belonging to a section OR zone id (no selection side-effect). */
+    getSelectableInSection?(sectionId: string): ExpandedSeat[];
     /** Programmatic deselect of specific seats (e.g. chip × in the cart). */
     deselect(seatIds: string[]): void;
     /**
@@ -806,6 +839,13 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     private panLast;
     /** Cumulative gesture movement in px — clicks are suppressed after a real pan/pinch. */
     private moved;
+    /**
+     * Manage-mode rubber-band marquee (option-gated). `start`/`cur` are WORLD-space
+     * points (overlayLayer rides the stage transform); `rect` is the on-canvas
+     * selection band. Null except during an active manage-mode drag.
+     */
+    private marquee;
+    private marqueeCur;
     constructor(container: HTMLDivElement, options?: RendererOptions);
     setChart(doc: ChartDoc, opts?: {
         floorId?: string;
@@ -830,6 +870,30 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     getSelection(): ExpandedSeat[];
     clearSelection(): void;
     deselect(seatIds: string[]): void;
+    /** Select every selectable seat on the chart (⌘A). Returns the added seats. */
+    selectAllSelectable(): ExpandedSeat[];
+    /** Select the selectable seats matching these public labels (category/row/
+     *  section bulk resolves to labels host-side). Returns the newly added seats. */
+    selectByLabels(labels: string[]): ExpandedSeat[];
+    /** Selectable seats in a section OR zone id — pure read (no selection change). */
+    getSelectableInSection(sectionId: string): ExpandedSeat[];
+    /**
+     * Union `ids` into the selection in one batched pass. Beyond MARQUEE_RING_CAP
+     * total selected we skip the per-seat ring nodes (fill paint still marks the
+     * seats) so a whole-arena select doesn't spawn thousands of Konva shapes.
+     * Returns the full current selection.
+     */
+    private selectMany;
+    private beginMarquee;
+    private updateMarquee;
+    private cancelMarquee;
+    /**
+     * Pointer-up: hit-test the marquee world-rect against the in-memory seat
+     * centres (NOT the Konva hit-graph — that's a cached bitmap when zoomed and
+     * far slower), keep only SELECTABLE seats, union them into the selection and
+     * fire `onMarquee`. A near-zero drag reads as a click: clear the selection.
+     */
+    private finishMarquee;
     flashSeat(seatId: string, color?: string): void;
     private onKeyDown;
     /** Nearest seat from `fromId` in a cardinal direction (aligned + close wins). */

package/dist/index.js

@@ -637,6 +637,7 @@ var SECTION_PROMINENT_SCALE = 0.45 * SEAT_LEGIBLE_SCALE;
 var BLOCK_MELT_TOP = 0.9 * SEAT_LEGIBLE_SCALE;
 var ZONE_PROMINENT_SCALE = 0.55 * SECTION_PROMINENT_SCALE;
 var MAX_LABELS = 700;
+var MARQUEE_RING_CAP = 2500;
 var ISO_ANGLE_DEG = -11.5;
 var ISO_SQUASH = 0.58;
 var LIFT_PER_STEP = 58;
@@ -863,8 +864,28 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.panLast = null;
     /** Cumulative gesture movement in px — clicks are suppressed after a real pan/pinch. */
     this.moved = 0;
+    /**
+     * Manage-mode rubber-band marquee (option-gated). `start`/`cur` are WORLD-space
+     * points (overlayLayer rides the stage transform); `rect` is the on-canvas
+     * selection band. Null except during an active manage-mode drag.
+     */
+    this.marquee = null;
+    this.marqueeCur = null;
     // ---- keyboard navigation (accessibility) ----------------------------------
     this.onKeyDown = (e) => {
+      if (this.opts.manageMode) {
+        if ((e.metaKey || e.ctrlKey) && (e.key === "a" || e.key === "A")) {
+          e.preventDefault();
+          this.opts.onMarquee?.(this.selectAllSelectable());
+          return;
+        }
+        if (e.key === "Escape" && this.selection.size) {
+          e.preventDefault();
+          this.clearSelection();
+          this.opts.onMarquee?.([]);
+          return;
+        }
+      }
       const dir = e.key === "ArrowLeft" ? { x: -1, y: 0 } : e.key === "ArrowRight" ? { x: 1, y: 0 } : e.key === "ArrowUp" ? { x: 0, y: -1 } : e.key === "ArrowDown" ? { x: 0, y: 1 } : null;
       if (dir) {
         e.preventDefault();
@@ -887,9 +908,15 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       this.pointers.set(e.pointerId, this.toLocal(e));
       if (this.pointers.size === 1) {
         this.moved = 0;
-        this.panLast = this.toLocal(e);
         this.pinch = null;
+        if (this.opts.manageMode && this.opts.marqueeSelect && e.pointerType !== "touch" && e.button === 0 && this.getRung() === "seats") {
+          this.beginMarquee(this.toLocal(e));
+          this.panLast = null;
+        } else {
+          this.panLast = this.toLocal(e);
+        }
       } else if (this.pointers.size === 2) {
+        if (this.marquee) this.cancelMarquee();
         const [a, b] = [...this.pointers.values()];
         const mid = { x: (a.x + b.x) / 2, y: (a.y + b.y) / 2 };
         const s = this.stage.scaleX();
@@ -908,6 +935,10 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       const prev = this.pointers.get(e.pointerId);
       this.moved += Math.hypot(p.x - prev.x, p.y - prev.y);
       this.pointers.set(e.pointerId, p);
+      if (this.marquee) {
+        this.updateMarquee(p);
+        return;
+      }
       if (this.pinch && this.pointers.size >= 2) {
         const [a, b] = [...this.pointers.values()];
         const dist = Math.hypot(b.x - a.x, b.y - a.y);
@@ -933,6 +964,12 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       }
     };
     this.onPointerEnd = (e) => {
+      if (this.marquee) {
+        this.finishMarquee();
+        this.pointers.delete(e.pointerId);
+        if (this.pointers.size === 0) this.panLast = null;
+        return;
+      }
       this.pointers.delete(e.pointerId);
       if (this.pointers.size < 2) this.pinch = null;
       if (this.pointers.size === 1) {
@@ -1168,6 +1205,144 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     }
     if (changed) this.overlayLayer.batchDraw();
   }
+  // ---- manage-mode bulk selection (SDK SeatManager) -------------------------
+  // All option-gated: no-ops (or empty) unless `manageMode` is set, so buyer
+  // surfaces that never pass the flag can't reach any of this.
+  /** Select every selectable seat on the chart (⌘A). Returns the added seats. */
+  selectAllSelectable() {
+    if (!this.opts.manageMode) return [];
+    const ids = [];
+    for (const seat of this.seats) if (this.isSelectable(seat.id)) ids.push(seat.id);
+    return this.selectMany(ids);
+  }
+  /** Select the selectable seats matching these public labels (category/row/
+   *  section bulk resolves to labels host-side). Returns the newly added seats. */
+  selectByLabels(labels) {
+    if (!this.opts.manageMode) return [];
+    const want = new Set(labels);
+    const ids = [];
+    for (const seat of this.seats) {
+      if (want.has(seat.label) && this.isSelectable(seat.id)) ids.push(seat.id);
+    }
+    return this.selectMany(ids);
+  }
+  /** Selectable seats in a section OR zone id — pure read (no selection change). */
+  getSelectableInSection(sectionId) {
+    const out = [];
+    const seen = /* @__PURE__ */ new Set();
+    for (const sec of this.sections) {
+      if (sec.id !== sectionId && sec.zone !== sectionId) continue;
+      for (const id of sec.memberIds) {
+        if (seen.has(id)) continue;
+        seen.add(id);
+        if (!this.isSelectable(id)) continue;
+        const s = this.seatById.get(id);
+        if (s) out.push(s);
+      }
+    }
+    return out;
+  }
+  /**
+   * Union `ids` into the selection in one batched pass. Beyond MARQUEE_RING_CAP
+   * total selected we skip the per-seat ring nodes (fill paint still marks the
+   * seats) so a whole-arena select doesn't spawn thousands of Konva shapes.
+   * Returns the full current selection.
+   */
+  selectMany(ids) {
+    const fresh = ids.filter((id) => !this.selection.has(id));
+    if (!fresh.length) return this.getSelection();
+    const drawRings = this.selection.size + fresh.length <= MARQUEE_RING_CAP;
+    for (const id of fresh) {
+      if (drawRings) {
+        this.setSelected(id, true, true);
+      } else {
+        this.selection.add(id);
+        const c = this.circleById.get(id);
+        if (c) this.paintSeat(c, id);
+      }
+    }
+    if (!this.cached) this.seatLayer.batchDraw();
+    this.overlayLayer.batchDraw();
+    return this.getSelection();
+  }
+  // ---- manage-mode marquee gesture ------------------------------------------
+  beginMarquee(clientPt) {
+    const w = this.screenToWorld(clientPt);
+    const s = this.stage.scaleX() || 1;
+    const rect = new Rect({
+      x: w.x,
+      y: w.y,
+      width: 0,
+      height: 0,
+      stroke: this.effSelection,
+      strokeWidth: 1.5 / s,
+      // world units → ~constant on-screen px under the stage scale
+      dash: [5 / s, 4 / s],
+      fill: "rgba(110,123,255,0.10)",
+      listening: false,
+      perfectDrawEnabled: false,
+      shadowForStrokeEnabled: false
+    });
+    this.overlayLayer.add(rect);
+    this.marquee = { start: w, rect };
+    this.marqueeCur = w;
+    this.overlayLayer.batchDraw();
+  }
+  updateMarquee(clientPt) {
+    if (!this.marquee) return;
+    const w = this.screenToWorld(clientPt);
+    const { start, rect } = this.marquee;
+    rect.setAttrs({
+      x: Math.min(start.x, w.x),
+      y: Math.min(start.y, w.y),
+      width: Math.abs(w.x - start.x),
+      height: Math.abs(w.y - start.y)
+    });
+    this.marqueeCur = w;
+    this.overlayLayer.batchDraw();
+  }
+  cancelMarquee() {
+    if (!this.marquee) return;
+    this.marquee.rect.destroy();
+    this.marquee = null;
+    this.marqueeCur = null;
+    this.overlayLayer.batchDraw();
+  }
+  /**
+   * Pointer-up: hit-test the marquee world-rect against the in-memory seat
+   * centres (NOT the Konva hit-graph — that's a cached bitmap when zoomed and
+   * far slower), keep only SELECTABLE seats, union them into the selection and
+   * fire `onMarquee`. A near-zero drag reads as a click: clear the selection.
+   */
+  finishMarquee() {
+    const m = this.marquee;
+    this.marquee = null;
+    if (!m) return;
+    m.rect.destroy();
+    this.overlayLayer.batchDraw();
+    const cur = this.marqueeCur ?? m.start;
+    this.marqueeCur = null;
+    const x0 = Math.min(m.start.x, cur.x);
+    const x1 = Math.max(m.start.x, cur.x);
+    const y0 = Math.min(m.start.y, cur.y);
+    const y1 = Math.max(m.start.y, cur.y);
+    const s = this.stage.scaleX() || 1;
+    if ((x1 - x0) * s < 4 && (y1 - y0) * s < 4) {
+      if (this.selection.size) {
+        this.clearSelection();
+        this.opts.onMarquee?.([]);
+      }
+      return;
+    }
+    const ids = [];
+    for (const seat of this.seats) {
+      if (seat.x < x0 || seat.x > x1 || seat.y < y0 || seat.y > y1) continue;
+      if (!this.isSelectable(seat.id)) continue;
+      ids.push(seat.id);
+    }
+    this.selectMany(ids);
+    this.opts.onMarquee?.(this.getSelection());
+  }
   flashSeat(seatId, color = "#f43f5e") {
     const seat = this.seatById.get(seatId);
     if (!seat) return;