@trycourier/react-designer 0.0.0-canary-20251210164636 → 0.0.0-canary-20251219131027

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" | "colorScheme">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
+export interface SMSProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "disableVariablesAutocomplete" | "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, colorScheme, ...rest }: SMSLayoutProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SMSLayout: ({ hidePublish, theme, variables, disableVariablesAutocomplete, channels, routing, colorScheme, ...rest }: SMSLayoutProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,9 +1,8 @@
 import type { Editor } from "@tiptap/react";
-type UniqueIdentifier = string | number;
+import { type VisibleBlockItem } from "@/components/TemplateEditor/store";
 export interface SlackSideBarProps {
-    items: UniqueIdentifier[];
+    items: VisibleBlockItem[];
     label?: string;
     editor?: Editor;
 }
 export declare const SlackSideBar: ({ items, label, editor }: SlackSideBarProps) => import("react/jsx-runtime").JSX.Element;
-export {};

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

@@ -1,4 +1,5 @@
 import type { MessageRouting } from "@/components/Providers/store";
+import { type VisibleBlockItem } from "@/components/TemplateEditor/store";
 import type { TextMenuConfig } from "@/components/ui/TextMenu/config";
 import type { TiptapDoc } from "@/lib/utils";
 import type { ChannelType } from "@/store";
@@ -21,13 +22,13 @@ export interface SlackRenderProps {
         editor: Editor;
     }) => void;
     items: {
-        Sidebar: string[];
+        Sidebar: VisibleBlockItem[];
         Editor: UniqueIdentifier[];
     };
     selectedNode: Node | null;
     slackEditor: Editor | null;
 }
-export interface SlackProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "channels" | "routing" | "value" | "colorScheme">, Omit<HTMLAttributes<HTMLDivElement>, "value" | "onChange"> {
+export interface SlackProps extends Pick<TemplateEditorProps, "hidePublish" | "theme" | "variables" | "disableVariablesAutocomplete" | "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, colorScheme, }: SlackLayoutProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SlackLayout: ({ hidePublish, theme, variables, disableVariablesAutocomplete, channels, routing, colorScheme, }: SlackLayoutProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,5 +1,13 @@
 import { type Channel, type ChannelType } from "@/store";
+import type { ElementalNode } from "@/types/elemental.types";
 import type { TemplateEditorProps } from "../TemplateEditor";
+export declare const getChannelDefaults: (type: ChannelType) => {
+    elements: ElementalNode[];
+    raw?: {
+        title?: string;
+        text?: string;
+    };
+};
 export declare const useChannels: ({ channels, routing, }: {
     /** @deprecated Use routing.channels instead. Will be removed in a future version. */
     channels?: ChannelType[];

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

@@ -1,4 +1,5 @@
 import type { ElementalContent } from "@/types/elemental.types";
+import type { VariableValidationConfig } from "@/types/validation.types";
 import type { HTMLAttributes } from "react";
 import type { ChannelType } from "../../store";
 import type { BrandEditorProps } from "../BrandEditor";
@@ -8,8 +9,22 @@ export interface TemplateEditorProps extends Omit<HTMLAttributes<HTMLDivElement>
     theme?: Theme | string;
     value?: ElementalContent | null;
     onChange?: (value: ElementalContent) => void;
-    /** @deprecated The variables prop is no longer used. Users can now type any variable directly without autocomplete suggestions. */
+    /**
+     * Variables available for autocomplete suggestions.
+     * When provided, typing {{ will show a dropdown with matching variables.
+     */
     variables?: Record<string, unknown>;
+    /**
+     * When true, disables variable autocomplete and allows users to type any variable name.
+     * When false (default), shows autocomplete dropdown with variables from the `variables` prop.
+     * @default false
+     */
+    disableVariablesAutocomplete?: boolean;
+    /**
+     * Configuration for custom variable validation.
+     * Allows restricting which variable names are allowed and defining behavior on validation failure.
+     */
+    variableValidation?: VariableValidationConfig;
     hidePublish?: boolean;
     autoSave?: boolean;
     autoSaveDebounce?: number;

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

@@ -1,12 +1,13 @@
 import type { Editor } from "@tiptap/react";
+import { type VisibleBlockItem } from "../store";
 type UniqueIdentifier = string | number;
 interface UsePragmaticDndProps {
     items: {
-        Sidebar: string[];
+        Sidebar: VisibleBlockItem[];
         Editor: UniqueIdentifier[];
     };
     setItems: React.Dispatch<React.SetStateAction<{
-        Sidebar: string[];
+        Sidebar: VisibleBlockItem[];
         Editor: UniqueIdentifier[];
     }>>;
     editor?: Editor | null;

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

@@ -1,8 +1,9 @@
 import type { Editor } from "@tiptap/react";
+import { type VisibleBlockItem } from "../store";
 type UniqueIdentifier = string | number;
 interface UseSyncEditorItemsProps {
     setItems: React.Dispatch<React.SetStateAction<{
-        Sidebar: string[];
+        Sidebar: VisibleBlockItem[];
         Editor: UniqueIdentifier[];
     }>>;
     rafId: React.MutableRefObject<number | null>;

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

@@ -1,30 +1,18 @@
 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 { useChannels, getChannelDefaults } 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 { 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/TemplateEditor/store.d.ts

@@ -1,4 +1,5 @@
 import type { ElementalContent } from "@/types/elemental.types";
+import type { VariableValidationConfig } from "@/types/validation.types";
 import type { Editor } from "@tiptap/react";
 export declare const subjectAtom: import("jotai").PrimitiveAtom<string | null> & {
     init: string | null;
@@ -29,6 +30,15 @@ export declare const isSidebarExpandedAtom: import("jotai").PrimitiveAtom<boolea
 export declare const variableValuesAtom: import("jotai").PrimitiveAtom<Record<string, string>> & {
     init: Record<string, string>;
 };
+export declare const availableVariablesAtom: import("jotai").PrimitiveAtom<Record<string, unknown>> & {
+    init: Record<string, unknown>;
+};
+export declare const disableVariablesAutocompleteAtom: import("jotai").PrimitiveAtom<boolean> & {
+    init: boolean;
+};
+export declare const variableValidationAtom: import("jotai").PrimitiveAtom<VariableValidationConfig | undefined> & {
+    init: VariableValidationConfig | undefined;
+};
 export declare const isDraggingAtom: import("jotai").PrimitiveAtom<boolean> & {
     init: boolean;
 };
@@ -45,3 +55,124 @@ export declare const flushFunctionsAtom: import("jotai").WritableAtom<Map<string
     fn?: FlushFunction;
 }], void>;
 export declare const flushAllPendingUpdates: (flushFunctions: Map<string, FlushFunction>) => void;
+/**
+ * Available block element types that can be used in the sidebar
+ */
+export type BlockElementType = "heading" | "text" | "image" | "spacer" | "divider" | "button" | "customCode" | "column" | "blockquote";
+/**
+ * Attributes that can be set as defaults or in presets for blocks.
+ * Types match the actual TipTap node attribute types for each extension.
+ */
+export interface BlockAttributes {
+    /** Background color (string, e.g., "#ffffff" or "transparent") */
+    backgroundColor?: string;
+    /** Border color */
+    borderColor?: string;
+    /** Border width in pixels */
+    borderWidth?: number;
+    /** Border radius in pixels */
+    borderRadius?: number;
+    /** Vertical padding in pixels */
+    paddingVertical?: number;
+    /** Horizontal padding in pixels */
+    paddingHorizontal?: number;
+    /** Text alignment */
+    textAlign?: "left" | "center" | "right" | "justify";
+    /** Button label text */
+    label?: string;
+    /** Button link URL */
+    link?: string;
+    /** Button alignment */
+    alignment?: "left" | "center" | "right";
+    /** Button padding in pixels */
+    padding?: number;
+    /** Font weight */
+    fontWeight?: "normal" | "bold";
+    /** Font style */
+    fontStyle?: "normal" | "italic";
+    /** Underline text */
+    isUnderline?: boolean;
+    /** Strikethrough text */
+    isStrike?: boolean;
+    /** @deprecated Text color - legacy property */
+    textColor?: string;
+    /** Divider color */
+    color?: string;
+    /** Divider line thickness in pixels */
+    size?: number;
+    /** Divider corner radius */
+    radius?: number;
+    /** Divider variant type */
+    variant?: "divider" | "spacer";
+    /** Image source path/URL */
+    sourcePath?: string;
+    /** Image alt text */
+    alt?: string;
+    /** Image width as ratio (0-1, where 1 = 100%) */
+    width?: number;
+    /** HTML code content */
+    code?: string;
+    /** Number of columns (1-4) */
+    columnsCount?: number;
+    /** Left border width for blockquote */
+    borderLeftWidth?: number;
+    [key: string]: unknown;
+}
+/**
+ * A block preset is a pre-configured variant of an existing block type.
+ * For example, a "Portal Button" preset is a button with specific href and label.
+ */
+export interface BlockPreset {
+    /** The base block type this preset is built on */
+    type: BlockElementType;
+    /** Unique identifier for this preset */
+    key: string;
+    /** Display label in the sidebar */
+    label: string;
+    /** Optional custom icon (React node) */
+    icon?: React.ReactNode;
+    /** Pre-configured attributes for this preset */
+    attributes: BlockAttributes;
+}
+/**
+ * A reference to a preset in the visible blocks list
+ */
+export interface PresetReference {
+    /** The base block type */
+    type: BlockElementType;
+    /** The preset key */
+    preset: string;
+}
+/**
+ * A visible block item can be either:
+ * - A built-in block type string (e.g., "text", "button")
+ * - A preset reference (e.g., { type: "button", preset: "portal" })
+ */
+export type VisibleBlockItem = BlockElementType | PresetReference;
+/**
+ * Type guard to check if a VisibleBlockItem is a PresetReference
+ */
+export declare const isPresetReference: (item: VisibleBlockItem) => item is PresetReference;
+/**
+ * Default block elements available in the sidebar
+ */
+export declare const DEFAULT_VISIBLE_BLOCKS: VisibleBlockItem[];
+/**
+ * Atom to store visible blocks in the sidebar (and their order)
+ */
+export declare const visibleBlocksAtom: import("jotai").PrimitiveAtom<VisibleBlockItem[]> & {
+    init: VisibleBlockItem[];
+};
+/**
+ * Atom to store default attributes for each block type
+ * When a new block is created, these defaults are applied
+ */
+export declare const blockDefaultsAtom: import("jotai").PrimitiveAtom<Partial<Record<BlockElementType, BlockAttributes>>> & {
+    init: Partial<Record<BlockElementType, BlockAttributes>>;
+};
+/**
+ * Atom to store registered block presets
+ */
+export declare const blockPresetsAtom: import("jotai").PrimitiveAtom<BlockPreset[]> & {
+    init: BlockPreset[];
+};

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

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

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

@@ -13,31 +13,31 @@ export declare const buttonSchema: z.ZodObject<{
     textColor: z.ZodOptional<z.ZodString>;
     borderColor: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
-    padding: number;
-    label: string;
     backgroundColor: string;
-    alignment: "left" | "center" | "right";
     borderRadius: number;
-    fontStyle: "italic" | "normal";
-    fontWeight: "bold" | "normal";
+    label: string;
+    alignment: "left" | "center" | "right";
+    padding: number;
+    fontWeight: "normal" | "bold";
+    fontStyle: "normal" | "italic";
     isUnderline: boolean;
     isStrike: boolean;
     link?: string | undefined;
-    textColor?: string | undefined;
     borderColor?: string | undefined;
+    textColor?: string | undefined;
 }, {
-    padding: number;
-    label: string;
     backgroundColor: string;
-    alignment: "left" | "center" | "right";
     borderRadius: number;
-    fontStyle: "italic" | "normal";
-    fontWeight: "bold" | "normal";
+    label: string;
+    alignment: "left" | "center" | "right";
+    padding: number;
+    fontWeight: "normal" | "bold";
+    fontStyle: "normal" | "italic";
     isUnderline: boolean;
     isStrike: boolean;
     link?: string | undefined;
-    textColor?: string | undefined;
     borderColor?: string | undefined;
+    textColor?: string | undefined;
 }>;
 export interface ButtonProps {
     label: string;

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

@@ -20,22 +20,22 @@ export declare const columnSchema: z.ZodObject<{
     }>, "many">>;
 }, "strip", z.ZodTypeAny, {
     backgroundColor: string;
-    paddingVertical: number;
-    paddingHorizontal: number;
-    borderWidth: number;
     borderColor: string;
+    borderWidth: number;
     borderRadius: number;
+    paddingVertical: number;
+    paddingHorizontal: number;
     columnsCount: number;
     cells?: {
         elements: any[];
     }[] | undefined;
 }, {
     backgroundColor?: string | undefined;
-    paddingVertical?: number | undefined;
-    paddingHorizontal?: number | undefined;
-    borderWidth?: number | undefined;
     borderColor?: string | undefined;
+    borderWidth?: number | undefined;
     borderRadius?: number | undefined;
+    paddingVertical?: number | undefined;
+    paddingHorizontal?: number | undefined;
     columnsCount?: number | undefined;
     cells?: {
         elements: any[];

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

@@ -9,8 +9,8 @@ export declare const dividerSchema: z.ZodObject<{
     padding: number;
     color: string;
     size: number;
-    variant: "divider" | "spacer";
     radius: number;
+    variant: "divider" | "spacer";
 }, {
     padding: number;
     color: string;

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

@@ -10,21 +10,21 @@ export declare const imageBlockSchema: z.ZodObject<{
     isUploading: z.ZodOptional<z.ZodBoolean>;
     imageNaturalWidth: z.ZodNumber;
 }, "strip", z.ZodTypeAny, {
-    width: number;
-    borderWidth: number;
     borderColor: string;
+    borderWidth: number;
     alignment: "left" | "center" | "right";
     sourcePath: string;
+    width: number;
     imageNaturalWidth: number;
     link?: string | undefined;
     alt?: string | undefined;
     isUploading?: boolean | undefined;
 }, {
-    width: number;
-    borderWidth: number;
     borderColor: string;
+    borderWidth: number;
     alignment: "left" | "center" | "right";
     sourcePath: string;
+    width: number;
     imageNaturalWidth: number;
     link?: string | undefined;
     alt?: string | undefined;

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

@@ -10,19 +10,19 @@ export declare const textBlockSchema: z.ZodObject<{
     id: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
     backgroundColor: string;
+    borderColor: string;
+    borderWidth: number;
     paddingVertical: number;
     paddingHorizontal: number;
-    borderWidth: number;
-    borderColor: string;
     textAlign: "left" | "center" | "right" | "justify";
     selected: boolean;
     id?: string | undefined;
 }, {
     backgroundColor: string;
+    borderColor: string;
+    borderWidth: number;
     paddingVertical: number;
     paddingHorizontal: number;
-    borderWidth: number;
-    borderColor: string;
     id?: string | undefined;
     textAlign?: "left" | "center" | "right" | "justify" | undefined;
     selected?: boolean | undefined;

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

@@ -1,7 +1,20 @@
 import { Extension, Node } from "@tiptap/core";
-import type { VariableNodeOptions } from "./Variable.types";
+import type { VariableNodeOptions, VariableOptions } from "./Variable.types";
 export declare const VariableNode: Node<VariableNodeOptions, any>;
 /**
  * Extension that inserts an empty variable chip when user types {{
+ * This is used when autocomplete is disabled (disableVariablesAutocomplete=true)
  */
 export declare const VariableInputRule: Extension<any, any>;
+/**
+ * Extension that provides variable autocomplete suggestions.
+ * When user types {{, shows a dropdown with available variables.
+ * Pass `variables` option to configure available variables.
+ * Pass `disableSuggestions: true` to disable autocomplete (falls back to VariableInputRule behavior).
+ */
+export declare const Variable: Extension<VariableOptions, any>;
+/**
+ * @deprecated This extension has been removed. Variable conversion now happens via VariableInputRule or Variable.
+ * This is a no-op extension provided for backwards compatibility and will be removed in a future major version.
+ */
+export declare const VariableTypeHandler: Extension<any, any>;

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

@@ -1,3 +1,5 @@
+import type { Editor, Range } from "@tiptap/core";
+import type { SuggestionOptions, SuggestionProps } from "@tiptap/suggestion";
 export interface VariableNodeOptions {
     HTMLAttributes?: Record<string, unknown>;
 }
@@ -5,3 +7,38 @@ export interface VariableNodeAttributes {
     id: string;
     isInvalid: boolean;
 }
+/**
+ * Options for the Variable suggestion extension that provides autocomplete.
+ */
+export interface VariableOptions {
+    HTMLAttributes?: Record<string, unknown>;
+    suggestion?: Partial<SuggestionOptions>;
+    /** Variables available for autocomplete suggestions */
+    variables?: Record<string, unknown>;
+    /** When true, disables the autocomplete dropdown */
+    disableSuggestions?: boolean;
+}
+export interface VariableCommandProps {
+    editor: Editor;
+    range: Range;
+    props: string;
+}
+export interface VariableSuggestionProps {
+    editor: Editor;
+    range: Range;
+    clientRect: () => DOMRect | null;
+    items: string[];
+    command: (props: {
+        editor: Editor;
+        range: Range;
+        props: string;
+    }) => void;
+    selected: number;
+}
+export interface VariableSuggestionsProps extends SuggestionProps {
+    items: string[];
+    command: (item: string) => void;
+    editor: Editor;
+    query: string;
+    selected: number;
+}

package/dist/components/extensions/Variable/VariableSuggestions.d.ts

@@ -0,0 +1,7 @@
+interface VariableSuggestionsProps {
+    items: string[];
+    command: (item: string) => void;
+    selected: number;
+}
+export declare const VariableSuggestions: React.FC<VariableSuggestionsProps>;
+export {};

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

@@ -1,3 +1,4 @@
 export * from "./Variable";
 export * from "./Variable.types";
 export * from "./VariablePaste";
+export * from "./VariableSuggestions";

package/dist/components/extensions/Variable/suggestion.d.ts

@@ -0,0 +1,2 @@
+import type { SuggestionOptions } from "@tiptap/suggestion";
+export declare const suggestion: Partial<SuggestionOptions>;

package/dist/components/extensions/extension-kit.d.ts

@@ -1,6 +1,11 @@
 import type { Node } from "@tiptap/pm/model";
-export declare const ExtensionKit: (options?: {
+export interface ExtensionKitOptions {
     setSelectedNode?: (node: Node) => void;
     shouldHandleClick?: () => boolean;
-}) => (import("@tiptap/core").Node<any, any> | import("@tiptap/core").Extension<any, any> | import("@tiptap/core").Mark<import("@tiptap/extension-underline").UnderlineOptions, any>)[];
+    /** Variables available for autocomplete suggestions */
+    variables?: Record<string, unknown>;
+    /** When true, disables variable autocomplete and allows typing any variable */
+    disableVariablesAutocomplete?: boolean;
+}
+export declare const ExtensionKit: (options?: ExtensionKitOptions) => (import("@tiptap/core").Node<any, any> | import("@tiptap/core").Extension<any, any> | import("@tiptap/core").Mark<import("@tiptap/extension-underline").UnderlineOptions, any>)[];
 export default ExtensionKit;

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

@@ -27,4 +27,4 @@ export { Paragraph } from "./Paragraph";
 export { Selection } from "./Selection";
 export { SlashMenu } from "./SlashMenu";
 export { UniqueId } from "./UniqueId";
-export { VariableNode, VariableInputRule, VariablePaste } from "./Variable";
+export { VariableNode, VariableInputRule, VariablePaste, Variable, VariableTypeHandler, } from "./Variable";

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

@@ -1,2 +1,3 @@
 export * from "./useNodeAttributes";
 export * from "./useVariables";
+export * from "./useBlockConfig";