@seatlayer/js 0.18.0 → 0.19.0

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { PickerSeat, SeatHoverDetails, ChartDoc, ChartTheme, ExpandedSeat } from '@seatlayer/core';
+import { PickerSeat, SeatHoverDetails, PickerTransport, ChartDoc, AvailabilityRule, ChartTheme, ExpandedSeat } from '@seatlayer/core';
 export { ExpandedSeat, SeatHoverDetails } from '@seatlayer/core';
 
 /**
@@ -254,6 +254,12 @@ interface EmbeddedDesignerOptions {
      * Only used when `showLoadingState` is enabled.
      */
     loadingTimeoutMs?: number;
+    /**
+     * Auto-grow the iframe to the height the Designer reports over the resize
+     * protocol (`seatlayer.designer.resize`). Defaults to `true`. Set `false` when
+     * the host sizes the iframe itself (e.g. a fixed-height chrome).
+     */
+    autoResize?: boolean;
     /**
      * Called when the user presses "Try again" on the error card. Use it to mint a
      * fresh Designer session and call `setDesignerUrl()` with the new URL, which
@@ -276,6 +282,13 @@ declare class EmbeddedDesigner {
     private timeoutTimer;
     private phase;
     private restoreContainerPosition;
+    private pinned;
+    private frameStyleBeforeFs;
+    private docOverflowBeforeFs;
+    private bodyOverflowBeforeFs;
+    private fsKeyHandler;
+    /** Latest height (px string) the Designer reported; re-applied after unpin. */
+    private lastAutoHeight;
     constructor(options: EmbeddedDesignerOptions);
     mount(): HTMLIFrameElement;
     /** Replace the iframe instead of assigning a new fragment to an existing one. */
@@ -283,6 +296,15 @@ declare class EmbeddedDesigner {
     getIframe(): HTMLIFrameElement | null;
     destroy(): void;
     private loadingStateEnabled;
+    private autoResizeEnabled;
+    /**
+     * Pin the iframe over the host page as a viewport-filling overlay. We save the
+     * iframe's inline style and the document scroll state so `unpinFullscreen`
+     * restores everything exactly. Escape (host-side) also exits.
+     */
+    private pinFullscreen;
+    /** Undo `pinFullscreen`: restore the iframe style + scroll lock. Idempotent. */
+    private unpinFullscreen;
     private clearTimeoutTimer;
     private ensureContainerPositioned;
     private restoreContainerStyle;
@@ -354,6 +376,16 @@ interface CheckoutHandoff {
     /** Convenience total in major units (Σ unitPrice × quantity). */
     total: number;
 }
+/** Host-authoritative pricing — see {@link SeatPickerOptions.pricing}. */
+interface SeatPickerPricing {
+    /** Unit prices by category key: a flat number, or `{ base, tiers: { tierId: price } }`. */
+    prices?: Record<string, number | {
+        base?: number;
+        tiers?: Record<string, number>;
+    }>;
+    /** Custom money renderer (e.g. `(n) => n + '€'`). Defaults to Intl currency formatting. */
+    formatter?: (amount: number, currency: string) => string;
+}
 /** Host theme overrides — any subset; unset keys fall back to the org's chart theme, then defaults. */
 interface SeatPickerTheme {
     /** Brand accent (CTA, active chips, hold pill). */
@@ -386,6 +418,12 @@ interface SeatPickerOptions {
     event: string;
     /** API origin. Defaults to https://api.seatlayer.io. */
     apiBase?: string;
+    /**
+     * Custom data transport. Defaults to the CORS-trivial PubApi against
+     * `apiBase`. Inject to run the widget against another backend adapter (the
+     * SeatLayer dashboard's own transport) or a fully local mock (demos).
+     */
+    transport?: PickerTransport;
     /** Reserved for future authenticated rendering. */
     publicKey?: string;
     /** Max seats selectable at once (default 10). */
@@ -398,8 +436,23 @@ interface SeatPickerOptions {
     currency?: string;
     /** Colorblind-safe rendering (Okabe-Ito palette, hollow booked seats). */
     colorblindSafe?: boolean;
+    /**
+     * Hide the "Powered by SeatLayer" attribution badge in the side panel foot.
+     * The chart theme's own `hideBadge` flag (paid orgs) also hides it — the badge
+     * is shown only when BOTH this option and the theme flag are unset/false.
+     */
+    hideBadge?: boolean;
     /** Host theme overrides — see SeatPickerTheme. */
     theme?: SeatPickerTheme;
+    /**
+     * Host-authoritative pricing. When your shop charges different prices than
+     * the chart's stored category prices, pass them here so the buyer sees the
+     * price they will actually pay — on the map tooltip, confirm popover, price
+     * panel, tray, totals, and in the checkout handoff's line items. Keyed by
+     * category key; per-tier overrides nest under `tiers`. Unlisted categories
+     * fall back to the chart price.
+     */
+    pricing?: SeatPickerPricing;
     /** Hold TTL in ms passed to hold(); server clamps to its own limits. */
     holdTtlMs?: number;
     /**
@@ -491,23 +544,27 @@ declare class SeatPicker {
     private confirmEl;
     private confirmSeat;
     private srEl;
-    private a11yFilter;
     private baQty;
     private baCat;
     private bestAvailableConfirm;
     private releasingHold;
+    /** Event sales window is closed (read-only load state / live close). */
+    private salesClosed;
+    /** Every seated category's live availability is 0 (sold-out overlay is up). */
+    private soldOut;
+    private soldoutEl;
+    /** Resolved colorblind-safe state — stored preference wins over the option. */
+    private cbSafe;
     private rungsEl;
     private floorsEl;
     private secCardEl;
     private viewEl;
     private viewCleanup;
     private allSeatsCache;
-    private miniEl;
     private miniCanvas;
     private miniBase;
     private miniTf;
     private priceBandKeys;
-    private priceFilterEl;
     /** Last surfaced section summary (re-rendered when the price band changes). */
     private lastSection;
     /** Section card collapsed to its slim pill (seat-picking has begun). */
@@ -526,6 +583,55 @@ declare class SeatPicker {
     private holdingLabels;
     private ctaPhase;
     private a11yChipsEl;
+    private fsFallback;
+    private fsChangeHandler;
+    private fsEscHandler;
+    /** True once we've asked the host page to pin us fullscreen (framed, no native). */
+    private framedFs;
+    /** Last height (px) posted to a host frame; dedupes redundant reports. */
+    private lastPostedHeight;
+    /**
+     * Eager sightline preview for the confirm card: a cheap generated forward
+     * view (or the organizer's real photo) plus a "Nm to stage · clear
+     * sightline" line — the premium at-a-glance moment; click opens the 360.
+     */
+    private confirmThumbHtml;
+    /** True when the picker is rendered inside an iframe (snippet embed at /e/:key). */
+    private isFramed;
+    /**
+     * Post a widget→host message when framed. targetOrigin is '*' because the
+     * payload carries nothing sensitive (a height number / a fullscreen flag);
+     * hosts verify `event.origin` on their side (see `attachPickerFrame`).
+     */
+    private postToHost;
+    /**
+     * Height (px) to advertise to a host frame.
+     *
+     * The picker fills whatever box it's given: `.sl-picker` is `height:100%;
+     * overflow:hidden`, and the /e/:key shell mounts it `position:fixed; inset:0`.
+     * So it has no intrinsic *document* height to read — `scrollHeight` just
+     * collapses to the current viewport, which for a framed embed would echo the
+     * host's own iframe height straight back (a circular value). We therefore
+     * report a width-driven *desired* height: a pleasant landscape box on desktop,
+     * taller on narrow widths where the bottom sheet needs room, clamped to the
+     * widget's `min-height` of 420. Width is host-controlled and never moves in
+     * response to the height we report, so this cannot feedback-loop.
+     */
+    private measureFramedHeight;
+    /** Post `seatlayer:height` to the host when framed and the value changed. */
+    private reportFramedHeight;
+    /** Full screen via the native API, falling back to a fixed-position overlay (iOS Safari). */
+    private toggleFullscreen;
+    /**
+     * Native element-fullscreen was unavailable or rejected. When framed, a CSS
+     * `.sl-fs` overlay can't escape the iframe, so we ask the host page to pin us
+     * (`seatlayer:fullscreen`). Otherwise (iOS Safari, same document) fall back to
+     * the `.sl-fs` overlay as before.
+     */
+    private enterFsFallback;
+    /** Toggle host-driven (framed) fullscreen: post the flag + own the Esc key. */
+    private setFramedFs;
+    private setFsFallback;
     private cbEl;
     private modalScrim;
     private prevFocus;
@@ -553,6 +659,41 @@ declare class SeatPicker {
     private buildExtendPrompt;
     /** Success overlay + onBooked fire when the held seats settle to booked. */
     private buildBookedOverlay;
+    /**
+     * Localized string with a literal fallback. `t()` returns the key itself for
+     * unknown keys, so this collapses that to `fallback` — while still honoring a
+     * host `messages` override (which makes `t()` return the override, not the key).
+     */
+    private tf;
+    /** Sold-out overlay — centered over the map, disabled waitlist stub (Gap 2). */
+    private buildSoldoutOverlay;
+    /**
+     * Recompute the sold-out state on every price/availability sync. Sold-out ⇔
+     * every SEATED category's live free count is 0. Suppressed when the chart has
+     * GA areas (GA capacity isn't per-seat, so seated counts would read 0 and
+     * falsely block standing room) — mirrors the public page. Clears live when WS
+     * frees a seat up.
+     */
+    private syncSoldout;
+    /**
+     * Pure sold-out predicate: every SEATED category's free count is 0, there is at
+     * least one seated category, and there are no GA areas (GA capacity isn't
+     * per-seat, so seated counts read 0 and would falsely block standing room).
+     * `left` is seeded implicitly — a missing key means a fully-booked tier (0 free).
+     */
+    private isSoldOut;
+    /**
+     * Sales-closed read-only state (Gap 3): persistent header pill, disabled CTA
+     * with a closed label, and frozen best-available / GA controls. `setSalesClosed`
+     * is the reactive entry (live 409 event_closed); `applySalesClosed` is the
+     * idempotent DOM apply used at load and on transition.
+     */
+    private setSalesClosed;
+    private applySalesClosed;
+    /** The badge is hidden when the host opts out OR the org's theme sets hideBadge. */
+    private badgeHidden;
+    /** Attribution badge in the side-panel foot (Gap 7). Hidden per host/theme. */
+    private buildBadge;
     /**
      * Create the positioned flex containers that own every persistent map overlay.
      * Appended once after controller.render(); each chrome piece is then appended
@@ -608,7 +749,7 @@ declare class SeatPicker {
     private drawMinimapRect;
     /** Minimap click → focus the section under the point (or overview on a miss). */
     private minimapJump;
-    /** Effective price of a category (first tier when tiered, else base price). */
+    /** Effective display price of a category: host pricing override → first tier → base. */
     private catPrice;
     /** Derive price bands: one chip per distinct price (≤5), else quantile ranges. */
     private priceBands;
@@ -659,7 +800,22 @@ declare class SeatPicker {
     private openSeatView;
     private closeSeatView;
     private money;
+    /**
+     * The price the buyer will actually pay for a category (+tier): the host's
+     * `pricing` override when present, else the chart's stored price. Every
+     * price the widget DISPLAYS or hands off must flow through here — a map
+     * that shows one price while checkout charges another destroys trust.
+     */
+    private paidPrice;
     private syncPrices;
+    /**
+     * Live-activity strip: turn WS availability deltas into one quiet line of
+     * social proof ("2 seats just taken in VIP · 118 left"). Diffs per-category
+     * counts on every status change — no per-seat payload needed. Skips the very
+     * first computation (initial load is not "activity").
+     */
+    private narrateAvailability;
+    private lastCatAvail;
     /** A live delta took one of OUR selected (not yet held) seats — evict + tell the buyer. */
     private evictTakenSelections;
     private syncTray;
@@ -686,6 +842,15 @@ declare class SeatPicker {
     private emitHoldChange;
     private toast;
     private placeTooltip;
+    /**
+     * Row label without the redundant section prefix. Charts commonly name row
+     * objects "104-A" while the Section column already shows "104" — so the Row
+     * cell repeats the section and, in the compact hover card, truncates to
+     * "10…". Strip a leading "<section><sep>" so Row reads a clean "A". Only when
+     * the prefix is exact (won't touch "1040-A" under section "104"); otherwise
+     * the label is shown verbatim.
+     */
+    private rowShort;
     private updateTooltip;
     getSelection(): PickerSeat[];
     /** Current active/restored hold reflected in the tray. */
@@ -699,6 +864,45 @@ declare class SeatPicker {
     destroy(): void;
 }
 
+/**
+ * Host-side helper for embedding the SeatLayer picker as an iframe.
+ *
+ * The picker (the /e/:key page, mounted `position:fixed; inset:0`) reports its
+ * desired height and fullscreen intent to whatever page frames it, using the
+ * picker wire contract:
+ *
+ *   • `{ type: 'seatlayer:height', px:number }`      — grow the iframe to `px`.
+ *   • `{ type: 'seatlayer:fullscreen', on:boolean }` — pin/unpin over the host.
+ *
+ * A framed picker cannot escape its own iframe with CSS, so it delegates both
+ * concerns to the host. `attachPickerFrame` wires those two behaviours onto a
+ * picker iframe and returns a detach function that tears everything back down.
+ */
+interface AttachPickerFrameOptions {
+    /**
+     * Origin to accept messages from. Defaults to the origin parsed from
+     * `iframe.src`. Messages from any other origin (or any other window) are
+     * ignored — the picker posts with `targetOrigin:'*'`, so the host is the side
+     * that must verify `event.origin`.
+     */
+    origin?: string;
+}
+/**
+ * Attach the picker resize + fullscreen protocol to a picker iframe.
+ *
+ * ```ts
+ * const iframe = document.querySelector('iframe#seatlayer')!;
+ * const detach = attachPickerFrame(iframe);
+ * // …later, when removing the embed:
+ * detach();
+ * ```
+ *
+ * @param iframe The `<iframe>` element pointing at a SeatLayer picker embed.
+ * @param opts   Optional `{ origin }` override for the accepted message origin.
+ * @returns A detach function: removes the listener and restores any pinned state.
+ */
+declare function attachPickerFrame(iframe: HTMLIFrameElement, opts?: AttachPickerFrameOptions): () => void;
+
 /**
  * Organizer manage-surface client for workers/api (the `/v1/events/:key/*`
  * inventory routes + the public realtime channel). Companion to api.ts (the
@@ -900,6 +1104,22 @@ declare class ManageApi {
         ok: true;
         holdTtlMs: number | null;
     }>;
+    /** The organizer's current per section/zone availability windows (needs
+     *  `event:view`). Ids absent from `rules` are open / on sale. */
+    availability(key: string): Promise<{
+        rules: Record<string, AvailabilityRule>;
+    }>;
+    /** Replace the availability windows for a set of section/zone ids (needs
+     *  `event:block`). Ids absent from `rules` become open / on sale; a zone rule
+     *  cascades to its sections. The worker derives each id's seat labels, so
+     *  `labels` on the sent rules is best-effort. Resolves with the authoritative
+     *  effective `hidden` set (a due rule may fire at once) and the server-cleaned
+     *  `rules` map (fired timed/threshold windows dropped). */
+    setAvailability(key: string, rules: Record<string, AvailabilityRule>): Promise<{
+        ok: true;
+        hidden: string[];
+        rules: Record<string, AvailabilityRule>;
+    }>;
     report(key: string): Promise<ReportResult>;
     controlRoom(key: string, windowMinutes?: number): Promise<ControlRoomSnapshot>;
     log(key: string, opts?: {
@@ -933,7 +1153,7 @@ declare class ManageApi {
  * {@link ManageApi}. Box office + Sections + full Reports UI are M2/M3.
  */
 
-type SeatManagerMode = 'view' | 'inspect' | 'block';
+type SeatManagerMode = 'view' | 'inspect' | 'block' | 'sections';
 /** DO seat status — 'blocked' has no engine analogue (→ 'not_for_sale'). */
 type DoStatus = 'free' | 'held' | 'booked' | 'blocked';
 /** Live KPI snapshot pushed to `onTallies` on every state change. */
@@ -1073,6 +1293,11 @@ declare class SeatManager {
     private tokenRefreshInFlight;
     private sectionByObject;
     private sectionLabelById;
+    private sectionsBase;
+    private availabilityRules;
+    private effectiveHidden;
+    private effectiveClosed;
+    private availabilitySaving;
     private lastSyncedAt;
     private blockedQuery;
     private blockedSection;
@@ -1178,6 +1403,36 @@ declare class SeatManager {
     private paintMonitorInsights;
     private applyHeatOverlay;
     private renderInspectRail;
+    /** Pull the organizer's availability rules (event:view). Called on load and on
+     *  every WS (re)connect, mirroring how the other panels re-hydrate. `closed` is
+     *  deterministic from the rules; `hidden` (which folds in already-due timed /
+     *  threshold windows) comes from the snapshot + WS effective set. */
+    private refreshAvailability;
+    /** Run a token-authed op; on a 401 re-mint via onTokenRefresh and retry once. */
+    private withAuthRetry;
+    private closedIdsFromRules;
+    /** Adopt a new effective hidden/closed set (from a snapshot or WS broadcast) and
+     *  repaint the rail + canvas when it actually moves. */
+    private updateEffectiveAvailability;
+    /** Canvas read of the availability state: dim hidden sections to a whisper,
+     *  half-light closed sections, leave open sections normal. Only in Sections mode;
+     *  cleared in every other tool. */
+    private applySectionCanvasTreatment;
+    /** Zone-grouped render tree: each zone header then its sections (which follow the
+     *  zone window), then loose sections + the ungrouped bucket. Effective hidden /
+     *  closed come from the live sets, rules from the organizer map. */
+    private buildSectionRows;
+    private renderSectionsRail;
+    private sectionRowHtml;
+    private wireSectionRail;
+    /** Change one row's availability mode. A zone rule subsumes its child section
+     *  rules, so those are dropped from the map (the zone window is the truth). */
+    private setSectionMode;
+    /** Edit a timed reveal time / threshold percent on an existing row rule. */
+    private setSectionRulePatch;
+    /** Optimistically adopt the new rules, then reconcile with the server-cleaned
+     *  map + effective hidden/closed sets. Rolls back the rules on failure. */
+    private persistAvailability;
     private paintLegend;
     private paintFeed;
     private renderBlockRail;
@@ -1199,4 +1454,4 @@ declare class SeatManager {
     private fail;
 }
 
-export { ApiError, type BestAvailableResult, type CheckoutHandoff, type CheckoutLineItem, type ControlRoomActivityEntry, type ControlRoomSectionMetric, type ControlRoomSnapshot, EmbeddedDesigner, type EmbeddedDesignerEventType, type EmbeddedDesignerMessage, type EmbeddedDesignerOptions, type GAAreaAvailability, type HoldConflict, type HoldLineItem, type HoldResult, type LogEntry, type LogPage, ManageApi, ManageApiError, type ReportByStatus, type ReportCategoryMeta, type ReportCategoryRow, type ReportResult, type ResumedHoldResult, SeatManager, type SeatManagerActionResult, type SeatManagerActivity, type SeatManagerMode, type SeatManagerOptions, type SeatManagerTallies, SeatPicker, type SeatPickerOptions, type SeatPickerTheme, SeatingChart, type SeatingChartOptions, type SelectedSeat };
+export { ApiError, type AttachPickerFrameOptions, type BestAvailableResult, type CheckoutHandoff, type CheckoutLineItem, type ControlRoomActivityEntry, type ControlRoomSectionMetric, type ControlRoomSnapshot, EmbeddedDesigner, type EmbeddedDesignerEventType, type EmbeddedDesignerMessage, type EmbeddedDesignerOptions, type GAAreaAvailability, type HoldConflict, type HoldLineItem, type HoldResult, type LogEntry, type LogPage, ManageApi, ManageApiError, type ReportByStatus, type ReportCategoryMeta, type ReportCategoryRow, type ReportResult, type ResumedHoldResult, SeatManager, type SeatManagerActionResult, type SeatManagerActivity, type SeatManagerMode, type SeatManagerOptions, type SeatManagerTallies, SeatPicker, type SeatPickerOptions, type SeatPickerTheme, SeatingChart, type SeatingChartOptions, type SelectedSeat, attachPickerFrame };