@coras-io/embed 0.1.0

package/dist/components/seated-selector/seated-selector.component.js

@@ -0,0 +1,321 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html, nothing } from "lit";
+import { property, state } from "lit/decorators.js";
+import { Task, TaskStatus } from "@lit/task";
+import { consume } from "@lit/context";
+import { localized, msg, str } from "@lit/localize";
+import { apiGet, withErrorHandling } from "../../core/api/queries.js";
+import { clientContext } from "../../contexts/client.context.js";
+import { currencyContext, distributorIdContext, localeContext, } from "../../contexts/properties.context.js";
+import { map } from "lit/directives/map.js";
+import { fireInternalEvent } from "../../core/events.js";
+import { convertToLocaleCurrency } from "../../core/currency/index.js";
+import { buildChartData, buildSelectionSummary, buildTickets, } from "../seats-io/seats-io.transform.js";
+import styles from "./seated-selector.styles.js";
+import "../seats-io/seats-io.js";
+import "../alert/alert.js";
+import "../button/button.js";
+const SEATS_ENDPOINT = "/{api_version}/theater-events/{coras_attraction_id}/instances/{instance_id}/seats";
+let CorasSeatedSelector = class CorasSeatedSelector extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.distributorID = "";
+        this.locale = "en-GB";
+        this.currency = "GBP";
+        this.attractionId = "";
+        this.instanceId = "";
+        this.assetsURL = "";
+        this.workspaceKey = "";
+        // Formatted performance date shown in the heading, e.g. "Sat 16 Mar 2023".
+        this.dateLabel = "";
+        this.region = "eu";
+        // Total seats the user must pick (sum of chosen ticket-type counts). Caps the
+        // chart selection and gates the confirm button.
+        this.ticketCount = 0;
+        this.selectedSeats = [];
+        this.selectionValid = true;
+        this.violations = [];
+        // Set once the host reports the seats reserved. Hides the fixed summary bar so
+        // it stops covering the basket that opens on top of it — until the shopper
+        // changes their selection, which reopens the bar for another go.
+        this.reserved = false;
+        this.fallbackFired = false;
+        this.seatsTask = new Task(this, {
+            task: async ([client, attractionId, instanceId, locale, distributorID, currency,]) => {
+                if (!client || !attractionId || !instanceId) {
+                    return null;
+                }
+                const { data } = await withErrorHandling(apiGet({
+                    client,
+                    distributorID,
+                    locale,
+                    endpoint: SEATS_ENDPOINT,
+                    path: {
+                        coras_attraction_id: attractionId,
+                        instance_id: instanceId,
+                    },
+                    query: { currency },
+                }));
+                return data ?? null;
+            },
+            args: () => [
+                this.client,
+                this.attractionId,
+                this.instanceId,
+                this.locale,
+                this.distributorID,
+                this.currency,
+            ],
+        });
+        // buildChartData must yield a stable reference: the chart child re-creates the
+        // whole seats.io map whenever its chartData property changes by identity, so a
+        // fresh object per render would destroy and rebuild the chart on every
+        // selection — an endless render loop. Rebuild only when the seats data or
+        // currency actually changes.
+        this.chartDataCache = null;
+        this.fallBackToSections = () => {
+            if (this.fallbackFired) {
+                return;
+            }
+            this.fallbackFired = true;
+            fireInternalEvent(this, "seats-unavailable", {});
+        };
+        this.handleObjectSelected = (event) => {
+            this.reserved = false;
+            const { label } = event.detail;
+            if (!this.selectedSeats.some((seat) => seat.id === label)) {
+                this.selectedSeats = [
+                    ...this.selectedSeats,
+                    { id: label, seatLabel: this.seatLabelFor(event.detail) },
+                ];
+            }
+        };
+        this.handleObjectDeselected = (event) => {
+            this.reserved = false;
+            const { label } = event.detail;
+            this.selectedSeats = this.selectedSeats.filter((seat) => seat.id !== label);
+        };
+        this.handleSelectionValid = () => {
+            this.selectionValid = true;
+            this.violations = [];
+        };
+        this.handleSelectionInvalid = (event) => {
+            this.selectionValid = false;
+            this.violations = event.detail.violations;
+        };
+        this.handleConfirm = () => {
+            const data = this.chartData;
+            if (!data || !this.isComplete) {
+                return;
+            }
+            const tickets = buildTickets(this.selectedLabels, data.availableSeats, data.flatPriceBands);
+            fireInternalEvent(this, "seats-confirmed", {
+                instanceId: this.instanceId,
+                tickets,
+            });
+        };
+    }
+    static { this.styles = styles; }
+    get chartData() {
+        const data = this.seatsTask.value;
+        if (!data) {
+            return null;
+        }
+        if (this.chartDataCache?.source !== data ||
+            this.chartDataCache.currency !== this.currency) {
+            this.chartDataCache = {
+                source: data,
+                currency: this.currency,
+                value: buildChartData(data, this.currency),
+            };
+        }
+        return this.chartDataCache.value;
+    }
+    get selectedLabels() {
+        return this.selectedSeats.map((seat) => seat.id);
+    }
+    // A new performance, price set, or ticket count is a fresh selection context.
+    // Drop seats chosen for the previous one before the next chart renders so they
+    // never carry into the new chart or reservation.
+    willUpdate(changed) {
+        if (changed.has("instanceId") || changed.has("ticketCount")) {
+            this.selectedSeats = [];
+            this.selectionValid = true;
+            this.violations = [];
+            this.reserved = false;
+        }
+    }
+    updated(changed) {
+        super.updated(changed);
+        if (this.seatsTask.status === TaskStatus.ERROR) {
+            this.fallBackToSections();
+            return;
+        }
+        if (this.seatsTask.status === TaskStatus.COMPLETE &&
+            !this.chartData?.selectableObjects.length) {
+            this.fallBackToSections();
+        }
+    }
+    // "STALLS-A-5" → "A5"; seats.io exposes row in labels.parent and seat in own.
+    seatLabelFor(object) {
+        const { own, parent } = object.labels;
+        return parent ? `${parent}${own}` : own;
+    }
+    // Called by the host once the reservation is created and the basket opens over
+    // the page, so the fixed summary bar closes instead of sitting on top of it.
+    reservationCreated() {
+        this.reserved = true;
+    }
+    get isComplete() {
+        if (this.selectedSeats.length === 0 || !this.selectionValid) {
+            return false;
+        }
+        return this.ticketCount
+            ? this.selectedSeats.length === this.ticketCount
+            : true;
+    }
+    formatPrice(value) {
+        return convertToLocaleCurrency({
+            value,
+            locale: this.locale,
+            currency: this.currency,
+        });
+    }
+    renderWarning() {
+        if (this.selectionValid || this.selectedSeats.length === 0) {
+            return nothing;
+        }
+        const message = this.violations.some((violation) => violation.toLowerCase().includes("orphan"))
+            ? msg("Please avoid leaving a single seat on its own.")
+            : msg("Please choose seats next to each other.");
+        return html `
+      <coras-alert assets-url=${this.assetsURL} variant="warning">
+        ${message}
+      </coras-alert>
+    `;
+    }
+    renderDrawer() {
+        const data = this.chartData;
+        if (!data || this.selectedSeats.length === 0 || this.reserved) {
+            return nothing;
+        }
+        const { groups, total } = buildSelectionSummary(this.selectedSeats, data.availableSeats, data.flatPriceBands, data.categories);
+        return html `
+      <div class="drawer" part="drawer">
+        <div class="drawer-summary">
+          <p class="drawer-total">${msg("Total")} ${this.formatPrice(total)}</p>
+          ${map(groups, (group) => html `
+              <p class="drawer-group">
+                <span
+                  class="drawer-dot"
+                  style="background:${group.color}"
+                ></span>
+                ${msg(str `${group.count} ${group.label} Tickets : ${group.seatLabels.join(", ")} (${this.formatPrice(group.unitPrice)} each)`)}
+              </p>
+            `)}
+        </div>
+
+        <coras-button
+          variant="primary"
+          height="sm"
+          ?disabled=${!this.isComplete}
+          @click=${this.handleConfirm}
+        >
+          ${msg("Add to basket")}
+        </coras-button>
+      </div>
+    `;
+    }
+    render() {
+        return this.seatsTask.render({
+            pending: () => html `<p class="status">${msg("Loading seat map…")}</p>`,
+            error: () => nothing,
+            complete: () => {
+                const chartData = this.chartData;
+                if (!chartData || chartData.selectableObjects.length === 0) {
+                    return nothing;
+                }
+                return html `
+          <p class="heading">
+            ${this.dateLabel
+                    ? msg(str `Select your seats for ${this.dateLabel}`)
+                    : msg("Select your seats")}
+          </p>
+
+          <coras-seats-io
+            workspace-key=${this.workspaceKey}
+            region=${this.region}
+            event=${this.instanceId}
+            language=${this.locale.split("-")[0] || "en"}
+            currency=${this.currency}
+            currency-locale=${this.locale}
+            max-selected-objects=${this.ticketCount}
+            .chartData=${chartData}
+            .selectedObjects=${this.selectedLabels}
+            @seats-io-object-selected=${this.handleObjectSelected}
+            @seats-io-object-deselected=${this.handleObjectDeselected}
+            @seats-io-selection-valid=${this.handleSelectionValid}
+            @seats-io-selection-invalid=${this.handleSelectionInvalid}
+            @seats-io-chart-rendering-failed=${this.fallBackToSections}
+          ></coras-seats-io>
+
+          ${this.renderWarning()} ${this.renderDrawer()}
+        `;
+            },
+        });
+    }
+};
+__decorate([
+    consume({ context: clientContext, subscribe: true })
+], CorasSeatedSelector.prototype, "client", void 0);
+__decorate([
+    consume({ context: distributorIdContext, subscribe: true })
+], CorasSeatedSelector.prototype, "distributorID", void 0);
+__decorate([
+    consume({ context: localeContext, subscribe: true })
+], CorasSeatedSelector.prototype, "locale", void 0);
+__decorate([
+    consume({ context: currencyContext, subscribe: true })
+], CorasSeatedSelector.prototype, "currency", void 0);
+__decorate([
+    property({ type: String, attribute: "attraction-id" })
+], CorasSeatedSelector.prototype, "attractionId", void 0);
+__decorate([
+    property({ type: String, attribute: "instance-id" })
+], CorasSeatedSelector.prototype, "instanceId", void 0);
+__decorate([
+    property({ type: String, attribute: "assets-url" })
+], CorasSeatedSelector.prototype, "assetsURL", void 0);
+__decorate([
+    property({ type: String, attribute: "workspace-key" })
+], CorasSeatedSelector.prototype, "workspaceKey", void 0);
+__decorate([
+    property({ type: String, attribute: "date-label" })
+], CorasSeatedSelector.prototype, "dateLabel", void 0);
+__decorate([
+    property({ type: String })
+], CorasSeatedSelector.prototype, "region", void 0);
+__decorate([
+    property({ type: Number, attribute: "ticket-count" })
+], CorasSeatedSelector.prototype, "ticketCount", void 0);
+__decorate([
+    state()
+], CorasSeatedSelector.prototype, "selectedSeats", void 0);
+__decorate([
+    state()
+], CorasSeatedSelector.prototype, "selectionValid", void 0);
+__decorate([
+    state()
+], CorasSeatedSelector.prototype, "violations", void 0);
+__decorate([
+    state()
+], CorasSeatedSelector.prototype, "reserved", void 0);
+CorasSeatedSelector = __decorate([
+    localized()
+], CorasSeatedSelector);
+export { CorasSeatedSelector };

package/dist/components/seated-selector/seated-selector.d.ts

@@ -0,0 +1,8 @@
+import { CorasSeatedSelector } from "./seated-selector.component.js";
+export * from "./seated-selector.component.js";
+export default CorasSeatedSelector;
+declare global {
+    interface HTMLElementTagNameMap {
+        "coras-seated-selector": CorasSeatedSelector;
+    }
+}

package/dist/components/seated-selector/seated-selector.js

@@ -0,0 +1,6 @@
+import { CorasSeatedSelector } from "./seated-selector.component.js";
+export * from "./seated-selector.component.js";
+export default CorasSeatedSelector;
+if (!customElements.get("coras-seated-selector")) {
+    customElements.define("coras-seated-selector", CorasSeatedSelector);
+}

package/dist/components/seated-selector/seated-selector.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/seated-selector/seated-selector.styles.js

@@ -0,0 +1,84 @@
+import { css } from "lit";
+import component from "../../styles/defaults/component.js";
+export default css `
+  ${component}
+
+  :host {
+    display: flex;
+    flex-direction: column;
+    gap: var(--coras-spacing-md, 16px);
+  }
+
+  .heading {
+    margin: 0;
+    color: var(--coras-color-text);
+    font-size: var(--coras-font-size-lg);
+    font-weight: var(--coras-font-weight-normal);
+    line-height: 1.5rem;
+  }
+
+  coras-seats-io {
+    display: block;
+    height: 600px;
+  }
+
+  .status {
+    margin: 0;
+    color: var(--coras-color-text);
+  }
+
+  .drawer {
+    position: fixed;
+    inset-inline: 0;
+    bottom: 0;
+    z-index: 20;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 24px;
+    box-sizing: border-box;
+    padding: 24px clamp(24px, 6vw, 96px);
+    background: var(--coras-color-background, #fcfcff);
+    border-top: 1px solid var(--coras-color-neutral-200, #e6e6e6);
+    box-shadow: 1px -4px 8px 4px rgba(0, 0, 0, 0.03);
+  }
+
+  .drawer-summary {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    min-width: 0;
+  }
+
+  .drawer-total {
+    margin: 0;
+    color: var(--coras-color-text);
+    font-size: var(--coras-font-size-base);
+    font-weight: var(--coras-font-weight-medium);
+  }
+
+  .drawer-group {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin: 0;
+    color: var(--coras-color-text);
+    font-size: var(--coras-font-size-sm);
+  }
+
+  .drawer-dot {
+    flex-shrink: 0;
+    width: 12px;
+    height: 12px;
+    border-radius: 50%;
+  }
+
+  @media (max-width: 600px) {
+    .drawer {
+      flex-direction: column;
+      align-items: stretch;
+      gap: 12px;
+      padding: 16px;
+    }
+  }
+`;

package/dist/components/seats-io/seats-io.component.d.ts

@@ -0,0 +1,27 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+import { Language } from "@seatsio/seatsio-types";
+import { SupportedCurrencies } from "../../core/types/index.js";
+import { SeatsChartData } from "./seats-io.transform.js";
+export declare class CorasSeatsIO extends LitElement {
+    static styles: CSSResultGroup;
+    region: string;
+    workspaceKey: string;
+    event: string;
+    language: Language;
+    currency: SupportedCurrencies;
+    currencyLocale: string;
+    chartData: SeatsChartData | null;
+    selectedObjects: string[];
+    maxSelectedObjects: number;
+    private container;
+    private seatsioInstance;
+    private eventsCallbacks;
+    private getConfig;
+    private loadSeatsio;
+    private getSeatsio;
+    private renderSeatsMap;
+    private getCdnUrl;
+    updated(changed: PropertyValues): Promise<void>;
+    disconnectedCallback(): void;
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/components/seats-io/seats-io.component.js

@@ -0,0 +1,162 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from "lit";
+import { property, query } from "lit/decorators.js";
+import { fireInternalEvent } from "../../core/events.js";
+import { SEATS_IO_DEFAULTS } from "./seats-io.constants.js";
+import styles from "./seats-io.styles.js";
+export class CorasSeatsIO extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.region = "eu";
+        this.workspaceKey = "";
+        this.event = "";
+        this.language = "en";
+        this.currency = "GBP";
+        this.currencyLocale = "en-GB";
+        // Coras-driven chart data (categories, pricing, selectability). When absent,
+        // the element renders a plain chart from workspace-key + event alone.
+        this.chartData = null;
+        this.selectedObjects = [];
+        this.maxSelectedObjects = 0;
+        this.seatsioInstance = null;
+        this.eventsCallbacks = {
+            onObjectSelected: (object) => fireInternalEvent(this, "seats-io-object-selected", object),
+            onObjectDeselected: (object) => fireInternalEvent(this, "seats-io-object-deselected", object),
+            onOrphanSeatsChanged: (object) => fireInternalEvent(this, "seats-io-orphan-seats-changed", object),
+            onSelectionValid: () => fireInternalEvent(this, "seats-io-selection-valid", {}),
+            onSelectionInvalid: (violations) => fireInternalEvent(this, "seats-io-selection-invalid", { violations }),
+            onChartRendered: (chart) => fireInternalEvent(this, "seats-io-chart-rendered", chart),
+            onChartRenderingFailed: (chart) => fireInternalEvent(this, "seats-io-chart-rendering-failed", chart),
+        };
+        // The seats.io chart bundle CDN, by region. Equivalent to the `seatsio`
+        // package's `Region.urlForId`, inlined so browser builds don't pull the
+        // seats.io *Node* SDK (an https-based API client) in for one URL.
+        this.getCdnUrl = () => {
+            return `https://api-${this.region}.seatsio.net/chart.js`;
+        };
+    }
+    static { this.styles = styles; }
+    getConfig() {
+        const base = {
+            ...SEATS_IO_DEFAULTS,
+            ...this.eventsCallbacks,
+            container: this.container,
+            workspaceKey: this.workspaceKey,
+            event: this.event,
+            language: this.language,
+        };
+        if (!this.chartData) {
+            return base;
+        }
+        const { categories, objectCategories, pricing, selectableObjects } = this.chartData;
+        // Selectability and colours are driven declaratively (selectableObjects +
+        // categories/objectCategories). seats.io serialises callbacks like
+        // isObjectSelectable/objectColor into its renderer iframe, where our
+        // closures over availableSeats are undefined and crash the render, so they
+        // are intentionally not used.
+        const config = {
+            ...base,
+            categories,
+            objectCategories,
+            pricing,
+            selectableObjects,
+            selectedObjects: this.selectedObjects,
+            ...(this.maxSelectedObjects
+                ? { maxSelectedObjects: this.maxSelectedObjects }
+                : {}),
+            selectionValidators: [{ type: "noOrphanSeats" }],
+            session: "continue",
+        };
+        return config;
+    }
+    loadSeatsio() {
+        return new Promise((resolve, reject) => {
+            const script = document.createElement("script");
+            script.onload = () => {
+                resolve(void 0);
+            };
+            script.onerror = () => reject(`Could not load ${script.src}`);
+            script.src = this.getCdnUrl();
+            document.head.appendChild(script);
+        });
+    }
+    getSeatsio() {
+        if (typeof seatsio === "undefined") {
+            return this.loadSeatsio();
+        }
+        else {
+            return Promise.resolve();
+        }
+    }
+    renderSeatsMap() {
+        if (!this.event || !this.workspaceKey) {
+            return;
+        }
+        const config = this.getConfig();
+        this.seatsioInstance = new seatsio.SeatingChart(config);
+        this.seatsioInstance.render();
+    }
+    async updated(changed) {
+        super.updated(changed);
+        if (changed.has("event") ||
+            changed.has("workspaceKey") ||
+            changed.has("region") ||
+            changed.has("language") ||
+            changed.has("chartData")) {
+            try {
+                await this.getSeatsio();
+                this.seatsioInstance?.destroy();
+                this.renderSeatsMap();
+            }
+            catch {
+                // The CDN script failed to load (or the renderer threw before it could
+                // call onChartRenderingFailed itself), so signal the failure explicitly.
+                // Without this the seat area stays blank and the section fallback never
+                // fires.
+                fireInternalEvent(this, "seats-io-chart-rendering-failed", {});
+            }
+        }
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.seatsioInstance?.destroy();
+    }
+    render() {
+        return html `<div id="chart"></div>`;
+    }
+}
+__decorate([
+    property({ type: String })
+], CorasSeatsIO.prototype, "region", void 0);
+__decorate([
+    property({ type: String, attribute: "workspace-key" })
+], CorasSeatsIO.prototype, "workspaceKey", void 0);
+__decorate([
+    property({ type: String })
+], CorasSeatsIO.prototype, "event", void 0);
+__decorate([
+    property({ type: String })
+], CorasSeatsIO.prototype, "language", void 0);
+__decorate([
+    property({ type: String })
+], CorasSeatsIO.prototype, "currency", void 0);
+__decorate([
+    property({ type: String, attribute: "currency-locale" })
+], CorasSeatsIO.prototype, "currencyLocale", void 0);
+__decorate([
+    property({ attribute: false })
+], CorasSeatsIO.prototype, "chartData", void 0);
+__decorate([
+    property({ attribute: false })
+], CorasSeatsIO.prototype, "selectedObjects", void 0);
+__decorate([
+    property({ type: Number, attribute: "max-selected-objects" })
+], CorasSeatsIO.prototype, "maxSelectedObjects", void 0);
+__decorate([
+    query("#chart")
+], CorasSeatsIO.prototype, "container", void 0);

package/dist/components/seats-io/seats-io.constants.d.ts

@@ -0,0 +1,12 @@
+export declare const SEATS_IO_DEFAULTS: {
+    showRowLabels: boolean;
+    showRowLines: boolean;
+    legend: {
+        hideNonSelectableCategories: boolean;
+    };
+    loading: string;
+    showActiveSectionTooltipOnMobile: boolean;
+};
+export declare const CATEGORY_COLORS: string[];
+export declare const SECTION_AVAILABLE_COLOR = "#16a085";
+export declare const SECTION_UNAVAILABLE_COLOR = "#b6bcc4";

package/dist/components/seats-io/seats-io.constants.js

@@ -0,0 +1,23 @@
+export const SEATS_IO_DEFAULTS = {
+    showRowLabels: true,
+    showRowLines: true,
+    legend: {
+        hideNonSelectableCategories: true,
+    },
+    loading: " ",
+    showActiveSectionTooltipOnMobile: false,
+};
+// Cycled per price-band category so each band gets a distinct legend swatch.
+export const CATEGORY_COLORS = [
+    "#2f6df6",
+    "#16a085",
+    "#e67e22",
+    "#8e44ad",
+    "#c0392b",
+    "#27ae60",
+    "#2980b9",
+    "#d35400",
+];
+// Section fill driven by availability (see setSectionColor).
+export const SECTION_AVAILABLE_COLOR = "#16a085";
+export const SECTION_UNAVAILABLE_COLOR = "#b6bcc4";

package/dist/components/seats-io/seats-io.d.ts

@@ -0,0 +1,8 @@
+import { CorasSeatsIO } from "./seats-io.component.js";
+export * from "./seats-io.component.js";
+export default CorasSeatsIO;
+declare global {
+    interface HTMLElementTagNameMap {
+        "coras-seats-io": CorasSeatsIO;
+    }
+}

package/dist/components/seats-io/seats-io.js

@@ -0,0 +1,6 @@
+import { CorasSeatsIO } from "./seats-io.component.js";
+export * from "./seats-io.component.js";
+export default CorasSeatsIO;
+if (!customElements.get("coras-seats-io")) {
+    customElements.define("coras-seats-io", CorasSeatsIO);
+}

package/dist/components/seats-io/seats-io.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;