@lobehub/editor 1.5.2 → 1.5.4

package/es/plugins/markdown/service/shortcut.js

@@ -20,6 +20,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 /* eslint-disable @typescript-eslint/no-redeclare */
 import { $createRangeSelection, $getSelection, $isLineBreakNode, $isRangeSelection, $isRootOrShadowRoot, $isTextNode, $setSelection } from 'lexical';
 import { genServiceId } from "../../../editor-kernel";
+import { createDebugLogger } from "../../../utils/debug";
 import { PUNCTUATION_OR_SPACE, getOpenTagStartIndex, indexBy, isEqualSubString } from "../utils";
 export var IMarkdownShortCutService = genServiceId('MarkdownShortCutService');
 function testElementTransformers(parentNode, anchorNode, anchorOffset, elementTransformers, fromTrigger) {
@@ -293,6 +294,7 @@ export var MarkdownShortCutService = /*#__PURE__*/function () {
     _defineProperty(this, "elementTransformers", []);
     _defineProperty(this, "textFormatTransformers", []);
     _defineProperty(this, "textMatchTransformers", []);
+    _defineProperty(this, "logger", createDebugLogger('service', 'markdown'));
     _defineProperty(this, "_markdownWriters", {});
     _defineProperty(this, "_textFormatTransformersByTrigger", null);
     _defineProperty(this, "_textMatchTransformersByTrigger", null);
@@ -397,7 +399,7 @@ export var MarkdownShortCutService = /*#__PURE__*/function () {
         return;
       }
       if ((_this$kernel = this.kernel) !== null && _this$kernel !== void 0 && _this$kernel.isHotReloadMode()) {
-        console.warn("[Hot Reload] Overriding markdown writer for type \"".concat(type, "\""));
+        this.logger.warn("\uD83D\uDD04 Hot reload: markdown writer \"".concat(type, "\""));
         this._markdownWriters[type] = writer;
         return;
       }

package/es/plugins/math/plugin/index.js

@@ -22,6 +22,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { $createNodeSelection, $setSelection } from 'lexical';
 import { KernelPlugin } from "../../../editor-kernel/plugin";
 import { IMarkdownShortCutService } from "../../markdown";
+import { createDebugLogger } from "../../../utils/debug";
 import { registerMathCommand } from "../command";
 import { $createMathBlockNode, $createMathInlineNode, MathBlockNode, MathInlineNode } from "../node";
 
@@ -35,6 +36,7 @@ export var MathPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
     var _this;
     _classCallCheck(this, MathPlugin);
     _this = _super.call(this);
+    _defineProperty(_assertThisInitialized(_this), "logger", createDebugLogger('plugin', 'math'));
     _this.kernel = kernel;
     _this.config = config;
     kernel.registerNodes([MathInlineNode, MathBlockNode]);
@@ -53,7 +55,7 @@ export var MathPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
         var _match = _slicedToArray(match, 2),
           code = _match[1];
         var mathNode = $createMathInlineNode(code);
-        console.log(mathNode);
+        _this.logger.debug('Math node inserted:', mathNode);
         // textNode.replace(mathNode);
         textNode.insertBefore(mathNode);
         textNode.setTextContent('');

package/es/plugins/math/react/component/MathInline.js

@@ -10,9 +10,11 @@ import { $getSelection, $isNodeSelection, CLICK_COMMAND, COMMAND_PRIORITY_NORMAL
 import { memo, useEffect, useRef, useState } from 'react';
 import { useLexicalEditor } from "../../../../editor-kernel/react";
 import { useLexicalNodeSelection } from "../../../../editor-kernel/react/useLexicalNodeSelection";
+import { createDebugLogger } from "../../../../utils/debug";
 import { $isMathNode, MathBlockNode } from "../../node";
 import Placeholder from "./Placeholder";
 import { jsx as _jsx } from "react/jsx-runtime";
+var logger = createDebugLogger('plugin', 'math');
 var MathInline = /*#__PURE__*/memo(function (_ref) {
   var editor = _ref.editor,
     node = _ref.node,
@@ -56,7 +58,7 @@ var MathInline = /*#__PURE__*/memo(function (_ref) {
   }, [isSelected, isEditing, editor, node]);
   useLexicalEditor(function (editor) {
     return editor.registerCommand(CLICK_COMMAND, function (payload) {
-      console.info(payload, payload.target, ref.current);
+      logger.debug('📊 Math click event:', payload.target === ref.current);
       if (payload.target && payload.target instanceof Node) {
         var _ref$current;
         // 获取节点对应的 DOM 元素

package/es/plugins/math/react/index.js

@@ -35,7 +35,7 @@ export var ReactMathPlugin = function ReactMathPlugin(_ref) {
       },
       theme: theme || styles
     });
-  }, [editor]);
+  }, [editor, className, theme, styles]);
   return /*#__PURE__*/_jsx(MathEdit, {
     renderComp: renderComp
   });

package/es/plugins/mention/react/ReactMentionPlugin.js

@@ -35,7 +35,7 @@ var ReactMentionPlugin = function ReactMentionPlugin(_ref) {
       markdownWriter: markdownWriter,
       theme: theme || styles
     });
-  }, [editor]);
+  }, [editor, className, markdownWriter, theme, styles]);
   return null;
 };
 ReactMentionPlugin.displayName = 'ReactMentionPlugin';

package/es/plugins/slash/plugin/index.js

@@ -129,4 +129,4 @@ export var SlashPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
     }
   }]);
   return SlashPlugin;
-}(KernelPlugin), _defineProperty(_class, "pluginName", 'slash'), _class);
+}(KernelPlugin), _defineProperty(_class, "pluginName", 'SlashPlugin'), _class);

package/es/plugins/slash/service/i-slash-service.d.ts

@@ -30,6 +30,7 @@ export declare class SlashService implements ISlashService {
     private triggerMap;
     private triggerFnMap;
     private triggerFuseMap;
+    private logger;
     constructor(kernel: IEditorKernel);
     registerSlash(options: SlashOptions): void;
     getSlashOptions(trigger: string): SlashOptions | undefined;

package/es/plugins/slash/service/i-slash-service.js

@@ -10,6 +10,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 
 import Fuse from 'fuse.js';
 import { genServiceId } from "../../../editor-kernel";
+import { createDebugLogger } from "../../../utils/debug";
 import { getBasicTypeaheadTriggerMatch } from "../utils/utils";
 export var ISlashService = genServiceId('SlashService');
 export var SlashService = /*#__PURE__*/function () {
@@ -18,6 +19,7 @@ export var SlashService = /*#__PURE__*/function () {
     _defineProperty(this, "triggerMap", new Map());
     _defineProperty(this, "triggerFnMap", new Map());
     _defineProperty(this, "triggerFuseMap", new Map());
+    _defineProperty(this, "logger", createDebugLogger('service', 'slash'));
     this.kernel = kernel;
   }
   // Specific service methods can be added here
@@ -26,7 +28,7 @@ export var SlashService = /*#__PURE__*/function () {
     value: function registerSlash(options) {
       if (this.triggerMap.has(options.trigger)) {
         if (this.kernel.isHotReloadMode()) {
-          console.warn("[Hot Reload] Overriding slash trigger \"".concat(options.trigger, "\""));
+          this.logger.warn("\uD83D\uDD04 Overriding slash trigger \"".concat(options.trigger, "\""));
         } else {
           throw new Error("Slash trigger \"".concat(options.trigger, "\" is already registered."));
         }
@@ -38,6 +40,7 @@ export var SlashService = /*#__PURE__*/function () {
         minLength: options.minLength,
         punctuation: options.punctuation
       }));
+      this.logger.debug("\u26A1 Slash trigger: ".concat(options.trigger));
       if (Array.isArray(options.items)) {
         // Filter out divider items for search functionality
         var searchableItems = options.items.filter(function (item) {

package/es/plugins/upload/plugin/index.js

@@ -19,6 +19,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { DRAG_DROP_PASTE } from '@lexical/rich-text';
 import { COMMAND_PRIORITY_HIGH, DROP_COMMAND } from 'lexical';
 import { KernelPlugin } from "../../../editor-kernel/plugin";
+import { createDebugLogger } from "../../../utils/debug";
 import { IUploadService, UploadService } from "../service/i-upload-service";
 import { getDragSelection } from "../utils";
 
@@ -32,6 +33,7 @@ export var UploadPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
     _classCallCheck(this, UploadPlugin);
     _this = _super.call(this);
     // Register the upload service
+    _defineProperty(_assertThisInitialized(_this), "logger", createDebugLogger('plugin', 'upload'));
     _this.kernel = kernel;
     _this.config = config;
     kernel.registerService(IUploadService, new UploadService());
@@ -50,7 +52,7 @@ export var UploadPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
           var uploadService = _this2.kernel.requireService(IUploadService);
           if (uploadService) {
             uploadService.uploadFile(file, 'drop', getDragSelection(event)).catch(function (error) {
-              console.error('Upload failed:', error);
+              _this2.logger.error('Upload failed:', error);
             });
           }
         }
@@ -65,7 +67,7 @@ export var UploadPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
             var uploadService = _this2.kernel.requireService(IUploadService);
             if (uploadService) {
               uploadService.uploadFile(file, 'drag-drop-paste', null).catch(function (error) {
-                console.error('Upload failed:', error);
+                _this2.logger.error('Upload failed:', error);
               });
             }
           }
@@ -79,4 +81,4 @@ export var UploadPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
     }
   }]);
   return UploadPlugin;
-}(KernelPlugin), _defineProperty(_class, "pluginName", 'upload'), _class);
+}(KernelPlugin), _defineProperty(_class, "pluginName", 'UploadPlugin'), _class);

package/es/react/Editor/Editor.js

@@ -63,9 +63,10 @@ var Editor = /*#__PURE__*/memo(function (_ref) {
   var memoMention = useMemo(function () {
     if (!enableMention) return;
     return /*#__PURE__*/_jsx(ReactMentionPlugin, {
+      className: className,
       markdownWriter: markdownWriter
     });
-  }, [enableMention, markdownWriter]);
+  }, [enableMention, markdownWriter, className]);
   var memoSlash = useMemo(function () {
     if (!enableSlash && !enableMention) return null;
     return /*#__PURE__*/_jsxs(ReactSlashPlugin, {

package/es/utils/debug.d.ts

@@ -0,0 +1,429 @@
+import createDebug from 'debug';
+/**
+ * Development mode check
+ */
+declare const isDev: boolean;
+/**
+ * Debug utility factory for LobeHub Editor
+ * Creates namespaced debug functions following the pattern: lobe-editor:category
+ */
+export declare class DebugLogger {
+    private debuggers;
+    /**
+     * Get or create a debug function for a specific namespace
+     * @param category - The debug category (e.g., 'kernel', 'plugin', 'upload')
+     * @param subcategory - Optional subcategory for more specific debugging
+     * @returns Debug function
+     */
+    getDebugger(category: string, subcategory?: string): createDebug.Debugger;
+    /**
+     * Create a scoped debug logger for a specific component/service
+     * @param category - Main category
+     * @param subcategory - Optional subcategory
+     * @returns Object with debug methods
+     */
+    createLogger(category: string, subcategory?: string): {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    /**
+     * Enable debug for specific namespaces
+     * @param namespaces - Comma-separated list of namespaces to enable
+     */
+    enable(namespaces: string): void;
+    /**
+     * Disable all debug output
+     */
+    disable(): void;
+    /**
+     * Check if a namespace is enabled
+     * @param namespace - The namespace to check
+     * @returns Whether the namespace is enabled
+     */
+    enabled(namespace: string): boolean;
+}
+/**
+ * Global debug logger instance
+ */
+export declare const debugLogger: DebugLogger;
+/**
+ * Convenience function to create a debug logger for a specific category
+ * @param category - Main category (e.g., 'kernel', 'plugin', 'upload')
+ * @param subcategory - Optional subcategory
+ * @returns Logger object with debug methods
+ */
+export declare function createDebugLogger(category: string, subcategory?: string): {
+    /**
+     * General debug logging
+     */
+    debug: createDebug.Debugger;
+    /**
+     * Error level logging - uses console.error for proper browser dev tool support
+     */
+    error: (...args: any[]) => void;
+    /**
+     * Info level logging
+     */
+    info: createDebug.Debugger;
+    /**
+     * Log function - alias for debug for compatibility
+     */
+    log: createDebug.Debugger;
+    /**
+     * Warning level logging - uses console.warn for proper browser dev tool support
+     */
+    warn: (...args: any[]) => void;
+};
+/**
+ * Pre-configured debug loggers for common categories
+ */
+export declare const debugLoggers: {
+    demo: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    file: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    image: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    kernel: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    markdown: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    math: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    mention: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    plugin: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    react: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    service: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    slash: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+    upload: {
+        /**
+         * General debug logging
+         */
+        debug: createDebug.Debugger;
+        /**
+         * Error level logging - uses console.error for proper browser dev tool support
+         */
+        error: (...args: any[]) => void;
+        /**
+         * Info level logging
+         */
+        info: createDebug.Debugger;
+        /**
+         * Log function - alias for debug for compatibility
+         */
+        log: createDebug.Debugger;
+        /**
+         * Warning level logging - uses console.warn for proper browser dev tool support
+         */
+        warn: (...args: any[]) => void;
+    };
+};
+/**
+ * Development mode utilities
+ */
+export { isDev };
+/**
+ * Conditional console logging - only logs in development mode
+ * Use this for demo files and development-only logging
+ */
+export declare const devConsole: {
+    error: (...args: any[]) => void;
+    info: (...args: any[]) => void;
+    log: (...args: any[]) => void;
+    warn: (...args: any[]) => void;
+};
+/**
+ * Production-safe error logging
+ * Always logs errors and warnings regardless of environment using native console methods
+ * for proper browser dev tool support. Debug/info uses debug package.
+ */
+export declare const prodSafeLogger: {
+    /**
+     * Debug info - only shown when debug is enabled
+     */
+    debug: createDebug.Debugger;
+    /**
+     * Log critical errors that should always be visible (uses console.error)
+     */
+    error: (...args: any[]) => void;
+    /**
+     * Info logging - only shown when debug is enabled
+     */
+    info: createDebug.Debugger;
+    /**
+     * Log warnings that should always be visible (uses console.warn)
+     */
+    warn: (...args: any[]) => void;
+};
+/**
+ * Browser debug utilities for Next.js and other client-side frameworks
+ */
+export declare const browserDebug: {
+    /**
+     * Disable debug logging in browser environment
+     */
+    disable: () => void;
+    /**
+     * Enable debug logging in browser environment
+     * @param namespaces - Debug namespaces to enable (e.g., 'lobe-editor:*')
+     */
+    enable: (namespaces?: string) => void;
+    /**
+     * Get current debug configuration
+     */
+    getConfig: () => {
+        enabled: string | boolean;
+        source: string;
+    };
+    /**
+     * Show available debug categories
+     */
+    showCategories: () => void;
+    /**
+     * Show current debug status and configuration
+     */
+    showStatus: () => void;
+};