@seatlayer/core 0.15.1 → 0.16.1

package/dist/index.d.cts

@@ -362,6 +362,8 @@ type SeatStatus = 'free' | 'held' | 'booked' | 'not_for_sale';
 interface RendererCallbacks {
     onSelect?: (seat: ExpandedSeat) => void;
     onDeselect?: (seat: ExpandedSeat) => void;
+    /** Buyer tried to add a seat after the active selection cap was reached. */
+    onSelectionLimit?: (maxSelection: number) => void;
     /** seat is null when the pointer leaves any seat. */
     onHover?: (seat: ExpandedSeat | null) => void;
     /** Keyboard focus moved to a seat (arrow-key navigation) — for screen-reader announcements. */
@@ -461,6 +463,13 @@ interface ISeatmapRenderer {
     getStatus(seatId: string): SeatStatus;
     getSelection(): ExpandedSeat[];
     clearSelection(): void;
+    /** Update the buyer selection cap without rebuilding the chart or camera. */
+    setMaxSelection?(maxSelection: number): void;
+    /**
+     * Programmatically restore free seats (for example an Undo action). Added
+     * seats respect the active cap and do not reopen a confirmation popover.
+     */
+    select?(seatIds: string[]): ExpandedSeat[];
     /**
      * Dynamically update organizer-only interaction without rebuilding the
      * renderer. No buyer surface calls this; every behavior remains gated by
@@ -522,6 +531,9 @@ interface ISeatmapRenderer {
     /** Price-band filter (F4): dim free seats whose category is NOT in `keys`
      *  (null clears). The widget resolves which categories fall in the band. */
     setCategoryFilter?(keys: string[] | null): void;
+    /** Smoothly frame the currently available seats in these categories. `null`
+     *  returns to the full chart. Used after an explicit buyer price-filter action. */
+    focusCategories?(keys: string[] | null): void;
     /** Dim the seats of these section/zone ids (organizer manager: held-back inventory). */
     setDimmedSections?(ids: string[] | null): void;
     /**
@@ -587,7 +599,7 @@ interface ISeatmapRenderer {
     sectionMembers?(id: string): string[];
     /**
      * Smoothly glide (pan+zoom) the camera to frame a section (by id) or a world-
-     * space bounds rect over ~450ms easeInOutCubic. `prefers-reduced-motion` snaps.
+     * space bounds rect over a calm easeInOutCubic glide. `prefers-reduced-motion` snaps.
      * A pointer-down (grab/pan) cancels an in-flight glide. Slice 5 "glide in".
      */
     focusRegion?(target: string | {
@@ -597,6 +609,8 @@ interface ISeatmapRenderer {
         height: number;
     }, opts?: {
         animate?: boolean;
+        minScale?: number;
+        durationMs?: number;
     }): void;
     /** Current LOD rung derived from zoom (for the ZONES/SECTIONS/SEATS pill). */
     getRung?(): LodRung;
@@ -908,6 +922,8 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     getStatus(seatId: string): SeatStatus;
     getSelection(): ExpandedSeat[];
     clearSelection(): void;
+    setMaxSelection(maxSelection: number): void;
+    select(seatIds: string[]): ExpandedSeat[];
     /** Switch organizer interaction in place so the host preserves camera, LOD,
      * focus and live status state while moving between Monitor and Block. */
     setManageInteraction(options: {
@@ -970,6 +986,9 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
      * widget resolves which categories fall inside the buyer's chosen band.
      */
     setCategoryFilter(keys: string[] | null): void;
+    /** Frame the currently available inventory that survived a buyer price
+     *  filter. Clearing the filter glides back to the full venue. */
+    focusCategories(keys: string[] | null): void;
     /**
      * Switch the projection between flat top-down and the isometric "3D" view
      * (rotate + y-squash about the chart centre, plus per-elevation lift). Tweens
@@ -1214,7 +1233,7 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     private zoomToBounds;
     /**
      * Smoothly glide the camera to frame a section (by id) or a world-space bounds
-     * rect — the Slice 5 "glide in". Pan+zoom tween over ~450ms easeInOutCubic; the
+     * rect — the Slice 5 "glide in". Pan+zoom tween over a calm easeInOutCubic; the
      * melt/LOD rides the camera every frame. `prefers-reduced-motion` (or
      * `opts.animate === false`) snaps via zoomToBounds. A grab (pointer-down) or a
      * newer glide cancels an in-flight one.
@@ -1227,6 +1246,7 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     }, opts?: {
         animate?: boolean;
         minScale?: number;
+        durationMs?: number;
     }): void;
     /** Cancel an in-flight camera glide (a grab or a newer glide interrupts it). */
     private cancelGlide;
@@ -1453,7 +1473,7 @@ declare class PickerController {
     private readonly opts;
     private readonly api;
     private readonly key;
-    private readonly maxSelection;
+    private maxSelection;
     private renderer;
     private _doc;
     /** Section/zone ids hidden from buyers this event (3.3) — seats vanish, not grey. */
@@ -1514,6 +1534,8 @@ declare class PickerController {
     seatDetails(seatId: string): SeatHoverDetails | null;
     clearSelection(): void;
     deselect(ids: string[]): void;
+    setMaxSelection(maxSelection: number): void;
+    select(ids: string[]): PickerSeat[];
     /**
      * Hold the current selection (or a given label set). The controller does the
      * renderer/hold side (409 → deselect + repaint the taken seats held) and then
@@ -1614,6 +1636,10 @@ declare class PickerController {
     /** Price-band filter (F4): dim free seats whose category is outside `keys`
      *  (null clears). The widget resolves which categories fall in the band. */
     setCategoryFilter(keys: string[] | null): void;
+    /** An explicit buyer price-filter action should not only dim the rest of the
+     *  chart: clear any older section drill-in and guide the camera to the seats
+     *  that remain relevant. Clearing the filter glides back to the full chart. */
+    focusCategoryFilter(keys: string[] | null): void;
     /** World-space rect currently visible + full chart bounds (F3 minimap frame). */
     getViewport(): {
         visible: {

package/dist/index.d.ts

@@ -362,6 +362,8 @@ type SeatStatus = 'free' | 'held' | 'booked' | 'not_for_sale';
 interface RendererCallbacks {
     onSelect?: (seat: ExpandedSeat) => void;
     onDeselect?: (seat: ExpandedSeat) => void;
+    /** Buyer tried to add a seat after the active selection cap was reached. */
+    onSelectionLimit?: (maxSelection: number) => void;
     /** seat is null when the pointer leaves any seat. */
     onHover?: (seat: ExpandedSeat | null) => void;
     /** Keyboard focus moved to a seat (arrow-key navigation) — for screen-reader announcements. */
@@ -461,6 +463,13 @@ interface ISeatmapRenderer {
     getStatus(seatId: string): SeatStatus;
     getSelection(): ExpandedSeat[];
     clearSelection(): void;
+    /** Update the buyer selection cap without rebuilding the chart or camera. */
+    setMaxSelection?(maxSelection: number): void;
+    /**
+     * Programmatically restore free seats (for example an Undo action). Added
+     * seats respect the active cap and do not reopen a confirmation popover.
+     */
+    select?(seatIds: string[]): ExpandedSeat[];
     /**
      * Dynamically update organizer-only interaction without rebuilding the
      * renderer. No buyer surface calls this; every behavior remains gated by
@@ -522,6 +531,9 @@ interface ISeatmapRenderer {
     /** Price-band filter (F4): dim free seats whose category is NOT in `keys`
      *  (null clears). The widget resolves which categories fall in the band. */
     setCategoryFilter?(keys: string[] | null): void;
+    /** Smoothly frame the currently available seats in these categories. `null`
+     *  returns to the full chart. Used after an explicit buyer price-filter action. */
+    focusCategories?(keys: string[] | null): void;
     /** Dim the seats of these section/zone ids (organizer manager: held-back inventory). */
     setDimmedSections?(ids: string[] | null): void;
     /**
@@ -587,7 +599,7 @@ interface ISeatmapRenderer {
     sectionMembers?(id: string): string[];
     /**
      * Smoothly glide (pan+zoom) the camera to frame a section (by id) or a world-
-     * space bounds rect over ~450ms easeInOutCubic. `prefers-reduced-motion` snaps.
+     * space bounds rect over a calm easeInOutCubic glide. `prefers-reduced-motion` snaps.
      * A pointer-down (grab/pan) cancels an in-flight glide. Slice 5 "glide in".
      */
     focusRegion?(target: string | {
@@ -597,6 +609,8 @@ interface ISeatmapRenderer {
         height: number;
     }, opts?: {
         animate?: boolean;
+        minScale?: number;
+        durationMs?: number;
     }): void;
     /** Current LOD rung derived from zoom (for the ZONES/SECTIONS/SEATS pill). */
     getRung?(): LodRung;
@@ -908,6 +922,8 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     getStatus(seatId: string): SeatStatus;
     getSelection(): ExpandedSeat[];
     clearSelection(): void;
+    setMaxSelection(maxSelection: number): void;
+    select(seatIds: string[]): ExpandedSeat[];
     /** Switch organizer interaction in place so the host preserves camera, LOD,
      * focus and live status state while moving between Monitor and Block. */
     setManageInteraction(options: {
@@ -970,6 +986,9 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
      * widget resolves which categories fall inside the buyer's chosen band.
      */
     setCategoryFilter(keys: string[] | null): void;
+    /** Frame the currently available inventory that survived a buyer price
+     *  filter. Clearing the filter glides back to the full venue. */
+    focusCategories(keys: string[] | null): void;
     /**
      * Switch the projection between flat top-down and the isometric "3D" view
      * (rotate + y-squash about the chart centre, plus per-elevation lift). Tweens
@@ -1214,7 +1233,7 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     private zoomToBounds;
     /**
      * Smoothly glide the camera to frame a section (by id) or a world-space bounds
-     * rect — the Slice 5 "glide in". Pan+zoom tween over ~450ms easeInOutCubic; the
+     * rect — the Slice 5 "glide in". Pan+zoom tween over a calm easeInOutCubic; the
      * melt/LOD rides the camera every frame. `prefers-reduced-motion` (or
      * `opts.animate === false`) snaps via zoomToBounds. A grab (pointer-down) or a
      * newer glide cancels an in-flight one.
@@ -1227,6 +1246,7 @@ declare class SeatmapRenderer implements ISeatmapRenderer {
     }, opts?: {
         animate?: boolean;
         minScale?: number;
+        durationMs?: number;
     }): void;
     /** Cancel an in-flight camera glide (a grab or a newer glide interrupts it). */
     private cancelGlide;
@@ -1453,7 +1473,7 @@ declare class PickerController {
     private readonly opts;
     private readonly api;
     private readonly key;
-    private readonly maxSelection;
+    private maxSelection;
     private renderer;
     private _doc;
     /** Section/zone ids hidden from buyers this event (3.3) — seats vanish, not grey. */
@@ -1514,6 +1534,8 @@ declare class PickerController {
     seatDetails(seatId: string): SeatHoverDetails | null;
     clearSelection(): void;
     deselect(ids: string[]): void;
+    setMaxSelection(maxSelection: number): void;
+    select(ids: string[]): PickerSeat[];
     /**
      * Hold the current selection (or a given label set). The controller does the
      * renderer/hold side (409 → deselect + repaint the taken seats held) and then
@@ -1614,6 +1636,10 @@ declare class PickerController {
     /** Price-band filter (F4): dim free seats whose category is outside `keys`
      *  (null clears). The widget resolves which categories fall in the band. */
     setCategoryFilter(keys: string[] | null): void;
+    /** An explicit buyer price-filter action should not only dim the rest of the
+     *  chart: clear any older section drill-in and guide the camera to the seats
+     *  that remain relevant. Clearing the filter glides back to the full chart. */
+    focusCategoryFilter(keys: string[] | null): void;
     /** World-space rect currently visible + full chart bounds (F3 minimap frame). */
     getViewport(): {
         visible: {

package/dist/index.js

@@ -644,6 +644,7 @@ var ISO_ANGLE_DEG = -11.5;
 var ISO_SQUASH = 0.58;
 var LIFT_PER_STEP = 58;
 var ISO_TWEEN_MS = 320;
+var CAMERA_GLIDE_MS = 650;
 var BLOCK_FILL_ALPHA = 0.85;
 var SOLD_DARKEN = 0.5;
 var SECTION_LABEL_PX = 20;
@@ -1270,6 +1271,24 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     for (const id of ids) this.setSelected(id, false, true);
     this.overlayLayer.batchDraw();
   }
+  setMaxSelection(maxSelection) {
+    this.opts.maxSelection = Math.max(0, Math.floor(maxSelection));
+  }
+  select(seatIds) {
+    const added = [];
+    for (const id of seatIds) {
+      if (this.selection.has(id) || !this.isSelectable(id)) continue;
+      if (this.selection.size >= this.opts.maxSelection) {
+        this.opts.onSelectionLimit?.(this.opts.maxSelection);
+        break;
+      }
+      this.setSelected(id, true, true);
+      const seat = this.seatById.get(id);
+      if (seat) added.push(seat);
+    }
+    if (added.length) this.overlayLayer.batchDraw();
+    return added;
+  }
   /** Switch organizer interaction in place so the host preserves camera, LOD,
    * focus and live status state while moving between Monitor and Block. */
   setManageInteraction(options) {
@@ -1598,6 +1617,40 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       this.seatLayer.batchDraw();
     }
   }
+  /** Frame the currently available inventory that survived a buyer price
+   *  filter. Clearing the filter glides back to the full venue. */
+  focusCategories(keys) {
+    if (!keys?.length) {
+      this.focusRegion(this.bounds, { durationMs: CAMERA_GLIDE_MS });
+      return;
+    }
+    const wanted = new Set(keys);
+    const matching = this.seats.filter((seat) => {
+      if (!wanted.has(seat.categoryKey) || this.seatInClosedSection(seat.id)) return false;
+      const status = this.statusById.get(seat.id) ?? "free";
+      return status === "free" || this.ownedHold.has(seat.id);
+    });
+    if (!matching.length) return;
+    let minX = Infinity;
+    let maxX = -Infinity;
+    let minY = Infinity;
+    let maxY = -Infinity;
+    for (const seat of matching) {
+      minX = Math.min(minX, seat.x);
+      maxX = Math.max(maxX, seat.x);
+      minY = Math.min(minY, seat.y);
+      maxY = Math.max(maxY, seat.y);
+    }
+    const pad = Math.max(24, this.seatR * 3);
+    minX -= pad;
+    maxX += pad;
+    minY -= pad;
+    maxY += pad;
+    this.focusRegion(
+      { x: minX, y: minY, width: Math.max(40, maxX - minX), height: Math.max(40, maxY - minY) },
+      { durationMs: CAMERA_GLIDE_MS }
+    );
+  }
   // ---- isometric ("3D") view mode -------------------------------------------
   /**
    * Switch the projection between flat top-down and the isometric "3D" view
@@ -2786,7 +2839,10 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       if (seat) this.opts.onDeselect?.(seat);
     } else {
       if (!this.isSelectable(id)) return;
-      if (this.selection.size >= this.opts.maxSelection) return;
+      if (this.selection.size >= this.opts.maxSelection) {
+        this.opts.onSelectionLimit?.(this.opts.maxSelection);
+        return;
+      }
       this.setSelected(id, true);
       const seat = this.seatById.get(id);
       if (seat) this.opts.onSelect?.(seat);
@@ -3124,7 +3180,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   }
   /**
    * Smoothly glide the camera to frame a section (by id) or a world-space bounds
-   * rect — the Slice 5 "glide in". Pan+zoom tween over ~450ms easeInOutCubic; the
+   * rect — the Slice 5 "glide in". Pan+zoom tween over a calm easeInOutCubic; the
    * melt/LOD rides the camera every frame. `prefers-reduced-motion` (or
    * `opts.animate === false`) snaps via zoomToBounds. A grab (pointer-down) or a
    * newer glide cancels an in-flight one.
@@ -3156,13 +3212,13 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       return;
     }
     const start = performance.now();
-    const DUR = 450;
+    const duration = Math.max(180, Math.min(1200, opts?.durationMs ?? CAMERA_GLIDE_MS));
     const step = (now) => {
       if (this.destroyed) {
         this.glideRaf = 0;
         return;
       }
-      const raw = Math.min(1, (now - start) / DUR);
+      const raw = Math.min(1, (now - start) / duration);
       const e = raw < 0.5 ? 4 * raw * raw * raw : 1 - Math.pow(-2 * raw + 2, 3) / 2;
       const sc = fromScale + (toScale - fromScale) * e;
       this.stage.scale({ x: sc, y: sc });
@@ -3287,15 +3343,49 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       if (seat.kind === "booth") continue;
       if (seat.x < x0 || seat.x > x1 || seat.y < y0 || seat.y > y1) continue;
       const status = this.statusById.get(seat.id) ?? "free";
-      const statusCue = status === "booked" ? "\xD7" : status === "held" && !this.ownedHold.has(seat.id) ? "H" : null;
+      const unavailable = status === "booked" || status === "held" && !this.ownedHold.has(seat.id);
+      if (unavailable) {
+        const cue = new Group({ x: seat.x, y: seat.y, listening: false });
+        if (status === "held") {
+          cue.add(new Rect({
+            x: -4.2,
+            y: -0.7,
+            width: 8.4,
+            height: 6.5,
+            cornerRadius: 1.3,
+            stroke: "#ffffff",
+            strokeWidth: 1.25,
+            listening: false
+          }));
+          cue.add(new Line({
+            points: [-2.4, -0.8, -2.4, -2.7, -1.2, -4, 0, -4.35, 1.2, -4, 2.4, -2.7, 2.4, -0.8],
+            stroke: "#ffffff",
+            strokeWidth: 1.2,
+            lineCap: "round",
+            lineJoin: "round",
+            listening: false
+          }));
+        } else {
+          cue.add(new Line({
+            points: [-4.2, 4.2, 4.2, -4.2],
+            stroke: "#ffffff",
+            strokeWidth: 1.8,
+            lineCap: "round",
+            listening: false
+          }));
+        }
+        this.labelGroup.add(cue);
+        if (++count >= MAX_LABELS) break;
+        continue;
+      }
       const t2 = new Text({
         x: seat.x,
         y: seat.y,
-        text: statusCue ?? seat.label,
-        fontSize: statusCue ? status === "booked" ? 13 : 8 : 7,
-        fontStyle: statusCue ? "800" : "600",
+        text: seat.label,
+        fontSize: 7,
+        fontStyle: "600",
         fontFamily: this.labelFont(),
-        fill: statusCue ? "#ffffff" : this.theme.seatLabelColor ?? DEF_SEAT_LABEL,
+        fill: this.theme.seatLabelColor ?? DEF_SEAT_LABEL,
         listening: false,
         perfectDrawEnabled: false
       });
@@ -3519,6 +3609,7 @@ var PickerController = class {
         this.opts.onDeselect?.(seat);
         this.emitSelectionChange();
       },
+      onSelectionLimit: this.opts.onSelectionLimit,
       onHover: (seat) => {
         this.opts.onHover?.(seat);
         if (this.opts.onSeatHover) this.opts.onSeatHover(seat ? this.describeSeat(seat) : null);
@@ -3586,6 +3677,15 @@ var PickerController = class {
     this.renderer?.deselect(ids);
     this.emitSelectionChange();
   }
+  setMaxSelection(maxSelection) {
+    this.maxSelection = Math.max(0, Math.floor(maxSelection));
+    this.renderer?.setMaxSelection?.(this.maxSelection);
+  }
+  select(ids) {
+    const added = this.renderer?.select?.(ids) ?? [];
+    if (added.length) this.emitSelectionChange();
+    return added.map((seat) => this.toSeat(seat));
+  }
   // ---- booking machine ------------------------------------------------------
   /**
    * Hold the current selection (or a given label set). The controller does the
@@ -3952,6 +4052,17 @@ var PickerController = class {
   setCategoryFilter(keys) {
     this.renderer?.setCategoryFilter?.(keys);
   }
+  /** An explicit buyer price-filter action should not only dim the rest of the
+   *  chart: clear any older section drill-in and guide the camera to the seats
+   *  that remain relevant. Clearing the filter glides back to the full chart. */
+  focusCategoryFilter(keys) {
+    const renderer = this.renderer;
+    if (!renderer) return;
+    renderer.clearSectionFocus?.();
+    this.opts.onSectionFocus?.(null);
+    if (renderer.focusCategories) renderer.focusCategories(keys);
+    else renderer.zoomToFit();
+  }
   /** World-space rect currently visible + full chart bounds (F3 minimap frame). */
   getViewport() {
     const r = this.renderer;