@seatlayer/vue 0.52.0 → 0.53.0

package/dist/index.cjs

@@ -46,6 +46,25 @@ var SeatingChart = (0, import_vue.defineComponent)({
     currency: { type: String, default: void 0 },
     /** Render with colorblind-safe seat glyphs. */
     colorblindSafe: { type: Boolean, default: void 0 },
+    /**
+     * Initial canvas projection. Read once when the chart is built, so
+     * changing it rebuilds.
+     * @deprecated `'isometric'` and `'perspective'` are retired in favour of
+     * the real 3D venue view; use `'flat'`.
+     */
+    initialView: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * What the BUYER sees when the chart cannot load: `'message'` (default) is
+     * a styleable notice with a Try again button, `'none'` is silent for hosts
+     * that render their own failure UI from the `error` event.
+     */
+    errorDisplay: {
+      type: String,
+      default: void 0
+    },
     /** Copy overrides, read once per mount. */
     messages: {
       type: Object,
@@ -120,69 +139,53 @@ var SeatingChart = (0, import_vue.defineComponent)({
       const onAccessExpired = (state) => emit("access-expired", state);
       const onAccessUnavailable = (state) => emit("access-unavailable", state);
       const onSelectedObjectUnavailable = (state) => emit("selected-object-unavailable", state);
-      const instance = new import_js.SeatingChart({
-        container: element,
-        event: props.event,
-        apiBase: props.apiBase,
-        maxSelection: props.maxSelection,
-        publicKey: props.publicKey,
-        locale: props.locale,
-        currency: props.currency,
-        colorblindSafe: props.colorblindSafe,
-        messages: props.messages,
-        seatTooltip: props.seatTooltip,
-        buyerAccessTokenProvider: props.buyerAccessTokenProvider,
-        buyerAccessToken: props.buyerAccessToken,
-        onAccessExpired,
-        onAccessUnavailable,
-        onSelectedObjectUnavailable,
-        onSelectionChange,
-        onHold,
-        onHoldRestored,
-        onHoldExpired,
-        onGAClick,
-        onError,
-        onDeckTap,
-        onHint,
-        onSeatHover
-      });
+      const instance = new import_js.SeatingChart((0, import_js.buildSeatingChartOptions)(
+        element,
+        {
+          event: props.event,
+          apiBase: props.apiBase,
+          maxSelection: props.maxSelection,
+          publicKey: props.publicKey,
+          locale: props.locale,
+          currency: props.currency,
+          colorblindSafe: props.colorblindSafe,
+          initialView: props.initialView,
+          errorDisplay: props.errorDisplay,
+          messages: props.messages,
+          seatTooltip: props.seatTooltip,
+          buyerAccessTokenProvider: props.buyerAccessTokenProvider,
+          buyerAccessToken: props.buyerAccessToken
+        },
+        {
+          onAccessExpired,
+          onAccessUnavailable,
+          onSelectedObjectUnavailable,
+          onSelectionChange,
+          onHold,
+          onHoldRestored,
+          onHoldExpired,
+          onGAClick,
+          onError,
+          onDeckTap,
+          onHint,
+          onSeatHover
+        }
+      ));
       chart.value = instance;
       void instance.render();
     };
     (0, import_vue.watch)(
       () => [
         container.value,
-        props.event,
-        props.apiBase,
-        props.maxSelection,
-        props.publicKey,
-        props.locale,
-        props.currency,
-        props.colorblindSafe
+        // The shared identity list, not a hand-copied one — this is exactly the
+        // place Vue fell two props behind React.
+        ...import_js.SEATING_CHART_IDENTITY_PROPS.map((prop) => props[prop])
       ],
       build,
       { immediate: true, flush: "post" }
     );
     (0, import_vue.onBeforeUnmount)(destroy);
-    const exposed = {
-      hold: (options) => chart.value?.hold(options) ?? Promise.resolve(null),
-      resumeHold: (holdId) => chart.value?.resumeHold(holdId) ?? Promise.resolve(null),
-      getCurrentHold: () => chart.value?.getCurrentHold() ?? null,
-      getGAAreas: () => chart.value?.getGAAreas() ?? [],
-      holdGA: (areaId, qty, options) => chart.value?.holdGA(areaId, qty, options) ?? Promise.resolve(null),
-      bestAvailable: (qty, categoryKey) => chart.value?.bestAvailable(qty, categoryKey) ?? Promise.resolve(null),
-      release: () => chart.value?.release() ?? Promise.resolve(),
-      releaseLabels: (labels) => chart.value?.releaseLabels(labels) ?? Promise.resolve(false),
-      getSelection: () => chart.value?.getSelection() ?? [],
-      setSeatTier: (seatId, tierId) => chart.value?.setSeatTier(seatId, tierId),
-      getFloors: () => chart.value?.getFloors() ?? [],
-      setFloor: (floorId) => chart.value?.setFloor(floorId),
-      setColorblindSafe: (on) => chart.value?.setColorblindSafe(on),
-      zoomIn: () => chart.value?.zoomIn(),
-      zoomOut: () => chart.value?.zoomOut(),
-      zoomToFit: () => chart.value?.zoomToFit(),
-      refreshAccess: () => chart.value?.refreshAccess() ?? Promise.resolve(false)
-    };
+    const exposed = (0, import_js.bindSeatingChartHandle)(() => chart.value);
     expose(exposed);
     return () => (0, import_vue.h)("div", { ref: container });
   }

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/SeatingChart.ts"],"sourcesContent":["/**\n * @seatlayer/vue — the Vue 3 wrapper for the SeatLayer embed SDK.\n *\n * Components are written as render functions rather than SFCs, so installing\n * this package needs no Vue compiler plugin.\n */\nexport { SeatingChart } from './SeatingChart';\nexport type { SeatingChartExposed } from './SeatingChart';\n\nexport type {\n  SelectedSeat,\n  HoldResult,\n  BestAvailableResult,\n  GAAreaAvailability,\n  HoldLineItem,\n  SeatHoverDetails,\n} from '@seatlayer/js';\n\n// Sales Channels — buyer access sessions for private channel inventory.\nexport type {\n  BuyerAccessToken,\n  BuyerAccessTokenProvider,\n  BuyerAccessRefreshReason,\n  BuyerAccessUnavailableReason,\n  BuyerAccessExpiredEvent,\n  BuyerAccessUnavailableEvent,\n  SelectedObjectUnavailableEvent,\n} from '@seatlayer/js';\n\n// The framework-agnostic widget class — for the one-call modal (SeatPickerWidget.open()).\nexport { SeatPicker as SeatPickerWidget } from '@seatlayer/js';\n\n// Host-side embed helper: grows the iframe on `seatlayer:height` and pins it on\n// `seatlayer:fullscreen`. Vue hosts depend on this package alone, so it has to be\n// reachable here rather than only from @seatlayer/js.\nexport { attachPickerFrame } from '@seatlayer/js';\nexport type { AttachPickerFrameOptions } from '@seatlayer/js';\n","import {\n  defineComponent,\n  h,\n  onBeforeUnmount,\n  ref,\n  shallowRef,\n  watch,\n  type PropType,\n  type Ref,\n} from 'vue';\nimport {\n  SeatingChart as CoreSeatingChart,\n  type SeatingChartOptions,\n  type SelectedSeat,\n  type HoldResult,\n  type BestAvailableResult,\n  type GAAreaAvailability,\n  type SeatHoverDetails,\n  type BuyerAccessToken,\n  type BuyerAccessTokenProvider,\n  type BuyerAccessExpiredEvent,\n  type BuyerAccessUnavailableEvent,\n  type SelectedObjectUnavailableEvent,\n} from '@seatlayer/js';\n\n/**\n * What `ref=\"chart\"` gives you — call these to drive the picker from your app.\n *\n * Vue exposes these through `defineExpose`, so a template ref is typed as this\n * rather than as the raw component instance.\n */\nexport interface SeatingChartExposed {\n  /** Hold the current selection. Resolves the hold, or `null` on a 409 conflict. */\n  hold(options?: { ttlMs?: number }): Promise<HoldResult | null>;\n  /** Restore an active hold by its opaque id. */\n  resumeHold(holdId: string): Promise<HoldResult | null>;\n  /** Current active hold known to the chart. */\n  getCurrentHold(): HoldResult | null;\n  /** GA areas with live remaining capacity. */\n  getGAAreas(): GAAreaAvailability[];\n  /** Atomically hold a quantity from one GA area. */\n  holdGA(areaId: string, qty: number, options?: { tierId?: string | null; ttlMs?: number }): Promise<HoldResult | null>;\n  /** Ask the server for the `qty` best free seats and hold them atomically. */\n  bestAvailable(qty: number, categoryKey?: string): Promise<BestAvailableResult | null>;\n  /** Release the current hold (if any). */\n  release(): Promise<void>;\n  /** Release some held labels while keeping the remainder active. */\n  releaseLabels(labels: string[]): Promise<boolean>;\n  /** The current selection, with prices resolved from the chart categories. */\n  getSelection(): SelectedSeat[];\n  /** Choose a ticket tier for a selected seat; `null` reverts to the default. */\n  setSeatTier(seatId: string, tierId: string | null): void;\n  /** Floors of a multi-floor chart. Empty before the first render. */\n  getFloors(): { id: string; name: string }[];\n  /** Switch the shown floor (2D). No-ops on single-floor charts. */\n  setFloor(floorId: string): void;\n  /** Toggle colorblind-safe rendering at runtime. */\n  setColorblindSafe(on: boolean): void;\n  /** Zoom in one step (same increment as the wheel/pinch gesture). */\n  zoomIn(): void;\n  /** Zoom out one step. */\n  zoomOut(): void;\n  /** Reset the camera so the whole chart fits the container. */\n  zoomToFit(): void;\n  /**\n   * Re-acquire the buyer access session after your app re-authorizes the buyer\n   * (Sales Channels). Resolves false when the chart is not access-scoped.\n   */\n  refreshAccess(): Promise<boolean>;\n}\n\n/**\n * Vue 3 wrapper around the framework-agnostic `@seatlayer/js` SDK.\n *\n * The canvas is created once and torn down on unmount. Only the props that\n * change the chart's identity — `event`, `apiBase`, `maxSelection`, `publicKey`,\n * `locale`, `currency`, `colorblindSafe` — trigger a rebuild; everything else is\n * read live, so a parent re-render never destroys the canvas mid-selection.\n *\n * Written as a render function rather than an SFC so the package builds with\n * plain TypeScript — a consumer needs no Vue compiler plugin to install it.\n *\n * @example\n * ```vue\n * <script setup lang=\"ts\">\n * import { ref } from 'vue';\n * import { SeatingChart, type SeatingChartExposed } from '@seatlayer/vue';\n *\n * const chart = ref<SeatingChartExposed | null>(null);\n * const checkout = async () => {\n *   const held = await chart.value?.hold();\n *   if (held) await pay(held.holdId);\n * };\n * </script>\n *\n * <template>\n *   <SeatingChart ref=\"chart\" event=\"summer-gala\" @selection-change=\"onChange\" />\n * </template>\n * ```\n */\nexport const SeatingChart = defineComponent({\n  name: 'SeatLayerSeatingChart',\n\n  props: {\n    /** Event key to render. Changing it rebuilds the chart. */\n    event: { type: String, required: true },\n    /** API base URL. Defaults to the public API. */\n    apiBase: { type: String, default: undefined },\n    /** Cap on how many seats a buyer may select. */\n    maxSelection: { type: Number, default: undefined },\n    /** Publishable key, when your integration uses one. */\n    publicKey: { type: String, default: undefined },\n    /** BCP-47 locale for built-in copy. */\n    locale: { type: String, default: undefined },\n    /** ISO currency for price formatting. */\n    currency: { type: String, default: undefined },\n    /** Render with colorblind-safe seat glyphs. */\n    colorblindSafe: { type: Boolean, default: undefined },\n    /** Copy overrides, read once per mount. */\n    messages: {\n      type: Object as PropType<SeatingChartOptions['messages']>,\n      default: undefined,\n    },\n    /**\n     * Show the built-in seat tooltip. Set false to draw your own popover from\n     * the `seat-hover` event.\n     */\n    seatTooltip: { type: Boolean, default: undefined },\n    /**\n     * Sales Channels: mint a buyer access session on demand. Called with a\n     * `reason`; returns `{ token, expiresAt }` from YOUR backend. The token is\n     * held in memory only — never storage, never a URL, never a log.\n     */\n    buyerAccessTokenProvider: {\n      type: Function as PropType<BuyerAccessTokenProvider>,\n      default: undefined,\n    },\n    /** One-shot session for hosts that own the lifecycle. Cannot be renewed. */\n    buyerAccessToken: {\n      type: [String, Object] as PropType<string | BuyerAccessToken>,\n      default: undefined,\n    },\n  },\n\n  emits: {\n    /** The buyer's selection changed. */\n    'selection-change': (_seats: SelectedSeat[]) => true,\n    /** A hold succeeded. */\n    hold: (_result: HoldResult) => true,\n    /** A previous hold was restored on mount. */\n    'hold-restored': (_result: HoldResult) => true,\n    /** The active hold lapsed. */\n    'hold-expired': () => true,\n    /** A GA area was clicked. */\n    'ga-click': (_area: GAAreaAvailability) => true,\n    /** Something failed — a network error, a rejected hold. */\n    error: (_error: unknown) => true,\n    /** A floor deck was tapped in the 3D view. */\n    'deck-tap': (_floorId: string) => true,\n    /** A transient hint worth showing the buyer, or `null` to clear it. */\n    hint: (_message: string | null) => true,\n    /** The pointer moved onto a seat, or off one (`null`). */\n    'seat-hover': (_details: SeatHoverDetails | null) => true,\n    /** The buyer access session lapsed; `refreshed` says whether it recovered. */\n    'access-expired': (_event: BuyerAccessExpiredEvent) => true,\n    /** Private inventory is unavailable and refreshing will not fix it. */\n    'access-unavailable': (_event: BuyerAccessUnavailableEvent) => true,\n    /** Selected-but-unheld units stopped being selectable. */\n    'selected-object-unavailable': (_event: SelectedObjectUnavailableEvent) => true,\n  },\n\n  setup(props, { emit, expose }) {\n    const container: Ref<HTMLDivElement | null> = ref(null);\n    // shallowRef: the chart owns a canvas and a large scene graph, and making it\n    // deeply reactive would have Vue walk all of it on every touch.\n    const chart = shallowRef<CoreSeatingChart | null>(null);\n\n    const destroy = () => {\n      chart.value?.destroy();\n      chart.value = null;\n    };\n\n    const build = () => {\n      const element = container.value;\n      if (!element) return;\n\n      destroy();\n\n      // Handlers are bound here rather than inline in the options literal.\n      // Inline, TypeScript has to resolve `emit`'s overloads while it is still\n      // contextually typing the literal against SeatingChartOptions, and it\n      // gives up — collapsing to the last emit signature. Naming them first\n      // separates the two inference problems, and reads better besides.\n      const onSelectionChange = (seats: SelectedSeat[]) => emit('selection-change', seats);\n      const onHold = (result: HoldResult) => emit('hold', result);\n      const onHoldRestored = (result: HoldResult) => emit('hold-restored', result);\n      const onHoldExpired = () => emit('hold-expired');\n      const onGAClick = (area: GAAreaAvailability) => emit('ga-click', area);\n      const onError = (error: unknown) => emit('error', error);\n      const onDeckTap = (floorId: string) => emit('deck-tap', floorId);\n      const onHint = (message: string | null) => emit('hint', message);\n      const onSeatHover = (details: SeatHoverDetails | null) => emit('seat-hover', details);\n      const onAccessExpired = (state: BuyerAccessExpiredEvent) => emit('access-expired', state);\n      const onAccessUnavailable = (state: BuyerAccessUnavailableEvent) =>\n        emit('access-unavailable', state);\n      const onSelectedObjectUnavailable = (state: SelectedObjectUnavailableEvent) =>\n        emit('selected-object-unavailable', state);\n\n      const instance = new CoreSeatingChart({\n        container: element,\n        event: props.event,\n        apiBase: props.apiBase,\n        maxSelection: props.maxSelection,\n        publicKey: props.publicKey,\n        locale: props.locale,\n        currency: props.currency,\n        colorblindSafe: props.colorblindSafe,\n        messages: props.messages,\n        seatTooltip: props.seatTooltip,\n        buyerAccessTokenProvider: props.buyerAccessTokenProvider,\n        buyerAccessToken: props.buyerAccessToken,\n        onAccessExpired,\n        onAccessUnavailable,\n        onSelectedObjectUnavailable,\n        onSelectionChange,\n        onHold,\n        onHoldRestored,\n        onHoldExpired,\n        onGAClick,\n        onError,\n        onDeckTap,\n        onHint,\n        onSeatHover,\n      });\n\n      chart.value = instance;\n      void instance.render();\n    };\n\n    // `flush: 'post'` so the container element exists on the first run — a\n    // pre-flush watcher would fire before the DOM node is attached.\n    watch(\n      () => [\n        container.value,\n        props.event,\n        props.apiBase,\n        props.maxSelection,\n        props.publicKey,\n        props.locale,\n        props.currency,\n        props.colorblindSafe,\n      ],\n      build,\n      { immediate: true, flush: 'post' },\n    );\n\n    onBeforeUnmount(destroy);\n\n    const exposed: SeatingChartExposed = {\n      hold: (options) => chart.value?.hold(options) ?? Promise.resolve(null),\n      resumeHold: (holdId) => chart.value?.resumeHold(holdId) ?? Promise.resolve(null),\n      getCurrentHold: () => chart.value?.getCurrentHold() ?? null,\n      getGAAreas: () => chart.value?.getGAAreas() ?? [],\n      holdGA: (areaId, qty, options) => chart.value?.holdGA(areaId, qty, options) ?? Promise.resolve(null),\n      bestAvailable: (qty, categoryKey) =>\n        chart.value?.bestAvailable(qty, categoryKey) ?? Promise.resolve(null),\n      release: () => chart.value?.release() ?? Promise.resolve(),\n      releaseLabels: (labels) => chart.value?.releaseLabels(labels) ?? Promise.resolve(false),\n      getSelection: () => chart.value?.getSelection() ?? [],\n      setSeatTier: (seatId, tierId) => chart.value?.setSeatTier(seatId, tierId),\n      getFloors: () => chart.value?.getFloors() ?? [],\n      setFloor: (floorId) => chart.value?.setFloor(floorId),\n      setColorblindSafe: (on) => chart.value?.setColorblindSafe(on),\n      zoomIn: () => chart.value?.zoomIn(),\n      zoomOut: () => chart.value?.zoomOut(),\n      zoomToFit: () => chart.value?.zoomToFit(),\n      refreshAccess: () => chart.value?.refreshAccess() ?? Promise.resolve(false),\n    };\n    expose(exposed);\n\n    return () => h('div', { ref: container });\n  },\n});\n"],"mappings":"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","names":["CoreSeatingChart","import_js"]}
+{"version":3,"sources":["../src/index.ts","../src/SeatingChart.ts"],"sourcesContent":["/**\n * @seatlayer/vue — the Vue 3 wrapper for the SeatLayer embed SDK.\n *\n * Components are written as render functions rather than SFCs, so installing\n * this package needs no Vue compiler plugin.\n */\nexport { SeatingChart } from './SeatingChart';\nexport type { SeatingChartExposed } from './SeatingChart';\n\nexport type {\n  SelectedSeat,\n  HoldResult,\n  BestAvailableResult,\n  GAAreaAvailability,\n  HoldLineItem,\n  SeatHoverDetails,\n} from '@seatlayer/js';\n\n// Sales Channels — buyer access sessions for private channel inventory.\nexport type {\n  BuyerAccessToken,\n  BuyerAccessTokenProvider,\n  BuyerAccessRefreshReason,\n  BuyerAccessUnavailableReason,\n  BuyerAccessExpiredEvent,\n  BuyerAccessUnavailableEvent,\n  SelectedObjectUnavailableEvent,\n} from '@seatlayer/js';\n\n// The framework-agnostic widget class — for the one-call modal (SeatPickerWidget.open()).\nexport { SeatPicker as SeatPickerWidget } from '@seatlayer/js';\n\n// Host-side embed helper: grows the iframe on `seatlayer:height` and pins it on\n// `seatlayer:fullscreen`. Vue hosts depend on this package alone, so it has to be\n// reachable here rather than only from @seatlayer/js.\nexport { attachPickerFrame } from '@seatlayer/js';\nexport type { AttachPickerFrameOptions } from '@seatlayer/js';\n","import {\n  defineComponent,\n  h,\n  onBeforeUnmount,\n  ref,\n  shallowRef,\n  watch,\n  type PropType,\n  type Ref,\n} from 'vue';\nimport {\n  SeatingChart as CoreSeatingChart,\n  SEATING_CHART_IDENTITY_PROPS,\n  bindSeatingChartHandle,\n  buildSeatingChartOptions,\n  type RendererViewMode,\n  type SeatingChartHandle,\n  type SeatingChartOptions,\n  type SelectedSeat,\n  type HoldResult,\n  type BestAvailableResult,\n  type GAAreaAvailability,\n  type SeatHoverDetails,\n  type BuyerAccessToken,\n  type BuyerAccessTokenProvider,\n  type BuyerAccessExpiredEvent,\n  type BuyerAccessUnavailableEvent,\n  type SelectedObjectUnavailableEvent,\n} from '@seatlayer/js';\n\n/**\n * What `ref=\"chart\"` gives you — call these to drive the picker from your app.\n *\n * Vue exposes these through `defineExpose`, so a template ref is typed as this\n * rather than as the raw component instance. It is the shared\n * `SeatingChartHandle` from `@seatlayer/js`: the same 17 methods React's `ref`\n * and Angular's component expose, from one declaration, so the three wrappers\n * cannot drift apart again.\n */\nexport type SeatingChartExposed = SeatingChartHandle;\n\n/**\n * Vue 3 wrapper around the framework-agnostic `@seatlayer/js` SDK.\n *\n * The canvas is created once and torn down on unmount. Only the props that\n * change the chart's identity (`SEATING_CHART_IDENTITY_PROPS`: `event`,\n * `apiBase`, `maxSelection`, `publicKey`, `locale`, `currency`,\n * `colorblindSafe`, `initialView`, `errorDisplay`) trigger a rebuild;\n * everything else is read live, so a parent re-render never destroys the canvas\n * mid-selection.\n *\n * Written as a render function rather than an SFC so the package builds with\n * plain TypeScript — a consumer needs no Vue compiler plugin to install it.\n *\n * @example\n * ```vue\n * <script setup lang=\"ts\">\n * import { ref } from 'vue';\n * import { SeatingChart, type SeatingChartExposed } from '@seatlayer/vue';\n *\n * const chart = ref<SeatingChartExposed | null>(null);\n * const checkout = async () => {\n *   const held = await chart.value?.hold();\n *   if (held) await pay(held.holdId);\n * };\n * </script>\n *\n * <template>\n *   <SeatingChart ref=\"chart\" event=\"summer-gala\" @selection-change=\"onChange\" />\n * </template>\n * ```\n */\nexport const SeatingChart = defineComponent({\n  name: 'SeatLayerSeatingChart',\n\n  props: {\n    /** Event key to render. Changing it rebuilds the chart. */\n    event: { type: String, required: true },\n    /** API base URL. Defaults to the public API. */\n    apiBase: { type: String, default: undefined },\n    /** Cap on how many seats a buyer may select. */\n    maxSelection: { type: Number, default: undefined },\n    /** Publishable key, when your integration uses one. */\n    publicKey: { type: String, default: undefined },\n    /** BCP-47 locale for built-in copy. */\n    locale: { type: String, default: undefined },\n    /** ISO currency for price formatting. */\n    currency: { type: String, default: undefined },\n    /** Render with colorblind-safe seat glyphs. */\n    colorblindSafe: { type: Boolean, default: undefined },\n    /**\n     * Initial canvas projection. Read once when the chart is built, so\n     * changing it rebuilds.\n     * @deprecated `'isometric'` and `'perspective'` are retired in favour of\n     * the real 3D venue view; use `'flat'`.\n     */\n    initialView: {\n      type: String as PropType<RendererViewMode>,\n      default: undefined,\n    },\n    /**\n     * What the BUYER sees when the chart cannot load: `'message'` (default) is\n     * a styleable notice with a Try again button, `'none'` is silent for hosts\n     * that render their own failure UI from the `error` event.\n     */\n    errorDisplay: {\n      type: String as PropType<'message' | 'none'>,\n      default: undefined,\n    },\n    /** Copy overrides, read once per mount. */\n    messages: {\n      type: Object as PropType<SeatingChartOptions['messages']>,\n      default: undefined,\n    },\n    /**\n     * Show the built-in seat tooltip. Set false to draw your own popover from\n     * the `seat-hover` event.\n     */\n    seatTooltip: { type: Boolean, default: undefined },\n    /**\n     * Sales Channels: mint a buyer access session on demand. Called with a\n     * `reason`; returns `{ token, expiresAt }` from YOUR backend. The token is\n     * held in memory only — never storage, never a URL, never a log.\n     */\n    buyerAccessTokenProvider: {\n      type: Function as PropType<BuyerAccessTokenProvider>,\n      default: undefined,\n    },\n    /** One-shot session for hosts that own the lifecycle. Cannot be renewed. */\n    buyerAccessToken: {\n      type: [String, Object] as PropType<string | BuyerAccessToken>,\n      default: undefined,\n    },\n  },\n\n  emits: {\n    /** The buyer's selection changed. */\n    'selection-change': (_seats: SelectedSeat[]) => true,\n    /** A hold succeeded. */\n    hold: (_result: HoldResult) => true,\n    /** A previous hold was restored on mount. */\n    'hold-restored': (_result: HoldResult) => true,\n    /** The active hold lapsed. */\n    'hold-expired': () => true,\n    /** A GA area was clicked. */\n    'ga-click': (_area: GAAreaAvailability) => true,\n    /** Something failed — a network error, a rejected hold. */\n    error: (_error: unknown) => true,\n    /** A floor deck was tapped in the 3D view. */\n    'deck-tap': (_floorId: string) => true,\n    /** A transient hint worth showing the buyer, or `null` to clear it. */\n    hint: (_message: string | null) => true,\n    /** The pointer moved onto a seat, or off one (`null`). */\n    'seat-hover': (_details: SeatHoverDetails | null) => true,\n    /** The buyer access session lapsed; `refreshed` says whether it recovered. */\n    'access-expired': (_event: BuyerAccessExpiredEvent) => true,\n    /** Private inventory is unavailable and refreshing will not fix it. */\n    'access-unavailable': (_event: BuyerAccessUnavailableEvent) => true,\n    /** Selected-but-unheld units stopped being selectable. */\n    'selected-object-unavailable': (_event: SelectedObjectUnavailableEvent) => true,\n  },\n\n  setup(props, { emit, expose }) {\n    const container: Ref<HTMLDivElement | null> = ref(null);\n    // shallowRef: the chart owns a canvas and a large scene graph, and making it\n    // deeply reactive would have Vue walk all of it on every touch.\n    const chart = shallowRef<CoreSeatingChart | null>(null);\n\n    const destroy = () => {\n      chart.value?.destroy();\n      chart.value = null;\n    };\n\n    const build = () => {\n      const element = container.value;\n      if (!element) return;\n\n      destroy();\n\n      // Handlers are bound here rather than inline in the options literal.\n      // Inline, TypeScript has to resolve `emit`'s overloads while it is still\n      // contextually typing the literal against SeatingChartOptions, and it\n      // gives up — collapsing to the last emit signature. Naming them first\n      // separates the two inference problems, and reads better besides.\n      const onSelectionChange = (seats: SelectedSeat[]) => emit('selection-change', seats);\n      const onHold = (result: HoldResult) => emit('hold', result);\n      const onHoldRestored = (result: HoldResult) => emit('hold-restored', result);\n      const onHoldExpired = () => emit('hold-expired');\n      const onGAClick = (area: GAAreaAvailability) => emit('ga-click', area);\n      const onError = (error: unknown) => emit('error', error);\n      const onDeckTap = (floorId: string) => emit('deck-tap', floorId);\n      const onHint = (message: string | null) => emit('hint', message);\n      const onSeatHover = (details: SeatHoverDetails | null) => emit('seat-hover', details);\n      const onAccessExpired = (state: BuyerAccessExpiredEvent) => emit('access-expired', state);\n      const onAccessUnavailable = (state: BuyerAccessUnavailableEvent) =>\n        emit('access-unavailable', state);\n      const onSelectedObjectUnavailable = (state: SelectedObjectUnavailableEvent) =>\n        emit('selected-object-unavailable', state);\n\n      const instance = new CoreSeatingChart(buildSeatingChartOptions(\n        element,\n        {\n          event: props.event,\n          apiBase: props.apiBase,\n          maxSelection: props.maxSelection,\n          publicKey: props.publicKey,\n          locale: props.locale,\n          currency: props.currency,\n          colorblindSafe: props.colorblindSafe,\n          initialView: props.initialView,\n          errorDisplay: props.errorDisplay,\n          messages: props.messages,\n          seatTooltip: props.seatTooltip,\n          buyerAccessTokenProvider: props.buyerAccessTokenProvider,\n          buyerAccessToken: props.buyerAccessToken,\n        },\n        {\n          onAccessExpired,\n          onAccessUnavailable,\n          onSelectedObjectUnavailable,\n          onSelectionChange,\n          onHold,\n          onHoldRestored,\n          onHoldExpired,\n          onGAClick,\n          onError,\n          onDeckTap,\n          onHint,\n          onSeatHover,\n        },\n      ));\n\n      chart.value = instance;\n      void instance.render();\n    };\n\n    // `flush: 'post'` so the container element exists on the first run — a\n    // pre-flush watcher would fire before the DOM node is attached.\n    watch(\n      () => [\n        container.value,\n        // The shared identity list, not a hand-copied one — this is exactly the\n        // place Vue fell two props behind React.\n        ...SEATING_CHART_IDENTITY_PROPS.map((prop) => props[prop]),\n      ],\n      build,\n      { immediate: true, flush: 'post' },\n    );\n\n    onBeforeUnmount(destroy);\n\n    // Built once and read live: the handle must survive every rebuild, so it\n    // asks for the current instance on each call rather than capturing one.\n    const exposed: SeatingChartExposed = bindSeatingChartHandle(() => chart.value);\n    expose(exposed);\n\n    return () => h('div', { ref: container });\n  },\n});\n"],"mappings":"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","names":["CoreSeatingChart","import_js"]}

package/dist/index.d.cts

@@ -1,69 +1,28 @@
 import * as _seatlayer_core from '@seatlayer/core';
 import * as vue from 'vue';
 import { PropType } from 'vue';
-import { SeatingChartOptions, BuyerAccessTokenProvider, BuyerAccessToken, SelectedSeat, HoldResult, GAAreaAvailability, SeatHoverDetails, BuyerAccessExpiredEvent, BuyerAccessUnavailableEvent, SelectedObjectUnavailableEvent, BestAvailableResult } from '@seatlayer/js';
+import { RendererViewMode, SeatingChartOptions, BuyerAccessTokenProvider, BuyerAccessToken, SelectedSeat, HoldResult, GAAreaAvailability, SeatHoverDetails, BuyerAccessExpiredEvent, BuyerAccessUnavailableEvent, SelectedObjectUnavailableEvent, SeatingChartHandle } from '@seatlayer/js';
 export { AttachPickerFrameOptions, BestAvailableResult, BuyerAccessExpiredEvent, BuyerAccessRefreshReason, BuyerAccessToken, BuyerAccessTokenProvider, BuyerAccessUnavailableEvent, BuyerAccessUnavailableReason, GAAreaAvailability, HoldLineItem, HoldResult, SeatHoverDetails, SeatPicker as SeatPickerWidget, SelectedObjectUnavailableEvent, SelectedSeat, attachPickerFrame } from '@seatlayer/js';
 
 /**
  * What `ref="chart"` gives you — call these to drive the picker from your app.
  *
  * Vue exposes these through `defineExpose`, so a template ref is typed as this
- * rather than as the raw component instance.
+ * rather than as the raw component instance. It is the shared
+ * `SeatingChartHandle` from `@seatlayer/js`: the same 17 methods React's `ref`
+ * and Angular's component expose, from one declaration, so the three wrappers
+ * cannot drift apart again.
  */
-interface SeatingChartExposed {
-    /** Hold the current selection. Resolves the hold, or `null` on a 409 conflict. */
-    hold(options?: {
-        ttlMs?: number;
-    }): Promise<HoldResult | null>;
-    /** Restore an active hold by its opaque id. */
-    resumeHold(holdId: string): Promise<HoldResult | null>;
-    /** Current active hold known to the chart. */
-    getCurrentHold(): HoldResult | null;
-    /** GA areas with live remaining capacity. */
-    getGAAreas(): GAAreaAvailability[];
-    /** Atomically hold a quantity from one GA area. */
-    holdGA(areaId: string, qty: number, options?: {
-        tierId?: string | null;
-        ttlMs?: number;
-    }): Promise<HoldResult | null>;
-    /** Ask the server for the `qty` best free seats and hold them atomically. */
-    bestAvailable(qty: number, categoryKey?: string): Promise<BestAvailableResult | null>;
-    /** Release the current hold (if any). */
-    release(): Promise<void>;
-    /** Release some held labels while keeping the remainder active. */
-    releaseLabels(labels: string[]): Promise<boolean>;
-    /** The current selection, with prices resolved from the chart categories. */
-    getSelection(): SelectedSeat[];
-    /** Choose a ticket tier for a selected seat; `null` reverts to the default. */
-    setSeatTier(seatId: string, tierId: string | null): void;
-    /** Floors of a multi-floor chart. Empty before the first render. */
-    getFloors(): {
-        id: string;
-        name: string;
-    }[];
-    /** Switch the shown floor (2D). No-ops on single-floor charts. */
-    setFloor(floorId: string): void;
-    /** Toggle colorblind-safe rendering at runtime. */
-    setColorblindSafe(on: boolean): void;
-    /** Zoom in one step (same increment as the wheel/pinch gesture). */
-    zoomIn(): void;
-    /** Zoom out one step. */
-    zoomOut(): void;
-    /** Reset the camera so the whole chart fits the container. */
-    zoomToFit(): void;
-    /**
-     * Re-acquire the buyer access session after your app re-authorizes the buyer
-     * (Sales Channels). Resolves false when the chart is not access-scoped.
-     */
-    refreshAccess(): Promise<boolean>;
-}
+type SeatingChartExposed = SeatingChartHandle;
 /**
  * Vue 3 wrapper around the framework-agnostic `@seatlayer/js` SDK.
  *
  * The canvas is created once and torn down on unmount. Only the props that
- * change the chart's identity — `event`, `apiBase`, `maxSelection`, `publicKey`,
- * `locale`, `currency`, `colorblindSafe` — trigger a rebuild; everything else is
- * read live, so a parent re-render never destroys the canvas mid-selection.
+ * change the chart's identity (`SEATING_CHART_IDENTITY_PROPS`: `event`,
+ * `apiBase`, `maxSelection`, `publicKey`, `locale`, `currency`,
+ * `colorblindSafe`, `initialView`, `errorDisplay`) trigger a rebuild;
+ * everything else is read live, so a parent re-render never destroys the canvas
+ * mid-selection.
  *
  * Written as a render function rather than an SFC so the package builds with
  * plain TypeScript — a consumer needs no Vue compiler plugin to install it.
@@ -122,6 +81,25 @@ declare const SeatingChart: vue.DefineComponent<vue.ExtractPropTypes<{
         type: BooleanConstructor;
         default: undefined;
     };
+    /**
+     * Initial canvas projection. Read once when the chart is built, so
+     * changing it rebuilds.
+     * @deprecated `'isometric'` and `'perspective'` are retired in favour of
+     * the real 3D venue view; use `'flat'`.
+     */
+    initialView: {
+        type: PropType<RendererViewMode>;
+        default: undefined;
+    };
+    /**
+     * What the BUYER sees when the chart cannot load: `'message'` (default) is
+     * a styleable notice with a Try again button, `'none'` is silent for hosts
+     * that render their own failure UI from the `error` event.
+     */
+    errorDisplay: {
+        type: PropType<"message" | "none">;
+        default: undefined;
+    };
     /** Copy overrides, read once per mount. */
     messages: {
         type: PropType<SeatingChartOptions["messages"]>;
@@ -212,6 +190,25 @@ declare const SeatingChart: vue.DefineComponent<vue.ExtractPropTypes<{
         type: BooleanConstructor;
         default: undefined;
     };
+    /**
+     * Initial canvas projection. Read once when the chart is built, so
+     * changing it rebuilds.
+     * @deprecated `'isometric'` and `'perspective'` are retired in favour of
+     * the real 3D venue view; use `'flat'`.
+     */
+    initialView: {
+        type: PropType<RendererViewMode>;
+        default: undefined;
+    };
+    /**
+     * What the BUYER sees when the chart cannot load: `'message'` (default) is
+     * a styleable notice with a Try again button, `'none'` is silent for hosts
+     * that render their own failure UI from the `error` event.
+     */
+    errorDisplay: {
+        type: PropType<"message" | "none">;
+        default: undefined;
+    };
     /** Copy overrides, read once per mount. */
     messages: {
         type: PropType<SeatingChartOptions["messages"]>;
@@ -260,6 +257,8 @@ declare const SeatingChart: vue.DefineComponent<vue.ExtractPropTypes<{
     locale: string;
     currency: string;
     colorblindSafe: boolean;
+    initialView: RendererViewMode;
+    errorDisplay: "message" | "none";
     seatTooltip: boolean;
     buyerAccessTokenProvider: BuyerAccessTokenProvider;
     buyerAccessToken: string | BuyerAccessToken;

package/dist/index.d.ts

@@ -1,69 +1,28 @@
 import * as _seatlayer_core from '@seatlayer/core';
 import * as vue from 'vue';
 import { PropType } from 'vue';
-import { SeatingChartOptions, BuyerAccessTokenProvider, BuyerAccessToken, SelectedSeat, HoldResult, GAAreaAvailability, SeatHoverDetails, BuyerAccessExpiredEvent, BuyerAccessUnavailableEvent, SelectedObjectUnavailableEvent, BestAvailableResult } from '@seatlayer/js';
+import { RendererViewMode, SeatingChartOptions, BuyerAccessTokenProvider, BuyerAccessToken, SelectedSeat, HoldResult, GAAreaAvailability, SeatHoverDetails, BuyerAccessExpiredEvent, BuyerAccessUnavailableEvent, SelectedObjectUnavailableEvent, SeatingChartHandle } from '@seatlayer/js';
 export { AttachPickerFrameOptions, BestAvailableResult, BuyerAccessExpiredEvent, BuyerAccessRefreshReason, BuyerAccessToken, BuyerAccessTokenProvider, BuyerAccessUnavailableEvent, BuyerAccessUnavailableReason, GAAreaAvailability, HoldLineItem, HoldResult, SeatHoverDetails, SeatPicker as SeatPickerWidget, SelectedObjectUnavailableEvent, SelectedSeat, attachPickerFrame } from '@seatlayer/js';
 
 /**
  * What `ref="chart"` gives you — call these to drive the picker from your app.
  *
  * Vue exposes these through `defineExpose`, so a template ref is typed as this
- * rather than as the raw component instance.
+ * rather than as the raw component instance. It is the shared
+ * `SeatingChartHandle` from `@seatlayer/js`: the same 17 methods React's `ref`
+ * and Angular's component expose, from one declaration, so the three wrappers
+ * cannot drift apart again.
  */
-interface SeatingChartExposed {
-    /** Hold the current selection. Resolves the hold, or `null` on a 409 conflict. */
-    hold(options?: {
-        ttlMs?: number;
-    }): Promise<HoldResult | null>;
-    /** Restore an active hold by its opaque id. */
-    resumeHold(holdId: string): Promise<HoldResult | null>;
-    /** Current active hold known to the chart. */
-    getCurrentHold(): HoldResult | null;
-    /** GA areas with live remaining capacity. */
-    getGAAreas(): GAAreaAvailability[];
-    /** Atomically hold a quantity from one GA area. */
-    holdGA(areaId: string, qty: number, options?: {
-        tierId?: string | null;
-        ttlMs?: number;
-    }): Promise<HoldResult | null>;
-    /** Ask the server for the `qty` best free seats and hold them atomically. */
-    bestAvailable(qty: number, categoryKey?: string): Promise<BestAvailableResult | null>;
-    /** Release the current hold (if any). */
-    release(): Promise<void>;
-    /** Release some held labels while keeping the remainder active. */
-    releaseLabels(labels: string[]): Promise<boolean>;
-    /** The current selection, with prices resolved from the chart categories. */
-    getSelection(): SelectedSeat[];
-    /** Choose a ticket tier for a selected seat; `null` reverts to the default. */
-    setSeatTier(seatId: string, tierId: string | null): void;
-    /** Floors of a multi-floor chart. Empty before the first render. */
-    getFloors(): {
-        id: string;
-        name: string;
-    }[];
-    /** Switch the shown floor (2D). No-ops on single-floor charts. */
-    setFloor(floorId: string): void;
-    /** Toggle colorblind-safe rendering at runtime. */
-    setColorblindSafe(on: boolean): void;
-    /** Zoom in one step (same increment as the wheel/pinch gesture). */
-    zoomIn(): void;
-    /** Zoom out one step. */
-    zoomOut(): void;
-    /** Reset the camera so the whole chart fits the container. */
-    zoomToFit(): void;
-    /**
-     * Re-acquire the buyer access session after your app re-authorizes the buyer
-     * (Sales Channels). Resolves false when the chart is not access-scoped.
-     */
-    refreshAccess(): Promise<boolean>;
-}
+type SeatingChartExposed = SeatingChartHandle;
 /**
  * Vue 3 wrapper around the framework-agnostic `@seatlayer/js` SDK.
  *
  * The canvas is created once and torn down on unmount. Only the props that
- * change the chart's identity — `event`, `apiBase`, `maxSelection`, `publicKey`,
- * `locale`, `currency`, `colorblindSafe` — trigger a rebuild; everything else is
- * read live, so a parent re-render never destroys the canvas mid-selection.
+ * change the chart's identity (`SEATING_CHART_IDENTITY_PROPS`: `event`,
+ * `apiBase`, `maxSelection`, `publicKey`, `locale`, `currency`,
+ * `colorblindSafe`, `initialView`, `errorDisplay`) trigger a rebuild;
+ * everything else is read live, so a parent re-render never destroys the canvas
+ * mid-selection.
  *
  * Written as a render function rather than an SFC so the package builds with
  * plain TypeScript — a consumer needs no Vue compiler plugin to install it.
@@ -122,6 +81,25 @@ declare const SeatingChart: vue.DefineComponent<vue.ExtractPropTypes<{
         type: BooleanConstructor;
         default: undefined;
     };
+    /**
+     * Initial canvas projection. Read once when the chart is built, so
+     * changing it rebuilds.
+     * @deprecated `'isometric'` and `'perspective'` are retired in favour of
+     * the real 3D venue view; use `'flat'`.
+     */
+    initialView: {
+        type: PropType<RendererViewMode>;
+        default: undefined;
+    };
+    /**
+     * What the BUYER sees when the chart cannot load: `'message'` (default) is
+     * a styleable notice with a Try again button, `'none'` is silent for hosts
+     * that render their own failure UI from the `error` event.
+     */
+    errorDisplay: {
+        type: PropType<"message" | "none">;
+        default: undefined;
+    };
     /** Copy overrides, read once per mount. */
     messages: {
         type: PropType<SeatingChartOptions["messages"]>;
@@ -212,6 +190,25 @@ declare const SeatingChart: vue.DefineComponent<vue.ExtractPropTypes<{
         type: BooleanConstructor;
         default: undefined;
     };
+    /**
+     * Initial canvas projection. Read once when the chart is built, so
+     * changing it rebuilds.
+     * @deprecated `'isometric'` and `'perspective'` are retired in favour of
+     * the real 3D venue view; use `'flat'`.
+     */
+    initialView: {
+        type: PropType<RendererViewMode>;
+        default: undefined;
+    };
+    /**
+     * What the BUYER sees when the chart cannot load: `'message'` (default) is
+     * a styleable notice with a Try again button, `'none'` is silent for hosts
+     * that render their own failure UI from the `error` event.
+     */
+    errorDisplay: {
+        type: PropType<"message" | "none">;
+        default: undefined;
+    };
     /** Copy overrides, read once per mount. */
     messages: {
         type: PropType<SeatingChartOptions["messages"]>;
@@ -260,6 +257,8 @@ declare const SeatingChart: vue.DefineComponent<vue.ExtractPropTypes<{
     locale: string;
     currency: string;
     colorblindSafe: boolean;
+    initialView: RendererViewMode;
+    errorDisplay: "message" | "none";
     seatTooltip: boolean;
     buyerAccessTokenProvider: BuyerAccessTokenProvider;
     buyerAccessToken: string | BuyerAccessToken;

package/dist/index.js

@@ -8,7 +8,10 @@ import {
   watch
 } from "vue";
 import {
-  SeatingChart as CoreSeatingChart
+  SeatingChart as CoreSeatingChart,
+  SEATING_CHART_IDENTITY_PROPS,
+  bindSeatingChartHandle,
+  buildSeatingChartOptions
 } from "@seatlayer/js";
 var SeatingChart = defineComponent({
   name: "SeatLayerSeatingChart",
@@ -27,6 +30,25 @@ var SeatingChart = defineComponent({
     currency: { type: String, default: void 0 },
     /** Render with colorblind-safe seat glyphs. */
     colorblindSafe: { type: Boolean, default: void 0 },
+    /**
+     * Initial canvas projection. Read once when the chart is built, so
+     * changing it rebuilds.
+     * @deprecated `'isometric'` and `'perspective'` are retired in favour of
+     * the real 3D venue view; use `'flat'`.
+     */
+    initialView: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * What the BUYER sees when the chart cannot load: `'message'` (default) is
+     * a styleable notice with a Try again button, `'none'` is silent for hosts
+     * that render their own failure UI from the `error` event.
+     */
+    errorDisplay: {
+      type: String,
+      default: void 0
+    },
     /** Copy overrides, read once per mount. */
     messages: {
       type: Object,
@@ -101,69 +123,53 @@ var SeatingChart = defineComponent({
       const onAccessExpired = (state) => emit("access-expired", state);
       const onAccessUnavailable = (state) => emit("access-unavailable", state);
       const onSelectedObjectUnavailable = (state) => emit("selected-object-unavailable", state);
-      const instance = new CoreSeatingChart({
-        container: element,
-        event: props.event,
-        apiBase: props.apiBase,
-        maxSelection: props.maxSelection,
-        publicKey: props.publicKey,
-        locale: props.locale,
-        currency: props.currency,
-        colorblindSafe: props.colorblindSafe,
-        messages: props.messages,
-        seatTooltip: props.seatTooltip,
-        buyerAccessTokenProvider: props.buyerAccessTokenProvider,
-        buyerAccessToken: props.buyerAccessToken,
-        onAccessExpired,
-        onAccessUnavailable,
-        onSelectedObjectUnavailable,
-        onSelectionChange,
-        onHold,
-        onHoldRestored,
-        onHoldExpired,
-        onGAClick,
-        onError,
-        onDeckTap,
-        onHint,
-        onSeatHover
-      });
+      const instance = new CoreSeatingChart(buildSeatingChartOptions(
+        element,
+        {
+          event: props.event,
+          apiBase: props.apiBase,
+          maxSelection: props.maxSelection,
+          publicKey: props.publicKey,
+          locale: props.locale,
+          currency: props.currency,
+          colorblindSafe: props.colorblindSafe,
+          initialView: props.initialView,
+          errorDisplay: props.errorDisplay,
+          messages: props.messages,
+          seatTooltip: props.seatTooltip,
+          buyerAccessTokenProvider: props.buyerAccessTokenProvider,
+          buyerAccessToken: props.buyerAccessToken
+        },
+        {
+          onAccessExpired,
+          onAccessUnavailable,
+          onSelectedObjectUnavailable,
+          onSelectionChange,
+          onHold,
+          onHoldRestored,
+          onHoldExpired,
+          onGAClick,
+          onError,
+          onDeckTap,
+          onHint,
+          onSeatHover
+        }
+      ));
       chart.value = instance;
       void instance.render();
     };
     watch(
       () => [
         container.value,
-        props.event,
-        props.apiBase,
-        props.maxSelection,
-        props.publicKey,
-        props.locale,
-        props.currency,
-        props.colorblindSafe
+        // The shared identity list, not a hand-copied one — this is exactly the
+        // place Vue fell two props behind React.
+        ...SEATING_CHART_IDENTITY_PROPS.map((prop) => props[prop])
       ],
       build,
       { immediate: true, flush: "post" }
     );
     onBeforeUnmount(destroy);
-    const exposed = {
-      hold: (options) => chart.value?.hold(options) ?? Promise.resolve(null),
-      resumeHold: (holdId) => chart.value?.resumeHold(holdId) ?? Promise.resolve(null),
-      getCurrentHold: () => chart.value?.getCurrentHold() ?? null,
-      getGAAreas: () => chart.value?.getGAAreas() ?? [],
-      holdGA: (areaId, qty, options) => chart.value?.holdGA(areaId, qty, options) ?? Promise.resolve(null),
-      bestAvailable: (qty, categoryKey) => chart.value?.bestAvailable(qty, categoryKey) ?? Promise.resolve(null),
-      release: () => chart.value?.release() ?? Promise.resolve(),
-      releaseLabels: (labels) => chart.value?.releaseLabels(labels) ?? Promise.resolve(false),
-      getSelection: () => chart.value?.getSelection() ?? [],
-      setSeatTier: (seatId, tierId) => chart.value?.setSeatTier(seatId, tierId),
-      getFloors: () => chart.value?.getFloors() ?? [],
-      setFloor: (floorId) => chart.value?.setFloor(floorId),
-      setColorblindSafe: (on) => chart.value?.setColorblindSafe(on),
-      zoomIn: () => chart.value?.zoomIn(),
-      zoomOut: () => chart.value?.zoomOut(),
-      zoomToFit: () => chart.value?.zoomToFit(),
-      refreshAccess: () => chart.value?.refreshAccess() ?? Promise.resolve(false)
-    };
+    const exposed = bindSeatingChartHandle(() => chart.value);
     expose(exposed);
     return () => h("div", { ref: container });
   }

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/SeatingChart.ts","../src/index.ts"],"sourcesContent":["import {\n  defineComponent,\n  h,\n  onBeforeUnmount,\n  ref,\n  shallowRef,\n  watch,\n  type PropType,\n  type Ref,\n} from 'vue';\nimport {\n  SeatingChart as CoreSeatingChart,\n  type SeatingChartOptions,\n  type SelectedSeat,\n  type HoldResult,\n  type BestAvailableResult,\n  type GAAreaAvailability,\n  type SeatHoverDetails,\n  type BuyerAccessToken,\n  type BuyerAccessTokenProvider,\n  type BuyerAccessExpiredEvent,\n  type BuyerAccessUnavailableEvent,\n  type SelectedObjectUnavailableEvent,\n} from '@seatlayer/js';\n\n/**\n * What `ref=\"chart\"` gives you — call these to drive the picker from your app.\n *\n * Vue exposes these through `defineExpose`, so a template ref is typed as this\n * rather than as the raw component instance.\n */\nexport interface SeatingChartExposed {\n  /** Hold the current selection. Resolves the hold, or `null` on a 409 conflict. */\n  hold(options?: { ttlMs?: number }): Promise<HoldResult | null>;\n  /** Restore an active hold by its opaque id. */\n  resumeHold(holdId: string): Promise<HoldResult | null>;\n  /** Current active hold known to the chart. */\n  getCurrentHold(): HoldResult | null;\n  /** GA areas with live remaining capacity. */\n  getGAAreas(): GAAreaAvailability[];\n  /** Atomically hold a quantity from one GA area. */\n  holdGA(areaId: string, qty: number, options?: { tierId?: string | null; ttlMs?: number }): Promise<HoldResult | null>;\n  /** Ask the server for the `qty` best free seats and hold them atomically. */\n  bestAvailable(qty: number, categoryKey?: string): Promise<BestAvailableResult | null>;\n  /** Release the current hold (if any). */\n  release(): Promise<void>;\n  /** Release some held labels while keeping the remainder active. */\n  releaseLabels(labels: string[]): Promise<boolean>;\n  /** The current selection, with prices resolved from the chart categories. */\n  getSelection(): SelectedSeat[];\n  /** Choose a ticket tier for a selected seat; `null` reverts to the default. */\n  setSeatTier(seatId: string, tierId: string | null): void;\n  /** Floors of a multi-floor chart. Empty before the first render. */\n  getFloors(): { id: string; name: string }[];\n  /** Switch the shown floor (2D). No-ops on single-floor charts. */\n  setFloor(floorId: string): void;\n  /** Toggle colorblind-safe rendering at runtime. */\n  setColorblindSafe(on: boolean): void;\n  /** Zoom in one step (same increment as the wheel/pinch gesture). */\n  zoomIn(): void;\n  /** Zoom out one step. */\n  zoomOut(): void;\n  /** Reset the camera so the whole chart fits the container. */\n  zoomToFit(): void;\n  /**\n   * Re-acquire the buyer access session after your app re-authorizes the buyer\n   * (Sales Channels). Resolves false when the chart is not access-scoped.\n   */\n  refreshAccess(): Promise<boolean>;\n}\n\n/**\n * Vue 3 wrapper around the framework-agnostic `@seatlayer/js` SDK.\n *\n * The canvas is created once and torn down on unmount. Only the props that\n * change the chart's identity — `event`, `apiBase`, `maxSelection`, `publicKey`,\n * `locale`, `currency`, `colorblindSafe` — trigger a rebuild; everything else is\n * read live, so a parent re-render never destroys the canvas mid-selection.\n *\n * Written as a render function rather than an SFC so the package builds with\n * plain TypeScript — a consumer needs no Vue compiler plugin to install it.\n *\n * @example\n * ```vue\n * <script setup lang=\"ts\">\n * import { ref } from 'vue';\n * import { SeatingChart, type SeatingChartExposed } from '@seatlayer/vue';\n *\n * const chart = ref<SeatingChartExposed | null>(null);\n * const checkout = async () => {\n *   const held = await chart.value?.hold();\n *   if (held) await pay(held.holdId);\n * };\n * </script>\n *\n * <template>\n *   <SeatingChart ref=\"chart\" event=\"summer-gala\" @selection-change=\"onChange\" />\n * </template>\n * ```\n */\nexport const SeatingChart = defineComponent({\n  name: 'SeatLayerSeatingChart',\n\n  props: {\n    /** Event key to render. Changing it rebuilds the chart. */\n    event: { type: String, required: true },\n    /** API base URL. Defaults to the public API. */\n    apiBase: { type: String, default: undefined },\n    /** Cap on how many seats a buyer may select. */\n    maxSelection: { type: Number, default: undefined },\n    /** Publishable key, when your integration uses one. */\n    publicKey: { type: String, default: undefined },\n    /** BCP-47 locale for built-in copy. */\n    locale: { type: String, default: undefined },\n    /** ISO currency for price formatting. */\n    currency: { type: String, default: undefined },\n    /** Render with colorblind-safe seat glyphs. */\n    colorblindSafe: { type: Boolean, default: undefined },\n    /** Copy overrides, read once per mount. */\n    messages: {\n      type: Object as PropType<SeatingChartOptions['messages']>,\n      default: undefined,\n    },\n    /**\n     * Show the built-in seat tooltip. Set false to draw your own popover from\n     * the `seat-hover` event.\n     */\n    seatTooltip: { type: Boolean, default: undefined },\n    /**\n     * Sales Channels: mint a buyer access session on demand. Called with a\n     * `reason`; returns `{ token, expiresAt }` from YOUR backend. The token is\n     * held in memory only — never storage, never a URL, never a log.\n     */\n    buyerAccessTokenProvider: {\n      type: Function as PropType<BuyerAccessTokenProvider>,\n      default: undefined,\n    },\n    /** One-shot session for hosts that own the lifecycle. Cannot be renewed. */\n    buyerAccessToken: {\n      type: [String, Object] as PropType<string | BuyerAccessToken>,\n      default: undefined,\n    },\n  },\n\n  emits: {\n    /** The buyer's selection changed. */\n    'selection-change': (_seats: SelectedSeat[]) => true,\n    /** A hold succeeded. */\n    hold: (_result: HoldResult) => true,\n    /** A previous hold was restored on mount. */\n    'hold-restored': (_result: HoldResult) => true,\n    /** The active hold lapsed. */\n    'hold-expired': () => true,\n    /** A GA area was clicked. */\n    'ga-click': (_area: GAAreaAvailability) => true,\n    /** Something failed — a network error, a rejected hold. */\n    error: (_error: unknown) => true,\n    /** A floor deck was tapped in the 3D view. */\n    'deck-tap': (_floorId: string) => true,\n    /** A transient hint worth showing the buyer, or `null` to clear it. */\n    hint: (_message: string | null) => true,\n    /** The pointer moved onto a seat, or off one (`null`). */\n    'seat-hover': (_details: SeatHoverDetails | null) => true,\n    /** The buyer access session lapsed; `refreshed` says whether it recovered. */\n    'access-expired': (_event: BuyerAccessExpiredEvent) => true,\n    /** Private inventory is unavailable and refreshing will not fix it. */\n    'access-unavailable': (_event: BuyerAccessUnavailableEvent) => true,\n    /** Selected-but-unheld units stopped being selectable. */\n    'selected-object-unavailable': (_event: SelectedObjectUnavailableEvent) => true,\n  },\n\n  setup(props, { emit, expose }) {\n    const container: Ref<HTMLDivElement | null> = ref(null);\n    // shallowRef: the chart owns a canvas and a large scene graph, and making it\n    // deeply reactive would have Vue walk all of it on every touch.\n    const chart = shallowRef<CoreSeatingChart | null>(null);\n\n    const destroy = () => {\n      chart.value?.destroy();\n      chart.value = null;\n    };\n\n    const build = () => {\n      const element = container.value;\n      if (!element) return;\n\n      destroy();\n\n      // Handlers are bound here rather than inline in the options literal.\n      // Inline, TypeScript has to resolve `emit`'s overloads while it is still\n      // contextually typing the literal against SeatingChartOptions, and it\n      // gives up — collapsing to the last emit signature. Naming them first\n      // separates the two inference problems, and reads better besides.\n      const onSelectionChange = (seats: SelectedSeat[]) => emit('selection-change', seats);\n      const onHold = (result: HoldResult) => emit('hold', result);\n      const onHoldRestored = (result: HoldResult) => emit('hold-restored', result);\n      const onHoldExpired = () => emit('hold-expired');\n      const onGAClick = (area: GAAreaAvailability) => emit('ga-click', area);\n      const onError = (error: unknown) => emit('error', error);\n      const onDeckTap = (floorId: string) => emit('deck-tap', floorId);\n      const onHint = (message: string | null) => emit('hint', message);\n      const onSeatHover = (details: SeatHoverDetails | null) => emit('seat-hover', details);\n      const onAccessExpired = (state: BuyerAccessExpiredEvent) => emit('access-expired', state);\n      const onAccessUnavailable = (state: BuyerAccessUnavailableEvent) =>\n        emit('access-unavailable', state);\n      const onSelectedObjectUnavailable = (state: SelectedObjectUnavailableEvent) =>\n        emit('selected-object-unavailable', state);\n\n      const instance = new CoreSeatingChart({\n        container: element,\n        event: props.event,\n        apiBase: props.apiBase,\n        maxSelection: props.maxSelection,\n        publicKey: props.publicKey,\n        locale: props.locale,\n        currency: props.currency,\n        colorblindSafe: props.colorblindSafe,\n        messages: props.messages,\n        seatTooltip: props.seatTooltip,\n        buyerAccessTokenProvider: props.buyerAccessTokenProvider,\n        buyerAccessToken: props.buyerAccessToken,\n        onAccessExpired,\n        onAccessUnavailable,\n        onSelectedObjectUnavailable,\n        onSelectionChange,\n        onHold,\n        onHoldRestored,\n        onHoldExpired,\n        onGAClick,\n        onError,\n        onDeckTap,\n        onHint,\n        onSeatHover,\n      });\n\n      chart.value = instance;\n      void instance.render();\n    };\n\n    // `flush: 'post'` so the container element exists on the first run — a\n    // pre-flush watcher would fire before the DOM node is attached.\n    watch(\n      () => [\n        container.value,\n        props.event,\n        props.apiBase,\n        props.maxSelection,\n        props.publicKey,\n        props.locale,\n        props.currency,\n        props.colorblindSafe,\n      ],\n      build,\n      { immediate: true, flush: 'post' },\n    );\n\n    onBeforeUnmount(destroy);\n\n    const exposed: SeatingChartExposed = {\n      hold: (options) => chart.value?.hold(options) ?? Promise.resolve(null),\n      resumeHold: (holdId) => chart.value?.resumeHold(holdId) ?? Promise.resolve(null),\n      getCurrentHold: () => chart.value?.getCurrentHold() ?? null,\n      getGAAreas: () => chart.value?.getGAAreas() ?? [],\n      holdGA: (areaId, qty, options) => chart.value?.holdGA(areaId, qty, options) ?? Promise.resolve(null),\n      bestAvailable: (qty, categoryKey) =>\n        chart.value?.bestAvailable(qty, categoryKey) ?? Promise.resolve(null),\n      release: () => chart.value?.release() ?? Promise.resolve(),\n      releaseLabels: (labels) => chart.value?.releaseLabels(labels) ?? Promise.resolve(false),\n      getSelection: () => chart.value?.getSelection() ?? [],\n      setSeatTier: (seatId, tierId) => chart.value?.setSeatTier(seatId, tierId),\n      getFloors: () => chart.value?.getFloors() ?? [],\n      setFloor: (floorId) => chart.value?.setFloor(floorId),\n      setColorblindSafe: (on) => chart.value?.setColorblindSafe(on),\n      zoomIn: () => chart.value?.zoomIn(),\n      zoomOut: () => chart.value?.zoomOut(),\n      zoomToFit: () => chart.value?.zoomToFit(),\n      refreshAccess: () => chart.value?.refreshAccess() ?? Promise.resolve(false),\n    };\n    expose(exposed);\n\n    return () => h('div', { ref: container });\n  },\n});\n","/**\n * @seatlayer/vue — the Vue 3 wrapper for the SeatLayer embed SDK.\n *\n * Components are written as render functions rather than SFCs, so installing\n * this package needs no Vue compiler plugin.\n */\nexport { SeatingChart } from './SeatingChart';\nexport type { SeatingChartExposed } from './SeatingChart';\n\nexport type {\n  SelectedSeat,\n  HoldResult,\n  BestAvailableResult,\n  GAAreaAvailability,\n  HoldLineItem,\n  SeatHoverDetails,\n} from '@seatlayer/js';\n\n// Sales Channels — buyer access sessions for private channel inventory.\nexport type {\n  BuyerAccessToken,\n  BuyerAccessTokenProvider,\n  BuyerAccessRefreshReason,\n  BuyerAccessUnavailableReason,\n  BuyerAccessExpiredEvent,\n  BuyerAccessUnavailableEvent,\n  SelectedObjectUnavailableEvent,\n} from '@seatlayer/js';\n\n// The framework-agnostic widget class — for the one-call modal (SeatPickerWidget.open()).\nexport { SeatPicker as SeatPickerWidget } from '@seatlayer/js';\n\n// Host-side embed helper: grows the iframe on `seatlayer:height` and pins it on\n// `seatlayer:fullscreen`. Vue hosts depend on this package alone, so it has to be\n// reachable here rather than only from @seatlayer/js.\nexport { attachPickerFrame } from '@seatlayer/js';\nexport type { AttachPickerFrameOptions } from '@seatlayer/js';\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/SeatingChart.ts","../src/index.ts"],"sourcesContent":["import {\n  defineComponent,\n  h,\n  onBeforeUnmount,\n  ref,\n  shallowRef,\n  watch,\n  type PropType,\n  type Ref,\n} from 'vue';\nimport {\n  SeatingChart as CoreSeatingChart,\n  SEATING_CHART_IDENTITY_PROPS,\n  bindSeatingChartHandle,\n  buildSeatingChartOptions,\n  type RendererViewMode,\n  type SeatingChartHandle,\n  type SeatingChartOptions,\n  type SelectedSeat,\n  type HoldResult,\n  type BestAvailableResult,\n  type GAAreaAvailability,\n  type SeatHoverDetails,\n  type BuyerAccessToken,\n  type BuyerAccessTokenProvider,\n  type BuyerAccessExpiredEvent,\n  type BuyerAccessUnavailableEvent,\n  type SelectedObjectUnavailableEvent,\n} from '@seatlayer/js';\n\n/**\n * What `ref=\"chart\"` gives you — call these to drive the picker from your app.\n *\n * Vue exposes these through `defineExpose`, so a template ref is typed as this\n * rather than as the raw component instance. It is the shared\n * `SeatingChartHandle` from `@seatlayer/js`: the same 17 methods React's `ref`\n * and Angular's component expose, from one declaration, so the three wrappers\n * cannot drift apart again.\n */\nexport type SeatingChartExposed = SeatingChartHandle;\n\n/**\n * Vue 3 wrapper around the framework-agnostic `@seatlayer/js` SDK.\n *\n * The canvas is created once and torn down on unmount. Only the props that\n * change the chart's identity (`SEATING_CHART_IDENTITY_PROPS`: `event`,\n * `apiBase`, `maxSelection`, `publicKey`, `locale`, `currency`,\n * `colorblindSafe`, `initialView`, `errorDisplay`) trigger a rebuild;\n * everything else is read live, so a parent re-render never destroys the canvas\n * mid-selection.\n *\n * Written as a render function rather than an SFC so the package builds with\n * plain TypeScript — a consumer needs no Vue compiler plugin to install it.\n *\n * @example\n * ```vue\n * <script setup lang=\"ts\">\n * import { ref } from 'vue';\n * import { SeatingChart, type SeatingChartExposed } from '@seatlayer/vue';\n *\n * const chart = ref<SeatingChartExposed | null>(null);\n * const checkout = async () => {\n *   const held = await chart.value?.hold();\n *   if (held) await pay(held.holdId);\n * };\n * </script>\n *\n * <template>\n *   <SeatingChart ref=\"chart\" event=\"summer-gala\" @selection-change=\"onChange\" />\n * </template>\n * ```\n */\nexport const SeatingChart = defineComponent({\n  name: 'SeatLayerSeatingChart',\n\n  props: {\n    /** Event key to render. Changing it rebuilds the chart. */\n    event: { type: String, required: true },\n    /** API base URL. Defaults to the public API. */\n    apiBase: { type: String, default: undefined },\n    /** Cap on how many seats a buyer may select. */\n    maxSelection: { type: Number, default: undefined },\n    /** Publishable key, when your integration uses one. */\n    publicKey: { type: String, default: undefined },\n    /** BCP-47 locale for built-in copy. */\n    locale: { type: String, default: undefined },\n    /** ISO currency for price formatting. */\n    currency: { type: String, default: undefined },\n    /** Render with colorblind-safe seat glyphs. */\n    colorblindSafe: { type: Boolean, default: undefined },\n    /**\n     * Initial canvas projection. Read once when the chart is built, so\n     * changing it rebuilds.\n     * @deprecated `'isometric'` and `'perspective'` are retired in favour of\n     * the real 3D venue view; use `'flat'`.\n     */\n    initialView: {\n      type: String as PropType<RendererViewMode>,\n      default: undefined,\n    },\n    /**\n     * What the BUYER sees when the chart cannot load: `'message'` (default) is\n     * a styleable notice with a Try again button, `'none'` is silent for hosts\n     * that render their own failure UI from the `error` event.\n     */\n    errorDisplay: {\n      type: String as PropType<'message' | 'none'>,\n      default: undefined,\n    },\n    /** Copy overrides, read once per mount. */\n    messages: {\n      type: Object as PropType<SeatingChartOptions['messages']>,\n      default: undefined,\n    },\n    /**\n     * Show the built-in seat tooltip. Set false to draw your own popover from\n     * the `seat-hover` event.\n     */\n    seatTooltip: { type: Boolean, default: undefined },\n    /**\n     * Sales Channels: mint a buyer access session on demand. Called with a\n     * `reason`; returns `{ token, expiresAt }` from YOUR backend. The token is\n     * held in memory only — never storage, never a URL, never a log.\n     */\n    buyerAccessTokenProvider: {\n      type: Function as PropType<BuyerAccessTokenProvider>,\n      default: undefined,\n    },\n    /** One-shot session for hosts that own the lifecycle. Cannot be renewed. */\n    buyerAccessToken: {\n      type: [String, Object] as PropType<string | BuyerAccessToken>,\n      default: undefined,\n    },\n  },\n\n  emits: {\n    /** The buyer's selection changed. */\n    'selection-change': (_seats: SelectedSeat[]) => true,\n    /** A hold succeeded. */\n    hold: (_result: HoldResult) => true,\n    /** A previous hold was restored on mount. */\n    'hold-restored': (_result: HoldResult) => true,\n    /** The active hold lapsed. */\n    'hold-expired': () => true,\n    /** A GA area was clicked. */\n    'ga-click': (_area: GAAreaAvailability) => true,\n    /** Something failed — a network error, a rejected hold. */\n    error: (_error: unknown) => true,\n    /** A floor deck was tapped in the 3D view. */\n    'deck-tap': (_floorId: string) => true,\n    /** A transient hint worth showing the buyer, or `null` to clear it. */\n    hint: (_message: string | null) => true,\n    /** The pointer moved onto a seat, or off one (`null`). */\n    'seat-hover': (_details: SeatHoverDetails | null) => true,\n    /** The buyer access session lapsed; `refreshed` says whether it recovered. */\n    'access-expired': (_event: BuyerAccessExpiredEvent) => true,\n    /** Private inventory is unavailable and refreshing will not fix it. */\n    'access-unavailable': (_event: BuyerAccessUnavailableEvent) => true,\n    /** Selected-but-unheld units stopped being selectable. */\n    'selected-object-unavailable': (_event: SelectedObjectUnavailableEvent) => true,\n  },\n\n  setup(props, { emit, expose }) {\n    const container: Ref<HTMLDivElement | null> = ref(null);\n    // shallowRef: the chart owns a canvas and a large scene graph, and making it\n    // deeply reactive would have Vue walk all of it on every touch.\n    const chart = shallowRef<CoreSeatingChart | null>(null);\n\n    const destroy = () => {\n      chart.value?.destroy();\n      chart.value = null;\n    };\n\n    const build = () => {\n      const element = container.value;\n      if (!element) return;\n\n      destroy();\n\n      // Handlers are bound here rather than inline in the options literal.\n      // Inline, TypeScript has to resolve `emit`'s overloads while it is still\n      // contextually typing the literal against SeatingChartOptions, and it\n      // gives up — collapsing to the last emit signature. Naming them first\n      // separates the two inference problems, and reads better besides.\n      const onSelectionChange = (seats: SelectedSeat[]) => emit('selection-change', seats);\n      const onHold = (result: HoldResult) => emit('hold', result);\n      const onHoldRestored = (result: HoldResult) => emit('hold-restored', result);\n      const onHoldExpired = () => emit('hold-expired');\n      const onGAClick = (area: GAAreaAvailability) => emit('ga-click', area);\n      const onError = (error: unknown) => emit('error', error);\n      const onDeckTap = (floorId: string) => emit('deck-tap', floorId);\n      const onHint = (message: string | null) => emit('hint', message);\n      const onSeatHover = (details: SeatHoverDetails | null) => emit('seat-hover', details);\n      const onAccessExpired = (state: BuyerAccessExpiredEvent) => emit('access-expired', state);\n      const onAccessUnavailable = (state: BuyerAccessUnavailableEvent) =>\n        emit('access-unavailable', state);\n      const onSelectedObjectUnavailable = (state: SelectedObjectUnavailableEvent) =>\n        emit('selected-object-unavailable', state);\n\n      const instance = new CoreSeatingChart(buildSeatingChartOptions(\n        element,\n        {\n          event: props.event,\n          apiBase: props.apiBase,\n          maxSelection: props.maxSelection,\n          publicKey: props.publicKey,\n          locale: props.locale,\n          currency: props.currency,\n          colorblindSafe: props.colorblindSafe,\n          initialView: props.initialView,\n          errorDisplay: props.errorDisplay,\n          messages: props.messages,\n          seatTooltip: props.seatTooltip,\n          buyerAccessTokenProvider: props.buyerAccessTokenProvider,\n          buyerAccessToken: props.buyerAccessToken,\n        },\n        {\n          onAccessExpired,\n          onAccessUnavailable,\n          onSelectedObjectUnavailable,\n          onSelectionChange,\n          onHold,\n          onHoldRestored,\n          onHoldExpired,\n          onGAClick,\n          onError,\n          onDeckTap,\n          onHint,\n          onSeatHover,\n        },\n      ));\n\n      chart.value = instance;\n      void instance.render();\n    };\n\n    // `flush: 'post'` so the container element exists on the first run — a\n    // pre-flush watcher would fire before the DOM node is attached.\n    watch(\n      () => [\n        container.value,\n        // The shared identity list, not a hand-copied one — this is exactly the\n        // place Vue fell two props behind React.\n        ...SEATING_CHART_IDENTITY_PROPS.map((prop) => props[prop]),\n      ],\n      build,\n      { immediate: true, flush: 'post' },\n    );\n\n    onBeforeUnmount(destroy);\n\n    // Built once and read live: the handle must survive every rebuild, so it\n    // asks for the current instance on each call rather than capturing one.\n    const exposed: SeatingChartExposed = bindSeatingChartHandle(() => chart.value);\n    expose(exposed);\n\n    return () => h('div', { ref: container });\n  },\n});\n","/**\n * @seatlayer/vue — the Vue 3 wrapper for the SeatLayer embed SDK.\n *\n * Components are written as render functions rather than SFCs, so installing\n * this package needs no Vue compiler plugin.\n */\nexport { SeatingChart } from './SeatingChart';\nexport type { SeatingChartExposed } from './SeatingChart';\n\nexport type {\n  SelectedSeat,\n  HoldResult,\n  BestAvailableResult,\n  GAAreaAvailability,\n  HoldLineItem,\n  SeatHoverDetails,\n} from '@seatlayer/js';\n\n// Sales Channels — buyer access sessions for private channel inventory.\nexport type {\n  BuyerAccessToken,\n  BuyerAccessTokenProvider,\n  BuyerAccessRefreshReason,\n  BuyerAccessUnavailableReason,\n  BuyerAccessExpiredEvent,\n  BuyerAccessUnavailableEvent,\n  SelectedObjectUnavailableEvent,\n} from '@seatlayer/js';\n\n// The framework-agnostic widget class — for the one-call modal (SeatPickerWidget.open()).\nexport { SeatPicker as SeatPickerWidget } from '@seatlayer/js';\n\n// Host-side embed helper: grows the iframe on `seatlayer:height` and pins it on\n// `seatlayer:fullscreen`. Vue hosts depend on this package alone, so it has to be\n// reachable here rather than only from @seatlayer/js.\nexport { attachPickerFrame } from '@seatlayer/js';\nexport type { AttachPickerFrameOptions } from '@seatlayer/js';\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seatlayer/vue",
-  "version": "0.52.0",
+  "version": "0.53.0",
   "description": "Vue 3 SeatLayer SDK — one native SeatingChart wrapper plus raw JS SeatPickerWidget and iframe helper.",
   "license": "MIT",
   "homepage": "https://docs.seatlayer.io/buyer-sdk/seat-picker/",
@@ -43,7 +43,8 @@
     "ticketing"
   ],
   "dependencies": {
-    "@seatlayer/js": "0.52.0"
+    "@seatlayer/core": "0.53.0",
+    "@seatlayer/js": "0.53.0"
   },
   "peerDependencies": {
     "vue": ">=3.3.0"