npm package diff

Package: @forge/bridge

Versions: 5.7.0-next.9 - 5.7.0-next.9-experimental-04e7c02

File: package/out/adf-renderer/adf-renderer.js

Index: package/out/adf-renderer/adf-renderer.js
===================================================================
--- package/out/adf-renderer/adf-renderer.js
+++ package/out/adf-renderer/adf-renderer.js
@@ -0,0 +1,187 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createAdfRendererIframeProps = exports.registerAdfRenderer = exports.ForgeADFRenderer = void 0;
+class ForgeADFRenderer extends HTMLElement {
+    constructor() {
+        super();
+        this._adfDocument = null;
+        this._isConnected = false;
+        this.iframe = null;
+        this.origin = new URL(document.referrer).origin;
+        this.attachShadowDOM();
+    }
+    static get observedAttributes() {
+        return ['adf-document', 'width', 'height'];
+    }
+    get adfDocument() {
+        return this._adfDocument;
+    }
+    set adfDocument(document) {
+        this.handleAdfDocumentChange(document);
+    }
+    attachShadowDOM() {
+        this.attachShadow({ mode: 'open' });
+        this.createShadowDOMContent();
+        this.cacheDOMReferences();
+    }
+    createShadowDOMContent() {
+        if (!this.shadowRoot)
+            return;
+        const styles = this.getComponentStyles();
+        const template = this.getHTMLTemplate();
+        this.shadowRoot.innerHTML = `${styles}${template}`;
+    }
+    getComponentStyles() {
+        return `
+            <style>
+                :host {
+                    display: block;
+                    width: 100%;
+                    height: 400px;
+                }
+
+                iframe {
+                    width: 100%;
+                    height: 100%;
+                    border: 1px solid #dfe1e6;
+                    border-radius: 3px;
+                }
+
+                .error {
+                    color: #de350b;
+                    background: #ffebe6;
+                    border: 1px solid #ff8f73;
+                    border-radius: 3px;
+                    padding: 12px;
+                    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+                }
+            </style>
+        `;
+    }
+    getHTMLTemplate() {
+        const iframeSrc = `${this.origin}/forge-apps/adf-renderer`;
+        return `
+            <iframe id="forge-adf-renderer-iframe"
+                    src="${iframeSrc}"
+                    frameborder="0"
+                    allowfullscreen>
+            </iframe>
+        `;
+    }
+    cacheDOMReferences() {
+        if (!this.shadowRoot)
+            return;
+        this.iframe = this.shadowRoot.getElementById('forge-adf-renderer-iframe');
+    }
+    connectedCallback() {
+        this._isConnected = true;
+        this.setupIframe();
+    }
+    attributeChangedCallback(name, _oldValue, newValue) {
+        if (!this._isConnected)
+            return;
+        switch (name) {
+            case 'adf-document':
+                try {
+                    const parsedDocument = newValue ? JSON.parse(newValue) : null;
+                    this.handleAdfDocumentChange(parsedDocument);
+                }
+                catch (error) {
+                    this.handleError(new Error(`Invalid ADF document: ${error.message}`));
+                }
+                break;
+            case 'width':
+                this.style.width = newValue || '100%';
+                break;
+            case 'height':
+                this.style.height = newValue || '400px';
+                break;
+        }
+    }
+    handleAdfDocumentChange(document) {
+        try {
+            this._adfDocument = document;
+            this.passAdfToIframe();
+        }
+        catch (error) {
+            this.handleError(error);
+        }
+    }
+    setupIframe() {
+        if (!this.iframe)
+            return;
+        try {
+            this.iframe.onload = () => {
+                this.passAdfToIframe();
+            };
+        }
+        catch (error) {
+            this.handleError(error);
+        }
+    }
+    passAdfToIframe() {
+        if (!this.iframe || !this.iframe.contentWindow)
+            return;
+        try {
+            const iframeWindow = this.iframe.contentWindow;
+            if (this._adfDocument) {
+                const message = {
+                    type: 'adf-document',
+                    document: this._adfDocument,
+                    timestamp: Date.now(),
+                    source: 'forge-adf-renderer'
+                };
+                iframeWindow.postMessage(message, this.origin);
+            }
+        }
+        catch (error) {
+        }
+    }
+    handleError(error) {
+        this.showErrorState(error);
+    }
+    showErrorState(error) {
+        if (!this.shadowRoot)
+            return;
+        const styles = this.getComponentStyles();
+        const errorTemplate = this.getErrorTemplate(error.message);
+        this.shadowRoot.innerHTML = `${styles}${errorTemplate}`;
+    }
+    getErrorTemplate(message) {
+        return `
+            <div class="error">
+                <strong>Error:</strong> ${message}
+            </div>
+        `;
+    }
+}
+exports.ForgeADFRenderer = ForgeADFRenderer;
+function registerAdfRenderer() {
+    if (!customElements.get('forge-adf-renderer')) {
+        customElements.define('forge-adf-renderer', ForgeADFRenderer);
+    }
+}
+exports.registerAdfRenderer = registerAdfRenderer;
+const createAdfRendererIframeProps = (adfDocument, iframeId) => {
+    const origin = new URL(document.referrer).origin;
+    const src = `${origin}/forge-apps/forge-adf-renderer`;
+    const guid = crypto.randomUUID();
+    const id = iframeId || `forge-adf-renderer-iframe-${guid}`;
+    const onLoad = () => {
+        var _a;
+        const iframe = document.getElementById(id);
+        const message = {
+            type: 'adf-document',
+            document: adfDocument,
+            timestamp: Date.now(),
+            source: 'forge-adf-renderer'
+        };
+        (_a = iframe.contentWindow) === null || _a === void 0 ? void 0 : _a.postMessage(message, origin);
+    };
+    return {
+        id,
+        src,
+        onLoad
+    };
+};
+exports.createAdfRendererIframeProps = createAdfRendererIframeProps;