react-email-studio 3.3.1 → 3.4.0

package/dist/index.d.cts

@@ -96,59 +96,6 @@ type EmailHtmlOptions = {
     customCSS?: string;
 };
 
-/** Theme color tokens (subset used by the editor chrome). */
-type ThemeColors = (typeof THEMES)["light"];
-/** Known `options` keys for {@link ReactEmailEditor} — callers may pass extra keys; these are what the editor reads. */
-type ReactEmailEditorOptions = EmailHtmlOptions & {
-    appearance?: {
-        theme?: string;
-        /** Shallow merge over the active theme (e.g. accent border). */
-        colors?: Partial<ThemeColors>;
-        /** Extra named palettes; keys appear in Settings → Color scheme. */
-        customThemes?: Record<string, ThemeColors>;
-    };
-    locale?: string;
-    features?: {
-        autoSave?: {
-            enabled?: boolean;
-            interval?: number;
-        };
-    };
-    tools?: Record<string, {
-        enabled?: boolean;
-    }>;
-    /** Optional labels for block-library sections (row layouts + content blocks). */
-    blockLibrary?: {
-        groupHeadings?: {
-            blocks?: string;
-        };
-        /** Override default palette group titles (keys: text, structure, media, actions, widgets). */
-        paletteGroupLabels?: Partial<Record<BlockPaletteGroupKey, string>>;
-    };
-};
-interface ReactEmailEditorRef {
-    loadJson(input: string | Record<string, unknown>): void;
-    /** Calls `cb` with the design as a JSON string (new `email_document` schema). */
-    exportJson(cb: (json: string) => void, pretty?: boolean): void;
-}
-type ReactEmailEditorProps = {
-    minHeight?: string;
-    editorId?: string;
-    options?: ReactEmailEditorOptions;
-    style?: CSSProperties;
-    onLoad?: (api: ReactEmailEditorRef) => void;
-    onReady?: (api: ReactEmailEditorRef) => void;
-    onUpload?: (file: File) => Promise<string>;
-    templates?: {
-        name: string;
-        design: unknown;
-        thumbnail?: string;
-    }[];
-    hideTemplates?: boolean;
-    children?: ReactNode;
-};
-declare const ReactEmailEditor: react.ForwardRefExoticComponent<ReactEmailEditorProps & react.RefAttributes<ReactEmailEditorRef>>;
-
 type Padding = {
     top?: number;
     right?: number;
@@ -286,6 +233,61 @@ type JsonToHtmlOptions = EmailHtmlOptions;
  */
 declare function jsonToHtml(designInput: unknown, opts?: JsonToHtmlOptions): string;
 
+/** Theme color tokens (subset used by the editor chrome). */
+type ThemeColors = (typeof THEMES)["light"];
+/** Known `options` keys for {@link ReactEmailEditor} — callers may pass extra keys; these are what the editor reads. */
+type ReactEmailEditorOptions = EmailHtmlOptions & {
+    appearance?: {
+        theme?: string;
+        /** Shallow merge over the active theme (e.g. accent border). */
+        colors?: Partial<ThemeColors>;
+        /** Extra named palettes; keys appear in Settings → Color scheme. */
+        customThemes?: Record<string, ThemeColors>;
+    };
+    locale?: string;
+    features?: {
+        autoSave?: {
+            enabled?: boolean;
+            interval?: number;
+        };
+    };
+    tools?: Record<string, {
+        enabled?: boolean;
+    }>;
+    /** Optional labels for block-library sections (row layouts + content blocks). */
+    blockLibrary?: {
+        groupHeadings?: {
+            blocks?: string;
+        };
+        /** Override default palette group titles (keys: text, structure, media, actions, widgets). */
+        paletteGroupLabels?: Partial<Record<BlockPaletteGroupKey, string>>;
+    };
+};
+interface ReactEmailEditorRef {
+    loadJson(input: string | Record<string, unknown>): void;
+    /** Calls `cb` with the design as a JSON string (new `email_document` schema). */
+    exportJson(cb: (json: string) => void, pretty?: boolean): void;
+}
+type ReactEmailEditorProps = {
+    minHeight?: string;
+    editorId?: string;
+    options?: ReactEmailEditorOptions;
+    style?: CSSProperties;
+    onLoad?: (api: ReactEmailEditorRef) => void;
+    onReady?: (api: ReactEmailEditorRef) => void;
+    onUpload?: (file: File) => Promise<string>;
+    templates?: {
+        name: string;
+        design: unknown;
+        thumbnail?: string;
+    }[];
+    hideTemplates?: boolean;
+    children?: ReactNode;
+};
+declare const ReactEmailEditor: react.ForwardRefExoticComponent<ReactEmailEditorProps & react.RefAttributes<ReactEmailEditorRef>> & {
+    jsonToHtml: typeof jsonToHtml;
+};
+
 /**
  * Pull usable HTML from a full document (`<!DOCTYPE` / `<html>`) or a fragment string.
  */

package/dist/index.d.ts

@@ -96,59 +96,6 @@ type EmailHtmlOptions = {
     customCSS?: string;
 };
 
-/** Theme color tokens (subset used by the editor chrome). */
-type ThemeColors = (typeof THEMES)["light"];
-/** Known `options` keys for {@link ReactEmailEditor} — callers may pass extra keys; these are what the editor reads. */
-type ReactEmailEditorOptions = EmailHtmlOptions & {
-    appearance?: {
-        theme?: string;
-        /** Shallow merge over the active theme (e.g. accent border). */
-        colors?: Partial<ThemeColors>;
-        /** Extra named palettes; keys appear in Settings → Color scheme. */
-        customThemes?: Record<string, ThemeColors>;
-    };
-    locale?: string;
-    features?: {
-        autoSave?: {
-            enabled?: boolean;
-            interval?: number;
-        };
-    };
-    tools?: Record<string, {
-        enabled?: boolean;
-    }>;
-    /** Optional labels for block-library sections (row layouts + content blocks). */
-    blockLibrary?: {
-        groupHeadings?: {
-            blocks?: string;
-        };
-        /** Override default palette group titles (keys: text, structure, media, actions, widgets). */
-        paletteGroupLabels?: Partial<Record<BlockPaletteGroupKey, string>>;
-    };
-};
-interface ReactEmailEditorRef {
-    loadJson(input: string | Record<string, unknown>): void;
-    /** Calls `cb` with the design as a JSON string (new `email_document` schema). */
-    exportJson(cb: (json: string) => void, pretty?: boolean): void;
-}
-type ReactEmailEditorProps = {
-    minHeight?: string;
-    editorId?: string;
-    options?: ReactEmailEditorOptions;
-    style?: CSSProperties;
-    onLoad?: (api: ReactEmailEditorRef) => void;
-    onReady?: (api: ReactEmailEditorRef) => void;
-    onUpload?: (file: File) => Promise<string>;
-    templates?: {
-        name: string;
-        design: unknown;
-        thumbnail?: string;
-    }[];
-    hideTemplates?: boolean;
-    children?: ReactNode;
-};
-declare const ReactEmailEditor: react.ForwardRefExoticComponent<ReactEmailEditorProps & react.RefAttributes<ReactEmailEditorRef>>;
-
 type Padding = {
     top?: number;
     right?: number;
@@ -286,6 +233,61 @@ type JsonToHtmlOptions = EmailHtmlOptions;
  */
 declare function jsonToHtml(designInput: unknown, opts?: JsonToHtmlOptions): string;
 
+/** Theme color tokens (subset used by the editor chrome). */
+type ThemeColors = (typeof THEMES)["light"];
+/** Known `options` keys for {@link ReactEmailEditor} — callers may pass extra keys; these are what the editor reads. */
+type ReactEmailEditorOptions = EmailHtmlOptions & {
+    appearance?: {
+        theme?: string;
+        /** Shallow merge over the active theme (e.g. accent border). */
+        colors?: Partial<ThemeColors>;
+        /** Extra named palettes; keys appear in Settings → Color scheme. */
+        customThemes?: Record<string, ThemeColors>;
+    };
+    locale?: string;
+    features?: {
+        autoSave?: {
+            enabled?: boolean;
+            interval?: number;
+        };
+    };
+    tools?: Record<string, {
+        enabled?: boolean;
+    }>;
+    /** Optional labels for block-library sections (row layouts + content blocks). */
+    blockLibrary?: {
+        groupHeadings?: {
+            blocks?: string;
+        };
+        /** Override default palette group titles (keys: text, structure, media, actions, widgets). */
+        paletteGroupLabels?: Partial<Record<BlockPaletteGroupKey, string>>;
+    };
+};
+interface ReactEmailEditorRef {
+    loadJson(input: string | Record<string, unknown>): void;
+    /** Calls `cb` with the design as a JSON string (new `email_document` schema). */
+    exportJson(cb: (json: string) => void, pretty?: boolean): void;
+}
+type ReactEmailEditorProps = {
+    minHeight?: string;
+    editorId?: string;
+    options?: ReactEmailEditorOptions;
+    style?: CSSProperties;
+    onLoad?: (api: ReactEmailEditorRef) => void;
+    onReady?: (api: ReactEmailEditorRef) => void;
+    onUpload?: (file: File) => Promise<string>;
+    templates?: {
+        name: string;
+        design: unknown;
+        thumbnail?: string;
+    }[];
+    hideTemplates?: boolean;
+    children?: ReactNode;
+};
+declare const ReactEmailEditor: react.ForwardRefExoticComponent<ReactEmailEditorProps & react.RefAttributes<ReactEmailEditorRef>> & {
+    jsonToHtml: typeof jsonToHtml;
+};
+
 /**
  * Pull usable HTML from a full document (`<!DOCTYPE` / `<html>`) or a fragment string.
  */

package/dist/index.js

@@ -6509,8 +6509,8 @@ import { Fragment as Fragment7, jsx as jsx11, jsxs as jsxs9 } from "react/jsx-ru
 var RIGHT_RAIL_DEFAULT_W = 328;
 var RIGHT_RAIL_MIN_W = 260;
 var RIGHT_RAIL_MAX_W = 720;
-var ReactEmailEditor = forwardRef(
-  function ReactEmailEditor2({
+var ReactEmailEditorComponent = forwardRef(
+  function ReactEmailEditor({
     minHeight = "100vh",
     editorId = "email-editor",
     onLoad,
@@ -8162,6 +8162,7 @@ var ReactEmailEditor = forwardRef(
     );
   }
 );
+var ReactEmailEditor2 = Object.assign(ReactEmailEditorComponent, { jsonToHtml });
 
 // src/lib/htmlToEmailDesign.ts
 var pad = (n) => ({ top: n, right: n, bottom: n, left: n });
@@ -8230,7 +8231,7 @@ function htmlToEmailDesignTemplate(html) {
 }
 export {
   PreviewModal as EmailPreviewModal,
-  ReactEmailEditor,
+  ReactEmailEditor2 as ReactEmailEditor,
   base64ToUtf8,
   DEVICES as emailPreviewDevices,
   extractHtmlForDesign,