@trycourier/react-designer 0.0.0-canary-20251208142108 → 0.0.0-canary-20251209152659

package/dist/components/BrandEditor/BrandEditor.d.ts

@@ -2,5 +2,6 @@ import type { Theme } from "../ui-kit/ThemeProvider/ThemeProvider.types";
 import { type EditorProps } from "./Editor";
 export interface BrandEditorProps extends Omit<EditorProps, "disableVariableAutocomplete"> {
     theme?: Theme | string;
+    colorScheme?: "light" | "dark";
 }
 export declare const BrandEditor: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<BrandEditorProps & import("react").RefAttributes<HTMLDivElement>>>;

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

@@ -19,7 +19,7 @@ interface BrandSettingsData {
     mediumLink?: string;
     xLink?: string;
 }
-export interface EmailProps extends Pick<TemplateEditorProps, "hidePublish" | "brandEditor" | "channels" | "variables" | "theme" | "routing" | "value" | "dataMode">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
+export interface EmailProps extends Pick<TemplateEditorProps, "hidePublish" | "brandEditor" | "channels" | "variables" | "theme" | "routing" | "value" | "colorScheme">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
     isLoading?: boolean;
     headerRenderer?: ({ hidePublish, channels, routing, }: {
         hidePublish?: boolean;

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

@@ -6,4 +6,4 @@ export declare const EmailEditorMain: import("react").ForwardRefExoticComponent<
 } & import("react").RefAttributes<HTMLDivElement>>;
 export interface EmailLayoutProps extends EmailProps {
 }
-export declare const EmailLayout: ({ variables, theme, isLoading, hidePublish, channels, brandEditor, routing, dataMode, ...rest }: EmailLayoutProps) => import("react/jsx-runtime").JSX.Element;
+export declare const EmailLayout: ({ variables, theme, isLoading, hidePublish, channels, brandEditor, routing, colorScheme, ...rest }: EmailLayoutProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -3,5 +3,7 @@ import type { Editor } from "@tiptap/react";
 export interface SideBarItemDetailsProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    /** Whether to disable variable autocomplete suggestions in sidebar inputs */
+    disableVariableAutocomplete?: boolean;
 }
-export declare const SideBarItemDetails: ({ element, editor }: SideBarItemDetailsProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const SideBarItemDetails: ({ element, editor, disableVariableAutocomplete, }: SideBarItemDetailsProps) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -21,7 +21,7 @@ export interface InboxRenderProps {
         editor: Editor;
     }) => void;
 }
-export interface InboxProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
+export interface InboxProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value" | "colorScheme">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
     readOnly?: boolean;
     headerRenderer?: ({ hidePublish, channels, routing, }: {
         hidePublish?: boolean;

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

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

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

@@ -27,7 +27,7 @@ export interface MSTeamsRenderProps {
     selectedNode: Node | null;
     msteamsEditor: Editor | null;
 }
-export interface MSTeamsProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
+export interface MSTeamsProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value" | "colorScheme">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
     readOnly?: boolean;
     headerRenderer?: ({ hidePublish, channels, routing, }: {
         hidePublish?: boolean;

package/dist/components/TemplateEditor/Channels/MSTeams/MSTeamsLayout.d.ts

@@ -4,4 +4,4 @@ export interface MSTeamsLayoutProps extends MSTeamsProps {
 }
 export declare const MSTeamsEditorContainer: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 export declare const MSTeamsEditorMain: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
-export declare const MSTeamsLayout: ({ hidePublish, theme, variables, channels, routing, }: MSTeamsLayoutProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MSTeamsLayout: ({ hidePublish, theme, variables, channels, routing, colorScheme, }: MSTeamsLayoutProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -18,7 +18,7 @@ export interface PushRenderProps {
         editor: Editor;
     }) => void;
 }
-export interface PushProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
+export interface PushProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value" | "colorScheme">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
     readOnly?: boolean;
     headerRenderer?: ({ hidePublish, channels, routing, }: {
         hidePublish?: boolean;

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

@@ -19,7 +19,7 @@ export interface SMSRenderProps {
         editor: Editor;
     }) => void;
 }
-export interface SMSProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value" | "dataMode">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
+export interface SMSProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value" | "colorScheme">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
     readOnly?: boolean;
     headerRenderer?: ({ hidePublish, channels, routing, }: {
         hidePublish?: boolean;

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

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

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

@@ -27,7 +27,7 @@ export interface SlackRenderProps {
     selectedNode: Node | null;
     slackEditor: Editor | null;
 }
-export interface SlackProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
+export interface SlackProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value" | "colorScheme">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
     readOnly?: boolean;
     headerRenderer?: ({ hidePublish, channels, routing, }: {
         hidePublish?: boolean;

package/dist/components/TemplateEditor/Channels/Slack/SlackLayout.d.ts

@@ -4,4 +4,4 @@ export interface SlackLayoutProps extends SlackProps {
 }
 export declare const SlackEditorContainer: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 export declare const SlackEditorMain: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
-export declare const SlackLayout: ({ hidePublish, theme, variables, channels, routing, }: SlackLayoutProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SlackLayout: ({ hidePublish, theme, variables, channels, routing, colorScheme, }: SlackLayoutProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -18,6 +18,6 @@ export interface TemplateEditorProps extends Omit<HTMLAttributes<HTMLDivElement>
     /** @deprecated Use routing.channels instead. Will be removed in a future version. */
     channels?: ChannelType[];
     routing?: MessageRouting;
-    dataMode?: "light" | "dark";
+    colorScheme?: "light" | "dark";
 }
 export declare const TemplateEditor: import("react").NamedExoticComponent<TemplateEditorProps>;

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

@@ -2,6 +2,8 @@ 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 } from "./Channels";
 export { default as EmailEditor } from "./Channels/Email/EmailEditor";
 export * from "./TemplateEditor";

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

@@ -3,6 +3,8 @@ import type { Editor } from "@tiptap/react";
 interface ButtonFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    /** Whether to disable variable autocomplete suggestions */
+    disableVariableAutocomplete?: boolean;
 }
-export declare const ButtonForm: ({ element, editor }: ButtonFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const ButtonForm: ({ element, editor, disableVariableAutocomplete, }: ButtonFormProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

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

@@ -3,5 +3,7 @@ import type { Editor } from "@tiptap/react";
 export interface ImageBlockFormProps {
     element?: ProseMirrorNode;
     editor: Editor | null;
+    /** Whether to disable variable autocomplete suggestions */
+    disableVariableAutocomplete?: boolean;
 }
-export declare const ImageBlockForm: ({ element, editor }: ImageBlockFormProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const ImageBlockForm: ({ element, editor, disableVariableAutocomplete, }: ImageBlockFormProps) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -6,6 +6,6 @@ export interface MainLayoutProps extends HTMLAttributes<HTMLDivElement> {
     isLoading?: boolean;
     SideBar?: React.ReactNode;
     Header?: React.ReactNode;
-    dataMode?: "light" | "dark";
+    colorScheme?: "light" | "dark";
 }
 export declare const MainLayout: import("react").ForwardRefExoticComponent<MainLayoutProps & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -5,5 +5,7 @@ export interface TextInputProps extends Omit<React.ComponentProps<"input">, "as"
     autoResize?: boolean;
     onChange?: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
     onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    /** Whether to disable variable autocomplete suggestions */
+    disableVariableAutocomplete?: boolean;
 }
 export declare const TextInput: React.ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;

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

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { type VariableEditorBaseProps } from "./shared";
+export interface VariableInputProps extends VariableEditorBaseProps {
+    /** Whether the input is read-only */
+    readOnly?: boolean;
+}
+/**
+ * A single-line input that renders {{variable}} patterns as styled chips.
+ * Uses a minimal TipTap editor under the hood for rich content rendering.
+ */
+export declare const VariableInput: React.ForwardRefExoticComponent<VariableInputProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { type VariableEditorBaseProps } from "./shared";
+export interface VariableTextareaProps extends VariableEditorBaseProps {
+}
+/**
+ * A textarea-like input that renders {{variable}} patterns as styled chips.
+ * Uses a minimal TipTap editor under the hood for rich content rendering.
+ */
+export declare const VariableTextarea: React.ForwardRefExoticComponent<VariableTextareaProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,6 @@
+export { VariableTextarea } from "./VariableTextarea";
+export type { VariableTextareaProps } from "./VariableTextarea";
+export { VariableInput } from "./VariableInput";
+export type { VariableInputProps } from "./VariableInput";
+export { parseStringToContent, contentToString, SimpleVariableNode, SimpleVariableView, VariableChipIcon, } from "./shared";
+export type { VariableEditorBaseProps } from "./shared";

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

@@ -0,0 +1,51 @@
+import { Node } from "@tiptap/core";
+import type { Content, JSONContent } from "@tiptap/core";
+import type { NodeViewProps } from "@tiptap/react";
+import * as React from "react";
+/**
+ * Simple variable icon for the chip
+ */
+export declare const VariableChipIcon: React.FC<{
+    color?: string;
+}>;
+/**
+ * Standalone variable view component
+ * Does not depend on external jotai stores
+ */
+export declare const SimpleVariableView: React.FC<NodeViewProps>;
+/**
+ * Custom VariableNode that uses SimpleVariableView
+ * Used in VariableInput and VariableTextarea components
+ */
+export declare const SimpleVariableNode: Node<any, any>;
+/**
+ * Parses a string with {{variable}} syntax into TipTap JSON content
+ */
+export declare function parseStringToContent(text: string): Content;
+/**
+ * Converts TipTap JSON content back to string with {{variable}} syntax
+ */
+export declare function contentToString(doc: JSONContent): string;
+/**
+ * Base props shared between VariableInput and VariableTextarea
+ */
+export interface VariableEditorBaseProps {
+    /** The current value with {{variable}} syntax */
+    value?: string;
+    /** Called when the value changes */
+    onChange?: (value: string) => void;
+    /** List of available variable names for autocomplete */
+    variables?: string[];
+    /** Placeholder text */
+    placeholder?: string;
+    /** Additional CSS classes */
+    className?: string;
+    /** Whether the input is disabled */
+    disabled?: boolean;
+    /** Whether to disable variable autocomplete suggestions */
+    disableVariableAutocomplete?: boolean;
+    /** Called when the input gains focus */
+    onFocus?: () => void;
+    /** Called when the input loses focus */
+    onBlur?: () => void;
+}

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

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

package/dist/components/ui-kit/ThemeProvider/ThemeProvider.d.ts

@@ -3,7 +3,7 @@ import type { Theme } from "./ThemeProvider.types";
 interface ThemeProviderProps {
     children: ReactNode;
     theme?: Theme | string;
-    dataMode?: "light" | "dark";
+    colorScheme?: "light" | "dark";
     className?: string;
 }
 export declare const ThemeProvider: import("react").ForwardRefExoticComponent<ThemeProviderProps & import("react").RefAttributes<HTMLDivElement>>;