@ctzhian/tiptap 1.11.4 → 1.12.0

package/dist/component/Icons/edit-line-icon.js

@@ -0,0 +1,13 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { SvgIcon } from "@mui/material";
+import * as React from "react";
+export var EditLineIcon = function EditLineIcon(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, _extends({
+    viewBox: "0 0 24 24",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M6.41421 15.89L16.5563 5.74785L15.1421 4.33363L5 14.4758V15.89H6.41421ZM7.24264 17.89H3V13.6473L14.435 2.21231C14.8256 1.82179 15.4587 1.82179 15.8492 2.21231L18.6777 5.04074C19.0682 5.43126 19.0682 6.06443 18.6777 6.45495L7.24264 17.89ZM3 19.89H21V21.89H3V19.89Z"
+  }));
+};
+EditLineIcon.displayName = 'icon-edit-line';

package/dist/component/Icons/file-icon.d.ts

@@ -0,0 +1,6 @@
+import { SvgIconProps } from "@mui/material";
+import * as React from "react";
+export declare const FileIcon: {
+    (props: SvgIconProps): React.JSX.Element;
+    displayName: string;
+};

package/dist/component/Icons/file-icon.js

@@ -0,0 +1,20 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { SvgIcon } from "@mui/material";
+import * as React from "react";
+export var FileIcon = function FileIcon(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, _extends({
+    viewBox: "0 0 1024 1024",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M929.391304 927.538087c0 51.222261-41.527652 92.749913-92.755478 92.749913H187.364174C136.136348 1020.288 94.608696 978.760348 94.608696 927.538087v-834.782609C94.608696 41.527652 136.136348 0 187.364174 0h440.709565a55.652174 55.652174 0 0 1 39.357218 16.300522L913.085217 261.954783A55.652174 55.652174 0 0 1 929.391304 301.312v626.226087z",
+    fill: "#1E89FF",
+    "p-id": "10217"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M268.521739 301.45113h301.451131c23.184696 0 34.782609 11.592348 34.782608 34.782609 0 23.184696-11.597913 34.782609-34.782608 34.782609H268.521739c-23.190261 0-34.782609-11.597913-34.782609-34.782609 0-23.190261 11.592348-34.782609 34.782609-34.782609zM268.521739 510.146783h440.581565c23.184696 0 34.782609 11.592348 34.782609 34.782608 0 23.184696-11.597913 34.782609-34.782609 34.782609H268.521739c-23.190261 0-34.782609-11.597913-34.782609-34.782609 0-23.190261 11.592348-34.782609 34.782609-34.782608zM268.521739 718.842435h440.581565c23.184696 0 34.782609 11.592348 34.782609 34.782608 0 23.184696-11.597913 34.782609-34.782609 34.782609H268.521739c-23.190261 0-34.782609-11.597913-34.782609-34.782609 0-23.190261 11.592348-34.782609 34.782609-34.782608z",
+    fill: "#FFFFFF",
+    fillOpacity: ".881",
+    "p-id": "10218"
+  }));
+};
+FileIcon.displayName = 'icon-file';

package/dist/component/Icons/index.d.ts

@@ -23,6 +23,7 @@ export { CarouselViewIcon } from './carousel-view-icon';
 export { CheckboxBlankCircleLineIcon } from './checkbox-blank-circle-line-icon';
 export { CheckboxCircleFillIcon } from './checkbox-circle-fill-icon';
 export { CheckboxCircleLineIcon } from './checkbox-circle-line-icon';
+export { ChromeIcon } from './chrome-icon';
 export { ClockwiseLineIcon } from './clockwise-line-icon';
 export { CloseCircleFillIcon } from './close-circle-fill-icon';
 export { CodeBoxLineIcon } from './code-box-line-icon';
@@ -39,11 +40,13 @@ export { DoubleQuotesLIcon } from './double-quotes-l-icon';
 export { DownloadLineIcon } from './download-line-icon';
 export { DraggableIcon } from './draggable-icon';
 export { EditBoxLineIcon } from './edit-box-line-icon';
+export { EditLineIcon } from './edit-line-icon';
 export { EraserLineIcon } from './eraser-line-icon';
 export { ErrorWarningFillIcon } from './error-warning-fill-icon';
 export { ExpendIcon } from './expend-icon';
 export { ExportLineIcon } from './export-line-icon';
 export { FileCopyLineIcon } from './file-copy-line-icon';
+export { FileIcon } from './file-icon';
 export { FileUploadLineIcon } from './file-upload-line-icon';
 export { FlipHorizontal2LineIcon } from './flip-horizontal-2-line-icon';
 export { FlowChartIcon } from './flow-chart-icon';

package/dist/component/Icons/index.js

@@ -26,6 +26,7 @@ export { CarouselViewIcon } from "./carousel-view-icon";
 export { CheckboxBlankCircleLineIcon } from "./checkbox-blank-circle-line-icon";
 export { CheckboxCircleFillIcon } from "./checkbox-circle-fill-icon";
 export { CheckboxCircleLineIcon } from "./checkbox-circle-line-icon";
+export { ChromeIcon } from "./chrome-icon";
 export { ClockwiseLineIcon } from "./clockwise-line-icon";
 export { CloseCircleFillIcon } from "./close-circle-fill-icon";
 export { CodeBoxLineIcon } from "./code-box-line-icon";
@@ -42,11 +43,13 @@ export { DoubleQuotesLIcon } from "./double-quotes-l-icon";
 export { DownloadLineIcon } from "./download-line-icon";
 export { DraggableIcon } from "./draggable-icon";
 export { EditBoxLineIcon } from "./edit-box-line-icon";
+export { EditLineIcon } from "./edit-line-icon";
 export { EraserLineIcon } from "./eraser-line-icon";
 export { ErrorWarningFillIcon } from "./error-warning-fill-icon";
 export { ExpendIcon } from "./expend-icon";
 export { ExportLineIcon } from "./export-line-icon";
 export { FileCopyLineIcon } from "./file-copy-line-icon";
+export { FileIcon } from "./file-icon";
 export { FileUploadLineIcon } from "./file-upload-line-icon";
 export { FlipHorizontal2LineIcon } from "./flip-horizontal-2-line-icon";
 export { FlowChartIcon } from "./flow-chart-icon";

package/dist/component/index.d.ts

@@ -1,3 +1,5 @@
+export { default as ActionDropdown } from './ActionDropdown';
 export { default as FloatingPopover } from './FloatingPopover';
+export { default as HoverPopover } from './HoverPopover';
 export { default as Menu } from './Menu';
 export { default as NestedList } from './Menu/NestedList';

package/dist/component/index.js

@@ -1,3 +1,5 @@
+export { default as ActionDropdown } from "./ActionDropdown";
 export { default as FloatingPopover } from "./FloatingPopover";
+export { default as HoverPopover } from "./HoverPopover";
 export { default as Menu } from "./Menu";
 export { default as NestedList } from "./Menu/NestedList";

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

@@ -1,15 +1,9 @@
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { FloatingPopover } from "../../../component";
+import { ActionDropdown, HoverPopover } from "../../../component";
 import { CheckboxCircleFillIcon, CloseCircleFillIcon, ErrorWarningFillIcon, Information2FillIcon, ScrollToBottomLineIcon, TextIcon, UserSmileFillIcon } from "../../../component/Icons";
 import { ToolbarItem } from "../../../component/Toolbar";
 import { Box, Divider, Stack } from '@mui/material';
 import { NodeViewContent, NodeViewWrapper } from '@tiptap/react';
-import React, { useMemo, useRef, useState } from 'react';
+import React, { useMemo, useRef } from 'react';
 var VARIANT_DATA = {
   info: {
     icon: /*#__PURE__*/React.createElement(Information2FillIcon, {
@@ -60,62 +54,11 @@ var AlertView = function AlertView(_ref) {
     selected = _ref.selected;
   var attrs = node.attrs;
   var containerRef = useRef(null);
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    anchorEl = _useState2[0],
-    setAnchorEl = _useState2[1];
   var showIcon = attrs.type !== 'text';
   var variantData = useMemo(function () {
     return VARIANT_DATA[attrs.variant || 'info'];
   }, [attrs.variant]);
-  var handleShowOperationPopover = function handleShowOperationPopover(event) {
-    return setAnchorEl(event.currentTarget);
-  };
-  var handleCloseOperationPopover = function handleCloseOperationPopover() {
-    return setAnchorEl(null);
-  };
-  return /*#__PURE__*/React.createElement(NodeViewWrapper, {
-    ref: containerRef,
-    className: "alert-wrapper ".concat(selected ? 'ProseMirror-selectednode' : ''),
-    "data-drag-handle": true,
-    as: 'div',
-    style: {
-      marginLeft: (_node$attrs = node.attrs) !== null && _node$attrs !== void 0 && _node$attrs.indent ? node.attrs.indent * 32 : undefined,
-      border: '1px solid',
-      borderColor: variantData.color,
-      // color: attrs.variant === 'default' ? 'var(--mui-palette-text-primary)' : variantData.color,
-      borderRadius: '10px',
-      padding: '12px 16px',
-      lineHeight: 1.625,
-      display: 'flex',
-      alignItems: 'flex-start',
-      gap: '16px',
-      background: attrs.variant === 'default' ? 'var(--mui-palette-background-paper3)' : "color-mix(in srgb, ".concat(variantData.color, " 10%, transparent)")
-    },
-    onClick: handleShowOperationPopover
-  }, showIcon && /*#__PURE__*/React.createElement(Box, {
-    sx: {
-      pt: '2px',
-      lineHeight: 1,
-      color: attrs.variant === 'default' ? 'text.disabled' : variantData.color
-    }
-  }, variantData.icon), /*#__PURE__*/React.createElement(Box, {
-    sx: {
-      flex: 1,
-      width: 0,
-      'code': {
-        borderColor: attrs.variant === 'default' ? '' : "color-mix(in srgb, ".concat(variantData.color, " 30%, transparent) !important"),
-        bgcolor: attrs.variant === 'default' ? '' : "color-mix(in srgb, ".concat(variantData.color, " 10%, transparent) !important")
-      }
-    }
-  }, /*#__PURE__*/React.createElement(NodeViewContent, {
-    as: 'div'
-  })), editor.isEditable && /*#__PURE__*/React.createElement(FloatingPopover, {
-    open: Boolean(anchorEl),
-    anchorEl: anchorEl,
-    onClose: handleCloseOperationPopover,
-    placement: "top"
-  }, /*#__PURE__*/React.createElement(Stack, {
+  var operationMenu = /*#__PURE__*/React.createElement(Stack, {
     direction: 'row',
     alignItems: 'center',
     sx: {
@@ -200,33 +143,78 @@ var AlertView = function AlertView(_ref) {
       alignSelf: 'center',
       borderColor: 'divider'
     }
-  }), /*#__PURE__*/React.createElement(ToolbarItem, {
-    icon: /*#__PURE__*/React.createElement(TextIcon, {
-      sx: {
-        fontSize: '1rem'
+  }), /*#__PURE__*/React.createElement(ActionDropdown, {
+    list: [{
+      key: 'text',
+      label: '文字',
+      icon: /*#__PURE__*/React.createElement(TextIcon, {
+        sx: {
+          fontSize: '1rem'
+        }
+      }),
+      onClick: function onClick() {
+        return updateAttributes({
+          type: 'text'
+        });
       }
-    }),
-    tip: "\u7EAF\u6587\u5B57",
-    onClick: function onClick() {
-      return updateAttributes({
-        type: 'text'
-      });
-    },
-    className: attrs.type === 'text' ? 'tool-active' : ''
-  }), /*#__PURE__*/React.createElement(ToolbarItem, {
-    icon: /*#__PURE__*/React.createElement(ScrollToBottomLineIcon, {
-      sx: {
-        transform: 'rotate(90deg)',
-        fontSize: '1rem'
+    }, {
+      key: 'icon',
+      label: '图标文字',
+      icon: /*#__PURE__*/React.createElement(ScrollToBottomLineIcon, {
+        sx: {
+          transform: 'rotate(90deg)',
+          fontSize: '1rem'
+        }
+      }),
+      onClick: function onClick() {
+        return updateAttributes({
+          type: 'icon'
+        });
       }
-    }),
-    tip: "\u56FE\u6807\u6587\u5B57",
-    onClick: function onClick() {
-      return updateAttributes({
-        type: 'icon'
-      });
-    },
-    className: attrs.type === 'icon' ? 'tool-active' : ''
+    }],
+    selected: attrs.type || 'icon',
+    tip: "\u7C7B\u578B"
+  }));
+  return /*#__PURE__*/React.createElement(HoverPopover, {
+    actions: operationMenu,
+    hoverDelay: 500,
+    closeDelay: 300,
+    placement: "top",
+    disabled: !editor.isEditable
+  }, /*#__PURE__*/React.createElement(NodeViewWrapper, {
+    ref: containerRef,
+    className: "alert-wrapper ".concat(selected ? 'ProseMirror-selectednode' : ''),
+    "data-drag-handle": true,
+    as: 'div',
+    style: {
+      marginLeft: (_node$attrs = node.attrs) !== null && _node$attrs !== void 0 && _node$attrs.indent ? node.attrs.indent * 32 : undefined,
+      border: '1px solid',
+      borderColor: "color-mix(in srgb, ".concat(variantData.color, " 50%, transparent)"),
+      borderRadius: '10px',
+      padding: '16px',
+      lineHeight: 1.625,
+      display: 'flex',
+      alignItems: 'flex-start',
+      gap: '16px',
+      background: attrs.variant === 'default' ? 'var(--mui-palette-background-paper3)' : "color-mix(in srgb, ".concat(variantData.color, " 10%, transparent)")
+    }
+  }, showIcon && /*#__PURE__*/React.createElement(Box, {
+    sx: {
+      pt: '2px',
+      lineHeight: 1,
+      color: attrs.variant === 'default' ? 'text.disabled' : variantData.color
+    }
+  }, variantData.icon), /*#__PURE__*/React.createElement(Box, {
+    sx: {
+      flex: 1,
+      width: 0,
+      'code': {
+        borderColor: attrs.variant === 'default' ? '' : "color-mix(in srgb, ".concat(variantData.color, " 30%, transparent) !important"),
+        bgcolor: attrs.variant === 'default' ? '' : "color-mix(in srgb, ".concat(variantData.color, " 10%, transparent) !important")
+      }
+    }
+  }, /*#__PURE__*/React.createElement(NodeViewContent, {
+    as: 'div'
   }))));
 };
 export default AlertView;

package/dist/extension/component/Attachment/AttachmentContent.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { AttachmentAttributes } from ".";
+interface AttachmentContentProps {
+    attrs: AttachmentAttributes;
+    type: 'icon' | 'block';
+    /** 是否为编辑模式 */
+    editable?: boolean;
+}
+/**
+ * 附件内容组件
+ * 用于渲染附件的实际内容，支持编辑和只读模式
+ */
+export declare const AttachmentContent: React.FC<AttachmentContentProps>;
+export default AttachmentContent;

package/dist/extension/component/Attachment/AttachmentContent.js

@@ -0,0 +1,142 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { FileIcon } from "../../../component/Icons";
+import { Box, Stack } from "@mui/material";
+import React from "react";
+/**
+ * 附件内容组件
+ * 用于渲染附件的实际内容，支持编辑和只读模式
+ */
+export var AttachmentContent = function AttachmentContent(_ref) {
+  var attrs = _ref.attrs,
+    type = _ref.type,
+    _ref$editable = _ref.editable,
+    editable = _ref$editable === void 0 ? false : _ref$editable;
+  // 编辑模式和只读模式的样式差异
+  var blockStyles = editable ? {
+    display: 'flex',
+    border: '1px solid',
+    borderColor: attrs.url === 'error' ? 'error.main' : 'divider',
+    cursor: 'pointer',
+    borderRadius: 'var(--mui-shape-borderRadius)',
+    bgcolor: 'background.paper',
+    p: 2,
+    color: 'inherit',
+    ':hover': {
+      borderColor: attrs.url === 'error' ? 'error.main' : 'primary.main'
+    }
+  } : {
+    display: 'block'
+  };
+  var blockInnerStyles = editable ? {
+    width: '100%'
+  } : {
+    border: '1px solid',
+    borderColor: attrs.url === 'error' ? 'error.main' : 'divider',
+    color: 'text.primary',
+    cursor: 'pointer',
+    borderRadius: 'var(--mui-shape-borderRadius)',
+    bgcolor: 'background.paper',
+    p: 2,
+    ':hover': {
+      borderColor: attrs.url === 'error' ? 'error.main' : 'primary.main'
+    }
+  };
+  var inlineStyles = editable ? {
+    color: 'primary.main',
+    cursor: 'pointer',
+    borderRadius: 'var(--mui-shape-borderRadius)',
+    transition: 'background-color 0.2s ease',
+    display: 'inline',
+    ':hover': {
+      bgcolor: 'background.paper'
+    }
+  } : {
+    display: 'inline-flex',
+    alignItems: 'center',
+    gap: 0.5,
+    color: 'primary.main',
+    cursor: 'pointer'
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, type === 'block' ? /*#__PURE__*/React.createElement(Box, _extends({
+    component: "a",
+    href: attrs.url,
+    target: "_blank",
+    download: attrs.title
+  }, !editable && {
+    'data-title': attrs.title,
+    'data-type': attrs.type
+  }, {
+    sx: blockStyles
+  }), /*#__PURE__*/React.createElement(Stack, _extends({
+    direction: 'row',
+    alignItems: 'center',
+    gap: 2,
+    sx: blockInnerStyles
+  }, !editable && {
+    'data-title': attrs.title,
+    'data-type': type
+  }), /*#__PURE__*/React.createElement(FileIcon, {
+    sx: {
+      fontSize: '2rem',
+      cursor: 'grab',
+      color: attrs.url === 'error' ? 'error.main' : 'primary.main',
+      alignSelf: 'center',
+      ':active': {
+        cursor: 'grabbing'
+      }
+    }
+  }), /*#__PURE__*/React.createElement(Stack, {
+    sx: {
+      flex: 1
+    },
+    gap: 0.5
+  }, /*#__PURE__*/React.createElement(Box, {
+    sx: {
+      fontSize: '0.875rem',
+      fontWeight: 'bold'
+    }
+  }, attrs.title), /*#__PURE__*/React.createElement(Box, {
+    sx: {
+      fontSize: '0.75rem',
+      color: 'text.secondary'
+    }
+  }, attrs.size)))) : /*#__PURE__*/React.createElement(Box, _extends({
+    component: "a",
+    href: attrs.url,
+    target: "_blank",
+    download: attrs.title
+  }, !editable && {
+    'data-title': attrs.title,
+    'data-type': attrs.type
+  }, {
+    sx: inlineStyles
+  }), editable ? /*#__PURE__*/React.createElement(Box, {
+    component: 'span',
+    sx: {
+      display: 'inline-flex',
+      alignItems: 'center',
+      gap: 0.5
+    }
+  }, /*#__PURE__*/React.createElement(FileIcon, {
+    sx: {
+      fontSize: '0.875rem',
+      cursor: 'grab',
+      color: 'primary.main',
+      alignSelf: 'center',
+      ':active': {
+        cursor: 'grabbing'
+      }
+    }
+  }), attrs.title) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FileIcon, {
+    sx: {
+      fontSize: '0.875rem',
+      cursor: 'grab',
+      color: 'primary.main',
+      alignSelf: 'center',
+      ':active': {
+        cursor: 'grabbing'
+      }
+    }
+  }), attrs.title)));
+};
+export default AttachmentContent;