@lobehub/editor 1.5.3 → 1.5.5

package/README.md

@@ -8,17 +8,17 @@
 
 A modern, extensible rich text editor built on Meta's Lexical framework with dual-architecture design, featuring both a powerful kernel and React integration. Optimized for AI applications and chat interfaces.
 
-[![][npm-release-shield]][npm-release-link]
-[![][github-releasedate-shield]][github-releasedate-link]
-[![][github-action-test-shield]][github-action-test-link]
-[![][github-action-release-shield]][github-action-release-link]<br/>
-[![][github-contributors-shield]][github-contributors-link]
-[![][github-forks-shield]][github-forks-link]
-[![][github-stars-shield]][github-stars-link]
-[![][github-issues-shield]][github-issues-link]
-[![][github-license-shield]][github-license-link]
-
-[Changelog](./CHANGELOG.md) · [Report Bug][github-issues-link] · [Request Feature][github-issues-link]
+\[!\[]\[npm-release-shield]]\[npm-release-link]
+\[!\[]\[github-releasedate-shield]]\[github-releasedate-link]
+\[!\[]\[github-action-test-shield]]\[github-action-test-link]
+\[!\[]\[github-action-release-shield]]\[github-action-release-link]<br/>
+\[!\[]\[github-contributors-shield]]\[github-contributors-link]
+\[!\[]\[github-forks-shield]]\[github-forks-link]
+\[!\[]\[github-stars-shield]]\[github-stars-link]
+\[!\[]\[github-issues-shield]]\[github-issues-link]
+\[!\[]\[github-license-shield]]\[github-license-link]
+
+[Changelog](./CHANGELOG.md) · \[Report Bug]\[github-issues-link] · \[Request Feature]\[github-issues-link]
 
 ![](https://github.com/user-attachments/assets/98c9a810-1c7d-4c33-acd7-ae9d4c0695da)
 
@@ -48,12 +48,6 @@ A modern, extensible rich text editor built on Meta's Lexical framework with dua
   - [Setup](#setup)
   - [Available Scripts](#available-scripts)
   - [Debug Environment Variables](#debug-environment-variables)
-  - [Project Architecture](#project-architecture)
-- [🤝 Contributing](#-contributing)
-- [🔗 Links](#-links)
-  - [More Products](#more-products)
-  - [Design Resources](#design-resources)
-  - [Development Resources](#development-resources)
 
 ####
 
@@ -76,7 +70,7 @@ A modern, extensible rich text editor built on Meta's Lexical framework with dua
 
 To install `@lobehub/editor`, run the following command:
 
-[![][bun-shield]][bun-link]
+\[!\[]\[bun-shield]]\[bun-link]
 
 ```bash
 $ bun add @lobehub/editor
@@ -88,7 +82,7 @@ $ pnpm add @lobehub/editor
 
 <div align="right">
 
-[![][back-to-top]](#readme-top)
+[!\[\]\[back-to-top\]](#readme-top)
 
 </div>
 
@@ -237,7 +231,7 @@ editor.dispatchCommand(INSERT_HEADING_COMMAND, { tag: 'h2' });
 
 <div align="right">
 
-[![][back-to-top]](#readme-top)
+[!\[\]\[back-to-top\]](#readme-top)
 
 </div>
 
@@ -396,7 +390,7 @@ CLEAR_FORMAT_COMMAND;
 
 <div align="right">
 
-[![][back-to-top]](#readme-top)
+[!\[\]\[back-to-top\]](#readme-top)
 
 </div>
 
@@ -406,11 +400,11 @@ CLEAR_FORMAT_COMMAND;
 
 You can use Github Codespaces for online development:
 
-[![][github-codespace-shield]][github-codespace-link]
+\[!\[]\[github-codespace-shield]]\[github-codespace-link]
 
 Or clone it for local development:
 
-[![][bun-shield]][bun-link]
+\[!\[]\[bun-shield]]\[bun-link]
 
 ```bash
 $ git clone https://github.com/lobehub/lobe-editor.git
@@ -477,34 +471,18 @@ DEBUG=lobe-editor:kernel,lobe-editor:plugin:*
 
 #### Development Usage
 
-```bash
+````bash
 # Full debug during development
-DEBUG=lobe-editor:* pnpm dev
+DEBUG=lobe-editor:*
 
 # Only critical logs
-DEBUG=lobe-editor:*:error,lobe-editor:*:warn pnpm dev
-
+DEBUG=lobe-editor:*:error,lobe-editor:*:warn
 # Plugin debugging
-DEBUG=lobe-editor:plugin:* pnpm dev
-
+DEBUG=lobe-editor:plugin:*
 # Service debugging
-DEBUG=lobe-editor:service:* pnpm dev
+DEBUG=lobe-editor:service:*
 ```
 
-#### Browser Configuration
-
-In browser environment, you can also enable debug logging via localStorage:
-
-```javascript
-// Enable all debug output
-localStorage.debug = 'lobe-editor:*';
-
-// Enable specific categories
-localStorage.debug = 'lobe-editor:kernel,lobe-editor:plugin:*';
-
-// Disable debug output
-localStorage.removeItem('debug');
-```
 
 ### Project Architecture
 
@@ -707,3 +685,4 @@ This project is [MIT](./LICENSE) licensed.
 [pr-welcome-link]: https://github.com/lobehub/lobe-editor/pulls
 [pr-welcome-shield]: https://img.shields.io/badge/%F0%9F%A4%AF%20PR%20WELCOME-%E2%86%92-ffcb47?labelColor=black&style=for-the-badge
 [profile-link]: https://github.com/lobehub
+````

package/es/index.d.ts

@@ -14,7 +14,7 @@ export * from './plugins/slash';
 export * from './plugins/table';
 export * from './plugins/upload';
 export type { IEditor } from './types';
-export { createDebugLogger, debugLogger, debugLoggers, devConsole, prodSafeLogger, } from './utils/debug';
+export { browserDebug, createDebugLogger, debugLogger, debugLoggers, devConsole, prodSafeLogger, } from './utils/debug';
 export { Kernel } from './editor-kernel/kernel';
 /**
  * Enable hot reload mode globally for all editor instances

package/es/index.js

@@ -14,7 +14,7 @@ export * from "./plugins/slash";
 export * from "./plugins/table";
 export * from "./plugins/upload";
 // Debug utilities
-export { createDebugLogger, debugLogger, debugLoggers, devConsole, prodSafeLogger } from "./utils/debug";
+export { browserDebug, createDebugLogger, debugLogger, debugLoggers, devConsole, prodSafeLogger } from "./utils/debug";
 
 // Hot reload utilities
 export { Kernel } from "./editor-kernel/kernel";

package/es/plugins/hr/react/components/HRNode.js

@@ -37,8 +37,9 @@ var HRNode = /*#__PURE__*/memo(function (_ref) {
       return false;
     }, COMMAND_PRIORITY_LOW));
   }, [clearSelection, editor, isSelected, node, setSelected]);
-  return /*#__PURE__*/_jsx("hr", {
-    className: cx(styles, isSelected && 'selected', className)
+  return /*#__PURE__*/_jsx("div", {
+    className: cx(styles, isSelected && 'selected', className),
+    children: /*#__PURE__*/_jsx("hr", {})
   });
 });
 HRNode.displayName = 'HRNode';

package/es/plugins/hr/react/style.js

@@ -4,5 +4,5 @@ import { createStyles } from 'antd-style';
 export var useStyles = createStyles(function (_ref) {
   var css = _ref.css,
     token = _ref.token;
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    cursor: pointer;\n\n    width: 100%;\n    height: 4px;\n    margin-block: calc(var(--lobe-markdown-margin-multiple) * 1.5em);\n    border-color: ", ";\n    border-style: dashed;\n    border-width: 1px;\n    border-block-start: none;\n    border-inline-start: none;\n    border-inline-end: none;\n\n    &.selected {\n      border-color: ", ";\n    }\n  "])), token.colorBorder, token.yellow);
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    cursor: pointer;\n\n    display: flex;\n    align-items: center;\n\n    width: 100%;\n    height: calc(var(--lobe-markdown-margin-multiple) * 1em);\n    margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n\n    hr {\n      width: 100%;\n      border-color: ", ";\n      border-style: dashed;\n      border-width: 1px;\n      border-block-start: none;\n      border-inline-start: none;\n      border-inline-end: none;\n    }\n\n    &.selected {\n      background: ", ";\n\n      hr {\n        border-color: #000;\n      }\n    }\n  "])), token.colorBorder, token.yellow);
 });

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

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

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/upload/plugin/index.js

@@ -81,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/utils/debug.d.ts

@@ -1,4 +1,8 @@
 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
@@ -360,7 +364,7 @@ export declare const debugLoggers: {
 /**
  * Development mode utilities
  */
-export declare const isDev: boolean;
+export { isDev };
 /**
  * Conditional console logging - only logs in development mode
  * Use this for demo files and development-only logging
@@ -394,3 +398,32 @@ export declare const prodSafeLogger: {
      */
     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;
+};

package/es/utils/debug.js

@@ -13,6 +13,11 @@ import createDebug from 'debug';
  */
 var BASE_NAMESPACE = 'lobe-editor';
 
+/**
+ * Development mode check
+ */
+var isDev = process.env.NODE_ENV === 'development';
+
 /**
  * Debug utility factory for LobeHub Editor
  * Creates namespaced debug functions following the pattern: lobe-editor:category
@@ -136,6 +141,32 @@ export var DebugLogger = /*#__PURE__*/function () {
  */
 export var debugLogger = new DebugLogger();
 
+/**
+ * Browser environment debug initialization - Zero configuration approach
+ * Automatically enables debug based on environment variables or development mode
+ */
+if (typeof window !== 'undefined') {
+  // Check for server-side DEBUG environment variable (passed through build process)
+  var envDebug = process.env.DEBUG;
+
+  // Simple logic: Environment variable takes precedence, then development mode
+  var debugConfig = null;
+  if (envDebug) {
+    // Environment variable exists - use it directly
+    debugConfig = envDebug;
+    localStorage.debug = envDebug;
+  } else if (isDev) {
+    // Development mode - auto-enable all lobe-editor debug
+    debugConfig = 'lobe-editor:*';
+    localStorage.debug = debugConfig;
+  }
+
+  // Apply debug configuration
+  if (debugConfig) {
+    createDebug.enable(debugConfig);
+  }
+}
+
 /**
  * Convenience function to create a debug logger for a specific category
  * @param category - Main category (e.g., 'kernel', 'plugin', 'upload')
@@ -167,7 +198,7 @@ export var debugLoggers = {
 /**
  * Development mode utilities
  */
-export var isDev = process.env.NODE_ENV === 'development';
+export { isDev };
 
 /**
  * Conditional console logging - only logs in development mode
@@ -228,4 +259,90 @@ export var prodSafeLogger = {
     var _console8;
     (_console8 = console).warn.apply(_console8, arguments);
   }
+};
+
+/**
+ * Browser debug utilities for Next.js and other client-side frameworks
+ */
+export var browserDebug = {
+  /**
+   * Disable debug logging in browser environment
+   */
+  disable: function disable() {
+    if (typeof window !== 'undefined') {
+      localStorage.removeItem('debug');
+      createDebug.disable();
+      console.info('Debug disabled.');
+    }
+  },
+  /**
+   * Enable debug logging in browser environment
+   * @param namespaces - Debug namespaces to enable (e.g., 'lobe-editor:*')
+   */
+  enable: function enable() {
+    var namespaces = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'lobe-editor:*';
+    if (typeof window !== 'undefined') {
+      localStorage.debug = namespaces;
+      createDebug.enable(namespaces);
+      console.info("Debug enabled: ".concat(namespaces));
+      console.info('Refresh the page to see debug logs from initialization.');
+    }
+  },
+  /**
+   * Get current debug configuration
+   */
+  getConfig: function getConfig() {
+    if (typeof window !== 'undefined') {
+      var _envDebug = process.env.DEBUG;
+      var currentDebug = localStorage.getItem('debug');
+      if (_envDebug) {
+        return {
+          enabled: _envDebug,
+          source: 'environment variable (auto-applied)'
+        };
+      } else if (isDev && currentDebug) {
+        return {
+          enabled: currentDebug,
+          source: 'development mode (auto-applied)'
+        };
+      } else {
+        return {
+          enabled: false,
+          source: 'disabled'
+        };
+      }
+    }
+    return {
+      enabled: process.env.DEBUG || false,
+      source: 'server-side'
+    };
+  },
+  /**
+   * Show available debug categories
+   */
+  showCategories: function showCategories() {
+    console.group('Available debug categories:');
+    console.log('� lobe-editor:kernel - Core editor functionality');
+    console.log('🔌 lobe-editor:plugin:* - All plugins');
+    console.log('🔍 lobe-editor:service:* - All services');
+    console.log('💬 lobe-editor:*:info - Info level messages');
+    console.log('⚠️ lobe-editor:*:warn - Warning messages');
+    console.log('❌ lobe-editor:*:error - Error messages');
+    console.groupEnd();
+    console.info('Usage: browserDebug.enable("lobe-editor:kernel,lobe-editor:plugin:*")');
+  },
+  /**
+   * Show current debug status and configuration
+   */
+  showStatus: function showStatus() {
+    var config = browserDebug.getConfig();
+    console.group('� LobeHub Editor Debug Status');
+    console.log("Status: ".concat(config.enabled ? '✅ Enabled' : '❌ Disabled'));
+    console.log("Configuration: ".concat(config.enabled || 'none'));
+    console.log("Source: ".concat(config.source));
+    console.groupEnd();
+    if (!config.enabled) {
+      console.info('💡 Zero-config setup: Set DEBUG=lobe-editor:* in your environment');
+    }
+  }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/editor",
-  "version": "1.5.3",
+  "version": "1.5.5",
   "description": "A powerful and extensible rich text editor built on Meta's Lexical framework, providing a modern editing experience with React integration.",
   "keywords": [
     "lobehub",