@silexlabs/silex 3.0.0-alpha.100

package/dist/plugins/client/client/grapesjs/PublicationUi.js

@@ -0,0 +1,336 @@
+/*
+ * Silex website builder, free/libre no-code tool for makers.
+ * Copyright (c) 2023 lexoyo and Silex Labs foundation
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+import { html, render } from 'lit-html';
+import { unsafeHTML } from 'lit-html/directives/unsafe-html.js';
+//import { map } from 'lit-html/directives/map.js'
+import { cmdPublicationLogin, cmdPublicationLogout, cmdPublicationStart, PublicationStatus } from './PublicationManager';
+import { ConnectorType } from '../../types';
+import { connectorList } from '../api';
+/**
+ * @fileoverview define the publication dialog
+ * This is the UI of the publication feature
+ * It is a dialog which allows the user to login to a connector and publish the website
+ * It also displays the publication status and logs during the publication process
+ * This class is used by the PublicationManager
+ * This is optional, you can use the PublicationManager without this UI
+ * @TODO Use publication events instead of calls from the PublicationManager
+ */
+// **
+// Constants
+export const cmdPublish = 'publish-open-dialog';
+// **
+// Utils
+function cleanupLogEntry(arr) {
+    return arr[arr.length - 1]
+        ?.map(str => str.replace(/\[.*\]/g, '').trim())
+        ?.filter(str => !!str)
+        ?.join('\n');
+}
+/**
+ * Class to manage the publication dialog
+ */
+export class PublicationUi {
+    editor;
+    options;
+    /**
+     * Dialog state
+     */
+    isOpen = false;
+    /**
+     * Dialog content
+     */
+    errorMessage = '';
+    /**
+     * Dialog element
+     * This is the DOM element of the dialog
+     */
+    el;
+    settings;
+    sender = null;
+    /**
+     * Initialize the dialog and the publish button
+     */
+    constructor(editor, options) {
+        this.editor = editor;
+        this.options = options;
+        // Reference to the dialog element
+        this.el = this.createDialogElements();
+        // Add the publish command to the editor
+        const openDialog = () => this.openDialog();
+        const closeDialog = () => this.closeDialog();
+        const setSender = sender => this.sender = sender;
+        editor.Commands.add(cmdPublish, {
+            run(editor, sender) {
+                setSender(sender);
+                openDialog();
+            },
+            stop(editor) { closeDialog(); },
+        });
+    }
+    // **
+    // Convenient state checkers
+    isSuccess(status) {
+        return status === PublicationStatus.STATUS_SUCCESS;
+    }
+    isPending(status) {
+        return status === PublicationStatus.STATUS_PENDING;
+    }
+    isError(status) {
+        return status === PublicationStatus.STATUS_ERROR;
+    }
+    isLoggedOut(status) {
+        return status === PublicationStatus.STATUS_LOGGED_OUT;
+    }
+    isReady(status) {
+        return status === PublicationStatus.STATUS_NONE;
+    }
+    // **
+    // Functions to open and close the dialog
+    getDialogElements() {
+        const el = document.querySelector('#publish-dialog');
+        const primary = el?.querySelector('#publish-button--primary');
+        const secondary = el?.querySelector('#publish-button--secondary');
+        if (!el || !primary || !secondary)
+            throw new Error('Publication dialog elements not found');
+        return { el, primary, secondary };
+    }
+    createDialogElements() {
+        // Create the dialog element
+        const el = document.createElement('div');
+        el.id = 'publish-dialog';
+        el.className = 'silex-dialog-inline silex-dialog gjs-two-color';
+        document.body.append(el);
+        // Create the publish button
+        this.editor.Panels.addButton(this.options.appendTo, {
+            id: 'publish-button',
+            className: 'silex-button--size publish-button',
+            command: cmdPublish,
+            attributes: { title: 'Publish' },
+            label: '<span class="fa-solid fa-upload"></span><span class="silex-button--small">Publish</span>',
+        });
+        return el;
+    }
+    move(rect) {
+        Object.keys(rect).forEach(key => this.el.style[key] = rect[key] + 'px');
+    }
+    // **
+    // Functions to render the dialog
+    async renderDialog(job, status) {
+        try {
+            if (this.isOpen && (!status || !this.settings))
+                throw new Error('PublicationUi: open but no status or settings');
+            render(html `
+      ${!this.isOpen ? '' : this.settings.connector ? await this.renderOpenDialog(job, status) : await this.renderLoginDialog(status)}
+    `, this.el);
+            if (this.isOpen) {
+                this.el.classList.remove('silex-dialog-hide');
+            }
+            else {
+                this.el.classList.add('silex-dialog-hide');
+            }
+        }
+        catch (err) {
+            console.error('Error while rendering the dialog', err);
+        }
+    }
+    async renderOpenDialog(job, status) {
+        return html `
+    <main>
+      ${this.isPending(status) ? html `
+        <p>Publication in progress</p>
+      ` : ''}
+      ${this.isReady(status) ? html `
+        <p>You are connected to ${this.settings.connector.displayName}</p><p>Click on the publish button to publish your website</p>
+        ${this.settings.options && Object.entries(this.settings.options).length && html `<p>Publication options: <ul>${Object.entries(this.settings.options).map(([key, value]) => html `<li>${key}: ${value}</li>`)}</ul></p>`}
+      ` : ''}
+      ${this.isSuccess(status) ? html `
+        <p>Publication success</p>
+        ${this.settings.options?.websiteUrl ? html `<p><a href="${this.settings.options.websiteUrl}" target="_blank">Click here to view the published website</a></p>` : ''}
+      ` : ''}
+      ${this.isError(status) || this.isLoggedOut(status) ? html `
+        <p>Publication error</p>
+        <div>${unsafeHTML(this.errorMessage)}</div>
+      ` : ''}
+      ${job?.message ? html `
+        <p>${unsafeHTML(job.message)}</p>
+      ` : ''}
+      ${this.isPending(status) ? html `
+        <progress
+          value=""
+          style="width: 100%;"
+        ></progress>
+      ` : ''}
+      ${job?.logs?.length && job.logs[0].length ? html `
+        <br><details>
+          <summary>Logs</summary>
+          <pre style="
+            max-width: 100%;
+            max-height: 50vh;
+            overflow: auto;
+            font-size: x-small;
+            " >${unsafeHTML(cleanupLogEntry(job.logs))}
+          </pre>
+        </details>
+      ` : ''}
+      ${job?.errors?.length && job.errors[0].length ? html `
+        <br><details>
+          <summary>Errors</summary>
+          <pre style="
+            max-width: 100%;
+            max-height: 50vh;
+            overflow: auto;
+            font-size: x-small;
+            "
+          >${unsafeHTML(cleanupLogEntry(job.errors))}
+          </pre>
+        </details>
+      ` : ''}
+    </main>
+    <footer>
+      ${this.isPending(status) || this.isLoggedOut(status) ? '' : html `
+        <button
+          class="silex-button silex-button--primary"
+          id="publish-button--primary"
+          @click=${() => this.editor.Commands.run(cmdPublicationStart)}
+        >Publish</button>
+      `}
+      ${this.isLoggedOut(status) ? html `
+        <button
+          class="silex-button silex-button--primary"
+          id="publish-button--primary"
+          @click=${() => this.editor.Commands.run(cmdPublicationLogin, this.settings.connector)}
+        >Connect</button>
+      ` : this.settings.connector.disableLogout ? '' : html `
+        <button
+          class="silex-button silex-button--secondary"
+          id="publish-button--secondary"
+          @click=${() => this.editor.Commands.run(cmdPublicationLogout)}
+        >Disconnect</button>
+      `}
+      <button
+        class="silex-button silex-button--secondary"
+        id="publish-button--secondary"
+        @click=${() => this.editor.Commands.stop(cmdPublish)}
+      >Close</button>
+    </footer>
+    `;
+    }
+    async renderLoginDialog(status) {
+        try {
+            render(html `<main><p>Loading</p></main>`, this.el);
+            const hostingConnectors = await connectorList({ type: ConnectorType.HOSTING });
+            const loggedConnectors = hostingConnectors.filter(connector => connector.isLoggedIn);
+            if (hostingConnectors.length === 1 && loggedConnectors.length === 1) {
+                this.settings.connector = loggedConnectors[0];
+                return this.renderOpenDialog(null, PublicationStatus.STATUS_NONE);
+            }
+            //const loggedConnector: ConnectorData = hostingConnectors.find(connector => connector.isLoggedIn)
+            //if (loggedConnector) {
+            //  this.settings.connector = loggedConnector
+            //  return this.renderOpenDialog(null, PublicationStatus.STATUS_NONE)
+            //}
+            return html `
+      <main>
+        <p>You need to connect a hosting connector to publish your website</p>
+        ${this.isError(status) || this.isLoggedOut(status) ? html `
+          <p>Login error</p>
+          <div>${unsafeHTML(this.errorMessage)}</div>
+        ` : ''}
+        ${hostingConnectors.map(connector => html `
+          <button
+            class="silex-button silex-button--primary"
+            id="publish-button--primary"
+            @click=${() => this.editor.Commands.run(cmdPublicationLogin, connector)}
+          >${connector.displayName}</button>
+        `)}
+      </main>
+      <footer>
+        <button
+          class="silex-button silex-button--secondary"
+          id="publish-button--secondary"
+          @click=${() => this.editor.Commands.stop(cmdPublish)}
+        >Close</button>
+      </footer>
+    `;
+        }
+        catch (err) {
+            console.error(err);
+            return html `
+      <header>
+        <h3>Oops</h3>
+      </header>
+      <main>
+        <p>Unable to load hosting connectors</p>
+        <p>Something went wrong: ${err.message}</p>
+      </main>
+      <footer>
+        <button
+          class="silex-button silex-button--secondary"
+          id="publish-button--secondary"
+          @click=${() => this.editor.Commands.stop(cmdPublish)}
+        >Close</button>
+      </footer>
+    `;
+        }
+    }
+    displayPending(job, status) {
+        this.errorMessage = null;
+        this.renderDialog(job, status);
+    }
+    displayError(message, job, status) {
+        console.info(message);
+        this.errorMessage = message;
+        this.renderDialog(job, status);
+    }
+    async closeDialog() {
+        this.isOpen = false;
+        this.renderDialog(null, null);
+        if (this.sender)
+            this.sender.set('active', 0); // Deactivate the button to make it ready to be clicked again
+        this.sender = null;
+    }
+    async toggleDialog() {
+        if (this.isOpen)
+            this.closeDialog();
+        else
+            this.openDialog();
+    }
+    async openDialog() {
+        this.isOpen = true;
+        // Position
+        const buttonEl = this.editor.Panels.getPanel('options')?.view.el.querySelector('.publish-button');
+        if (buttonEl) {
+            const rect = buttonEl.getBoundingClientRect();
+            const width = 450;
+            const padding = 10 * 2;
+            const minHeight = 50;
+            this.move({
+                left: rect.right - width - padding,
+                top: rect.bottom + 10,
+                width,
+                minHeight,
+            });
+        }
+        else {
+            console.error('Unable to find publish button');
+        }
+        // Publication
+        //this.editor.Commands.run(cmdPublicationStart)
+        this.renderDialog(null, PublicationStatus.STATUS_NONE);
+    }
+}
+//# sourceMappingURL=PublicationUi.js.map

package/dist/plugins/client/client/grapesjs/PublicationUi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PublicationUi.js","sourceRoot":"","sources":["../../../../../src/ts/client/grapesjs/PublicationUi.ts"],"names":[],"mappings":"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"}

package/dist/plugins/client/client/grapesjs/blocks.d.ts

@@ -0,0 +1 @@
+export declare const blocksPlugin: (editor: any, opts: any) => void;

package/dist/plugins/client/client/grapesjs/blocks.js

@@ -0,0 +1,37 @@
+/*
+ * Silex website builder, free/libre no-code tool for makers.
+ * Copyright (c) 2023 lexoyo and Silex Labs foundation
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+export const blocksPlugin = (editor, opts) => {
+    // Defaults
+    const options = {
+        ...opts,
+    };
+    // Container block
+    const containerId = 'container';
+    editor.BlockManager.add(containerId, {
+        label: 'Container',
+        category: 'Basics',
+        attributes: { class: 'container-png' },
+        content: {
+            type: containerId,
+            style: {
+                'min-height': '100px',
+            },
+        },
+    });
+    editor.DomComponents.addType(containerId, {});
+};
+//# sourceMappingURL=blocks.js.map

package/dist/plugins/client/client/grapesjs/blocks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"blocks.js","sourceRoot":"","sources":["../../../../../src/ts/client/grapesjs/blocks.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,MAAM,EAAE,IAAI,EAAE,EAAE;IAC3C,WAAW;IACX,MAAM,OAAO,GAAG;QACd,GAAG,IAAI;KACR,CAAA;IACD,kBAAkB;IAClB,MAAM,WAAW,GAAG,WAAW,CAAA;IAC/B,MAAM,CAAC,YAAY,CAAC,GAAG,CAAC,WAAW,EAAE;QACnC,KAAK,EAAE,WAAW;QAClB,QAAQ,EAAE,QAAQ;QAClB,UAAU,EAAE,EAAE,KAAK,EAAE,eAAe,EAAE;QACtC,OAAO,EAAE;YACP,IAAI,EAAE,WAAW;YACjB,KAAK,EAAE;gBACL,YAAY,EAAE,OAAO;aACtB;SACF;KACF,CAAC,CAAA;IACF,MAAM,CAAC,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,EAAE,CAAC,CAAA;AAC/C,CAAC,CAAA"}

package/dist/plugins/client/client/grapesjs/breadcrumbs.d.ts

@@ -0,0 +1 @@
+export default function (editor: any, options: any): void;

package/dist/plugins/client/client/grapesjs/breadcrumbs.js

@@ -0,0 +1,75 @@
+import { onFooter } from './footer';
+export default function (editor, options) {
+    let breadcrumbsContainer;
+    onFooter(footer => {
+        // Initialize the breadcrumbs container
+        breadcrumbsContainer = document.createElement('div');
+        breadcrumbsContainer.id = 'breadcrumbs-container';
+        footer.prepend(breadcrumbsContainer);
+        // Add breadcrumbs styles
+        const breadcrumbsStyles = document.createElement('style');
+        breadcrumbsStyles.innerHTML = `
+      #breadcrumbs-container {
+        display: flex;
+        align-items: center;
+        height: 100%;
+        padding: 0 10px;
+        font-size: 12px;
+        color: #999;
+        overflow-x: auto;
+        overflow-y: hidden;
+      }
+      #breadcrumbs-container h3 {
+        font-size: inherit;
+        margin: 0;
+      }
+      #breadcrumbs-container .breadcrumb {
+        margin: 0 5px;
+        font-size: 14px;
+        line-height: 1;
+        cursor: pointer;
+        white-space: nowrap;
+      }
+      #breadcrumbs-container .breadcrumb::after {
+        content: "➔";
+        margin-left: 10px;
+      }
+
+      #breadcrumbs-container .breadcrumb:last-child::after {
+        content: "";
+      }
+    `;
+        footer.prepend(breadcrumbsStyles);
+        renderBreadcrumbs();
+    });
+    // Append the breadcrumbs container to the editor's container
+    editor.on('component:selected style:target component:drag:end', () => renderBreadcrumbs());
+    function renderBreadcrumbs() {
+        let component = editor.getSelected() ?? editor.Pages.getSelected().getMainComponent();
+        if (!breadcrumbsContainer)
+            return;
+        // Clear the breadcrumbs container
+        breadcrumbsContainer.innerHTML = '';
+        // Traverse up the tree of components, prepending each to the breadcrumbs
+        while (component) {
+            const breadcrumb = createBreadcrumb(component);
+            breadcrumbsContainer.prepend(breadcrumb);
+            component = component.parent();
+        }
+        // Label
+        const label = document.createElement('span');
+        label.innerHTML = '<h3>Selection:&nbsp;</h3>';
+        breadcrumbsContainer.prepend(label);
+    }
+    function createBreadcrumb(component) {
+        const breadcrumb = document.createElement('span');
+        const model = component.model;
+        breadcrumb.onclick = () => {
+            editor.select(component);
+        };
+        breadcrumb.classList.add('breadcrumb');
+        breadcrumb.innerHTML = `<span>${component.getName() ?? component.get('tagName')}</span>`;
+        return breadcrumb;
+    }
+}
+//# sourceMappingURL=breadcrumbs.js.map

package/dist/plugins/client/client/grapesjs/breadcrumbs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.js","sourceRoot":"","sources":["../../../../../src/ts/client/grapesjs/breadcrumbs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAEnC,MAAM,CAAC,OAAO,WAAW,MAAM,EAAE,OAAO;IACtC,IAAI,oBAAoB,CAAA;IACxB,QAAQ,CAAC,MAAM,CAAC,EAAE;QAChB,uCAAuC;QACvC,oBAAoB,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;QACpD,oBAAoB,CAAC,EAAE,GAAG,uBAAuB,CAAA;QACjD,MAAM,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAA;QACpC,yBAAyB;QACzB,MAAM,iBAAiB,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;QACzD,iBAAiB,CAAC,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8B7B,CAAA;QACD,MAAM,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAA;QACjC,iBAAiB,EAAE,CAAA;IACrB,CAAC,CAAC,CAAA;IACF,6DAA6D;IAE7D,MAAM,CAAC,EAAE,CAAC,oDAAoD,EAAE,GAAG,EAAE,CAAC,iBAAiB,EAAE,CAAC,CAAA;IAC1F,SAAS,iBAAiB;QACxB,IAAI,SAAS,GAAG,MAAM,CAAC,WAAW,EAAE,IAAI,MAAM,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,gBAAgB,EAAE,CAAA;QAErF,IAAG,CAAC,oBAAoB;YAAE,OAAM;QAEhC,kCAAkC;QAClC,oBAAoB,CAAC,SAAS,GAAG,EAAE,CAAA;QAEnC,yEAAyE;QACzE,OAAO,SAAS,EAAE;YAChB,MAAM,UAAU,GAAG,gBAAgB,CAAC,SAAS,CAAC,CAAA;YAC9C,oBAAoB,CAAC,OAAO,CAAC,UAAU,CAAC,CAAA;YACxC,SAAS,GAAG,SAAS,CAAC,MAAM,EAAE,CAAA;SAC/B;QAED,QAAQ;QACR,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QAC5C,KAAK,CAAC,SAAS,GAAG,2BAA2B,CAAA;QAC7C,oBAAoB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAA;IACrC,CAAC;IACD,SAAS,gBAAgB,CAAC,SAAS;QACjC,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QACjD,MAAM,KAAK,GAAG,SAAS,CAAC,KAAK,CAAA;QAC7B,UAAU,CAAC,OAAO,GAAG,GAAG,EAAE;YACxB,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;QAC1B,CAAC,CAAA;QACD,UAAU,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC,CAAA;QACtC,UAAU,CAAC,SAAS,GAAG,SAAS,SAAS,CAAC,OAAO,EAAE,IAAI,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,SAAS,CAAA;QACxF,OAAO,UAAU,CAAA;IACnB,CAAC;AACH,CAAC"}

package/dist/plugins/client/client/grapesjs/footer.d.ts

@@ -0,0 +1,2 @@
+export default function (editor: any, options: any): void;
+export declare function onFooter(fn: any): void;

package/dist/plugins/client/client/grapesjs/footer.js

@@ -0,0 +1,28 @@
+// Styles are in: src/scss/footer.scss
+let _onFooter = [];
+let footer;
+export default function (editor, options) {
+    const panel = editor.Panels.addPanel({
+        id: 'footer',
+        visible: true,
+        buttons: [{
+                id: 'myNewButton',
+                className: 'someClass',
+                command: 'someCommand',
+                attributes: { title: 'Some title' },
+                active: false,
+            }],
+    });
+    setTimeout(() => {
+        footer = panel.view?.el;
+        _onFooter.forEach(cbk => cbk(footer));
+        _onFooter = [];
+    });
+}
+export function onFooter(fn) {
+    if (footer)
+        fn(footer);
+    else
+        _onFooter.push(fn);
+}
+//# sourceMappingURL=footer.js.map

package/dist/plugins/client/client/grapesjs/footer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../../../src/ts/client/grapesjs/footer.ts"],"names":[],"mappings":"AAAA,sCAAsC;AACtC,IAAI,SAAS,GAAG,EAAE,CAAA;AAClB,IAAI,MAAM,CAAA;AACV,MAAM,CAAC,OAAO,WAAW,MAAM,EAAE,OAAO;IACtC,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC;QACnC,EAAE,EAAE,QAAQ;QACZ,OAAO,EAAE,IAAI;QACb,OAAO,EAAE,CAAC;gBACR,EAAE,EAAE,aAAa;gBACjB,SAAS,EAAE,WAAW;gBACtB,OAAO,EAAE,aAAa;gBACtB,UAAU,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE;gBACnC,MAAM,EAAE,KAAK;aAEd,CAAC;KACH,CAAC,CAAA;IACF,UAAU,CAAC,GAAG,EAAE;QACd,MAAM,GAAG,KAAK,CAAC,IAAI,EAAE,EAAE,CAAA;QACvB,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAA;QACrC,SAAS,GAAG,EAAE,CAAA;IAChB,CAAC,CAAC,CAAA;AACJ,CAAC;AAED,MAAM,UAAU,QAAQ,CAAC,EAAE;IACzB,IAAG,MAAM;QAAE,EAAE,CAAC,MAAM,CAAC,CAAA;;QAChB,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACzB,CAAC"}

package/dist/plugins/client/client/grapesjs/index.d.ts

@@ -0,0 +1,5 @@
+import { Editor, EditorConfig } from 'grapesjs';
+import { ConnectorId, WebsiteId } from '../../types';
+export declare function getEditorConfig(id: WebsiteId, connectorId: ConnectorId, rootUrl: string): EditorConfig;
+export declare function initEditor(config: EditorConfig): Promise<Editor>;
+export declare function getEditor(): Editor;