@corti/embedded-web 0.1.0 → 0.2.0

package/dist/CortiEmbedded.js

@@ -4,27 +4,41 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 } from 'lit/decorators.js';
-import { baseStyles } from './styles/base.js';
-import { containerStyles } from './styles/container-styles.js';
-import { validateAndNormalizeBaseURL } from './utils/baseUrl.js';
-import { buildEmbeddedUrl, isRealEmbeddedLoad } from './utils/embedUrl.js';
-import { formatError } from './utils/errorFormatter.js';
-import { PostMessageHandler, } from './utils/PostMessageHandler.js';
+import { html, LitElement } from "lit";
+import { property } from "lit/decorators.js";
+import { baseStyles } from "./styles/base.js";
+import { containerStyles } from "./styles/container-styles.js";
+import { validateAndNormalizeBaseURL } from "./utils/baseUrl.js";
+import { buildEmbeddedUrl, isRealEmbeddedLoad } from "./utils/embedUrl.js";
+import { formatError } from "./utils/errorFormatter.js";
+import { PostMessageHandler, } from "./utils/PostMessageHandler.js";
+const IFRAME_SANDBOX_POLICY = "allow-forms allow-modals allow-scripts allow-same-origin";
 export class CortiEmbedded extends LitElement {
     constructor() {
         super(...arguments);
-        this.visibility = 'hidden';
+        this.visibility = "hidden";
         this.postMessageHandler = null;
         this.normalizedBaseURL = null;
     }
+    // eslint-disable-next-line class-methods-use-this
+    getIframeAllowPolicy(normalizedBaseURL) {
+        const permissionTarget = normalizedBaseURL
+            ? new URL(normalizedBaseURL).origin
+            : "*";
+        return [
+            `microphone ${permissionTarget}`,
+            `camera ${permissionTarget}`,
+            `device-capture ${permissionTarget}`,
+            `display-capture ${permissionTarget}`,
+            `clipboard-write ${permissionTarget}`,
+        ].join("; ");
+    }
     connectedCallback() {
         super.connectedCallback();
         // Ensure baseURL is provided
         if (!this.baseURL) {
             this.dispatchErrorEvent({
-                message: 'baseURL is required',
+                message: "baseURL is required",
             });
             return;
         }
@@ -34,9 +48,10 @@ export class CortiEmbedded extends LitElement {
         }
         catch (error) {
             this.dispatchErrorEvent({
-                message: error.message || 'Invalid baseURL',
+                message: error.message || "Invalid baseURL",
             });
-            throw error;
+            // Dispatch the error event rather than throwing so consumers can handle it
+            // via the 'error' event listener without wrapping connectedCallback in try/catch.
         }
     }
     disconnectedCallback() {
@@ -65,7 +80,7 @@ export class CortiEmbedded extends LitElement {
         }
         else {
             this.dispatchErrorEvent({
-                message: 'No iframe or contentWindow available',
+                message: "No iframe or contentWindow available",
             });
         }
     }
@@ -73,18 +88,29 @@ export class CortiEmbedded extends LitElement {
         this.dispatchEvent(new CustomEvent(event, { detail: data }));
     }
     dispatchEmbeddedEvent(rawEventName, payload) {
-        // Preserve raw DOM event passthrough for consumers listening directly.
+        if (rawEventName === "ready" || rawEventName === "loaded")
+            return;
+        // Pass all other events through as raw DOM events for direct listeners.
         this.dispatchPublicEvent(rawEventName, payload);
-        this.dispatchPublicEvent('embedded-event', {
+        // Forward supported embedded events through the generic 'event' stream so
+        // consumers can observe them without subscribing to each raw event name.
+        this.dispatchPublicEvent("event", {
+            name: rawEventName,
+            payload,
+        });
+        // Also emit the legacy 'embedded-event' stream for backward compatibility.
+        // This allows existing integrations listening for 'embedded-event' to continue
+        // working while newer consumers can use the 'event' stream.
+        this.dispatchPublicEvent("embedded-event", {
             name: rawEventName,
             payload,
         });
     }
     dispatchErrorEvent(error) {
-        this.dispatchPublicEvent('error', error);
+        this.dispatchPublicEvent("error", error);
     }
     isRealIframeLoad(iframe) {
-        const src = iframe.getAttribute('src') || '';
+        const src = iframe.getAttribute("src") || "";
         if (!this.normalizedBaseURL)
             return false;
         return isRealEmbeddedLoad(src, this.normalizedBaseURL);
@@ -108,43 +134,38 @@ export class CortiEmbedded extends LitElement {
         }
     }
     getIframe() {
-        return this.shadowRoot?.querySelector('iframe') || null;
+        return this.shadowRoot?.querySelector("iframe") || null;
     }
     updated(changedProps) {
         super.updated(changedProps);
-        if (changedProps.has('baseURL')) {
-            // Validate baseURL and normalize; fail fast on invalid input
+        if (changedProps.has("baseURL")) {
+            // Tear down the existing handler; the new one is created in handleIframeLoad
+            if (this.postMessageHandler) {
+                this.postMessageHandler.destroy();
+                this.postMessageHandler = null;
+            }
+            // Validate the new URL
             try {
                 this.normalizedBaseURL = validateAndNormalizeBaseURL(this.baseURL);
             }
             catch (error) {
-                // Tear down and clear iframe to avoid keeping an old origin active
-                if (this.postMessageHandler) {
-                    this.postMessageHandler.destroy();
-                    this.postMessageHandler = null;
-                }
+                this.normalizedBaseURL = null;
                 const iframe = this.getIframe();
                 if (iframe) {
-                    iframe.setAttribute('src', 'about:blank');
+                    iframe.setAttribute("src", "about:blank");
                 }
                 this.dispatchErrorEvent({
-                    message: error.message || 'Invalid baseURL',
+                    message: error.message || "Invalid baseURL",
                 });
                 return;
             }
-            // Tear down existing handler and re-point iframe to new URL
-            if (this.postMessageHandler) {
-                this.postMessageHandler.destroy();
-                this.postMessageHandler = null;
-            }
+            // Update the iframe to the new URL
             const iframe = this.getIframe();
             if (iframe) {
-                const expected = this.normalizedBaseURL
-                    ? buildEmbeddedUrl(this.normalizedBaseURL)
-                    : '';
-                if (iframe.getAttribute('src') !== expected) {
-                    iframe.setAttribute('src', expected);
-                    iframe.setAttribute('allow', `microphone ${expected}; camera ${expected}; device-capture ${expected}; display-capture ${expected}`);
+                const expected = buildEmbeddedUrl(this.normalizedBaseURL);
+                iframe.setAttribute("allow", this.getIframeAllowPolicy(expected));
+                if (iframe.getAttribute("src") !== expected) {
+                    iframe.setAttribute("src", expected);
                 }
             }
         }
@@ -157,7 +178,7 @@ export class CortiEmbedded extends LitElement {
      */
     async auth(credentials) {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
             const payload = {
@@ -168,18 +189,24 @@ export class CortiEmbedded extends LitElement {
                 refresh_expires_in: credentials.refresh_expires_in,
                 refresh_token: credentials.refresh_token,
                 id_token: credentials.id_token,
-                'not-before-policy': credentials['not-before-policy'],
+                "not-before-policy": credentials["not-before-policy"],
                 session_state: credentials.session_state,
                 scope: credentials.scope,
                 profile: credentials.profile,
-                mode: credentials.mode,
             };
-            const user = await this.postMessageHandler.auth(payload);
-            return user;
+            const response = await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "auth",
+                payload,
+            });
+            if (response.success && response.payload) {
+                return response.payload.user;
+            }
+            throw new Error(response.error);
         }
         catch (error) {
-            const formattedError = formatError(error, 'Authentication failed');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Authentication failed");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -190,18 +217,26 @@ export class CortiEmbedded extends LitElement {
      */
     async createInteraction(encounter) {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
-            const response = await this.postMessageHandler.createInteraction(encounter);
-            return {
-                id: response.id,
-                createdAt: response.createdAt,
-            };
+            const response = await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "createInteraction",
+                payload: encounter,
+            });
+            if (response.success && response.payload) {
+                const result = response.payload;
+                return {
+                    id: result.id,
+                    createdAt: result.createdAt,
+                };
+            }
+            throw new Error(response.error);
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to create interaction');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to create interaction");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -212,7 +247,7 @@ export class CortiEmbedded extends LitElement {
      */
     async configureSession(config) {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
             const payload = {
@@ -221,11 +256,15 @@ export class CortiEmbedded extends LitElement {
                 defaultTemplateKey: config.defaultTemplateKey,
                 defaultMode: config.defaultMode,
             };
-            await this.postMessageHandler.configureSession(payload);
+            await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "configureSession",
+                payload,
+            });
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to configure session');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to configure session");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -236,15 +275,19 @@ export class CortiEmbedded extends LitElement {
      */
     async addFacts(facts) {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
             const payload = { facts };
-            await this.postMessageHandler.addFacts(payload);
+            await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "addFacts",
+                payload,
+            });
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to add facts');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to add facts");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -255,15 +298,19 @@ export class CortiEmbedded extends LitElement {
      */
     async navigate(path) {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
             const payload = { path };
-            await this.postMessageHandler.navigate(payload);
+            await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "navigate",
+                payload,
+            });
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to navigate');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to navigate");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -273,14 +320,18 @@ export class CortiEmbedded extends LitElement {
      */
     async startRecording() {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
-            await this.postMessageHandler.startRecording();
+            await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "startRecording",
+                payload: {},
+            });
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to start recording');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to start recording");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -290,14 +341,18 @@ export class CortiEmbedded extends LitElement {
      */
     async stopRecording() {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
-            await this.postMessageHandler.stopRecording();
+            await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "stopRecording",
+                payload: {},
+            });
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to stop recording');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to stop recording");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -312,16 +367,24 @@ export class CortiEmbedded extends LitElement {
                     isAuthenticated: false,
                     user: undefined,
                 },
-                currentUrl: '',
+                currentUrl: "",
                 interaction: null,
             };
         }
         try {
-            return await this.postMessageHandler.getStatus();
+            const response = await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "getStatus",
+                payload: {},
+            });
+            if (response.success && response.payload) {
+                return response.payload;
+            }
+            throw new Error(response.error);
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to get status');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to get status");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -332,14 +395,22 @@ export class CortiEmbedded extends LitElement {
      */
     async configure(config) {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
-            return await this.postMessageHandler.configure(config);
+            const response = await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "configure",
+                payload: config,
+            });
+            if (response.success && response.payload) {
+                return response.payload;
+            }
+            throw new Error(response.error);
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to configure component');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to configure component");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -350,17 +421,21 @@ export class CortiEmbedded extends LitElement {
      */
     async setCredentials(credentials) {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
             if (!credentials.password) {
-                throw new Error('Password is required');
+                throw new Error("Password is required");
             }
-            await this.postMessageHandler.setCredentials(credentials);
+            await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "setCredentials",
+                payload: credentials,
+            });
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to set credentials');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to set credentials");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -368,28 +443,34 @@ export class CortiEmbedded extends LitElement {
      * Show the embedded UI
      */
     show() {
-        this.visibility = 'visible';
+        this.visibility = "visible";
     }
     /**
      * Hide the embedded UI
      */
     hide() {
-        this.visibility = 'hidden';
+        this.visibility = "hidden";
     }
     /**
      * Get templates
      */
     async getTemplates() {
         if (!this.postMessageHandler) {
-            throw new Error('Component not ready');
+            throw new Error("Component not ready");
         }
         try {
-            const response = await this.postMessageHandler.getTemplates();
-            return response;
+            const response = await this.postMessageHandler.postMessage({
+                type: "CORTI_EMBEDDED",
+                version: "v1",
+                action: "getTemplates",
+            });
+            if (response.success && response.payload) {
+                return response.payload;
+            }
+            throw new Error(response.error);
         }
         catch (error) {
-            const formattedError = formatError(error, 'Failed to get templates');
-            this.dispatchErrorEvent(formattedError);
+            const formattedError = formatError(error, "Failed to get templates");
             throw new Error(JSON.stringify(formattedError));
         }
     }
@@ -401,7 +482,7 @@ export class CortiEmbedded extends LitElement {
     getDebugStatus() {
         const iframe = this.getIframe();
         return {
-            ready: iframe?.contentDocument?.readyState === 'complete',
+            ready: iframe?.contentDocument?.readyState === "complete",
             iframeExists: !!iframe,
             iframeSrc: iframe?.src,
             iframeContentWindow: !!iframe?.contentWindow,
@@ -413,21 +494,23 @@ export class CortiEmbedded extends LitElement {
         };
     }
     render() {
-        // Don't render if baseURL is not provided
-        if (!this.baseURL) {
-            return html `<div>baseURL is required</div>`;
+        // Use the pre-validated normalizedBaseURL so render() never throws.
+        // normalizedBaseURL is set in connectedCallback (before first render) and
+        // kept up to date by updated() on each baseURL change.
+        if (!this.normalizedBaseURL) {
+            return html ``;
         }
         return html `
       <iframe
-        src=${buildEmbeddedUrl(validateAndNormalizeBaseURL(this.baseURL))}
+        src=${buildEmbeddedUrl(this.normalizedBaseURL)}
         title="Corti Embedded UI"
-        sandbox=${'allow-forms allow-modals allow-scripts allow-same-origin'}
-        allow="microphone *; camera *; device-capture *; display-capture *"
+        sandbox=${IFRAME_SANDBOX_POLICY}
+        allow=${this.getIframeAllowPolicy(this.normalizedBaseURL)}
         @load=${(event) => this.handleIframeLoad(event)}
         @unload=${() => this.postMessageHandler?.destroy()}
-        style=${this.visibility === 'hidden'
-            ? 'display: none;'
-            : 'display: block;'}
+        style=${this.visibility === "hidden"
+            ? "display: none;"
+            : "display: block;"}
       ></iframe>
     `;
     }