@nextblock-cms/editor 0.2.16 → 0.2.18

package/index.d.ts

@@ -0,0 +1,29 @@
+export { Editor } from './lib/editor';
+export { Editor as default } from './lib/editor';
+export { NotionEditor } from './lib/NotionEditor';
+export { EditorBubbleMenu } from './lib/components/menus/BubbleMenu';
+export { EditorFloatingMenu } from './lib/components/menus/FloatingMenu';
+export { EnhancedFloatingMenu } from './lib/components/menus/EnhancedFloatingMenu';
+export { EditorToolbar } from './lib/components/menus/Toolbar';
+export { SlashCommandList } from './lib/components/menus/SlashCommandList';
+export { Toolbar, ToolbarGroup, ToolbarButton, ToolbarSeparator } from './lib/components/ui/Toolbar';
+export { UndoRedoButtons } from './lib/components/ui/UndoRedoButtons';
+export { DragHandle } from './lib/components/DragHandle';
+export { HtmlContent } from './lib/components/HtmlContent';
+export { MobileToolbar } from './lib/components/mobile/MobileToolbar';
+export { editorExtensions } from './lib/kit';
+export { SlashCommand } from './lib/extensions/slash-command';
+export { TrailingNode } from './lib/extensions/TrailingNode';
+export { default as AlertWidget } from './lib/extensions/AlertWidget';
+export { default as CtaWidgetNode } from './lib/extensions/CtaWidgetNode';
+export { DraggableNodes } from './lib/extensions/DraggableNodes';
+export { AdvancedPlaceholder } from './lib/extensions/AdvancedPlaceholder';
+export { EnhancedFocus } from './lib/extensions/EnhancedFocus';
+export { KeyboardShortcuts } from './lib/extensions/KeyboardShortcuts';
+export { useEditorHistory, canExecuteHistoryAction, executeHistoryAction, getHistoryShortcut } from './lib/hooks/useEditorHistory';
+export { FeatureValidationTest } from './lib/components/test/FeatureValidationTest';
+export { UndoRedoTest } from './lib/components/test/UndoRedoTest';
+export { NotionEditorEnhancedTest } from './lib/components/test/NotionEditorEnhancedTest';
+export type { CommandItemProps } from './lib/extensions/slash-command';
+export type { CommandListRef } from './lib/components/menus/SlashCommandList';
+export type { EditorHistoryState, EditorHistoryActions } from './lib/hooks/useEditorHistory';

package/lib/NotionEditor.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+import { OpenImagePicker } from './utils/mediaPicker';
+interface NotionEditorProps {
+    content: string;
+    onChange: (content: string) => void;
+    placeholder?: string;
+    editable?: boolean;
+    showToolbar?: boolean;
+    showCharacterCount?: boolean;
+    className?: string;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    openImagePicker?: OpenImagePicker;
+}
+export declare const NotionEditor: React.FC<NotionEditorProps>;
+export default NotionEditor;

package/lib/components/DragHandle.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { Editor } from '@tiptap/react';
+interface DragHandleProps {
+    editor: Editor | null;
+    className?: string;
+    onDragStart?: (event: DragEvent) => void;
+    onDragEnd?: (event: DragEvent) => void;
+    onNodeChange?: (params: {
+        node: any;
+        editor: Editor;
+        pos: number;
+    }) => void;
+}
+export declare const DragHandle: React.FC<DragHandleProps>;
+export default DragHandle;

package/lib/components/HtmlContent.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+export interface HtmlContentProps {
+    html: string;
+    className?: string;
+}
+export declare const HtmlContent: React.FC<HtmlContentProps>;
+export default HtmlContent;

package/lib/components/menus/BubbleMenu.d.ts

@@ -0,0 +1,7 @@
+import { FC } from 'react';
+import { Editor } from '@tiptap/core';
+interface BubbleMenuComponentProps {
+    editor: Editor;
+}
+export declare const EditorBubbleMenu: FC<BubbleMenuComponentProps>;
+export {};

package/lib/components/menus/EnhancedFloatingMenu.d.ts

@@ -0,0 +1,8 @@
+import { FC, default as React } from 'react';
+import { Editor } from '@tiptap/core';
+interface EnhancedFloatingMenuProps {
+    editor: Editor;
+    wrapperRef?: React.RefObject<HTMLDivElement | null>;
+}
+export declare const EnhancedFloatingMenu: FC<EnhancedFloatingMenuProps>;
+export {};

package/lib/components/menus/FloatingMenu.d.ts

@@ -0,0 +1,7 @@
+import { FC } from 'react';
+import { Editor } from '@tiptap/core';
+interface FloatingMenuComponentProps {
+    editor: Editor;
+}
+export declare const EditorFloatingMenu: FC<FloatingMenuComponentProps>;
+export {};

package/lib/components/menus/ImageToolbar.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { Editor } from '@tiptap/core';
+interface ImageToolbarProps {
+    editor: Editor;
+}
+export declare const ImageToolbar: React.FC<ImageToolbarProps>;
+export default ImageToolbar;

package/lib/components/menus/SlashCommandList.d.ts

@@ -0,0 +1,13 @@
+import { default as React } from 'react';
+import { CommandItemProps } from '../../extensions/slash-command';
+interface SlashCommandListProps {
+    items: CommandItemProps[];
+    command: (item: CommandItemProps) => void;
+}
+export interface CommandListRef {
+    onKeyDown: ({ event }: {
+        event: KeyboardEvent;
+    }) => boolean;
+}
+export declare const SlashCommandList: React.ForwardRefExoticComponent<SlashCommandListProps & React.RefAttributes<CommandListRef>>;
+export {};

package/lib/components/menus/TableToolbar.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { Editor } from '@tiptap/core';
+interface TableToolbarProps {
+    editor: Editor;
+}
+export declare const TableToolbar: React.FC<TableToolbarProps>;
+export default TableToolbar;

package/lib/components/menus/Toolbar.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { Editor } from '@tiptap/core';
+interface EditorToolbarProps {
+    editor: Editor;
+}
+export declare const EditorToolbar: React.FC<EditorToolbarProps>;
+export {};

package/lib/components/mobile/MobileToolbar.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { Editor } from '@tiptap/core';
+interface MobileToolbarProps {
+    editor: Editor;
+    className?: string;
+}
+export declare const MobileToolbar: React.FC<MobileToolbarProps>;
+export {};

package/lib/components/test/FeatureValidationTest.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export declare const FeatureValidationTest: React.FC;
+export default FeatureValidationTest;

package/lib/components/test/NotionEditorEnhancedTest.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+/**
+ * Test component to verify NotionEditor enhanced functionality
+ * Tests:
+ * 1. Undo/Redo buttons are visible in toolbar
+ * 2. Drag handles appear on block hover
+ * 3. Enhanced styling and spacing
+ * 4. All existing features still work
+ */
+export declare const NotionEditorEnhancedTest: React.FC;
+export default NotionEditorEnhancedTest;

package/lib/components/test/UndoRedoTest.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+/**
+ * Test component to verify undo/redo functionality with all content types
+ * This component demonstrates the enhanced undo/redo features working with:
+ * - Text formatting (bold, italic, etc.)
+ * - Headings and paragraphs
+ * - Lists (bullet, ordered, task)
+ * - Tables
+ * - Images
+ * - Code blocks
+ * - Custom widgets
+ * - Drag and drop operations
+ */
+export declare const UndoRedoTest: React.FC;
+export default UndoRedoTest;

package/lib/components/ui/AdvancedColorMenu.d.ts

@@ -0,0 +1,9 @@
+import { Editor } from '@tiptap/core';
+type Mode = "text" | "highlight";
+interface AdvancedColorMenuProps {
+    editor: Editor;
+    className?: string;
+    initialMode?: Mode;
+}
+export declare function AdvancedColorMenu({ editor, className, initialMode }: AdvancedColorMenuProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/ui/AdvancedFontSizeMenu.d.ts

@@ -0,0 +1,7 @@
+import { Editor } from '@tiptap/core';
+interface AdvancedFontSizeMenuProps {
+    editor: Editor;
+    className?: string;
+}
+export declare function AdvancedFontSizeMenu({ editor, className }: AdvancedFontSizeMenuProps): import("react/jsx-runtime").JSX.Element;
+export default AdvancedFontSizeMenu;

package/lib/components/ui/Toolbar.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+export declare const Toolbar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const ToolbarGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const ToolbarButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    isActive?: boolean;
+} & React.RefAttributes<HTMLButtonElement>>;
+export declare const ToolbarSeparator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;

package/lib/components/ui/UndoRedoButtons.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+import { Editor } from '@tiptap/core';
+interface UndoRedoButtonsProps {
+    editor: Editor;
+    className?: string;
+    showLabels?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+}
+export declare const UndoRedoButtons: React.FC<UndoRedoButtonsProps>;
+export default UndoRedoButtons;

package/lib/components/widgets/AlertWidgetComponent.d.ts

@@ -0,0 +1,3 @@
+import { NodeViewProps } from '@tiptap/react';
+declare const AlertWidgetComponent: ({ node, updateAttributes, editor }: NodeViewProps) => import("react/jsx-runtime").JSX.Element;
+export default AlertWidgetComponent;

package/lib/components/widgets/CtaWidgetComponent.d.ts

@@ -0,0 +1,3 @@
+import { NodeViewProps } from '@tiptap/react';
+declare const CtaWidgetComponent: ({ node, updateAttributes, editor }: NodeViewProps) => import("react/jsx-runtime").JSX.Element;
+export default CtaWidgetComponent;

package/lib/editor.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+interface EditorProps {
+    content: string;
+    onChange: (content: string) => void;
+    placeholder?: string;
+    editable?: boolean;
+    showToolbar?: boolean;
+    showCharacterCount?: boolean;
+    className?: string;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    useEnhancedFloatingMenu?: boolean;
+    showMobileToolbar?: boolean;
+    enableAdvancedPlaceholders?: boolean;
+    enableFocusMode?: boolean;
+    showKeyboardShortcuts?: boolean;
+}
+export declare const Editor: React.FC<EditorProps>;
+export default Editor;

package/lib/extensions/AdvancedPlaceholder.d.ts

@@ -0,0 +1,3 @@
+import { PlaceholderOptions } from '@tiptap/extension-placeholder';
+export type AdvancedPlaceholderOptions = PlaceholderOptions;
+export declare const AdvancedPlaceholder: import('@tiptap/core').Extension<PlaceholderOptions, any>;

package/lib/extensions/AlertWidget.d.ts

@@ -0,0 +1,18 @@
+import { Node } from '@tiptap/core';
+export type AlertAttrs = {
+    type?: 'info' | 'warning' | 'error' | 'success';
+    title?: string;
+    message?: string;
+    align?: 'left' | 'center' | 'right';
+    size?: 'small' | 'medium' | 'large';
+    textAlign?: 'left' | 'center' | 'right';
+};
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        alertWidget: {
+            setAlertWidget: (attrs?: AlertAttrs) => ReturnType;
+        };
+    }
+}
+declare const AlertWidget: Node<any, any>;
+export default AlertWidget;

package/lib/extensions/CtaWidgetNode.d.ts

@@ -0,0 +1,16 @@
+import { Node } from '@tiptap/core';
+declare const _default: Node<any, any>;
+export default _default;
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        ctaWidget: {
+            setCtaWidget: (options?: {
+                text?: string;
+                url?: string;
+                style?: string;
+                size?: string;
+                textAlign?: string;
+            }) => ReturnType;
+        };
+    }
+}

package/lib/extensions/DivNode.d.ts

@@ -0,0 +1,2 @@
+import { Node } from '@tiptap/core';
+export declare const DivNode: Node<any, any>;

package/lib/extensions/DraggableNodes.d.ts

@@ -0,0 +1,11 @@
+import { Extension } from '@tiptap/core';
+export declare const DraggableParagraph: import('@tiptap/core').Node<import('@tiptap/extension-paragraph').ParagraphOptions, any>;
+export declare const DraggableHeading: import('@tiptap/core').Node<import('@tiptap/extension-heading').HeadingOptions, any>;
+export declare const DraggableBlockquote: import('@tiptap/core').Node<import('@tiptap/extension-blockquote').BlockquoteOptions, any>;
+export declare const DraggableBulletList: import('@tiptap/core').Node<import('@tiptap/extension-list').BulletListOptions, any>;
+export declare const DraggableOrderedList: import('@tiptap/core').Node<import('@tiptap/extension-list').OrderedListOptions, any>;
+export declare const DraggableTaskList: import('@tiptap/core').Node<import('@tiptap/extension-list').TaskListOptions, any>;
+export declare const DraggableTaskItem: import('@tiptap/core').Node<import('@tiptap/extension-list').TaskItemOptions, any>;
+export declare const DraggableCodeBlock: import('@tiptap/core').Node<import('@tiptap/extension-code-block-lowlight').CodeBlockLowlightOptions, any>;
+export declare const DraggableImage: import('@tiptap/core').Node<import('@tiptap/extension-image').ImageOptions, any>;
+export declare const DraggableNodes: Extension<any, any>;

package/lib/extensions/EnhancedFocus.d.ts

@@ -0,0 +1,10 @@
+import { Extension } from '@tiptap/core';
+export interface EnhancedFocusOptions {
+    className: string;
+    mode: 'all' | 'deepest' | 'shallowest';
+    showFocusRing: boolean;
+    highlightSelection: boolean;
+    dimUnfocused: boolean;
+    animateTransitions: boolean;
+}
+export declare const EnhancedFocus: Extension<EnhancedFocusOptions, any>;

package/lib/extensions/FontSizeMark.d.ts

@@ -0,0 +1,13 @@
+import { Mark } from '@tiptap/core';
+export interface FontSizeOptions {
+    HTMLAttributes: Record<string, unknown>;
+}
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        fontSize: {
+            setFontSize: (className: string) => ReturnType;
+            unsetFontSize: () => ReturnType;
+        };
+    }
+}
+export declare const FontSizeMark: Mark<FontSizeOptions, any>;

package/lib/extensions/ImageExtended.d.ts

@@ -0,0 +1,2 @@
+declare const ImageExtended: import('@tiptap/core').Node<import('@tiptap/extension-image').ImageOptions, any>;
+export default ImageExtended;

package/lib/extensions/KeyboardShortcuts.d.ts

@@ -0,0 +1,7 @@
+import { Extension } from '@tiptap/core';
+export interface KeyboardShortcutsOptions {
+    enableAdvancedShortcuts: boolean;
+    enableCustomShortcuts: boolean;
+    showShortcutHints: boolean;
+}
+export declare const KeyboardShortcuts: Extension<KeyboardShortcutsOptions, any>;

package/lib/extensions/PreserveAllAttributesExtension.d.ts

@@ -0,0 +1,2 @@
+import { Extension } from '@tiptap/core';
+export declare const PreserveAllAttributesExtension: Extension<any, any>;

package/lib/extensions/ResizableImageView.d.ts

@@ -0,0 +1,2 @@
+import { NodeViewProps } from '@tiptap/react';
+export default function ResizableImageView(props: NodeViewProps): import("react/jsx-runtime").JSX.Element;

package/lib/extensions/ScriptTagNode.d.ts

@@ -0,0 +1,2 @@
+import { Node } from '@tiptap/core';
+export declare const ScriptTagNode: Node<any, any>;

package/lib/extensions/StyleTagNode.d.ts

@@ -0,0 +1,2 @@
+import { Node } from '@tiptap/core';
+export declare const StyleTagNode: Node<any, any>;

package/lib/extensions/TrailingNode.d.ts

@@ -0,0 +1,9 @@
+import { Extension } from '@tiptap/core';
+export interface TrailingNodeOptions {
+    /** Name of the node to append at the end (must exist in your schema) */
+    node: string;
+    /** If the last node’s type is in this list, do nothing */
+    notAfter: string[];
+}
+export declare const TrailingNode: Extension<TrailingNodeOptions, any>;
+export default TrailingNode;

package/lib/extensions/components/AlertWidgetComponent.d.ts

@@ -0,0 +1,3 @@
+import { NodeViewProps } from '@tiptap/react';
+declare const AlertWidgetComponent: ({ node, updateAttributes, editor }: NodeViewProps) => import("react/jsx-runtime").JSX.Element;
+export default AlertWidgetComponent;

package/lib/extensions/components/CtaWidgetComponent.d.ts

@@ -0,0 +1,3 @@
+import { NodeViewProps } from '@tiptap/react';
+declare const CtaWidgetComponent: ({ node, updateAttributes, editor }: NodeViewProps) => import("react/jsx-runtime").JSX.Element;
+export default CtaWidgetComponent;

package/lib/extensions/slash-command.d.ts

@@ -0,0 +1,17 @@
+import { Extension, Editor, Range } from '@tiptap/core';
+import { SuggestionOptions } from '@tiptap/suggestion';
+import { default as React } from 'react';
+export interface CommandItemProps {
+    title: string;
+    description: string;
+    icon: React.ReactNode;
+    command: ({ editor, range }: {
+        editor: Editor;
+        range: Range;
+    }) => void;
+}
+interface SlashCommandOptions {
+    suggestion: Partial<SuggestionOptions>;
+}
+export declare const SlashCommand: Extension<SlashCommandOptions, any>;
+export {};

package/lib/hooks/useEditorHistory.d.ts

@@ -0,0 +1,30 @@
+import { Editor } from '@tiptap/core';
+export interface EditorHistoryState {
+    canUndo: boolean;
+    canRedo: boolean;
+    historyDepth: number;
+    isHistoryEmpty: boolean;
+}
+export interface EditorHistoryActions {
+    undo: () => boolean;
+    redo: () => boolean;
+    clearHistory: () => void;
+    getHistoryState: () => EditorHistoryState;
+}
+/**
+ * Custom hook for managing Tiptap editor history state and actions
+ * Provides real-time updates of undo/redo availability and history management
+ */
+export declare const useEditorHistory: (editor: Editor | null) => EditorHistoryState & EditorHistoryActions;
+/**
+ * Utility function to check if undo/redo actions are available
+ */
+export declare const canExecuteHistoryAction: (editor: Editor | null, action: "undo" | "redo") => boolean;
+/**
+ * Utility function to execute history actions safely
+ */
+export declare const executeHistoryAction: (editor: Editor | null, action: "undo" | "redo") => boolean;
+/**
+ * Get keyboard shortcut text based on platform
+ */
+export declare const getHistoryShortcut: (action: "undo" | "redo") => string;

package/lib/kit.d.ts

@@ -0,0 +1,2 @@
+import { Extensions } from '@tiptap/core';
+export declare const editorExtensions: Extensions;

package/lib/utils/formatHTML.d.ts

@@ -0,0 +1,2 @@
+export declare function formatHTML(input: string, indentSize?: number): string;
+export default formatHTML;

package/lib/utils/mediaPicker.d.ts

@@ -0,0 +1,11 @@
+import { Editor } from '@tiptap/core';
+export type PickedImage = {
+    src: string;
+    alt?: string;
+    width?: number | null;
+    height?: number | null;
+    blurDataURL?: string | null;
+};
+export type OpenImagePicker = () => Promise<PickedImage | null>;
+export declare function setOpenImagePicker(editor: Editor, open?: OpenImagePicker): void;
+export declare function getOpenImagePicker(editor: Editor): OpenImagePicker | undefined;

package/package.json

@@ -1,7 +1,15 @@
 {
   "name": "@nextblock-cms/editor",
-  "version": "0.2.16",
-  "main": "index.cjs.js",
-  "module": "index.es.js",
-  "types": "index.d.ts"
+  "version": "0.2.18",
+  "main": "index.js",
+  "module": "index.mjs",
+  "types": "index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./index.mjs",
+      "require": "./index.js"
+    },
+    "./styles/*": "./styles/*"
+  }
 }