@lobehub/editor 4.3.2 → 4.5.0

package/es/renderer/diff/style.d.ts

@@ -0,0 +1,13 @@
+export declare const styles: {
+    body: string;
+    cell: string;
+    cellOld: string;
+    deleteCell: string;
+    emptyCell: string;
+    header: string;
+    headerCell: string;
+    headerOld: string;
+    insertCell: string;
+    root: string;
+    row: string;
+};

package/es/renderer/diff/style.js

@@ -0,0 +1,20 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import { createStaticStyles } from 'antd-style';
+export var styles = createStaticStyles(function (_ref) {
+  var css = _ref.css,
+    cssVar = _ref.cssVar;
+  return {
+    body: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n    flex-direction: column;\n    background: ", ";\n  "])), cssVar.colorBgContainer),
+    cell: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    overflow: auto;\n    min-width: 0;\n    min-height: 24px;\n\n    > div {\n      width: 100%;\n      min-width: 0;\n    }\n  "]))),
+    cellOld: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral([""]))),
+    deleteCell: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    background: color-mix(in srgb, ", " 10%, transparent);\n  "])), cssVar.colorError),
+    emptyCell: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    background: ", ";\n  "])), cssVar.colorFillQuaternary),
+    header: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);\n    border-block-end: 1px solid ", ";\n    background: ", ";\n  "])), cssVar.colorBorderSecondary, cssVar.colorFillQuaternary),
+    headerCell: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    padding-block: 8px;\n    padding-inline: 16px;\n\n    font-size: 12px;\n    font-weight: 600;\n    color: ", ";\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n  "])), cssVar.colorTextSecondary),
+    headerOld: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    border-inline-end: 1px solid ", ";\n  "])), cssVar.colorBorderSecondary),
+    insertCell: css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    background: color-mix(in srgb, ", " 10%, transparent);\n  "])), cssVar.colorSuccess),
+    root: css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n    overflow: hidden;\n\n    border: 1px solid ", ";\n    border-radius: ", ";\n\n    font-size: 14px;\n\n    background: ", ";\n  "])), cssVar.colorBorderSecondary, cssVar.borderRadiusSM, cssVar.colorBgContainer),
+    row: css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);\n  "])))
+  };
+});

package/es/renderer/diff/types.d.ts

@@ -0,0 +1,28 @@
+import type { SerializedLexicalNode } from 'lexical';
+import type { ReactNode } from 'react';
+export type LexicalDiffRowKind = 'delete' | 'equal' | 'insert' | 'modify';
+export interface LexicalDiffCell {
+    baseBlockType: string | null;
+    block: SerializedLexicalNode | null;
+    blockType: string | null;
+}
+export interface LexicalDiffRow {
+    kind: LexicalDiffRowKind;
+    newCell: LexicalDiffCell | null;
+    oldCell: LexicalDiffCell | null;
+}
+export interface LexicalDiffBlockRenderContext {
+    baseBlockType: string | null;
+    blockType: string | null;
+    newBaseBlockType: string | null;
+    newBlockType: string | null;
+    oldBaseBlockType: string | null;
+    oldBlockType: string | null;
+    renderDefaultNew: () => ReactNode;
+    renderDefaultOld: () => ReactNode;
+    row: LexicalDiffRow;
+}
+export type LexicalDiffBlockRenderer = (context: LexicalDiffBlockRenderContext) => {
+    new?: ReactNode;
+    old?: ReactNode;
+} | null;

package/es/renderer/diff/types.js

@@ -0,0 +1 @@
+export {};

package/es/renderer/index.d.ts

@@ -1,4 +1,7 @@
+export type { LexicalDiffBlockRenderContext, LexicalDiffBlockRenderer, LexicalDiffCell, LexicalDiffRow, LexicalDiffRowKind, } from './diff/types';
 export { loadLanguage } from './engine/shiki';
+export type { LexicalDiffProps } from './LexicalDiff';
+export { LexicalDiff } from './LexicalDiff';
 export { LexicalRenderer } from './LexicalRenderer';
 export { rendererNodes } from './nodes';
 export { createDefaultRenderers } from './renderers';

package/es/renderer/index.js

@@ -1,4 +1,5 @@
 export { loadLanguage } from "./engine/shiki";
+export { LexicalDiff } from "./LexicalDiff";
 export { LexicalRenderer } from "./LexicalRenderer";
 export { rendererNodes } from "./nodes";
 export { createDefaultRenderers } from "./renderers";

package/es/renderer/renderers/codeblock.js

@@ -13,6 +13,7 @@ import { createStaticStyles } from 'antd-style';
 import { Check, ChevronDown, ChevronRight, CopyIcon } from 'lucide-react';
 import { useCallback, useState } from 'react';
 import { highlightCode } from "../engine/shiki";
+import { renderMermaidBlock } from "./mermaid";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var useStyles = createStaticStyles(function (_ref) {
@@ -150,6 +151,10 @@ function CodeBlockRenderer(_ref3) {
   });
 }
 export function renderCodeBlock(node, key, children) {
+  var language = (node.language || '').toLowerCase();
+  if (language === 'mermaid') {
+    return renderMermaidBlock(node, key);
+  }
   return /*#__PURE__*/_jsx(CodeBlockRenderer, {
     codeChildren: children,
     node: node

package/es/renderer/renderers/mermaid.d.ts

@@ -0,0 +1,2 @@
+import { type ReactNode } from 'react';
+export declare function renderMermaidBlock(node: Record<string, any>, key: string): ReactNode;

package/es/renderer/renderers/mermaid.js

@@ -0,0 +1,18 @@
+'use client';
+
+import { Mermaid } from '@lobehub/ui';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function renderMermaidBlock(node, key) {
+  var code = node.code || '';
+  return /*#__PURE__*/_jsx(Mermaid, {
+    animated: false,
+    defaultExpand: true,
+    fullFeatured: true,
+    style: {
+      width: '100%'
+    },
+    theme: "lobe-theme",
+    variant: "filled",
+    children: code
+  }, key);
+}

package/es/types/kernel.d.ts

@@ -57,6 +57,8 @@ export interface IKernelEventMap {
         cacheState: EditorState;
         historyState: HistoryStateEntry | null;
         markdown: string;
+        matchedPatterns: string[];
+        score: number;
     }) => void;
     /**
      * handle paste event
@@ -93,6 +95,10 @@ export interface IEditor {
      * Get editor content of specified type
      */
     getDocument(type: string): DataSource | undefined;
+    /**
+     * Lexical history state (undo stack metadata)
+     */
+    getHistoryState(): HistoryState;
     /**
      * Get Lexical editor instance
      */
@@ -249,10 +255,6 @@ export interface IEditorKernel extends IEditor {
      * @param name
      */
     getDecorator(name: string): IDecorator | undefined;
-    /**
-     * Get editor history state
-     */
-    getHistoryState(): HistoryState;
     /**
      * Get all registered decorator names
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/editor",
-  "version": "4.3.2",
+  "version": "4.5.0",
   "description": "A powerful and extensible rich text editor built on Meta's Lexical framework, providing a modern editing experience with React integration.",
   "keywords": [
     "lobehub",
@@ -86,6 +86,7 @@
     "katex": "^0.16.27",
     "lexical": "^0.39.0",
     "lucide-react": "^0.562.0",
+    "mermaid": "^11.13.0",
     "polished": "^4.3.1",
     "re-resizable": "^6.11.2",
     "react-error-boundary": "^6.0.2",