@coras-io/embed 0.1.0

package/dist/mixins/overlay/overlay-mixin.js

@@ -0,0 +1,86 @@
+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 } from "lit";
+import { property, state } from "lit/decorators.js";
+import "../../components/overlay/overlay.js";
+import { fireInternalEvent } from "../../core/events.js";
+import { scrollLock } from "../../core/utils/scroll-lock.js";
+export const OverlayMixin = (superClass) => {
+    class OverlayMixinElement extends superClass {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
+        constructor(...args) {
+            super();
+            this.open = false;
+            this.isVisible = false;
+            this._ownsScrollLock = false;
+            this.isVisible = this.open;
+            if (this.open) {
+                scrollLock.lock();
+                this._ownsScrollLock = true;
+            }
+        }
+        handleAnimationStarted(event) {
+            event.stopPropagation();
+            if (this.open) {
+                this.isVisible = true;
+            }
+        }
+        handleAnimationEnded(event) {
+            event.stopPropagation();
+            if (!this.open) {
+                this.isVisible = false;
+                if (this._ownsScrollLock) {
+                    scrollLock.unlock();
+                    this._ownsScrollLock = false;
+                }
+            }
+        }
+        updated(changedProperties) {
+            if (changedProperties.has("open")) {
+                if (this.open) {
+                    if (!this._ownsScrollLock) {
+                        scrollLock.lock();
+                        this._ownsScrollLock = true;
+                    }
+                }
+                else if (!this.isVisible && this._ownsScrollLock) {
+                    scrollLock.unlock();
+                    this._ownsScrollLock = false;
+                }
+            }
+            super.updated?.(changedProperties);
+        }
+        handleModalClosed() {
+            if (!this.open) {
+                return;
+            }
+            fireInternalEvent(this, "modal-closed", {});
+        }
+        disconnectedCallback() {
+            if (this._ownsScrollLock) {
+                scrollLock.unlock();
+                this._ownsScrollLock = false;
+            }
+            super.disconnectedCallback?.();
+        }
+        renderOverlay() {
+            return html `<coras-overlay
+        ?open=${this.open}
+        @click=${this.handleModalClosed}
+        @overlay-animation-started=${this.handleAnimationStarted}
+        @overlay-animation-ended=${this.handleAnimationEnded}
+      ></coras-overlay>`;
+        }
+    }
+    __decorate([
+        property({ type: Boolean })
+    ], OverlayMixinElement.prototype, "open", void 0);
+    __decorate([
+        state()
+    ], OverlayMixinElement.prototype, "isVisible", void 0);
+    return OverlayMixinElement;
+};

package/dist/mixins/overlay/types.d.ts

@@ -0,0 +1,8 @@
+import { TemplateResult } from "lit";
+export type Constructor<T> = new (...args: any[]) => T;
+export declare class OverlayMixinInterface {
+    open: boolean;
+    isVisible: boolean;
+    renderOverlay: () => TemplateResult;
+    handleModalClosed: () => void;
+}

package/dist/mixins/overlay/types.js

@@ -0,0 +1 @@
+export {};

package/dist/mixins/points/points.d.ts

@@ -0,0 +1,3 @@
+import { LitElement } from "lit";
+import { Constructor, PointsMixinInterface } from "./types.js";
+export declare const PointsMixin: <T extends Constructor<LitElement>>(superClass: T) => Constructor<PointsMixinInterface> & T;

package/dist/mixins/points/points.js

@@ -0,0 +1,30 @@
+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 { property } from "lit/decorators.js";
+export const PointsMixin = (superClass) => {
+    class PointsMixinElement extends superClass {
+        constructor() {
+            super(...arguments);
+            this.pointsLogoUrl = "";
+            this.pointsIconUrl = "";
+            this.pointsUnit = "";
+        }
+    }
+    __decorate([
+        property({ type: String, attribute: "points-logo-url" })
+    ], PointsMixinElement.prototype, "pointsLogoUrl", void 0);
+    __decorate([
+        property({ type: String, attribute: "points-icon-url" })
+    ], PointsMixinElement.prototype, "pointsIconUrl", void 0);
+    __decorate([
+        property({ type: String, attribute: "points-unit" })
+    ], PointsMixinElement.prototype, "pointsUnit", void 0);
+    __decorate([
+        property({ attribute: false })
+    ], PointsMixinElement.prototype, "calculateRewardPoints", void 0);
+    return PointsMixinElement;
+};

package/dist/mixins/points/types.d.ts

@@ -0,0 +1,8 @@
+import { CalculateRewardPoints } from "../../core/types/index.js";
+export type Constructor<T> = new (...args: any[]) => T;
+export declare class PointsMixinInterface {
+    pointsLogoUrl: string;
+    pointsIconUrl: string;
+    pointsUnit: string;
+    calculateRewardPoints: CalculateRewardPoints | undefined;
+}

package/dist/mixins/points/types.js

@@ -0,0 +1 @@
+export {};

package/dist/mixins/search-mixin/search-mixin.d.ts

@@ -0,0 +1,4 @@
+import { LitElement } from "lit";
+import { SearchMixinInterface } from "./types.js";
+import { Constructor } from "../../contexts/utils.js";
+export declare const SearchMixin: <T extends Constructor<LitElement>>(superClass: T) => Constructor<SearchMixinInterface> & T;

package/dist/mixins/search-mixin/search-mixin.js

@@ -0,0 +1,66 @@
+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 { consume } from "@lit/context";
+import { Task } from "@lit/task";
+import { debounce } from "../../core/utils/function.js";
+import { distributorIdContext, localeContext, apiHostContext, } from "../../contexts/properties.context.js";
+import { pageDispatchContext, } from "../../contexts/events.context.js";
+import { clientContext } from "../../contexts/client.context.js";
+import { apiGet } from "../../core/api/queries.js";
+export const SearchMixin = (superClass) => {
+    class SearchMixinElement extends superClass {
+        constructor() {
+            super(...arguments);
+            this.lastSearchTerm = "";
+            this.searchTask = new Task(this, {
+                autoRun: false,
+                task: async ([searchTerm, locale]) => {
+                    if (this.searchTask.value && this.lastSearchTerm === searchTerm) {
+                        return this.searchTask.value;
+                    }
+                    this.lastSearchTerm = searchTerm;
+                    const { data } = await apiGet({
+                        client: this.client,
+                        distributorID: this.distributorID,
+                        locale: locale || "en-US",
+                        endpoint: "/{api_version}/search",
+                        query: {
+                            query: searchTerm || "",
+                        },
+                    });
+                    return data;
+                },
+                args: () => [this.getSearchTerm(), this.locale],
+            });
+            this.throttledSearch = debounce({ delay: 500 }, (event) => {
+                const searchTerm = event.detail.value;
+                if (searchTerm && searchTerm.length >= 3) {
+                    this.searchTask.run();
+                }
+            });
+        }
+        getSearchTerm() {
+            return "";
+        }
+    }
+    __decorate([
+        consume({ context: localeContext })
+    ], SearchMixinElement.prototype, "locale", void 0);
+    __decorate([
+        consume({ context: pageDispatchContext })
+    ], SearchMixinElement.prototype, "dispatchPageUpdate", void 0);
+    __decorate([
+        consume({ context: distributorIdContext, subscribe: true })
+    ], SearchMixinElement.prototype, "distributorID", void 0);
+    __decorate([
+        consume({ context: apiHostContext, subscribe: true })
+    ], SearchMixinElement.prototype, "apiHost", void 0);
+    __decorate([
+        consume({ context: clientContext, subscribe: true })
+    ], SearchMixinElement.prototype, "client", void 0);
+    return SearchMixinElement;
+};

package/dist/mixins/search-mixin/types.d.ts

@@ -0,0 +1,7 @@
+import { Task } from "@lit/task";
+import { components } from "../../core/types/api-schema.js";
+export declare class SearchMixinInterface {
+    searchTask: Task<readonly [string, string | undefined], components["schemas"]["SearchGetResponse"] | undefined>;
+    getSearchTerm(): string;
+    throttledSearch(event: CustomEvent): void;
+}

package/dist/mixins/search-mixin/types.js

@@ -0,0 +1 @@
+export {};

package/dist/sdk/chrome.d.ts

@@ -0,0 +1,10 @@
+import type { CorasChrome } from "./types.js";
+/**
+ * Resolve the chrome option into slotted navbar/footer elements. The elements
+ * are returned detached; the caller appends them as light-DOM children of the
+ * page element so the page's `coras-layout` projects them and provides config
+ * via context. See plan Appendix D.
+ */
+export declare function createChrome(chrome: CorasChrome | undefined, options?: {
+    logo?: string;
+}): Promise<HTMLElement[]>;

package/dist/sdk/chrome.js

@@ -0,0 +1,83 @@
+import { safeUrl } from "@coras-io/brand-tokens";
+const SLOT_TAGS = {
+    navbar: "coras-navbar",
+    footer: "coras-footer",
+};
+const chromeLoaders = {
+    navbar: () => import("../containers/navbar/navbar.js"),
+    footer: () => import("../containers/footer/footer.js"),
+};
+function normalizeChrome(chrome) {
+    if (chrome === undefined || chrome === false) {
+        return { navbar: false, footer: false };
+    }
+    if (chrome === "managed") {
+        return { navbar: "managed", footer: "managed" };
+    }
+    return { navbar: chrome.navbar ?? false, footer: chrome.footer ?? false };
+}
+function isManagedSlot(spec) {
+    return (typeof spec === "object" &&
+        spec !== null &&
+        !(spec instanceof HTMLElement) &&
+        spec.use === "managed");
+}
+async function createCorasSlot(slot, managed, logo) {
+    await chromeLoaders[slot]();
+    const element = document.createElement(SLOT_TAGS[slot]);
+    element.setAttribute("slot", slot);
+    // The managed navbar renders this as a default logo unless the host slots a
+    // `brand` element below; the footer has no logo, so only set it for navbar.
+    if (slot === "navbar" && logo) {
+        element.logo = logo;
+    }
+    // Apply feature toggles as properties, not attributes: the navbar's booleans
+    // default to `true`, and a default-true boolean attribute cannot express
+    // `false` (its presence is the truthy signal). Property assignment can.
+    if (managed?.props) {
+        Object.assign(element, managed.props);
+    }
+    // Project host-owned content into the chrome element's named slots (e.g.
+    // `brand`). Slots left unspecified stay blank.
+    for (const [name, child] of Object.entries(managed?.slots ?? {})) {
+        if (!child)
+            continue;
+        child.setAttribute("slot", name);
+        element.appendChild(child);
+    }
+    return element;
+}
+async function createSlotElement(slot, spec, logo) {
+    if (spec === false || spec == null)
+        return null;
+    if (spec === "managed")
+        return createCorasSlot(slot, undefined, logo);
+    if (isManagedSlot(spec))
+        return createCorasSlot(slot, spec, logo);
+    if (typeof spec === "function") {
+        const element = await spec();
+        element.setAttribute("slot", slot);
+        return element;
+    }
+    spec.setAttribute("slot", slot);
+    return spec;
+}
+/**
+ * Resolve the chrome option into slotted navbar/footer elements. The elements
+ * are returned detached; the caller appends them as light-DOM children of the
+ * page element so the page's `coras-layout` projects them and provides config
+ * via context. See plan Appendix D.
+ */
+export async function createChrome(chrome, options) {
+    const normalized = normalizeChrome(chrome);
+    const elements = [];
+    // `theme.logo` is the public config and skips BrandConfig validation, so gate
+    // it here at the SDK boundary: an unsafe URL yields "" and renders no logo.
+    const navbar = await createSlotElement("navbar", normalized.navbar, safeUrl(options?.logo));
+    if (navbar)
+        elements.push(navbar);
+    const footer = await createSlotElement("footer", normalized.footer);
+    if (footer)
+        elements.push(footer);
+    return elements;
+}

package/dist/sdk/element-adapter.d.ts

@@ -0,0 +1,16 @@
+import type { CorasCallbacks, CorasHostEventName } from "./types.js";
+export type CallbackBridge = {
+    /** Remove all listeners. Safe to call multiple times. */
+    dispose(): void;
+};
+type BridgeOptions = {
+    /** Reports errors thrown inside host callbacks. */
+    onListenerError?: (error: unknown, event: CorasHostEventName) => void;
+};
+/**
+ * Attaches per-mount listeners for the `coras:*` events on `target` and routes
+ * each to the matching callback. Because listeners live on the mount's own
+ * element, events from one mount never reach another mount's callbacks.
+ */
+export declare function attachCallbackBridge(target: EventTarget, callbacks: CorasCallbacks, options?: BridgeOptions): CallbackBridge;
+export {};

package/dist/sdk/element-adapter.js

@@ -0,0 +1,60 @@
+/**
+ * Maps each host-facing DOM event to its `mount()` callback. DOM events remain
+ * the internal page-to-SDK boundary; this bridge lets normal integrations use
+ * typed callbacks instead of `addEventListener`. See P-011 and ADR 0001.
+ */
+const EVENT_TO_CALLBACK = {
+    "coras:ready": "onReady",
+    "coras:navigate": "onNavigate",
+    "coras:state-change": "onStateChange",
+    "coras:reservation-created": "onReservationCreated",
+    "coras:payment-status": "onPaymentStatus",
+    "coras:error": "onError",
+};
+/**
+ * Attaches per-mount listeners for the `coras:*` events on `target` and routes
+ * each to the matching callback. Because listeners live on the mount's own
+ * element, events from one mount never reach another mount's callbacks.
+ */
+export function attachCallbackBridge(target, callbacks, options = {}) {
+    const registered = [];
+    const hostEventNames = Object.keys(EVENT_TO_CALLBACK);
+    for (const eventName of hostEventNames) {
+        const callbackName = EVENT_TO_CALLBACK[eventName];
+        const handler = ((event) => {
+            const callback = callbacks[callbackName];
+            if (!callback)
+                return;
+            try {
+                callback(event.detail);
+            }
+            catch (error) {
+                // A throwing host callback must not break the SDK or other callbacks.
+                options.onListenerError?.(error, eventName);
+                // Route the failure to onError, unless onError itself threw.
+                if (callbackName !== "onError" && callbacks.onError) {
+                    const detail = {
+                        code: "callback_error",
+                        message: `The "${callbackName}" callback threw.`,
+                    };
+                    try {
+                        callbacks.onError(detail);
+                    }
+                    catch (nestedError) {
+                        options.onListenerError?.(nestedError, eventName);
+                    }
+                }
+            }
+        });
+        target.addEventListener(eventName, handler);
+        registered.push([eventName, handler]);
+    }
+    return {
+        dispose() {
+            for (const [eventName, handler] of registered) {
+                target.removeEventListener(eventName, handler);
+            }
+            registered.length = 0;
+        },
+    };
+}

package/dist/sdk/meta.d.ts

@@ -0,0 +1,7 @@
+import type { CorasPageMeta, CorasPageName } from "./types.js";
+/**
+ * Public metadata for a page. Currently exposes the internal custom-element tag
+ * used to render it; richer SEO metadata (title/description/canonical/JSON-LD)
+ * is added under the SEO work (plan P-072).
+ */
+export declare function getPageMeta(page: CorasPageName): CorasPageMeta;

package/dist/sdk/meta.js

@@ -0,0 +1,9 @@
+import { defaultPageRegistry } from "./page-registry.js";
+/**
+ * Public metadata for a page. Currently exposes the internal custom-element tag
+ * used to render it; richer SEO metadata (title/description/canonical/JSON-LD)
+ * is added under the SEO work (plan P-072).
+ */
+export function getPageMeta(page) {
+    return { page, tagName: defaultPageRegistry[page].tagName };
+}

package/dist/sdk/mount.d.ts

@@ -0,0 +1,19 @@
+import { type PageRegistry } from "./page-registry.js";
+import type { CorasApp, CorasMountOptions } from "./types.js";
+/**
+ * Create a `mount` function bound to a page registry. The public `mount` uses
+ * the real registry; tests inject a lightweight registry so lifecycle behavior
+ * is verifiable without loading the heavy page modules.
+ */
+export declare function createMountWith(registry: PageRegistry): (options: CorasMountOptions) => CorasApp;
+/**
+ * Mount a Coras page into a host container and return a synchronous app handle.
+ *
+ * ```ts
+ * const app = mount({ container, page: "landing", config });
+ * await app.ready;
+ * app.update({ page: "search", params: { search: "museum" } });
+ * app.unmount();
+ * ```
+ */
+export declare const mount: (options: CorasMountOptions) => CorasApp;