@mjml-agent-editor/editor 0.2.0 → 0.4.0

package/dist/canvas.d.cts

@@ -1,4 +1,27 @@
 import * as React from 'react';
+import { Editor } from 'grapesjs';
+
+/**
+ * Sections a host adds to the palette.
+ *
+ * A dropped block is ordinary MJML from then on, so it has to be MJML the agent's strict
+ * compile accepts and the editor writes back unchanged: one bad block in the palette would
+ * put an error into every email it is dropped in, and block every agent write to it.
+ */
+
+type SectionBlock = {
+    /** Unique, and not the id of a built-in block. */
+    readonly id: string;
+    /** Plain text. */
+    readonly label: string;
+    /** Exactly one `<mj-section>`, without `sec-*`/`obj-*` ids: those are added on drop. */
+    readonly mjml: string;
+    /** SVG markup for the tile, rendered as is. The palette paints it with `fill`, as it does
+     *  the built-in tiles, so draw with filled shapes. */
+    readonly media?: string;
+};
+/** Why a block cannot be offered; empty when it can. */
+declare function blockProblems(mjml: string, editor?: Editor): string[];
 
 type SaveStatus = "idle" | "saving" | "saved" | "error";
 /** Snapshot of editor state pushed to the header (device, undo, save, zoom, width). */
@@ -45,7 +68,12 @@ type Props = {
     commentsRefresh: number;
     /** Reports the number of open comments (for the header indicator). */
     onOpenCountChange: (n: number) => void;
+    /**
+     * Sections offered after the built-in blocks, read once when the editor starts. One that
+     * `blockProblems` refuses is left out and reported in the console.
+     */
+    blocks?: readonly SectionBlock[];
 };
-declare function EmailEditor({ docId, onReady, commentsRefresh, onOpenCountChange }: Props): React.JSX.Element;
+declare function EmailEditor({ docId, onReady, commentsRefresh, onOpenCountChange, blocks, }: Props): React.JSX.Element;
 
-export { type EditorApi, type EditorState, EmailEditor, type SaveStatus };
+export { type EditorApi, type EditorState, EmailEditor, type SaveStatus, type SectionBlock, blockProblems };

package/dist/canvas.d.ts

@@ -1,4 +1,27 @@
 import * as React from 'react';
+import { Editor } from 'grapesjs';
+
+/**
+ * Sections a host adds to the palette.
+ *
+ * A dropped block is ordinary MJML from then on, so it has to be MJML the agent's strict
+ * compile accepts and the editor writes back unchanged: one bad block in the palette would
+ * put an error into every email it is dropped in, and block every agent write to it.
+ */
+
+type SectionBlock = {
+    /** Unique, and not the id of a built-in block. */
+    readonly id: string;
+    /** Plain text. */
+    readonly label: string;
+    /** Exactly one `<mj-section>`, without `sec-*`/`obj-*` ids: those are added on drop. */
+    readonly mjml: string;
+    /** SVG markup for the tile, rendered as is. The palette paints it with `fill`, as it does
+     *  the built-in tiles, so draw with filled shapes. */
+    readonly media?: string;
+};
+/** Why a block cannot be offered; empty when it can. */
+declare function blockProblems(mjml: string, editor?: Editor): string[];
 
 type SaveStatus = "idle" | "saving" | "saved" | "error";
 /** Snapshot of editor state pushed to the header (device, undo, save, zoom, width). */
@@ -45,7 +68,12 @@ type Props = {
     commentsRefresh: number;
     /** Reports the number of open comments (for the header indicator). */
     onOpenCountChange: (n: number) => void;
+    /**
+     * Sections offered after the built-in blocks, read once when the editor starts. One that
+     * `blockProblems` refuses is left out and reported in the console.
+     */
+    blocks?: readonly SectionBlock[];
 };
-declare function EmailEditor({ docId, onReady, commentsRefresh, onOpenCountChange }: Props): React.JSX.Element;
+declare function EmailEditor({ docId, onReady, commentsRefresh, onOpenCountChange, blocks, }: Props): React.JSX.Element;
 
-export { type EditorApi, type EditorState, EmailEditor, type SaveStatus };
+export { type EditorApi, type EditorState, EmailEditor, type SaveStatus, type SectionBlock, blockProblems };