@trycourier/react-designer 0.0.0-canary-20250605142011 → 0.0.0-canary-20250626144519

package/dist/cjs/styles.css

@@ -896,11 +896,11 @@ body {
 .courier-inset-0 {
   inset: 0px;
 }
-.-courier-left-\[10px\] {
-  left: -10px;
+.-courier-left-\[2px\] {
+  left: -2px;
 }
-.-courier-right-\[10px\] {
-  right: -10px;
+.-courier-right-\[2px\] {
+  right: -2px;
 }
 .courier-bottom-0 {
   bottom: 0px;
@@ -1195,6 +1195,9 @@ body {
 .courier-max-h-\[88px\] {
   max-height: 88px;
 }
+.courier-min-h-12 {
+  min-height: 3rem;
+}
 .courier-min-h-\[1\.5rem\] {
   min-height: 1.5rem;
 }
@@ -1415,6 +1418,9 @@ body {
 .courier-items-center {
   align-items: center;
 }
+.courier-justify-start {
+  justify-content: flex-start;
+}
 .courier-justify-end {
   justify-content: flex-end;
 }
@@ -1485,6 +1491,9 @@ body {
 .courier-rounded-3xl {
   border-radius: 1.5rem;
 }
+.courier-rounded-\[40px\] {
+  border-radius: 40px;
+}
 .courier-rounded-full {
   border-radius: 9999px;
 }
@@ -1793,6 +1802,10 @@ body {
 .courier-p-\[3px\] {
   padding: 3px;
 }
+.\!courier-px-2 {
+  padding-left: 0.5rem !important;
+  padding-right: 0.5rem !important;
+}
 .\!courier-py-\[5px\] {
   padding-top: 5px !important;
   padding-bottom: 5px !important;
@@ -1873,12 +1886,6 @@ body {
   padding-top: 1px;
   padding-bottom: 1px;
 }
-.\!courier-pl-2 {
-  padding-left: 0.5rem !important;
-}
-.\!courier-pr-2 {
-  padding-right: 0.5rem !important;
-}
 .courier-pb-0 {
   padding-bottom: 0px;
 }
@@ -2207,7 +2214,7 @@ body {
 .touch-transparent {
     -webkit-tap-highlight-color: transparent;
   }
-.courier-editor-preview-mode>div:first-child {
+.courier-editor-preview-mode.courier-main-content {
       flex-grow: 1;
       width: 100%;
     }
@@ -2394,19 +2401,19 @@ body {
 .courier-editor-preview-mode.courier-editor-preview-mode-mobile .courier-editor-main:hover >button {
   display: none;
 }
-.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote * {
+.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow * {
   pointer-events: none;
 }
-.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote * {
+.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote *, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow * {
   cursor: default;
 }
-.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote [data-cypress="draggable-handle"] {
+.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow [data-cypress="draggable-handle"] {
   display: none;
 }
-.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:active [data-cypress="draggable-handle"] {
+.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:active [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow:hover [data-cypress="draggable-handle"], .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow:active [data-cypress="draggable-handle"] {
   display: none;
 }
-.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:active .node-element.courier-empty-image::before {
+.courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-button:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-divider:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-paragraph:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-heading:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-blockquote:active .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow:hover .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow:hover .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow:hover .node-element.courier-empty-image::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow:active .node-element>div::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow:active .node-element>hr::before, .courier-editor-preview-mode .ProseMirror>.react-renderer.node-buttonRow:active .node-element.courier-empty-image::before {
   display: none;
 }
 .courier-editor-preview-mode .ProseMirror>.react-renderer.node-imageBlock .courier-empty-image {
@@ -2591,13 +2598,23 @@ body {
   font-size: 0.875rem;
   line-height: 1.25rem;
 }
+.courier-inbox-editor .ProseMirror>.react-renderer.node-buttonRow {
+  margin-top: 0.5rem;
+}
+/* Override the centering from SortableItemWrapper */
+.courier-inbox-editor .ProseMirror>.react-renderer.node-buttonRow .draggable-item {
+          justify-content: flex-start !important;
+        }
+.courier-inbox-editor .ProseMirror>.react-renderer.node-buttonRow [data-cypress="draggable-handle"] {
+  display: none;
+}
 .courier-inbox-editor .ProseMirror>.react-renderer .draggable-item {
   padding: 0px;
 }
-.courier-inbox-editor .ProseMirror>.react-renderer.node-paragraph .selected-element .node-element::before, .courier-inbox-editor .ProseMirror>.react-renderer.node-heading .selected-element .node-element::before {
+.courier-inbox-editor .ProseMirror>.react-renderer.node-paragraph .selected-element .node-element::before, .courier-inbox-editor .ProseMirror>.react-renderer.node-heading .selected-element .node-element::before, .courier-inbox-editor .ProseMirror>.react-renderer.node-buttonRow .selected-element .node-element::before {
   display: none;
 }
-.courier-inbox-editor .ProseMirror>.react-renderer.node-paragraph .selected-element .courier-actions-panel, .courier-inbox-editor .ProseMirror>.react-renderer.node-heading .selected-element .courier-actions-panel {
+.courier-inbox-editor .ProseMirror>.react-renderer.node-paragraph .selected-element .courier-actions-panel, .courier-inbox-editor .ProseMirror>.react-renderer.node-heading .selected-element .courier-actions-panel, .courier-inbox-editor .ProseMirror>.react-renderer.node-buttonRow .selected-element .courier-actions-panel {
   display: none;
 }
 .courier-inbox-editor .ProseMirror>.react-renderer:hover [data-cypress="draggable-handle"] {

package/dist/components/TemplateEditor/Channels/Email/Email.d.ts

@@ -1,7 +1,55 @@
+import type { TiptapDoc } from "@/lib/utils";
+import type { ChannelType } from "@/store";
 import type { ElementalNode } from "@/types/elemental.types";
+import type { UniqueIdentifier } from "@dnd-kit/core";
+import type { SortingStrategy } from "@dnd-kit/sortable";
+import type { Node } from "@tiptap/pm/model";
+import type { Editor } from "@tiptap/react";
+import type { MessageRouting, TenantData } from "../../../Providers/store";
 import type { TemplateEditorProps } from "../../TemplateEditor";
+interface BrandSettingsData {
+    brandColor?: string;
+    textColor?: string;
+    subtleColor?: string;
+    headerStyle: "border" | "plain";
+    logo?: string;
+    link?: string;
+    facebookLink?: string;
+    linkedinLink?: string;
+    instagramLink?: string;
+    mediumLink?: string;
+    xLink?: string;
+}
 export interface EmailProps extends Pick<TemplateEditorProps, "hidePublish" | "brandEditor" | "channels" | "variables" | "theme" | "routing"> {
     isLoading?: boolean;
+    headerRenderer?: ({ hidePublish, channels, routing, }: {
+        hidePublish?: boolean;
+        channels?: ChannelType[];
+        routing: MessageRouting;
+    }) => React.ReactNode;
+    render?: ({ subject, handleSubjectChange, selectedNode, setSelectedNode, previewMode, emailEditor, ref, isBrandApply, brandSettings, items, content, strategy, syncEditorItems, brandEditorContent, tenantData, togglePreviewMode, }: {
+        subject: string | null;
+        handleSubjectChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+        selectedNode: Node | null;
+        setSelectedNode: (node: Node | null) => void;
+        previewMode: "desktop" | "mobile" | undefined;
+        emailEditor: Editor | null;
+        ref: React.RefObject<HTMLDivElement> | null;
+        isBrandApply: boolean;
+        brandSettings: BrandSettingsData | null;
+        items: Items;
+        content: TiptapDoc | null;
+        strategy: SortingStrategy;
+        syncEditorItems: (editor: Editor) => void;
+        brandEditorContent: string | null;
+        tenantData: TenantData | null;
+        togglePreviewMode: (mode: "desktop" | "mobile" | undefined) => void;
+    }) => React.ReactNode;
+}
+interface Items {
+    Editor: UniqueIdentifier[];
+    Sidebar: UniqueIdentifier[];
 }
 export declare const defaultEmailContent: ElementalNode[];
 export declare const Email: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<EmailProps & import("react").RefAttributes<HTMLDivElement>>>;
+export {};

package/dist/components/TemplateEditor/Channels/Email/EmailLayout.d.ts

@@ -0,0 +1,9 @@
+import { type HTMLAttributes } from "react";
+import { type EmailProps } from "./Email";
+export declare const EmailEditorContainer: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const EmailEditorMain: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+    previewMode: "desktop" | "mobile" | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export interface EmailLayoutProps extends EmailProps {
+}
+export declare const EmailLayout: ({ variables, theme, isLoading, hidePublish, channels, brandEditor, routing, }: EmailLayoutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TemplateEditor/Channels/Email/SideBar/SideBar.d.ts

@@ -1,7 +1,7 @@
 import type { UniqueIdentifier } from "@dnd-kit/core";
-interface SideBarProps {
+export interface SideBarProps {
     items: UniqueIdentifier[];
     brandEditor?: boolean;
+    label?: string;
 }
-export declare const SideBar: ({ items, brandEditor }: SideBarProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+export declare const SideBar: ({ items, brandEditor, label }: SideBarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TemplateEditor/Channels/Email/SideBar/SideBarItemDetails/SideBarItemDetails.d.ts

@@ -1,8 +1,7 @@
 import type { Node as ProseMirrorNode } from "@tiptap/pm/model";
 import type { Editor } from "@tiptap/react";
-interface SideBarItemDetailsProps {
+export interface SideBarItemDetailsProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
 }
 export declare const SideBarItemDetails: ({ element, editor }: SideBarItemDetailsProps) => import("react/jsx-runtime").JSX.Element | null;
-export {};

package/dist/components/TemplateEditor/Channels/Email/SideBar/index.d.ts

@@ -1 +1,2 @@
 export * from "./SideBar";
+export * from "./SideBarItemDetails";

package/dist/components/TemplateEditor/Channels/Email/index.d.ts

@@ -1 +1,2 @@
 export * from "./Email";
+export * from "./EmailLayout";

package/dist/components/TemplateEditor/Channels/Inbox/Inbox.d.ts

@@ -1,7 +1,29 @@
+import type { MessageRouting } from "@/components/Providers/store";
+import type { TextMenuConfig } from "@/components/ui/TextMenu/config";
+import type { TiptapDoc } from "@/lib/utils";
+import type { ChannelType } from "@/store";
 import type { ElementalNode } from "@/types/elemental.types";
+import type { AnyExtension, Editor } from "@tiptap/react";
 import type { TemplateEditorProps } from "../../TemplateEditor";
 export declare const defaultInboxContent: ElementalNode[];
+export declare const InboxConfig: TextMenuConfig;
+export declare const InboxEditorContent: () => null;
+export interface InboxRenderProps {
+    content: TiptapDoc;
+    extensions: AnyExtension[];
+    editable: boolean;
+    autofocus: boolean;
+    onUpdate: ({ editor }: {
+        editor: Editor;
+    }) => void;
+}
 export interface InboxProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing"> {
     readOnly?: boolean;
+    headerRenderer?: ({ hidePublish, channels, routing, }: {
+        hidePublish?: boolean;
+        channels?: ChannelType[];
+        routing: MessageRouting;
+    }) => React.ReactNode;
+    render?: (props: InboxRenderProps) => React.ReactNode;
 }
 export declare const Inbox: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<InboxProps & import("react").RefAttributes<HTMLDivElement>>>;

package/dist/components/TemplateEditor/Channels/Inbox/InboxEditor.d.ts

@@ -0,0 +1,4 @@
+import type { InboxRenderProps } from "./Inbox";
+export interface InboxEditorProps extends InboxRenderProps {
+}
+export declare const InboxEditor: ({ content, extensions, editable, autofocus, onUpdate, }: InboxEditorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TemplateEditor/Channels/Inbox/InboxLayout.d.ts

@@ -0,0 +1,4 @@
+import type { InboxProps } from "./Inbox";
+export interface InboxLayoutProps extends InboxProps {
+}
+export declare const InboxLayout: ({ hidePublish, theme, variables, channels, routing, }: InboxLayoutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TemplateEditor/Channels/Inbox/index.d.ts

@@ -1 +1,3 @@
 export * from "./Inbox";
+export * from "./InboxEditor";
+export * from "./InboxLayout";

package/dist/components/TemplateEditor/Channels/Push/Push.d.ts

@@ -1,7 +1,29 @@
+import type { MessageRouting } from "@/components/Providers/store";
+import type { TextMenuConfig } from "@/components/ui/TextMenu/config";
+import type { TiptapDoc } from "@/lib/utils";
+import type { ChannelType } from "@/store";
 import type { ElementalNode } from "@/types/elemental.types";
+import type { AnyExtension, Editor } from "@tiptap/react";
 import type { TemplateEditorProps } from "../../TemplateEditor";
+export declare const PushEditorContent: () => null;
+export interface PushRenderProps {
+    content: TiptapDoc;
+    extensions: AnyExtension[];
+    editable: boolean;
+    autofocus: boolean;
+    onUpdate: ({ editor }: {
+        editor: Editor;
+    }) => void;
+}
 export interface PushProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing"> {
     readOnly?: boolean;
+    headerRenderer?: ({ hidePublish, channels, routing, }: {
+        hidePublish?: boolean;
+        channels?: ChannelType[];
+        routing: MessageRouting;
+    }) => React.ReactNode;
+    render?: (props: PushRenderProps) => React.ReactNode;
 }
 export declare const defaultPushContent: ElementalNode[];
+export declare const PushConfig: TextMenuConfig;
 export declare const Push: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<PushProps & import("react").RefAttributes<HTMLDivElement>>>;

package/dist/components/TemplateEditor/Channels/Push/PushEditor.d.ts

@@ -0,0 +1,6 @@
+import type { HTMLAttributes } from "react";
+import { type PushRenderProps } from "./Push";
+interface PushEditorProps extends PushRenderProps, Omit<HTMLAttributes<HTMLDivElement>, "content"> {
+}
+export declare const PushEditor: ({ content, extensions, editable, autofocus, onUpdate, className, }: PushEditorProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/TemplateEditor/Channels/Push/PushLayout.d.ts

@@ -0,0 +1,4 @@
+import type { PushProps } from "./Push";
+export interface PushLayoutProps extends PushProps {
+}
+export declare const PushLayout: ({ hidePublish, theme, variables, channels, routing, }: PushLayoutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TemplateEditor/Channels/Push/index.d.ts

@@ -1 +1,3 @@
 export * from "./Push";
+export * from "./PushEditor";
+export * from "./PushLayout";

package/dist/components/TemplateEditor/Channels/SMS/SMS.d.ts

@@ -1,7 +1,29 @@
+import type { TextMenuConfig } from "@/components/ui/TextMenu/config";
+import type { TiptapDoc } from "@/lib/utils";
 import type { ElementalNode } from "@/types/elemental.types";
+import type { AnyExtension, Editor } from "@tiptap/react";
+import type { MessageRouting } from "../../../Providers/store";
+import type { ChannelType } from "@/store";
 import type { TemplateEditorProps } from "../../TemplateEditor";
 export declare const defaultSMSContent: ElementalNode[];
+export declare const SMSEditorContent: () => import("react/jsx-runtime").JSX.Element;
+export interface SMSRenderProps {
+    content: TiptapDoc;
+    extensions: AnyExtension[];
+    editable: boolean;
+    autofocus: boolean;
+    onUpdate: ({ editor }: {
+        editor: Editor;
+    }) => void;
+}
 export interface SMSProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing"> {
     readOnly?: boolean;
+    headerRenderer?: ({ hidePublish, channels, routing, }: {
+        hidePublish?: boolean;
+        channels?: ChannelType[];
+        routing: MessageRouting;
+    }) => React.ReactNode;
+    render?: (props: SMSRenderProps) => React.ReactNode;
 }
+export declare const SMSConfig: TextMenuConfig;
 export declare const SMS: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<SMSProps & import("react").RefAttributes<HTMLDivElement>>>;

package/dist/components/TemplateEditor/Channels/SMS/SMSEditor.d.ts

@@ -0,0 +1,5 @@
+import type { HTMLAttributes } from "react";
+import type { SMSRenderProps } from "./SMS";
+export interface SMSEditorProps extends SMSRenderProps, Omit<HTMLAttributes<HTMLDivElement>, "content"> {
+}
+export declare const SMSEditor: ({ content, extensions, editable, autofocus, onUpdate, className, }: SMSEditorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TemplateEditor/Channels/SMS/SMSLayout.d.ts

@@ -0,0 +1,4 @@
+import type { SMSProps } from "./SMS";
+export interface SMSLayoutProps extends SMSProps {
+}
+export declare const SMSLayout: ({ hidePublish, theme, variables, channels, routing }: SMSLayoutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TemplateEditor/Channels/SMS/index.d.ts

@@ -1 +1,3 @@
 export * from "./SMS";
+export * from "./SMSEditor";
+export * from "./SMSLayout";

package/dist/components/TemplateEditor/Channels/index.d.ts

@@ -3,3 +3,4 @@ export * from "./Email";
 export * from "./Inbox";
 export * from "./Push";
 export * from "./SMS";
+export * from "./useChannels";

package/dist/components/TemplateEditor/Channels/useChannels.d.ts

@@ -0,0 +1,13 @@
+import { type Channel, type ChannelType } from "@/store";
+import type { TemplateEditorProps } from "../TemplateEditor";
+export declare const useChannels: ({ channels, routing, }: {
+    channels?: ChannelType[];
+    routing?: TemplateEditorProps["routing"];
+}) => {
+    enabledChannels: Channel[];
+    disabledChannels: Channel[];
+    channel: ChannelType;
+    setChannel: (channelType: ChannelType) => void;
+    addChannel: (channelType: ChannelType) => void;
+    removeChannel: (channelToRemove: ChannelType) => Promise<void>;
+};

package/dist/components/TemplateEditor/Layout/Layout.d.ts

@@ -0,0 +1,7 @@
+import { type HTMLAttributes } from "react";
+export declare const ChannelRootContainer: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+    previewMode: "desktop" | "mobile" | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export declare const EditorSidebar: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+    previewMode: "desktop" | "mobile" | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/TemplateEditor/Layout/index.d.ts

@@ -0,0 +1 @@
+export * from "./Layout";

package/dist/components/TemplateEditor/index.d.ts

@@ -1 +1,17 @@
+export { BrandFooter } from "@/components/BrandEditor/Editor/BrandFooter";
+export { PreviewPanel } from "@/components/ui/PreviewPanel";
+export { TextMenu } from "@/components/ui/TextMenu";
+export { cn } from "@/lib/utils";
+export { SortableContext } from "@dnd-kit/sortable";
+export { useChannels } from "./Channels";
+export { default as EmailEditor } from "./Channels/Email/EmailEditor";
 export * from "./TemplateEditor";
+export { SideBar as EmailSideBar, SideBarItemDetails as EmailSideBarItemDetails, } from "./Channels/Email/SideBar";
+export { SideBar as InboxSideBar } from "./Channels/Inbox/SideBar";
+export declare const EmailChannel: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("./Channels").EmailProps & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const SMSChannel: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("./Channels").SMSProps & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const PushChannel: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("./Channels").PushProps & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const InboxChannel: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("./Channels").InboxProps & import("react").RefAttributes<HTMLDivElement>>>;
+export { EmailEditorContainer, EmailEditorMain } from "./Channels/Email";
+export { ChannelRootContainer, EditorSidebar } from "./Layout";
+export { InboxEditor, PushEditor, SMSEditor } from "./Channels";

package/dist/components/extensions/Blockquote/Blockquote.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/Blockquote/Blockquote.types.d.ts

@@ -7,17 +7,17 @@ export declare const blockquoteSchema: z.ZodObject<{
     borderColor: z.ZodString;
     id: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
+    backgroundColor: string;
     paddingVertical: number;
     paddingHorizontal: number;
     borderColor: string;
-    backgroundColor: string;
     borderLeftWidth: number;
     id?: string | undefined;
 }, {
+    backgroundColor: string;
     paddingVertical: number;
     paddingHorizontal: number;
     borderColor: string;
-    backgroundColor: string;
     borderLeftWidth: number;
     id?: string | undefined;
 }>;

package/dist/components/extensions/Button/Button.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/Button/Button.types.d.ts

@@ -17,12 +17,12 @@ export declare const buttonSchema: z.ZodObject<{
 }, "strip", z.ZodTypeAny, {
     padding: number;
     borderWidth: number;
+    label: string;
+    backgroundColor: string;
+    textColor: string;
     borderColor: string;
     size: "full" | "default";
     borderRadius: number;
-    textColor: string;
-    backgroundColor: string;
-    label: string;
     alignment: "left" | "center" | "right";
     fontStyle: "italic" | "normal";
     fontWeight: "bold" | "normal";
@@ -32,12 +32,12 @@ export declare const buttonSchema: z.ZodObject<{
 }, {
     padding: number;
     borderWidth: number;
+    label: string;
+    backgroundColor: string;
+    textColor: string;
     borderColor: string;
     size: "full" | "default";
     borderRadius: number;
-    textColor: string;
-    backgroundColor: string;
-    label: string;
     alignment: "left" | "center" | "right";
     fontStyle: "italic" | "normal";
     fontWeight: "bold" | "normal";

package/dist/components/extensions/ButtonRow/ButtonRow.d.ts

@@ -0,0 +1,11 @@
+import { Node } from "@tiptap/core";
+import type { ButtonRowProps } from "./ButtonRow.types";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        buttonRow: {
+            setButtonRow: (props: Partial<ButtonRowProps>) => ReturnType;
+        };
+    }
+}
+export declare const defaultButtonRowProps: ButtonRowProps;
+export declare const ButtonRow: Node<any, any>;

package/dist/components/extensions/ButtonRow/ButtonRow.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/ButtonRow/ButtonRow.types.d.ts

@@ -0,0 +1,45 @@
+import { z } from "zod";
+export interface ButtonRowProps {
+    id?: string;
+    button1Label: string;
+    button1Link: string;
+    button1BackgroundColor: string;
+    button1TextColor: string;
+    button2Label: string;
+    button2Link: string;
+    button2BackgroundColor: string;
+    button2TextColor: string;
+    padding?: number;
+}
+export declare const buttonRowSchema: z.ZodObject<{
+    button1Label: z.ZodString;
+    button1Link: z.ZodOptional<z.ZodUnion<[z.ZodString, z.ZodLiteral<"">]>>;
+    button1BackgroundColor: z.ZodOptional<z.ZodString>;
+    button1TextColor: z.ZodOptional<z.ZodString>;
+    button2Label: z.ZodString;
+    button2Link: z.ZodOptional<z.ZodUnion<[z.ZodString, z.ZodLiteral<"">]>>;
+    button2BackgroundColor: z.ZodOptional<z.ZodString>;
+    button2TextColor: z.ZodOptional<z.ZodString>;
+    padding: z.ZodOptional<z.ZodNumber>;
+}, "strip", z.ZodTypeAny, {
+    button1Label: string;
+    button2Label: string;
+    padding?: number | undefined;
+    button1Link?: string | undefined;
+    button1BackgroundColor?: string | undefined;
+    button1TextColor?: string | undefined;
+    button2Link?: string | undefined;
+    button2BackgroundColor?: string | undefined;
+    button2TextColor?: string | undefined;
+}, {
+    button1Label: string;
+    button2Label: string;
+    padding?: number | undefined;
+    button1Link?: string | undefined;
+    button1BackgroundColor?: string | undefined;
+    button1TextColor?: string | undefined;
+    button2Link?: string | undefined;
+    button2BackgroundColor?: string | undefined;
+    button2TextColor?: string | undefined;
+}>;
+export type ButtonRowFormData = z.infer<typeof buttonRowSchema>;

package/dist/components/extensions/ButtonRow/ButtonRowComponent.d.ts

@@ -0,0 +1,5 @@
+import { type NodeViewProps } from "@tiptap/react";
+import React from "react";
+import type { ButtonRowProps } from "./ButtonRow.types";
+export declare const ButtonRowComponent: React.FC<ButtonRowProps>;
+export declare const ButtonRowComponentNode: (props: NodeViewProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/extensions/ButtonRow/index.d.ts

@@ -0,0 +1,4 @@
+export { ButtonRow, defaultButtonRowProps } from "./ButtonRow";
+export { ButtonRowComponent, ButtonRowComponentNode } from "./ButtonRowComponent";
+export type { ButtonRowProps, ButtonRowFormData } from "./ButtonRow.types";
+export { buttonRowSchema } from "./ButtonRow.types";

package/dist/components/extensions/Divider/Divider.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/DragPlaceholder/DragPlaceholder.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/FileHandler/FileHandler.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/Heading/Heading.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/Image/Image.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/ImageBlock/ImageBlock.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/Link/Link.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/Paragraph/Paragraph.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/Selection/Selection.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/extensions/TextBlock/TextBlock.test.d.ts

@@ -0,0 +1 @@
+import "@testing-library/jest-dom/vitest";