@einblick/sdk 0.7.0 → 0.7.3

package/dist/react/runtime.js

@@ -7,6 +7,7 @@ const EINBLICK_ACCENT_COLOR = `var(${EINBLICK_ACCENT_COLOR_VAR}, ${DEFAULT_EINBL
 const EINBLICK_ACCENT_TINT = `color-mix(in srgb, ${EINBLICK_ACCENT_COLOR} 12%, transparent)`;
 const EINBLICK_ACCENT_HOVER_COLOR = `color-mix(in srgb, ${EINBLICK_ACCENT_COLOR} 92%, black)`;
 const CONTROL_BAR_HEIGHT = 44;
+const BRIDGE_CONNECTION_TIMEOUT_MS = 8000;
 function getBrandBadgeSvg(size) {
     return `
     <svg viewBox="0 0 40 40" width="${size}" height="${size}" aria-hidden="true" focusable="false">
@@ -67,11 +68,15 @@ function createDatabaseIconElement(size) {
     return svg;
 }
 function createRandomId() {
-    if (typeof crypto !== 'undefined' &&
-        typeof crypto.randomUUID === 'function') {
+    if (typeof crypto === 'undefined') {
+        throw new Error('Secure browser randomness is unavailable');
+    }
+    if (typeof crypto.randomUUID === 'function') {
         return crypto.randomUUID();
     }
-    return Math.random().toString(36).slice(2);
+    const bytes = new Uint8Array(16);
+    crypto.getRandomValues(bytes);
+    return Array.from(bytes, (byte) => byte.toString(16).padStart(2, '0')).join('');
 }
 function stopEvent(event) {
     event.preventDefault();
@@ -202,6 +207,14 @@ function injectRuntimeStyles() {
       cursor: pointer;
     }
 
+    [data-einblick-edit-controls][hidden],
+    [data-einblick-edit-button][hidden],
+    [data-einblick-collection-create-button][hidden],
+    [data-einblick-collection-create-wrapper][hidden],
+    [data-einblick-field-button][hidden] {
+      display: none !important;
+    }
+
     [data-einblick-edit-button] svg,
     [data-einblick-collection-create-button] svg,
     [data-einblick-field-button] svg {
@@ -457,12 +470,17 @@ class EinblickEditRuntime {
     callbacks;
     chrome;
     reserveBottomSpace;
+    persist;
     locale;
     messages;
     accentColor;
     originalRootAccentColor;
     bridgeNonce = createRandomId();
     session;
+    brokerId = null;
+    brokerReadyWaiters = new Set();
+    collectionCreateControls = new Map();
+    loginPreparing = false;
     state = {
         enabled: true,
         active: true,
@@ -500,6 +518,7 @@ class EinblickEditRuntime {
     currentInlineRestoreState = null;
     inlineSaveInFlight = null;
     editorBackdrop = null;
+    editorFrame = null;
     editorNonce = null;
     editorTarget = null;
     editorBinding = null;
@@ -517,6 +536,7 @@ class EinblickEditRuntime {
         this.chrome = options.chrome ?? 'bar';
         this.reserveBottomSpace =
             options.reserveBottomSpace ?? this.chrome === 'bar';
+        this.persist = options.persist ?? true;
         this.locale = resolveEinblickSdkLocale(options.locale);
         this.messages = getEinblickSdkMessages(this.locale);
         this.accentColor = normalizeAccentColor(options.accentColor);
@@ -673,12 +693,12 @@ class EinblickEditRuntime {
         this.removeNavigatorPanel(false);
         this.closeDrawer();
         this.restoreAccentColor();
+        for (const control of this.collectionCreateControls.values()) {
+            control.container.remove();
+        }
+        this.collectionCreateControls.clear();
         if (this.pendingLogin) {
-            if (this.pendingLogin.closePollId !== null) {
-                window.clearInterval(this.pendingLogin.closePollId);
-            }
-            this.pendingLogin.resolve(false);
-            this.pendingLogin = null;
+            this.resolvePendingLogin(this.pendingLogin.nonce, false, true);
         }
         for (const pending of this.pendingInlineSaves.values()) {
             window.clearTimeout(pending.timeoutId);
@@ -690,6 +710,7 @@ class EinblickEditRuntime {
             pending.reject(new Error(this.messages.errors.editingInterrupted));
         }
         this.pendingInlineMediaSaves.clear();
+        this.resolveBrokerReadyWaiters(null);
         this.setState({
             enabled: true,
             active: false,
@@ -726,42 +747,123 @@ class EinblickEditRuntime {
         if (typeof window === 'undefined') {
             return false;
         }
+        if (this.pendingLogin || this.loginPreparing) {
+            return false;
+        }
+        this.loginPreparing = true;
         const returnTo = options?.returnTo ?? window.location.href;
         const loginNonce = createRandomId();
-        const loginUrl = this.buildBridgeUrl({
-            mode: 'login',
-            nonce: loginNonce,
-            returnTo,
-        });
-        if (this.pendingLogin) {
-            return false;
+        const popupFeatures = 'popup=yes,width=680,height=820,resizable=yes,scrollbars=yes';
+        let popup = null;
+        try {
+            // Reserve the popup while a direct user gesture is still active. The
+            // secure bridge may need a moment to prepare its broker, and opening a
+            // window after that await is blocked by browsers with strict popup
+            // policies. Navigation happens only after the SDK has registered the
+            // exact popup, nonce, and message source below.
+            popup = window.open('about:blank', 'einblick-edit-login', popupFeatures);
         }
-        return await new Promise((resolve) => {
-            let popup = null;
-            try {
-                popup = window.open(loginUrl, 'einblick-edit-login', 'popup=yes,width=680,height=820,resizable=yes,scrollbars=yes');
+        catch {
+            popup = null;
+        }
+        try {
+            const brokerId = await this.waitForBrokerId();
+            if (!brokerId) {
+                try {
+                    popup?.close();
+                }
+                catch { }
+                const message = this.messages.errors.bridgeNotConnected;
+                this.callbacks.onError?.(message);
+                return false;
             }
-            catch {
+            const loginUrl = this.buildBridgeUrl({
+                mode: 'login',
+                nonce: loginNonce,
+                returnTo,
+            });
+            if (popup?.closed) {
                 popup = null;
             }
+            if (!popup) {
+                try {
+                    popup = window.open('about:blank', 'einblick-edit-login', popupFeatures);
+                }
+                catch {
+                    popup = null;
+                }
+            }
             if (!popup) {
                 window.location.assign(loginUrl);
-                resolve(false);
-                return;
+                return false;
             }
-            popup.focus();
-            const closePollId = window.setInterval(() => {
-                if (!popup || popup.closed) {
-                    window.clearInterval(closePollId);
-                    if (this.pendingLogin?.nonce === loginNonce) {
-                        this.pendingLogin.resolve(false);
-                        this.pendingLogin = null;
+            const loginResult = new Promise((resolve) => {
+                const closePollId = window.setInterval(() => {
+                    if (!popup || popup.closed) {
+                        this.resolvePendingLogin(loginNonce, false);
                     }
+                }, 400);
+                this.pendingLogin = { nonce: loginNonce, popup, resolve, closePollId };
+            });
+            try {
+                popup.location.assign(loginUrl);
+                popup.focus();
+            }
+            catch {
+                this.resolvePendingLogin(loginNonce, false, true);
+                window.location.assign(loginUrl);
+                return false;
+            }
+            return await loginResult;
+        }
+        finally {
+            this.loginPreparing = false;
+        }
+    }
+    resolvePendingLogin(nonce, result, closePopup = false) {
+        const pending = this.pendingLogin;
+        if (!pending || pending.nonce !== nonce) {
+            return false;
+        }
+        if (pending.closePollId !== null) {
+            window.clearInterval(pending.closePollId);
+        }
+        this.pendingLogin = null;
+        if (closePopup) {
+            try {
+                pending.popup?.close();
+            }
+            catch { }
+        }
+        pending.resolve(result);
+        return true;
+    }
+    waitForBrokerId() {
+        if (this.brokerId) {
+            return Promise.resolve(this.brokerId);
+        }
+        this.pingBridge();
+        return new Promise((resolve) => {
+            let settled = false;
+            const finish = (brokerId) => {
+                if (settled) {
+                    return;
                 }
-            }, 400);
-            this.pendingLogin = { nonce: loginNonce, popup, resolve, closePollId };
+                settled = true;
+                window.clearTimeout(timeoutId);
+                this.brokerReadyWaiters.delete(finish);
+                resolve(brokerId);
+            };
+            const timeoutId = window.setTimeout(() => finish(null), BRIDGE_CONNECTION_TIMEOUT_MS);
+            this.brokerReadyWaiters.add(finish);
         });
     }
+    resolveBrokerReadyWaiters(brokerId) {
+        for (const resolve of this.brokerReadyWaiters) {
+            resolve(brokerId);
+        }
+        this.brokerReadyWaiters.clear();
+    }
     openEditor(binding, element) {
         this.setBrandPopoverOpen(false);
         this.setBottomBarMenuOpen(false);
@@ -919,14 +1021,24 @@ class EinblickEditRuntime {
             return;
         }
         if (data.source === EINBLICK_BRIDGE_SOURCE) {
+            if (event.source !== this.bridgeFrame?.contentWindow) {
+                return;
+            }
             this.handleBridgeMessage(data);
             return;
         }
         if (data.source === EINBLICK_AUTH_SOURCE) {
+            if (event.source !== this.pendingLogin?.popup) {
+                return;
+            }
             this.handleAuthMessage(data);
             return;
         }
         if (data.source === EINBLICK_EDITOR_SOURCE) {
+            if (event.source !== this.editorFrame?.contentWindow &&
+                event.source !== this.navigatorFrame?.contentWindow) {
+                return;
+            }
             this.handleEditorMessage(data);
         }
     };
@@ -936,7 +1048,10 @@ class EinblickEditRuntime {
         }
         if (message.type === 'bridge-ready') {
             this.clearBridgePing();
+            this.brokerId = message.brokerId ?? this.brokerId;
+            this.resolveBrokerReadyWaiters(this.brokerId);
             if (message.authenticated) {
+                this.setSession({ active: true, expiresAt: message.expiresAt });
                 this.setState({
                     enabled: true,
                     active: true,
@@ -964,6 +1079,26 @@ class EinblickEditRuntime {
             }
             return;
         }
+        if (message.type === 'broker-proof-result') {
+            const pending = this.pendingLogin;
+            if (!pending ||
+                message.requestId !== pending.nonce ||
+                message.brokerId !== this.brokerId) {
+                return;
+            }
+            try {
+                pending.popup?.postMessage({
+                    source: EINBLICK_AUTH_SOURCE,
+                    type: 'broker-proof-result',
+                    nonce: pending.nonce,
+                    requestId: message.requestId,
+                    brokerId: message.brokerId,
+                    ciphertext: message.ciphertext,
+                }, this.appOrigin);
+            }
+            catch { }
+            return;
+        }
         if (message.type === 'logout-result') {
             const pending = this.pendingLogout;
             if (!pending || pending.requestId !== message.requestId) {
@@ -1011,35 +1146,42 @@ class EinblickEditRuntime {
         if (!this.pendingLogin || message.nonce !== this.pendingLogin.nonce) {
             return;
         }
-        if (this.pendingLogin.closePollId !== null) {
-            window.clearInterval(this.pendingLogin.closePollId);
+        if (message.type === 'broker-proof-request') {
+            if (message.requestId !== this.pendingLogin.nonce ||
+                message.brokerId !== this.brokerId ||
+                !this.bridgeFrame?.contentWindow) {
+                return;
+            }
+            try {
+                this.bridgeFrame.contentWindow.postMessage({
+                    source: EINBLICK_PARENT_SOURCE,
+                    type: 'broker-proof-request',
+                    nonce: this.bridgeNonce,
+                    requestId: message.requestId,
+                    brokerId: message.brokerId,
+                    publicKey: message.publicKey,
+                }, this.appOrigin);
+            }
+            catch { }
+            return;
         }
         const pending = this.pendingLogin;
-        this.pendingLogin = null;
         if (message.ok) {
-            if (!message.sessionToken) {
+            if (!message.brokerId || message.brokerId !== this.brokerId) {
                 const errorMessage = this.messages.errors.signInDidNotReturnSession;
                 this.setState({ ...this.state, errorMessage, status: 'error' });
                 this.callbacks.onError?.(errorMessage);
-                pending.resolve(false);
+                this.resolvePendingLogin(pending.nonce, false, true);
                 return;
             }
-            this.setSession({
-                sessionToken: message.sessionToken,
-                expiresAt: message.expiresAt,
-            });
-            try {
-                pending.popup?.close();
-            }
-            catch { }
-            this.reloadBridge();
-            pending.resolve(true);
+            this.pingBridge();
+            this.resolvePendingLogin(pending.nonce, true, true);
             return;
         }
         const errorMessage = message.message || this.messages.errors.signInFailed;
         this.setState({ ...this.state, errorMessage, status: 'error' });
         this.callbacks.onError?.(errorMessage);
-        pending.resolve(false);
+        this.resolvePendingLogin(pending.nonce, false, true);
     }
     handleEditorMessage(message) {
         if (this.navigatorNonce && message.nonce === this.navigatorNonce) {
@@ -1133,24 +1275,13 @@ class EinblickEditRuntime {
         }
     }
     setSession(session) {
-        const previousSessionToken = this.session?.sessionToken ?? null;
+        const wasActive = this.session !== null;
         this.session = session && !isEditSessionExpired(session) ? session : null;
-        const nextSessionToken = this.session?.sessionToken ?? null;
-        if (previousSessionToken !== nextSessionToken) {
+        if (wasActive !== (this.session !== null)) {
             this.removeNavigatorPanel(false);
         }
         this.callbacks.onSessionChange(this.session);
     }
-    getActiveSessionToken() {
-        if (!this.session) {
-            return null;
-        }
-        if (isEditSessionExpired(this.session)) {
-            this.setSession(null);
-            return null;
-        }
-        return this.session.sessionToken;
-    }
     setState(nextState) {
         this.state = nextState;
         this.callbacks.onStateChange(nextState);
@@ -1739,10 +1870,15 @@ class EinblickEditRuntime {
         }
     }
     async logoutFromEinblick() {
+        await this.endEditSession(true);
+    }
+    async deactivateEditSession() {
+        await this.endEditSession(false);
+    }
+    async endEditSession(signOut) {
         if (typeof window === 'undefined') {
             return;
         }
-        const sessionToken = this.getActiveSessionToken();
         this.setSession(null);
         this.setState({
             enabled: true,
@@ -1752,13 +1888,13 @@ class EinblickEditRuntime {
             siteName: this.state.siteName,
             errorMessage: undefined,
         });
-        const loggedOutViaBridge = await this.requestBridgeLogout();
+        const loggedOutViaBridge = await this.requestBridgeLogout(signOut);
         if (!loggedOutViaBridge) {
-            await this.logoutViaPopup(sessionToken);
+            await this.logoutViaPopup(signOut);
         }
         this.reloadBridge();
     }
-    requestBridgeLogout() {
+    requestBridgeLogout(signOut) {
         if (typeof window === 'undefined' || this.pendingLogout) {
             return Promise.resolve(false);
         }
@@ -1782,6 +1918,7 @@ class EinblickEditRuntime {
                     type: 'logout',
                     nonce: this.bridgeNonce,
                     requestId,
+                    signOut,
                 }, this.appOrigin);
             }
             catch {
@@ -1793,12 +1930,12 @@ class EinblickEditRuntime {
             }
         });
     }
-    async logoutViaPopup(sessionToken) {
+    async logoutViaPopup(signOut) {
         const logoutUrl = this.buildBridgeUrl({
             mode: 'logout',
             nonce: createRandomId(),
             returnTo: window.location.href,
-            sessionToken,
+            signOut,
         });
         let popup = null;
         try {
@@ -2046,23 +2183,22 @@ class EinblickEditRuntime {
         frame.src = this.buildBridgeUrl({ mode: 'bridge', nonce: this.bridgeNonce });
         this.bridgeFrame = frame;
         document.body.append(frame);
-        const sendPing = () => {
-            if (!this.bridgeFrame?.contentWindow) {
-                return;
-            }
-            try {
-                this.bridgeFrame.contentWindow.postMessage({
-                    source: EINBLICK_PARENT_SOURCE,
-                    type: 'bridge-ping',
-                    nonce: this.bridgeNonce,
-                }, this.appOrigin);
-            }
-            catch { }
-        };
         frame.addEventListener('load', () => {
-            sendPing();
+            this.pingBridge();
         });
-        this.bridgePingInterval = window.setInterval(sendPing, 1500);
+        this.bridgePingInterval = window.setInterval(() => this.pingBridge(), 1500);
+    }
+    pingBridge() {
+        if (!this.bridgeFrame?.contentWindow)
+            return;
+        try {
+            this.bridgeFrame.contentWindow.postMessage({
+                source: EINBLICK_PARENT_SOURCE,
+                type: 'bridge-ping',
+                nonce: this.bridgeNonce,
+            }, this.appOrigin);
+        }
+        catch { }
     }
     clearBridgePing() {
         if (this.bridgePingInterval !== null) {
@@ -2075,28 +2211,33 @@ class EinblickEditRuntime {
         url.searchParams.set('siteKey', this.siteKey);
         url.searchParams.set('origin', window.location.origin);
         url.searchParams.set('nonce', args.nonce);
+        url.searchParams.set('protocol', '2');
+        url.searchParams.set('persist', this.persist ? '1' : '0');
         if (args.mode !== 'bridge') {
             url.searchParams.set('mode', args.mode);
         }
-        const sessionToken = args.sessionToken ??
-            (args.mode === 'bridge' ? this.getActiveSessionToken() : null);
-        if (sessionToken) {
-            url.searchParams.set('sessionToken', sessionToken);
+        const brokerId = args.brokerId ?? (args.mode === 'login' ? this.brokerId : null);
+        if (brokerId) {
+            url.searchParams.set('brokerId', brokerId);
         }
         if (args.returnTo) {
             url.searchParams.set('returnTo', args.returnTo);
         }
+        if (args.signOut === false) {
+            url.searchParams.set('signOut', '0');
+        }
         return url.toString();
     }
     buildEditorUrl(binding, nonce, intent = 'edit') {
-        const sessionToken = this.getActiveSessionToken();
-        if (!sessionToken) {
+        if (!this.session || isEditSessionExpired(this.session)) {
             throw new Error(this.messages.errors.editSessionExpired);
         }
         const url = new URL('/sdk/editor', this.appOrigin);
         url.searchParams.set('origin', window.location.origin);
         url.searchParams.set('nonce', nonce);
-        url.searchParams.set('sessionToken', sessionToken);
+        url.searchParams.set('siteKey', this.siteKey);
+        url.searchParams.set('protocol', '2');
+        url.searchParams.set('persist', this.persist ? '1' : '0');
         url.searchParams.set('returnTo', window.location.href);
         url.searchParams.set('sourceType', binding.sourceType ?? 'cms');
         url.searchParams.set('resourceSlug', binding.resourceSlug);
@@ -2115,25 +2256,27 @@ class EinblickEditRuntime {
         return url.toString();
     }
     buildNavigatorUrl(nonce) {
-        const sessionToken = this.getActiveSessionToken();
-        if (!sessionToken) {
+        if (!this.session || isEditSessionExpired(this.session)) {
             throw new Error(this.messages.errors.editSessionExpired);
         }
         const url = new URL('/sdk/navigator', this.appOrigin);
         url.searchParams.set('origin', window.location.origin);
         url.searchParams.set('nonce', nonce);
-        url.searchParams.set('sessionToken', sessionToken);
+        url.searchParams.set('siteKey', this.siteKey);
+        url.searchParams.set('protocol', '2');
+        url.searchParams.set('persist', this.persist ? '1' : '0');
         return url.toString();
     }
     buildCollectionEditorUrl(args) {
-        const sessionToken = this.getActiveSessionToken();
-        if (!sessionToken) {
+        if (!this.session || isEditSessionExpired(this.session)) {
             throw new Error(this.messages.errors.editSessionExpired);
         }
         const url = new URL('/sdk/editor', this.appOrigin);
         url.searchParams.set('origin', window.location.origin);
         url.searchParams.set('nonce', args.nonce);
-        url.searchParams.set('sessionToken', sessionToken);
+        url.searchParams.set('siteKey', this.siteKey);
+        url.searchParams.set('protocol', '2');
+        url.searchParams.set('persist', this.persist ? '1' : '0');
         url.searchParams.set('returnTo', window.location.href);
         url.searchParams.set('sourceType', args.sourceType ?? 'cms');
         url.searchParams.set('collectionId', args.collectionId);
@@ -2175,6 +2318,62 @@ class EinblickEditRuntime {
         if (typeof document === 'undefined') {
             return;
         }
+        for (const [template, control] of this.collectionCreateControls) {
+            if (!template.isConnected || !control.container.isConnected) {
+                control.container.remove();
+                this.collectionCreateControls.delete(template);
+            }
+        }
+        const templates = Array.from(document.querySelectorAll('template[data-einblick-collection-create-template="true"]'));
+        for (const template of templates) {
+            const collection = template.closest('[data-einblick-editable="true"][data-einblick-kind="collection"]');
+            const binding = collection ? readBindingFromElement(collection) : null;
+            const isVisible = !!collection &&
+                !!binding &&
+                this.shouldShowCreateButton(collection, binding);
+            const existing = this.collectionCreateControls.get(template);
+            if (!isVisible || !collection) {
+                if (existing) {
+                    existing.container.remove();
+                    this.collectionCreateControls.delete(template);
+                }
+                continue;
+            }
+            let control = existing;
+            if (!control) {
+                const button = document.createElement('button');
+                button.type = 'button';
+                button.setAttribute('data-einblick-collection-create-button', 'true');
+                button.setAttribute('data-einblick-runtime-created', 'true');
+                const container = collection.tagName === 'UL' || collection.tagName === 'OL'
+                    ? document.createElement('li')
+                    : button;
+                if (container !== button) {
+                    container.setAttribute('data-einblick-collection-create-wrapper', 'true');
+                    container.append(button);
+                }
+                template.insertAdjacentElement('afterend', container);
+                control = { button, container };
+                this.collectionCreateControls.set(template, control);
+            }
+            const buttonClass = template.dataset.einblickCollectionCreateButtonClass ?? '';
+            if (control.button.className !== buttonClass) {
+                control.button.className = buttonClass;
+            }
+            const explicitLabel = template.dataset.einblickCollectionCreateLabel?.trim();
+            if (explicitLabel) {
+                control.button.dataset.einblickCollectionCreateLabel = explicitLabel;
+            }
+            else {
+                delete control.button.dataset.einblickCollectionCreateLabel;
+            }
+            if (control.container !== control.button) {
+                const wrapperClass = template.dataset.einblickCollectionCreateWrapperClass ?? '';
+                if (control.container.className !== wrapperClass) {
+                    control.container.className = wrapperClass;
+                }
+            }
+        }
         const buttons = Array.from(document.querySelectorAll('[data-einblick-collection-create-button="true"]'));
         for (const button of buttons) {
             const label = button.dataset.einblickCollectionCreateLabel?.trim() ||
@@ -2188,6 +2387,13 @@ class EinblickEditRuntime {
                 this.shouldShowCreateButton(collection, binding);
             button.hidden = !isVisible;
             button.disabled = !isVisible;
+            button.tabIndex = isVisible ? 0 : -1;
+            if (isVisible) {
+                button.removeAttribute('aria-hidden');
+            }
+            else {
+                button.setAttribute('aria-hidden', 'true');
+            }
             const wrapper = button.closest('[data-einblick-collection-create-wrapper="true"]');
             if (wrapper) {
                 wrapper.hidden = !isVisible;
@@ -2195,7 +2401,8 @@ class EinblickEditRuntime {
         }
     }
     shouldShowEditButton(element, binding) {
-        if (element?.dataset.einblickKind === 'collection') {
+        if (!this.state.isAuthenticated ||
+            element?.dataset.einblickKind === 'collection') {
             return false;
         }
         return isRecordEditableBinding(binding);
@@ -2718,6 +2925,7 @@ class EinblickEditRuntime {
         });
         document.body.append(backdrop);
         this.editorBackdrop = backdrop;
+        this.editorFrame = iframe;
     }
     openCollectionDrawer(args) {
         if (!this.state.isAuthenticated) {
@@ -2774,6 +2982,7 @@ class EinblickEditRuntime {
         });
         document.body.append(backdrop);
         this.editorBackdrop = backdrop;
+        this.editorFrame = iframe;
     }
     isBottomBarMenuOpen() {
         return !!this.bottomBarMoreMenu && !this.bottomBarMoreMenu.hidden;
@@ -2789,6 +2998,7 @@ class EinblickEditRuntime {
     closeDrawer() {
         this.editorBackdrop?.remove();
         this.editorBackdrop = null;
+        this.editorFrame = null;
         this.editorNonce = null;
         this.editorTarget = null;
         this.editorBinding = null;
@@ -2820,6 +3030,8 @@ export function createEinblickEditRuntime(options) {
         start: () => runtime.start(),
         destroy: () => runtime.destroy(),
         login: (loginOptions) => runtime.login(loginOptions),
+        deactivate: () => runtime.deactivateEditSession(),
+        logout: () => runtime.logoutFromEinblick(),
         openEditor: (binding, element) => runtime.openEditor(binding, element),
         setLocale: (locale) => runtime.setLocale(locale),
         setAccentColor: (accentColor) => runtime.setAccentColor(accentColor),