@seatlayer/vue 0.48.2 → 0.50.0

package/README.md

@@ -5,9 +5,10 @@
 [![Vue](https://img.shields.io/badge/Vue-%E2%89%A53.3-42B883.svg)](https://vuejs.org/)
 [![License: MIT](https://img.shields.io/badge/license-MIT-111827.svg)](../../LICENSE)
 
-The official Vue 3 components for SeatLayer reserved seating. Render an
-interactive chart, hold inventory in the browser, and complete the booking from
-your trusted server.
+The official Vue 3 wrapper for SeatLayer reserved seating provides one native
+Vue component: `SeatingChart`. The buyer modal and iframe integration remain
+the framework-agnostic JavaScript `SeatPickerWidget` and `attachPickerFrame`
+helpers exported by this package; they are not additional Vue components.
 
 [Package on npm](https://www.npmjs.com/package/@seatlayer/vue) ·
 [SeatPicker docs](https://docs.seatlayer.io/buyer-sdk/seat-picker/) ·
@@ -61,7 +62,7 @@ async function checkout() {
 | `event` | `string` | **Required.** Changing it rebuilds the chart. |
 | `apiBase` | `string` | Defaults to the public API. |
 | `maxSelection` | `number` | Cap on how many seats a buyer may select. |
-| `publicKey` | `string` | Publishable key, when your integration uses one. |
+| `publicKey` | `string` | Reserved compatibility input; stored by the chart but not transmitted to SeatLayer. |
 | `locale` | `string` | BCP-47 locale for built-in copy. |
 | `currency` | `string` | ISO currency for price formatting. |
 | `colorblindSafe` | `boolean` | Render colorblind-safe seat glyphs. |
@@ -97,8 +98,8 @@ Everything on the template ref, typed as `SeatingChartExposed`:
 
 ## Also exported
 
-- `SeatPickerWidget` — the framework-agnostic one-call modal (`SeatPickerWidget.open()`).
-- `attachPickerFrame` — host-side iframe helper; grows on `seatlayer:height` and
+- `SeatPickerWidget` — raw framework-agnostic JavaScript one-call modal (`SeatPickerWidget.open()`).
+- `attachPickerFrame` — raw framework-agnostic JavaScript iframe helper; grows on `seatlayer:height` and
   pins on `seatlayer:fullscreen`.
 
 ## Related

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';\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  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"]}

package/dist/index.d.cts

@@ -2,7 +2,7 @@ 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';
-export { BestAvailableResult, BuyerAccessExpiredEvent, BuyerAccessRefreshReason, BuyerAccessToken, BuyerAccessTokenProvider, BuyerAccessUnavailableEvent, BuyerAccessUnavailableReason, GAAreaAvailability, HoldLineItem, HoldResult, SeatHoverDetails, SeatPicker as SeatPickerWidget, SelectedObjectUnavailableEvent, SelectedSeat, attachPickerFrame } 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.

package/dist/index.d.ts

@@ -2,7 +2,7 @@ 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';
-export { BestAvailableResult, BuyerAccessExpiredEvent, BuyerAccessRefreshReason, BuyerAccessToken, BuyerAccessTokenProvider, BuyerAccessUnavailableEvent, BuyerAccessUnavailableReason, GAAreaAvailability, HoldLineItem, HoldResult, SeatHoverDetails, SeatPicker as SeatPickerWidget, SelectedObjectUnavailableEvent, SelectedSeat, attachPickerFrame } 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.

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';\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  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":[]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@seatlayer/vue",
-  "version": "0.48.2",
-  "description": "Vue 3 components for the SeatLayer embed SDK — render an interactive seat picker and hold seats.",
+  "version": "0.50.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/",
   "repository": {
@@ -43,7 +43,7 @@
     "ticketing"
   ],
   "dependencies": {
-    "@seatlayer/js": "0.48.2"
+    "@seatlayer/js": "0.50.0"
   },
   "peerDependencies": {
     "vue": ">=3.3.0"