@trycourier/react-designer 0.4.0 → 0.5.0

package/dist/components/Providers/useTemplateActions.d.ts

@@ -19,8 +19,8 @@ export declare function useTemplateActions(): {
     setTemplateError: (error: string | TemplateError | null) => void;
     templateData: import("./store").TenantData | null;
     setTemplateData: (args_0: import("./store").TenantData | ((prev: import("./store").TenantData | null) => import("./store").TenantData | null) | null) => void;
-    templateEditorContent: import("../TemplateEditor").ElementalContent | null | undefined;
-    setTemplateEditorContent: (content: import("../TemplateEditor").ElementalContent | null | undefined) => void;
+    templateEditorContent: import("../..").ElementalContent | null | undefined;
+    setTemplateEditorContent: (content: import("../..").ElementalContent | null | undefined) => void;
     createCustomError: (message: string, toastProps?: import("sonner").ExternalToast) => TemplateError;
     convertLegacyError: (error: string | TemplateError) => TemplateError;
     /**

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

@@ -3,5 +3,6 @@ import type { Editor } from "@tiptap/react";
 export interface SideBarItemDetailsProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    hideCloseButton?: boolean;
 }
-export declare const SideBarItemDetails: ({ element, editor }: SideBarItemDetailsProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const SideBarItemDetails: ({ element, editor, hideCloseButton, }: SideBarItemDetailsProps) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -1,9 +1,4 @@
 export { BrandFooter } from "@/components/BrandEditor/Editor/BrandFooter";
-export { PreviewPanel } from "@/components/ui/PreviewPanel";
-export { TextMenu } from "@/components/ui/TextMenu";
-export { cn, convertElementalToTiptap, convertTiptapToElemental } from "@/lib/utils";
-export { VariableInput, VariableTextarea } from "@/components/ui/VariableEditor";
-export { getFlattenedVariables } from "@/components/utils/getFlattenedVariables";
 export { useChannels, getChannelDefaults } from "./Channels";
 export { default as EmailEditor } from "./Channels/Email/EmailEditor";
 export * from "./TemplateEditor";
@@ -11,20 +6,13 @@ export { SideBar as EmailSideBar, SideBarItemDetails as EmailSideBarItemDetails,
 export { SideBar as InboxSideBar } from "./Channels/Inbox/SideBar";
 export { MSTeamsSideBar } from "./Channels/MSTeams/SideBar";
 export { SlackSideBar, SlackSideBarItemDetails } from "./Channels/Slack/SideBar";
+export { EmailEditorContainer, EmailEditorMain, type EmailEditorProps, type InboxEditorProps, type MSTeamsEditorProps, type PushEditorProps, type SlackEditorProps, type SMSEditorProps, } from "./Channels";
 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 declare const MSTeamsChannel: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("./Channels").MSTeamsProps & import("react").RefAttributes<HTMLDivElement>>>;
 export declare const SlackChannel: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("./Channels").SlackProps & import("react").RefAttributes<HTMLDivElement>>>;
-export { EmailEditorContainer, EmailEditorMain, type EmailEditorProps, type InboxEditorProps, type MSTeamsEditorProps, type PushEditorProps, type SlackEditorProps, type SMSEditorProps, } from "./Channels";
-export { CHANNELS } from "@/channels";
-export type { ChannelType } from "@/store";
-export type { ElementalContent } from "@/types";
 export { ChannelRootContainer, EditorSidebar } from "./Layout";
 export { InboxEditor, MSTeamsEditor, PushEditor, SlackEditor, SMSEditor } from "./Channels";
-export { useAutoSave } from "@/hooks/useAutoSave";
 export { useDebouncedFlush } from "./hooks/useDebouncedFlush";
-export { Status as TemplateStatus } from "@/components/ui/Status";
-export { MonacoCodeEditor } from "@/components/extensions/CustomCode/MonacoCodeEditor";
-export { ToggleGroup } from "@/components/ui-kit";

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

@@ -3,6 +3,7 @@ import type { Editor } from "@tiptap/react";
 interface BlockquoteFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    hideCloseButton?: boolean;
 }
-export declare const BlockquoteForm: ({ element, editor }: BlockquoteFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const BlockquoteForm: ({ element, editor, hideCloseButton, }: BlockquoteFormProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

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

@@ -3,6 +3,7 @@ import type { Editor } from "@tiptap/react";
 interface ButtonFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    hideCloseButton?: boolean;
 }
-export declare const ButtonForm: ({ element, editor }: ButtonFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const ButtonForm: ({ element, editor, hideCloseButton }: ButtonFormProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/components/extensions/Column/ColumnForm.d.ts

@@ -3,6 +3,7 @@ import type { Editor } from "@tiptap/react";
 interface ColumnFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    hideCloseButton?: boolean;
 }
-export declare const ColumnForm: ({ element, editor }: ColumnFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const ColumnForm: ({ element, editor, hideCloseButton }: ColumnFormProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/components/extensions/CustomCode/CustomCodeForm.d.ts

@@ -3,6 +3,7 @@ import type { Editor } from "@tiptap/react";
 interface CustomCodeFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    hideCloseButton?: boolean;
 }
-export declare const CustomCodeForm: ({ element, editor }: CustomCodeFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const CustomCodeForm: ({ element, editor, hideCloseButton, }: CustomCodeFormProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

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

@@ -3,6 +3,7 @@ import type { Editor } from "@tiptap/react";
 interface DividerFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    hideCloseButton?: boolean;
 }
-export declare const DividerForm: ({ element, editor }: DividerFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const DividerForm: ({ element, editor, hideCloseButton }: DividerFormProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

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

@@ -3,5 +3,6 @@ import type { Editor } from "@tiptap/react";
 export interface ImageBlockFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    hideCloseButton?: boolean;
 }
-export declare const ImageBlockForm: ({ element, editor }: ImageBlockFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const ImageBlockForm: ({ element, editor, hideCloseButton, }: ImageBlockFormProps) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -0,0 +1,15 @@
+import { Node } from "@tiptap/core";
+import { defaultListProps, type ListProps } from "./List.types";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        list: {
+            setList: (props?: Partial<ListProps>) => ReturnType;
+            toggleList: () => ReturnType;
+            toggleOrderedList: () => ReturnType;
+            toggleUnorderedList: () => ReturnType;
+        };
+    }
+}
+export { defaultListProps };
+export declare const List: Node<any, any>;
+export default List;

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

@@ -0,0 +1,38 @@
+import { z } from "zod";
+export declare const listSchema: z.ZodObject<{
+    id: z.ZodOptional<z.ZodString>;
+    listType: z.ZodEnum<["ordered", "unordered"]>;
+    borderColor: z.ZodString;
+    borderWidth: z.ZodNumber;
+    paddingVertical: z.ZodNumber;
+    paddingHorizontal: z.ZodNumber;
+}, "strip", z.ZodTypeAny, {
+    borderColor: string;
+    borderWidth: number;
+    paddingVertical: number;
+    paddingHorizontal: number;
+    listType: "ordered" | "unordered";
+    id?: string | undefined;
+}, {
+    borderColor: string;
+    borderWidth: number;
+    paddingVertical: number;
+    paddingHorizontal: number;
+    listType: "ordered" | "unordered";
+    id?: string | undefined;
+}>;
+export interface ListProps {
+    /** Whether the list is ordered (numbered) or unordered (bulleted) */
+    listType: "ordered" | "unordered";
+    /** Unique identifier for the list node */
+    id?: string;
+    /** Border color for list markers (bullets/numbers) */
+    borderColor?: string;
+    /** Border width in pixels */
+    borderWidth?: number;
+    /** Vertical padding in pixels */
+    paddingVertical?: number;
+    /** Horizontal padding in pixels */
+    paddingHorizontal?: number;
+}
+export declare const defaultListProps: ListProps;

package/dist/components/extensions/List/ListComponent.d.ts

@@ -0,0 +1,12 @@
+import { type NodeViewProps } from "@tiptap/react";
+/**
+ * List NodeView component that renders the list.
+ *
+ * Uses SortableItemWrapper for proper drag-and-drop reordering,
+ * selection styling, and action buttons (duplicate, delete).
+ *
+ * When nested inside a blockquote, uses a simpler wrapper without
+ * drag handles or selection behavior to let the blockquote handle those.
+ */
+export declare const ListComponentNode: (props: NodeViewProps) => import("react/jsx-runtime").JSX.Element;
+export default ListComponentNode;

package/dist/components/extensions/List/ListForm.d.ts

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

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

@@ -0,0 +1,4 @@
+export { List, defaultListProps } from "./List";
+export { ListForm } from "./ListForm";
+export type { ListProps } from "./List.types";
+export { listSchema } from "./List.types";

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

@@ -0,0 +1,34 @@
+import { Node } from "@tiptap/core";
+import type { ListItemProps } from "./ListItem.types";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        listItem: {
+            /** Split the list item at the current cursor position */
+            splitListItem: (typeOrName: string) => ReturnType;
+            /** Lift the list item out of the list (outdent) */
+            liftListItem: (typeOrName: string) => ReturnType;
+            /** Sink the list item into a nested list (indent) */
+            sinkListItem: (typeOrName: string) => ReturnType;
+            /** Wrap selection in a list */
+            wrapInList: (typeOrName: string, attrs?: Record<string, unknown>) => ReturnType;
+        };
+    }
+}
+export declare const defaultListItemProps: ListItemProps;
+/**
+ * Custom ListItem extension with prosemirror-schema-list commands.
+ *
+ * Provides commands:
+ * - splitListItem: Split list item at cursor (creates new bullet)
+ * - liftListItem: Lift list item out of list (outdent)
+ * - sinkListItem: Sink list item into nested list (indent)
+ * - wrapInList: Wrap selection in a list
+ *
+ * Keyboard shortcuts:
+ * - Enter: Split list item (handled in List extension)
+ * - Tab: Sink list item (handled in List extension)
+ * - Shift-Tab: Lift list item (handled in List extension)
+ * - Shift-Enter: Add a hard break (new line within the paragraph)
+ */
+export declare const ListItem: Node<any, any>;
+export default ListItem;

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

@@ -0,0 +1,7 @@
+export interface ListItemProps {
+    /** Background color for the list item */
+    backgroundColor?: string;
+    /** Unique identifier for the list item node */
+    id?: string;
+}
+export declare const defaultListItemProps: ListItemProps;

package/dist/components/extensions/ListItem/ListItemComponent.d.ts

@@ -0,0 +1,7 @@
+import { type NodeViewProps } from "@tiptap/react";
+/**
+ * Simple ListItem NodeView that renders as a standard <li> element.
+ * Uses NodeViewContent to allow prosemirror to manage the content.
+ */
+export declare const ListItemComponentNode: (props: NodeViewProps) => import("react/jsx-runtime").JSX.Element;
+export default ListItemComponentNode;

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

@@ -0,0 +1,2 @@
+export { ListItem, defaultListItemProps } from "./ListItem";
+export type { ListItemProps } from "./ListItem.types";

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

@@ -3,6 +3,7 @@ import type { Editor } from "@tiptap/react";
 interface TextBlockFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    hideCloseButton?: boolean;
 }
-export declare const TextBlockForm: ({ element, editor }: TextBlockFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const TextBlockForm: ({ element, editor, hideCloseButton }: TextBlockFormProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

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

@@ -23,6 +23,8 @@ export { FixedChannelSelection } from "./FixedChannelSelection";
 export { Heading } from "./Heading";
 export { ImageBlock } from "./ImageBlock";
 export { Link } from "./Link";
+export { List } from "./List";
+export { ListItem } from "./ListItem";
 export { Paragraph } from "./Paragraph";
 export { Selection } from "./Selection";
 export { SlashMenu } from "./SlashMenu";

package/dist/components/ui/Blocks/ListBlock/ListBlock.d.ts

@@ -0,0 +1,2 @@
+import { type BlockBaseProps } from "../Block";
+export declare const ListBlock: ({ draggable }: Pick<BlockBaseProps, "draggable">) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/Blocks/ListBlock/index.d.ts

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

package/dist/components/ui/Blocks/index.d.ts

@@ -6,5 +6,6 @@ export * from "./CustomCodeBlock";
 export * from "./DividerBlock";
 export * from "./HeadingBlock";
 export * from "./ImageBlock";
+export * from "./ListBlock";
 export * from "./SpacerBlock";
 export * from "./TextBlock";

package/dist/components/ui/FormHeader/FormHeader.d.ts

@@ -1,6 +1,7 @@
 interface FormHeaderProps {
-    type: "text" | "image" | "spacer" | "divider" | "button" | "blockquote" | "heading" | "customCode" | "column";
+    type: "text" | "image" | "spacer" | "divider" | "button" | "blockquote" | "heading" | "customCode" | "column" | "list";
     label?: string;
+    hideCloseButton?: boolean;
 }
-export declare const FormHeader: ({ type }: FormHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FormHeader: ({ type, hideCloseButton }: FormHeaderProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ui/SortableItemWrapper/SortableItemWrapper.d.ts

@@ -7,8 +7,10 @@ export interface SortableItemWrapperProps extends NodeViewWrapperProps {
     className?: string;
     editor: Editor;
     getPos?: (() => number) | boolean;
+    /** If true, this element will not accept drops (but can still be dragged) */
+    disableDropTarget?: boolean;
 }
-export declare const SortableItemWrapper: ({ children, id, className, editor, getPos: _getPos, ...props }: SortableItemWrapperProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SortableItemWrapper: ({ children, id, className, editor, getPos: _getPos, disableDropTarget, ...props }: SortableItemWrapperProps) => import("react/jsx-runtime").JSX.Element;
 export interface SortableItemProps {
     children: React.ReactNode;
     id?: string;

package/dist/components/ui/TextMenu/config.d.ts

@@ -28,6 +28,8 @@ export interface TextMenuConfig {
     alignRight?: TextMenuItem;
     alignJustify?: TextMenuItem;
     quote?: TextMenuItem;
+    orderedList?: TextMenuItem;
+    unorderedList?: TextMenuItem;
     link?: TextMenuItem;
     variable?: TextMenuItem;
     conditionalRules?: ConditionalRule[];

package/dist/components/ui/TextMenu/hooks/useTextmenuCommands.d.ts

@@ -6,6 +6,8 @@ interface TextMenuStates {
     isUnderline: boolean;
     isStrike: boolean;
     isQuote: boolean;
+    isOrderedList: boolean;
+    isUnorderedList: boolean;
     isAlignLeft: boolean;
     isAlignCenter: boolean;
     isAlignRight: boolean;
@@ -23,6 +25,8 @@ export declare const useTextmenuCommands: (editor: Editor, config?: TextMenuConf
     onAlignJustify: () => boolean;
     onLink: (url: string, inNewTab?: boolean) => boolean;
     onQuote: () => void;
+    onOrderedList: () => void;
+    onUnorderedList: () => void;
     resetButtonFormatting: () => boolean;
 };
 export {};

package/dist/components/ui/TextMenu/hooks/useTextmenuStates.d.ts

@@ -9,6 +9,8 @@ export declare const useTextmenuStates: (editor: Editor | null) => {
     isAlignRight: boolean;
     isAlignJustify: boolean;
     isQuote: boolean;
+    isOrderedList: boolean;
+    isUnorderedList: boolean;
     isLink: boolean;
     shouldShow: ({ editor }: {
         editor: Editor;

package/dist/components/ui/VariableEditor/VariableChipBase.d.ts

@@ -31,5 +31,7 @@ export interface VariableChipBaseProps {
     textColorOverride?: string;
     /** Custom color getter function (kept for API compatibility, colors handled by CSS) */
     getColors?: (isInvalid: boolean, hasValue: boolean) => VariableColors;
+    /** Whether the chip is read-only (prevents editing) */
+    readOnly?: boolean;
 }
 export declare const VariableChipBase: React.FC<VariableChipBaseProps>;

package/dist/components/ui-kit/Icon/UnorderedListIcon.d.ts

@@ -0,0 +1,3 @@
+import type { IconProps } from "./Icon";
+export declare const UnorderedListIcon: ({ color, active, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default UnorderedListIcon;

package/dist/components/ui-kit/Icon/index.d.ts

@@ -4,7 +4,7 @@ export { BinIcon } from "./BinIcon";
 export { BoldIcon } from "./BoldIcon";
 export { BorderRadiusIcon } from "./BorderRadiusIcon";
 export { BorderWidthIcon } from "./BorderWidthIcon";
-export { BulletListIcon } from "./BulletListIcon";
+export { UnorderedListIcon } from "./UnorderedListIcon";
 export { CenterAlignIcon } from "./CenterAlignIcon";
 export { CloseIcon } from "./CloseIcon";
 export { ColorIcon } from "./ColorIcon";