@ctzhian/tiptap 2.0.0 → 2.1.1

package/dist/extension/component/Flow/Edit.js

@@ -6,7 +6,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { FloatingPopover } from "../../../component/FloatingPopover";
 import { Button, Stack, TextField } from "@mui/material";
-import React, { useEffect, useMemo, useState } from "react";
+import React, { useEffect, useState } from "react";
 var EditFlow = function EditFlow(_ref) {
   var anchorEl = _ref.anchorEl,
     attrs = _ref.attrs,
@@ -16,34 +16,9 @@ var EditFlow = function EditFlow(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     editCode = _useState2[0],
     setEditCode = _useState2[1];
-
-  // 当 attrs.code 更新时，同步更新 editCode
   useEffect(function () {
     setEditCode(attrs.code || '');
   }, [attrs.code]);
-
-  // 创建虚拟元素，表示 flow-wrapper 的中心点
-  var centerVirtualElement = useMemo(function () {
-    if (!anchorEl) return null;
-    return {
-      getBoundingClientRect: function getBoundingClientRect() {
-        // 每次调用时重新计算，确保位置实时更新
-        var rect = anchorEl.getBoundingClientRect();
-        var centerX = rect.left + rect.width / 2;
-        var centerY = rect.top + rect.height / 2;
-        return {
-          width: 0,
-          height: 0,
-          x: centerX,
-          y: centerY,
-          top: centerY,
-          left: centerX,
-          right: centerX,
-          bottom: centerY
-        };
-      }
-    };
-  }, [anchorEl]);
   var handleSaveFlow = function handleSaveFlow() {
     var trimmedCode = editCode.trim();
     if (!trimmedCode) return;
@@ -54,12 +29,9 @@ var EditFlow = function EditFlow(_ref) {
   };
   return /*#__PURE__*/React.createElement(FloatingPopover, {
     open: true,
-    anchorEl: centerVirtualElement,
+    anchorEl: anchorEl,
     onClose: onCancel,
-    placement: "top",
-    style: {
-      transform: 'translate(-50%, 0)'
-    }
+    placement: "bottom"
   }, /*#__PURE__*/React.createElement(Stack, {
     gap: 2,
     sx: {

package/dist/extension/component/Flow/index.js

@@ -35,26 +35,26 @@ var FlowViewWrapper = function FlowViewWrapper(_ref) {
     _useState6 = _slicedToArray(_useState5, 2),
     isDragging = _useState6[0],
     setIsDragging = _useState6[1];
-  var _useState7 = useState(null),
+  var _useState7 = useState(false),
     _useState8 = _slicedToArray(_useState7, 2),
-    dragCorner = _useState8[0],
-    setDragCorner = _useState8[1];
+    keepHoverPopoverOpen = _useState8[0],
+    setKeepHoverPopoverOpen = _useState8[1];
+  var _useState9 = useState(null),
+    _useState10 = _slicedToArray(_useState9, 2),
+    dragCorner = _useState10[0],
+    setDragCorner = _useState10[1];
   var dragStartXRef = useRef(0);
   var dragStartWidthRef = useRef(0);
   var flowWrapperRef = useRef(null);
   var flowContentRef = useRef(null);
-
-  // 获取当前实际显示的流程图宽度
+  var editButtonRef = useRef(null);
   var getCurrentDisplayWidth = function getCurrentDisplayWidth() {
     if (flowWrapperRef.current) {
       return flowWrapperRef.current.offsetWidth;
     }
-    // 如果 ref 不存在，使用容器宽度计算
     var containerWidth = 800;
     return getPixelValue(attrs.width, containerWidth);
   };
-
-  // 将 width 转换为像素值
   var getPixelValue = function getPixelValue(value, containerSize) {
     var defaultPercent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 100;
     if (!value) return containerSize * (defaultPercent / 100);
@@ -81,7 +81,7 @@ var FlowViewWrapper = function FlowViewWrapper(_ref) {
       var percent = Math.round(pixels / containerWidth * 100);
       return "".concat(percent, "%");
     }
-    return Math.round(pixels);
+    return "".concat(Math.round(pixels), "px");
   };
   var handleMouseDown = function handleMouseDown(e, corner) {
     e.preventDefault();
@@ -95,13 +95,9 @@ var FlowViewWrapper = function FlowViewWrapper(_ref) {
     if (!isDragging || !dragCorner) return;
     var deltaX = e.clientX - dragStartXRef.current;
     var newWidth;
-
-    // 根据不同的角计算宽度变化
     if (dragCorner === 'top-right' || dragCorner === 'bottom-right') {
-      // 右侧角：向右拉伸，宽度增加
       newWidth = dragStartWidthRef.current + deltaX;
     } else {
-      // 左侧角：向左拉伸，宽度增加（deltaX 为负时宽度增加）
       newWidth = dragStartWidthRef.current - deltaX;
     }
     newWidth = Math.max(200, Math.min(1920, newWidth));
@@ -125,7 +121,12 @@ var FlowViewWrapper = function FlowViewWrapper(_ref) {
     }
   }, [isDragging, handleMouseMove, handleMouseUp]);
   var handleShowPopover = function handleShowPopover() {
-    return setIsEditing(true);
+    setKeepHoverPopoverOpen(true);
+    setIsEditing(true);
+  };
+  var handleEditCancel = function handleEditCancel() {
+    setIsEditing(false);
+    setKeepHoverPopoverOpen(false);
   };
   if (!editor.isEditable) {
     return /*#__PURE__*/React.createElement(ReadonlyFlow, {
@@ -167,6 +168,7 @@ var FlowViewWrapper = function FlowViewWrapper(_ref) {
     style: {
       width: '100%'
     },
+    keepOpen: keepHoverPopoverOpen,
     actions: /*#__PURE__*/React.createElement(Stack, {
       direction: 'row',
       alignItems: 'center',
@@ -174,6 +176,7 @@ var FlowViewWrapper = function FlowViewWrapper(_ref) {
         p: 0.5
       }
     }, /*#__PURE__*/React.createElement(ToolbarItem, {
+      ref: editButtonRef,
       icon: /*#__PURE__*/React.createElement(EditLineIcon, {
         sx: {
           fontSize: '1rem'
@@ -292,15 +295,13 @@ var FlowViewWrapper = function FlowViewWrapper(_ref) {
       zIndex: 10
     }
   }))))), isEditing && /*#__PURE__*/React.createElement(EditFlow, {
-    anchorEl: flowContentRef.current,
+    anchorEl: editButtonRef.current,
     attrs: attrs,
     updateAttributes: function updateAttributes(newAttrs) {
       _updateAttributes(newAttrs);
-      setIsEditing(false);
+      handleEditCancel();
     },
-    onCancel: function onCancel() {
-      return setIsEditing(false);
-    }
+    onCancel: handleEditCancel
   }));
 };
 var FlowDiagram = function FlowDiagram(_ref2) {

package/dist/extension/component/Image/index.d.ts

@@ -1,6 +1,7 @@
 import { EditorFnProps } from "../../../type";
 import { NodeViewProps } from "@tiptap/react";
 import React from "react";
+import 'react-photo-view/dist/react-photo-view.css';
 export interface ImageAttributes {
     src: string;
     title?: string;

package/dist/extension/component/Image/index.js

@@ -14,6 +14,8 @@ import { ToolbarItem } from "../../../component/Toolbar";
 import { alpha, Box, Button, Divider, Stack, TextField, useTheme } from "@mui/material";
 import { NodeViewWrapper } from "@tiptap/react";
 import React, { useCallback, useEffect, useRef, useState } from "react";
+import { PhotoView } from "react-photo-view";
+import 'react-photo-view/dist/react-photo-view.css';
 import { HoverPopover } from "../../../component/HoverPopover";
 import CropImage from "./Crop";
 import InsertImage from "./Insert";
@@ -157,6 +159,15 @@ var ImageViewWrapper = function ImageViewWrapper(_ref) {
     dragStartXRef.current = e.clientX;
     dragStartWidthRef.current = getCurrentDisplayWidth();
   };
+  var handleImageClick = function handleImageClick(e) {
+    // 如果正在拖拽调整大小，阻止预览
+    if (isDragging || dragCorner) {
+      e.preventDefault();
+      e.stopPropagation();
+      return;
+    }
+    // 允许 PhotoView 处理点击事件进行预览
+  };
   var handleMouseMove = useCallback(function (e) {
     if (!isDragging || !dragCorner) return;
     var deltaX = e.clientX - dragStartXRef.current;
@@ -383,6 +394,8 @@ var ImageViewWrapper = function ImageViewWrapper(_ref) {
     onMouseLeave: function onMouseLeave() {
       return setIsHovering(false);
     }
+  }, /*#__PURE__*/React.createElement(PhotoView, {
+    src: attrs.src
   }, /*#__PURE__*/React.createElement("img", {
     ref: imageRef,
     src: attrs.src,
@@ -390,14 +403,15 @@ var ImageViewWrapper = function ImageViewWrapper(_ref) {
     style: {
       maxWidth: '100%',
       height: 'auto',
-      cursor: 'default',
+      cursor: isDragging ? 'default' : 'pointer',
       border: '2px solid',
       borderColor: isHovering || isDragging ? alpha(theme.palette.primary.main, 0.3) : 'transparent'
     },
+    onClick: handleImageClick,
     onError: function onError(e) {
       _onError === null || _onError === void 0 || _onError(e);
     }
-  }), (isHovering || isDragging) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
+  })), (isHovering || isDragging) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
     onMouseDown: function onMouseDown(e) {
       return handleMouseDown(e, 'top-left');
     },

package/dist/extension/component/Link/LinkContent.js

@@ -22,6 +22,7 @@ export var LinkContent = function LinkContent(_ref) {
     border: '1px solid',
     borderColor: 'divider',
     cursor: 'pointer',
+    textAlign: 'left',
     borderRadius: 'var(--mui-shape-borderRadius)',
     p: 2,
     textDecoration: 'none',
@@ -39,6 +40,7 @@ export var LinkContent = function LinkContent(_ref) {
     borderColor: 'divider',
     color: 'text.primary',
     cursor: 'pointer',
+    textAlign: 'left',
     borderRadius: 'var(--mui-shape-borderRadius)',
     p: 2,
     ':hover': {

package/dist/extension/component/Link/index.js

@@ -114,7 +114,7 @@ var LinkViewWrapper = function LinkViewWrapper(_ref) {
           fontSize: '1rem'
         }
       }),
-      tip: "\u590D\u5236",
+      tip: "\u590D\u5236\u94FE\u63A5",
       onClick: handleCopyLink
     }), /*#__PURE__*/React.createElement(ToolbarItem, {
       icon: /*#__PURE__*/React.createElement(LinkUnlinkIcon, {

package/dist/extension/component/TableCellHandleMenu/index.js

@@ -18,6 +18,7 @@ import { DeleteBack2LineIcon } from "../../../component/Icons/delete-back-2-line
 import { getThemeTextBgColor, getThemeTextColor } from "../../../contants/enums";
 import { Box, Divider, Typography } from '@mui/material';
 import { useTheme } from '@mui/material/styles';
+import { TextSelection } from '@tiptap/pm/state';
 import { CellSelection, cellAround, deleteCellSelection, mergeCells, splitCell } from '@tiptap/pm/tables';
 import { useEditorState } from '@tiptap/react';
 import React, { forwardRef, useCallback, useEffect, useState } from 'react';
@@ -147,10 +148,66 @@ export var TableCellHandleMenu = /*#__PURE__*/forwardRef(function (_ref, ref) {
             }
           }),
           onClick: function onClick() {
+            if (!editor) return;
+            if (editor.state.storedMarks) {
+              var textStyleMarkType = editor.schema.marks.textStyle;
+              if (textStyleMarkType) {
+                editor.view.dispatch(editor.state.tr.removeStoredMark(textStyleMarkType));
+              }
+            }
             setTimeout(function () {
-              editor.chain().focus().toggleMark('textStyle', {
-                color: it.value
-              }).run();
+              var _editor$state = editor.state,
+                selection = _editor$state.selection,
+                doc = _editor$state.doc;
+              var textStyleMark = editor.schema.marks.textStyle;
+              if (!textStyleMark) return;
+              if (selection instanceof CellSelection) {
+                var tr = editor.state.tr;
+                var hasContent = false;
+                selection.forEachCell(function (cellNode, cellPos) {
+                  if (cellNode.content.size > 0) {
+                    hasContent = true;
+                    var from = cellPos + 1;
+                    var to = cellPos + cellNode.nodeSize - 1;
+                    if (from < to) {
+                      var $from = doc.resolve(from);
+                      var $to = doc.resolve(to);
+                      var cellTextSelection = TextSelection.between($from, $to, 1);
+                      if (cellTextSelection) {
+                        var mark = textStyleMark.create({
+                          color: it.value
+                        });
+                        tr.addMark(from, to, mark);
+                      }
+                    }
+                  }
+                });
+                if (hasContent) {
+                  editor.view.dispatch(tr);
+                  editor.commands.focus();
+                }
+              } else {
+                var $anchor = selection.$anchor;
+                var cell = cellAround($anchor);
+                if (cell) {
+                  var cellNode = doc.nodeAt(cell.pos);
+                  if (cellNode && cellNode.content.size > 0) {
+                    var from = cell.pos + 1;
+                    var to = cell.pos + cellNode.nodeSize - 1;
+                    if (from < to) {
+                      var $from = doc.resolve(from);
+                      var $to = doc.resolve(to);
+                      var newSelection = TextSelection.between($from, $to, 1);
+                      if (newSelection) {
+                        editor.view.dispatch(editor.state.tr.setSelection(newSelection));
+                      }
+                    }
+                  }
+                }
+                editor.chain().focus().toggleMark('textStyle', {
+                  color: it.value
+                }).run();
+              }
             }, 0);
           }
         };

package/dist/extension/component/TableHandle/TableHandleAddButton.d.ts

@@ -0,0 +1,14 @@
+import type { Node } from '@tiptap/pm/model';
+import type { Editor } from '@tiptap/react';
+import React from 'react';
+import type { Orientation } from '../../../util/table-utils';
+interface TableHandleAddButtonProps {
+    editor?: Editor | null;
+    orientation: Orientation;
+    index?: number;
+    tableNode?: Node;
+    tablePos?: number;
+    direction: 'before' | 'after';
+}
+export declare const TableHandleAddButton: ({ editor, orientation, index, tableNode, tablePos, direction, }: TableHandleAddButtonProps) => React.JSX.Element | null;
+export {};

package/dist/extension/component/TableHandle/TableHandleAddButton.js

@@ -0,0 +1,87 @@
+import { SkipDownIcon, SkipLeftIcon, SkipRightIcon, SkipUpIcon } from "../../../component/Icons";
+import { Box } from '@mui/material';
+import { TableMap } from '@tiptap/pm/tables';
+import React, { useCallback } from 'react';
+import { selectCellsByCoords } from "../../../util/table-utils";
+export var TableHandleAddButton = function TableHandleAddButton(_ref) {
+  var editor = _ref.editor,
+    orientation = _ref.orientation,
+    index = _ref.index,
+    tableNode = _ref.tableNode,
+    tablePos = _ref.tablePos,
+    direction = _ref.direction;
+  var handleClick = useCallback(function () {
+    if (!editor || !tableNode || typeof tablePos !== 'number' || typeof index !== 'number') {
+      return;
+    }
+    try {
+      // 先选中当前行/列
+      var _TableMap$get = TableMap.get(tableNode),
+        width = _TableMap$get.width,
+        height = _TableMap$get.height;
+      var start = orientation === 'row' ? {
+        row: index,
+        col: 0
+      } : {
+        row: 0,
+        col: index
+      };
+      var end = orientation === 'row' ? {
+        row: index,
+        col: width - 1
+      } : {
+        row: height - 1,
+        col: index
+      };
+
+      // 选中行/列
+      selectCellsByCoords(editor, tablePos, [start, end], {
+        mode: 'dispatch',
+        dispatch: editor.view.dispatch.bind(editor.view)
+      });
+
+      // 执行插入操作
+      if (orientation === 'row') {
+        editor.chain().focus()[direction === 'before' ? 'addRowBefore' : 'addRowAfter']().run();
+      } else {
+        editor.chain().focus()[direction === 'before' ? 'addColumnBefore' : 'addColumnAfter']().run();
+      }
+    } catch (error) {
+      console.warn('Failed to add row/column:', error);
+    }
+  }, [editor, orientation, index, tableNode, tablePos, direction]);
+  if (!(editor !== null && editor !== void 0 && editor.isEditable)) return null;
+  var iconStyle = {
+    width: '0.75rem',
+    height: '0.75rem',
+    flexShrink: 0
+  };
+  var Icon = orientation === 'row' ? direction === 'before' ? SkipUpIcon : SkipDownIcon : direction === 'before' ? SkipLeftIcon : SkipRightIcon;
+  var ariaLabel = orientation === 'row' ? direction === 'before' ? '上方插入行' : '下方插入行' : direction === 'before' ? '左侧插入列' : '右侧插入列';
+  return /*#__PURE__*/React.createElement(Box, {
+    component: "button",
+    onClick: handleClick,
+    sx: {
+      border: 'none',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      backgroundColor: 'var(--mui-palette-background-paper3)',
+      borderRadius: 'var(--mui-shape-borderRadius)',
+      cursor: 'pointer',
+      padding: 0,
+      width: orientation === 'row' ? '0.75rem' : '2rem',
+      height: '0.75rem',
+      transition: 'background-color 0.2s ease-in-out',
+      '&:hover': {
+        backgroundColor: 'var(--mui-palette-primary-main)',
+        '& .MuiSvgIcon-root': {
+          color: 'var(--mui-palette-common-white)'
+        }
+      }
+    },
+    "aria-label": ariaLabel
+  }, /*#__PURE__*/React.createElement(Icon, {
+    sx: iconStyle
+  }));
+};

package/dist/extension/component/TableHandle/TableHandleMenu.css

@@ -32,5 +32,4 @@
 
 .tiptap-table-handle-menu.column {
   height: 0.75rem;
-  width: var(--table-handle-ref-width);
 }

package/dist/extension/component/TableHandle/TableHandleMenu.js

@@ -534,7 +534,7 @@ export var TableHandleMenu = function TableHandleMenu(_ref) {
           my: 0.5
         }
       }),
-      key: 'divider2'
+      key: 'divider3'
     }, {
       key: 'duplicate',
       label: orientation === 'row' ? '复制当前行' : '复制当前列',
@@ -615,7 +615,7 @@ export var TableHandleMenu = function TableHandleMenu(_ref) {
   }, []);
   var ariaLabel = orientation === 'row' ? 'Row actions' : 'Column actions';
   if (!(editor !== null && editor !== void 0 && editor.isEditable)) return null;
-  var handleButton = /*#__PURE__*/React.createElement(Box, {
+  var menuButton = /*#__PURE__*/React.createElement(Box, {
     component: "button",
     className: "tiptap-table-handle-menu ".concat(isDragging ? 'is-dragging' : '', " ").concat(orientation),
     draggable: true,
@@ -634,11 +634,12 @@ export var TableHandleMenu = function TableHandleMenu(_ref) {
       padding: 0
     }, orientation === 'row' ? {
       width: '0.75rem',
-      height: 'var(--table-handle-ref-height, 40px)'
+      height: '0.75rem'
     } : {
-      height: '0.75rem',
-      width: 'var(--table-handle-ref-width, 100px)'
+      width: '100%',
+      height: '0.75rem'
     }), {}, {
+      transition: 'background-color 0.2s ease-in-out',
       '&.is-dragging': {
         backgroundColor: 'var(--mui-palette-primary-main)',
         '& .MuiSvgIcon-root': {
@@ -663,7 +664,7 @@ export var TableHandleMenu = function TableHandleMenu(_ref) {
   }));
   return /*#__PURE__*/React.createElement(Menu, {
     width: 216,
-    context: handleButton,
+    context: menuButton,
     list: menuList,
     anchorOrigin: {
       vertical: orientation === 'row' ? 'top' : 'bottom',

package/dist/extension/component/TableHandle/index.js

@@ -7,6 +7,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { FloatingPortal } from '@floating-ui/react';
 import React, { useCallback, useMemo, useState } from 'react';
 import { colDragStart, rowDragStart } from "../../node/TableHandler/plugin";
+import { TableHandleAddButton } from "./TableHandleAddButton";
 import { TableHandleMenu } from "./TableHandleMenu";
 import { useTableHandlePositioning } from "./use-table-handle-positioning";
 import { useTableHandleState } from "./use-table-handle-state";
@@ -63,7 +64,22 @@ export function TableHandle(_ref) {
   }, shouldShowRow && /*#__PURE__*/React.createElement("div", {
     ref: rowHandle.ref,
     style: rowHandle.style
-  }, /*#__PURE__*/React.createElement(TableHandleMenu, {
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '0.125rem',
+      width: '0.75rem',
+      height: 'var(--table-handle-ref-height, 40px)'
+    }
+  }, /*#__PURE__*/React.createElement(TableHandleAddButton, {
+    editor: editor,
+    orientation: "row",
+    index: state.rowIndex,
+    tablePos: state.blockPos,
+    tableNode: state.block,
+    direction: "before"
+  }), /*#__PURE__*/React.createElement(TableHandleMenu, {
     editor: editor,
     orientation: "row",
     index: state.rowIndex,
@@ -74,9 +90,36 @@ export function TableHandle(_ref) {
     onOpenChange: function onOpenChange(open) {
       return handleMenuOpenChange('row', open);
     }
-  })), shouldShowColumn && /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React.createElement(TableHandleAddButton, {
+    editor: editor,
+    orientation: "row",
+    index: state.rowIndex,
+    tablePos: state.blockPos,
+    tableNode: state.block,
+    direction: "after"
+  }))), shouldShowColumn && /*#__PURE__*/React.createElement("div", {
     ref: colHandle.ref,
     style: colHandle.style
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      flexDirection: 'row',
+      gap: '0.125rem',
+      height: '0.75rem',
+      width: 'var(--table-handle-ref-width, 100px)'
+    }
+  }, /*#__PURE__*/React.createElement(TableHandleAddButton, {
+    editor: editor,
+    orientation: "column",
+    index: state.colIndex,
+    tablePos: state.blockPos,
+    tableNode: state.block,
+    direction: "before"
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      flex: 1,
+      minWidth: 0
+    }
   }, /*#__PURE__*/React.createElement(TableHandleMenu, {
     editor: editor,
     orientation: "column",
@@ -88,6 +131,13 @@ export function TableHandle(_ref) {
     onOpenChange: function onOpenChange(open) {
       return handleMenuOpenChange('column', open);
     }
-  })));
+  })), /*#__PURE__*/React.createElement(TableHandleAddButton, {
+    editor: editor,
+    orientation: "column",
+    index: state.colIndex,
+    tablePos: state.blockPos,
+    tableNode: state.block,
+    direction: "after"
+  }))));
 }
 TableHandle.displayName = 'TableHandle';

package/dist/extension/component/TableSelectionOverlay/index.js

@@ -34,6 +34,7 @@ var getCellAtCoordinates = function getCellAtCoordinates(state, view, x, y) {
   return cellAround($pos);
 };
 var getSelectionBoundingRect = function getSelectionBoundingRect(view, selection) {
+  if (!(selection instanceof CellSelection)) return null;
   var cells = [];
   selection.forEachCell(function (_node, pos) {
     var dom = view.nodeDOM(pos);
@@ -242,8 +243,7 @@ export var TableSelectionOverlay = function TableSelectionOverlay(_ref2) {
   var activeHandleRef = useRef(null);
   var containerRef = useRef(null);
   var _useFloating = useFloating({
-      placement: 'top-start',
-      strategy: 'absolute'
+      placement: 'top-start'
     }),
     refs = _useFloating.refs,
     floatingStyles = _useFloating.floatingStyles,
@@ -384,14 +384,7 @@ export var TableSelectionOverlay = function TableSelectionOverlay(_ref2) {
   }, [editor, updateSelectionRect, updateTableDom]);
   useEffect(function () {
     var c = tableDom === null || tableDom === void 0 ? void 0 : tableDom.querySelector('.table-selection-overlay-container');
-    if (!c) {
-      // Try to find .table-controls as fallback
-      var wrapper = tableDom === null || tableDom === void 0 ? void 0 : tableDom.closest('.tableWrapper');
-      var controls = wrapper === null || wrapper === void 0 ? void 0 : wrapper.querySelector('.table-controls');
-      containerRef.current = controls !== null && controls !== void 0 ? controls : null;
-    } else {
-      containerRef.current = c;
-    }
+    containerRef.current = c !== null && c !== void 0 ? c : null;
   }, [tableDom]);
   if (!isVisible || !selectionRect) {
     return null;
@@ -412,9 +405,8 @@ export var TableSelectionOverlay = function TableSelectionOverlay(_ref2) {
       onResizeStart: createResizeHandler
     }));
   };
-  var rootElement = containerRef.current || document.body;
   return /*#__PURE__*/React.createElement(FloatingPortal, {
-    root: rootElement
+    root: containerRef.current
   }, /*#__PURE__*/React.createElement("div", {
     ref: refs.setFloating,
     style: _objectSpread(_objectSpread({}, floatingStyles), {}, {

package/dist/extension/component/UploadProgress/index.d.ts

@@ -7,6 +7,6 @@ export interface UploadProgressAttributes {
     tempId: string;
 }
 export declare const getFileIcon: (fileType: string) => React.JSX.Element;
-export declare const getFileTypeText: (fileType: string) => "音频" | "图片" | "视频" | "文件";
+export declare const getFileTypeText: (fileType: string) => "图片" | "视频" | "音频" | "文件";
 declare const UploadProgressView: React.FC<NodeViewProps>;
 export default UploadProgressView;

package/dist/extension/component/Video/Insert.js

@@ -85,7 +85,8 @@ var InsertVideo = function InsertVideo(_ref) {
                 autoplay: attrs.autoplay,
                 loop: attrs.loop,
                 muted: attrs.muted,
-                poster: attrs.poster
+                poster: attrs.poster,
+                align: attrs.align
               });
             }
             _context.next = 15;
@@ -139,7 +140,8 @@ var InsertVideo = function InsertVideo(_ref) {
               autoplay: attrs.autoplay,
               loop: attrs.loop,
               muted: attrs.muted,
-              poster: attrs.poster
+              poster: attrs.poster,
+              align: attrs.align
             });
             handleClosePopover();
             _context2.next = 15;

package/dist/extension/component/Video/Readonly.js

@@ -8,15 +8,7 @@ var ReadonlyVideo = function ReadonlyVideo(_ref) {
     className: "video-wrapper"
   }, /*#__PURE__*/React.createElement(Box, {
     sx: {
-      position: 'relative',
-      display: 'inline-block',
-      border: '1px solid',
-      borderColor: 'divider',
-      borderRadius: 'var(--mui-shape-borderRadius)',
-      p: '0.25rem',
-      '&:hover .video-controls': {
-        opacity: 1
-      }
+      textAlign: attrs.align || undefined
     }
   }, /*#__PURE__*/React.createElement("video", {
     src: attrs.src,
@@ -25,11 +17,12 @@ var ReadonlyVideo = function ReadonlyVideo(_ref) {
     autoPlay: attrs.autoplay,
     loop: attrs.loop,
     muted: attrs.muted,
-    width: attrs.width,
+    width: attrs.width || undefined,
     style: {
       maxWidth: '100%',
+      cursor: 'pointer',
       height: 'auto',
-      display: 'block'
+      display: 'inline-block'
     },
     onError: function onError(e) {
       _onError === null || _onError === void 0 || _onError(e);