@ctzhian/tiptap 1.5.2 → 1.5.3

package/dist/hook/index.js

@@ -0,0 +1,110 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["exclude", "extensions", "mentionItems", "onMentionFilter", "onSave", "onError", "onUpload", "onTocUpdate", "editable"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { getExtensions } from "../extension";
+import { migrateMathStrings } from "../util";
+import { useEditor } from '@tiptap/react';
+import { renderToMarkdown } from '@tiptap/static-renderer/pm/markdown';
+var useTiptap = function useTiptap(_ref) {
+  var exclude = _ref.exclude,
+    extensionsProps = _ref.extensions,
+    mentionItems = _ref.mentionItems,
+    onMentionFilter = _ref.onMentionFilter,
+    onSave = _ref.onSave,
+    onError = _ref.onError,
+    onUpload = _ref.onUpload,
+    onTocUpdate = _ref.onTocUpdate,
+    _ref$editable = _ref.editable,
+    editable = _ref$editable === void 0 ? true : _ref$editable,
+    options = _objectWithoutProperties(_ref, _excluded);
+  var extensions = getExtensions({
+    exclude: exclude,
+    extensions: extensionsProps,
+    editable: editable,
+    mentionItems: mentionItems,
+    onMentionFilter: onMentionFilter,
+    onUpload: onUpload,
+    onError: onError,
+    onTocUpdate: onTocUpdate
+  });
+  var editor = useEditor(_objectSpread(_objectSpread({
+    editable: editable,
+    extensions: extensions
+  }, options), {}, {
+    editorProps: {
+      handleKeyDown: function handleKeyDown(view, event) {
+        // 编辑模式下保存
+        if (event.key === 's' && (event.metaKey || event.ctrlKey) && editable) {
+          event.preventDefault();
+          onSave === null || onSave === void 0 || onSave(editor);
+          return true;
+        }
+        // tab
+        if (event.key === 'Tab') {
+          var isInList = (editor === null || editor === void 0 ? void 0 : editor.isActive('orderedList')) || (editor === null || editor === void 0 ? void 0 : editor.isActive('bulletList')) || (editor === null || editor === void 0 ? void 0 : editor.isActive('taskList'));
+          var isInTable = editor === null || editor === void 0 ? void 0 : editor.isActive('table');
+          if (!isInList && !isInTable) {
+            event.preventDefault();
+            var tr = view.state.tr.insertText('\t');
+            view.dispatch(tr);
+            return true;
+          }
+        }
+      }
+    },
+    onCreate: function onCreate(_ref2) {
+      var currentEditor = _ref2.editor;
+      if (options.onCreate) {
+        options.onCreate({
+          editor: currentEditor
+        });
+      }
+      // 处理数学公式 - 延迟执行确保文档完全准备好
+      setTimeout(function () {
+        try {
+          migrateMathStrings(currentEditor);
+        } catch (error) {
+          console.warn('数学公式迁移失败:', error);
+          onError === null || onError === void 0 || onError(error);
+        }
+      }, 100);
+    },
+    onSelectionUpdate: function onSelectionUpdate(props) {
+      if (options.onSelectionUpdate) {
+        options.onSelectionUpdate(props);
+      }
+    },
+    onContentError: function onContentError(props) {
+      if (options.onContentError) {
+        options.onContentError(props);
+      }
+      onError === null || onError === void 0 || onError(props.error);
+    }
+  }));
+  return {
+    editor: editor,
+    getText: function getText() {
+      return (editor === null || editor === void 0 ? void 0 : editor.getText()) || '';
+    },
+    getHTML: function getHTML() {
+      return (editor === null || editor === void 0 ? void 0 : editor.getHTML()) || '';
+    },
+    getJSON: function getJSON() {
+      return (editor === null || editor === void 0 ? void 0 : editor.getJSON()) || null;
+    },
+    getMarkdownByJSON: function getMarkdownByJSON() {
+      if (!editor) return '';
+      return renderToMarkdown({
+        extensions: editor.extensionManager.extensions,
+        content: editor.getJSON()
+      });
+    }
+  };
+};
+export default useTiptap;

package/dist/index.css

@@ -0,0 +1,555 @@
+@import url('./asset/css/index.css');
+
+.tiptap.ProseMirror {
+  overflow-y: auto;
+  outline: none;
+  color: var(--mui-palette-text-secondary);
+}
+
+/* 节点缩进（依赖 data-indent 属性） */
+.tiptap.ProseMirror [data-indent="1"] {
+  margin-left: 32px;
+}
+
+.tiptap.ProseMirror [data-indent="2"] {
+  margin-left: 64px;
+}
+
+.tiptap.ProseMirror [data-indent="3"] {
+  margin-left: 96px;
+}
+
+.tiptap.ProseMirror [data-indent="4"] {
+  margin-left: 128px;
+}
+
+.tiptap.ProseMirror [data-indent="5"] {
+  margin-left: 160px;
+}
+
+.tiptap.ProseMirror [data-indent="6"] {
+  margin-left: 192px;
+}
+
+.tiptap.ProseMirror [data-indent="7"] {
+  margin-left: 224px;
+}
+
+.tiptap.ProseMirror [data-indent="8"] {
+  margin-left: 256px;
+}
+
+.tiptap.ProseMirror[contenteditable="false"] {
+  padding: 0;
+}
+
+.tiptap.ProseMirror :first-child {
+  margin-top: 0 !important;
+}
+
+.tiptap.ProseMirror :last-child {
+  margin-bottom: 0 !important;
+}
+
+.tiptap.ProseMirror a {
+  text-decoration: underline;
+}
+
+.tiptap.ProseMirror p {
+  line-height: 1.625;
+  margin-top: 0;
+  font-size: 16px;
+  margin-bottom: 20px;
+}
+
+.tiptap.ProseMirror blockquote p,
+.tiptap.ProseMirror .node-alert p {
+  margin: 0;
+}
+
+/* blockquote */
+.tiptap.ProseMirror blockquote {
+  position: relative;
+  padding: 8px 16px;
+  margin: 0 0 20px;
+  border-radius: 10px;
+  border: 1px solid var(--mui-palette-divider);
+  color: var(--mui-palette-text-secondary);
+  background-color: var(--mui-palette-background-paper3);
+}
+
+/* list */
+.tiptap.ProseMirror ol,
+.tiptap.ProseMirror ul {
+  padding: 0 32px;
+  margin: 20px 16px 20px 0;
+  list-style: none;
+}
+
+.tiptap.ProseMirror li ol,
+.tiptap.ProseMirror li ul {
+  margin: 0;
+}
+
+.tiptap.ProseMirror ol {
+  list-style: decimal;
+}
+
+.tiptap.ProseMirror ol ol {
+  list-style: lower-alpha;
+}
+
+.tiptap.ProseMirror ol ol ol {
+  list-style: lower-roman;
+}
+
+.tiptap.ProseMirror ul:not([data-type='taskList']) {
+  list-style: disc;
+}
+
+.tiptap.ProseMirror ul:not([data-type='taskList']) li {
+  position: relative;
+  padding-left: 0;
+}
+
+.tiptap.ProseMirror ul:not([data-type='taskList']) ul {
+  list-style: disc;
+}
+
+.tiptap.ProseMirror ul:not([data-type='taskList']) ul ul {
+  list-style: disc;
+}
+
+.tiptap.ProseMirror ul[data-type='taskList'] {
+  list-style: none;
+  margin-left: 0;
+  padding: 0;
+}
+
+.tiptap.ProseMirror ul[data-type='taskList'] li {
+  align-items: flex-start;
+  display: flex;
+}
+
+.tiptap.ProseMirror ul[data-type='taskList'] li>label {
+  flex: 0 0 auto;
+  user-select: none;
+  margin-right: 0.5rem;
+  height: 28px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.tiptap.ProseMirror ul[data-type='taskList'] li>div {
+  flex: 1 1 auto;
+}
+
+.tiptap.ProseMirror ul[data-type='taskList'] li[data-checked='true']>div {
+  color: var(--mui-palette-text-disabled);
+  text-decoration: line-through;
+}
+
+.tiptap.ProseMirror label:has(input[type="checkbox"]) {
+  padding-top: 0;
+}
+
+.tiptap.ProseMirror ul[data-type='taskList'] input[type='checkbox'] {
+  cursor: pointer;
+}
+
+.tiptap.ProseMirror ul[data-type='taskList'] ul[data-type='taskList'] {
+  margin: 0;
+}
+
+.tiptap.ProseMirror ul p,
+.tiptap.ProseMirror ol p {
+  margin-top: 0.25rem;
+  margin-bottom: 0.25rem;
+}
+
+.tiptap.ProseMirror ol li::marker {
+  font-family: monospace;
+}
+
+/* code */
+.tiptap.ProseMirror .codeblock-wrapper {
+  margin: 20px 0;
+}
+
+.tiptap.ProseMirror pre {
+  position: relative;
+  color: var(--mui-palette-common-white);
+  background-color: #171c19;
+}
+
+.tiptap.ProseMirror code {
+  padding: 2px 8px;
+  margin: 0 4px;
+  line-height: 1.625;
+  font-size: inherit;
+  word-break: break-all;
+  font-weight: 500;
+  background-color: var(--mui-palette-background-paper2);
+  border-radius: 6px;
+}
+
+.tiptap.ProseMirror pre code {
+  color: inherit;
+  padding: 0;
+  font-weight: normal;
+  border-radius: 0;
+  background-color: transparent;
+  -webkit-text-fill-color: inherit;
+}
+
+/* details */
+.tiptap.ProseMirror .cq-details {
+  display: flex;
+  gap: 0.25rem;
+  line-height: 1.625;
+  margin: 20px 0;
+  border: 1px solid var(--mui-palette-divider);
+  border-radius: var(--mui-shape-borderRadius);
+  padding: 0.5rem;
+}
+
+.tiptap.ProseMirror .cq-details summary {
+  font-weight: 600;
+}
+
+.tiptap.ProseMirror .cq-details>button {
+  cursor: pointer;
+  background: transparent;
+  border-radius: 4px;
+  font-size: 0.625rem;
+  border: none;
+  width: 1.25rem;
+  height: 1.25rem;
+  margin-top: 0.1rem;
+  padding: 0;
+}
+
+.tiptap.ProseMirror .cq-details>button:hover {
+  background-color: var(--mui-palette-divider);
+}
+
+.tiptap.ProseMirror .cq-details>button::before {
+  content: '\25B6';
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: transform 0.2s ease-in-out;
+}
+
+.tiptap.ProseMirror .cq-details.is-open>button::before {
+  transform: rotate(90deg);
+}
+
+.tiptap.ProseMirror .cq-details>div {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  width: 100%;
+}
+
+.tiptap.ProseMirror .cq-details>div>[data-type='detailsContent']> :last-child {
+  margin-bottom: 0.5rem;
+}
+
+.tiptap.ProseMirror .cq-details .cq-details {
+  margin: 0.5rem 0;
+}
+
+/* emoji */
+.tiptap.ProseMirror [data-type='emoji'] img {
+  height: 1rem;
+  width: 1rem;
+  margin: 0;
+  padding: 0;
+  border: none;
+}
+
+/* mention */
+.tiptap.ProseMirror .mention {
+  background-color: var(--mui-palette-background-paper);
+  border-radius: var(--mui-shape-borderRadius);
+  box-decoration-break: clone;
+  color: var(--mui-palette-primary-main);
+  padding: 0.1rem 0.3rem;
+}
+
+/* heading */
+.tiptap.ProseMirror h1,
+.tiptap.ProseMirror h2,
+.tiptap.ProseMirror h3,
+.tiptap.ProseMirror h4,
+.tiptap.ProseMirror h5,
+.tiptap.ProseMirror h6 {
+  position: relative;
+  color: inherit;
+  font-style: inherit;
+  color: var(--mui-palette-text-primary);
+}
+
+.tiptap.ProseMirror h1 {
+  font-size: 30px;
+  line-height: 36px;
+  font-weight: 700;
+  margin: 48px 0 20px;
+}
+
+.tiptap.ProseMirror h2 {
+  font-size: 24px;
+  line-height: 32px;
+  font-weight: 700;
+  margin: 40px 0 20px;
+}
+
+.tiptap.ProseMirror h3 {
+  font-size: 20px;
+  line-height: 28px;
+  font-weight: 600;
+  margin: 36px 0 20px;
+}
+
+.tiptap.ProseMirror h4 {
+  font-size: 18px;
+  line-height: 26px;
+  font-weight: 600;
+  margin: 32px 0 20px;
+}
+
+.tiptap.ProseMirror h5 {
+  font-size: 18px;
+  line-height: 26px;
+  font-weight: 600;
+  margin: 32px 0 20px;
+}
+
+.tiptap.ProseMirror h6 {
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 600;
+  margin: 32px 0 20px;
+}
+
+/* horizontal rule */
+.tiptap.ProseMirror hr {
+  margin: 20px 0;
+  border: none;
+  height: 1px;
+  background-color: var(--mui-palette-divider);
+}
+
+.tiptap.ProseMirror table {
+  border-collapse: separate;
+  border-spacing: 0;
+  text-indent: 0;
+  max-width: 100%;
+  table-layout: fixed;
+  overflow: hidden;
+  background-color: var(--mui-palette-background-paper);
+  caption-side: top;
+  border-left: 1px solid transparent;
+  border-right: 1px solid transparent;
+}
+
+.tiptap.ProseMirror table p {
+  font-size: 14px;
+  line-height: 24px;
+}
+
+/* 表格单元格基础样式 */
+.tiptap.ProseMirror table td,
+.tiptap.ProseMirror table th {
+  border: none;
+  border-bottom: 1px solid var(--mui-palette-divider);
+  border-right: 1px solid transparent;
+  box-sizing: border-box;
+  padding: 12px 16px;
+  position: relative;
+  vertical-align: top;
+  transition: all 0.2s ease-in-out;
+}
+
+.tiptap.ProseMirror table tbody tr:first-child th,
+.tiptap.ProseMirror table tbody tr:first-child td {
+  border-top: 1px solid var(--mui-palette-divider);
+}
+
+.tiptap.ProseMirror table td>*,
+.tiptap.ProseMirror table th>* {
+  margin-bottom: 0;
+}
+
+/* 表格表头样式 */
+.tiptap.ProseMirror table th {
+  background-color: var(--mui-palette-background-paper3);
+  font-weight: 600;
+  color: var(--mui-palette-text-primary);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  text-align: left;
+}
+
+/* 表格数据单元格样式 */
+.tiptap.ProseMirror table td {
+  background-color: var(--mui-palette-background-default);
+}
+
+/* 表格悬停时显示所有列边框 - 只在编辑模式下生效 */
+.tiptap.ProseMirror[contenteditable="true"] table:hover,
+.tiptap.ProseMirror[contenteditable="true"] .table-focus table {
+  border-left: 1px dotted var(--mui-palette-divider);
+  border-right: 1px dotted var(--mui-palette-divider);
+}
+
+.tiptap.ProseMirror[contenteditable="true"] table:hover td,
+.tiptap.ProseMirror[contenteditable="true"] table:hover th,
+.tiptap.ProseMirror[contenteditable="true"] .table-focus td,
+.tiptap.ProseMirror[contenteditable="true"] .table-focus th {
+  border-right-color: var(--mui-palette-divider);
+  border-right-style: dotted;
+}
+
+.tiptap.ProseMirror[contenteditable="true"] table:hover td:last-child,
+.tiptap.ProseMirror[contenteditable="true"] table:hover th:last-child,
+.tiptap.ProseMirror[contenteditable="true"] .table-focus td:last-child,
+.tiptap.ProseMirror[contenteditable="true"] .table-focus th:last-child {
+  border-right-color: transparent;
+}
+
+.tiptap.ProseMirror[contenteditable="false"] table {
+  border-left: 1px dotted var(--mui-palette-divider);
+  border-right: 1px dotted var(--mui-palette-divider);
+}
+
+.tiptap.ProseMirror[contenteditable="false"] table td,
+.tiptap.ProseMirror[contenteditable="false"] table th {
+  border-right-color: var(--mui-palette-divider);
+  border-right-style: dotted;
+}
+
+.tiptap.ProseMirror[contenteditable="false"] table td:last-child,
+.tiptap.ProseMirror[contenteditable="false"] table th:last-child {
+  border-right-color: transparent;
+}
+
+/* 表格选择状态 */
+.tiptap.ProseMirror[contenteditable="true"] table .selectedCell:after {
+  background-color: color-mix(in srgb, var(--mui-palette-primary-main) 12%, transparent);
+  content: '';
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  pointer-events: none;
+  position: absolute;
+  z-index: 2;
+  /* border-radius: 4px; */
+  /* border: 2px solid var(--mui-palette-primary-main); */
+}
+
+.tiptap.ProseMirror[contenteditable="true"] table .selectedCell {
+  background-color: color-mix(in srgb, var(--mui-palette-primary-main) 5%, transparent) !important;
+}
+
+/* 选中单元格的边框样式 - 只改变最外圈边框颜色 */
+.tiptap.ProseMirror[contenteditable="true"] table .selectedCell {
+  border-color: var(--mui-palette-primary-main) !important;
+}
+
+/* 表格列调整手柄 */
+.tiptap.ProseMirror[contenteditable="true"] table .column-resize-handle {
+  background-color: transparent;
+  border-right: 2px dotted var(--mui-palette-primary-main);
+  bottom: -2px;
+  pointer-events: none;
+  position: absolute;
+  right: -2px;
+  top: 0;
+  width: 1px;
+  z-index: 3;
+  opacity: 0.6;
+  transition: all 0.2s ease-in-out;
+}
+
+.tiptap.ProseMirror.resize-cursor {
+  cursor: col-resize;
+}
+
+/* 表格包装器样式 */
+.tiptap.ProseMirror .tableWrapper {
+  overflow-x: auto;
+  margin: 20px 0;
+}
+
+/* 表格滚动条样式 */
+.tiptap.ProseMirror .tableWrapper::-webkit-scrollbar {
+  height: 2px;
+}
+
+.tiptap.ProseMirror .tableWrapper::-webkit-scrollbar-track {
+  background: var(--mui-palette-divider);
+  border-radius: 4px;
+}
+
+.tiptap.ProseMirror .tableWrapper::-webkit-scrollbar-thumb {
+  background: var(--mui-palette-text-disabled);
+  border-radius: 4px;
+}
+
+/* youtube */
+.tiptap.ProseMirror div[data-youtube-video] {
+  cursor: move;
+  padding-right: 1.5rem;
+}
+
+.tiptap.ProseMirror div[data-youtube-video] iframe {
+  border: 1px solid var(--mui-palette-divider);
+  padding: 0.25rem;
+  border-radius: var(--mui-shape-borderRadius);
+  display: block;
+  min-height: 200px;
+  min-width: 200px;
+  outline: 0px solid transparent;
+  margin: 20px 0;
+}
+
+@keyframes rotate-icon {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.PhotoView-Slider__Backdrop {
+  background: rgba(33, 34, 45, 0.3) !important;
+  backdrop-filter: blur(5px);
+  transition: none !important;
+  animation-duration: none !important;
+}
+
+.PhotoView-Slider__BannerWrap {
+  background-color: rgba(33, 34, 45, 0.2) !important;
+}
+
+.slash-decoration[data-decoration-content].is-empty {
+  padding: 4px 8px;
+  background-color: var(--mui-palette-background-paper2);
+  border-radius: var(--mui-shape-borderRadius);
+}
+
+.slash-decoration[data-decoration-content].is-empty::after {
+  content: attr(data-decoration-content);
+  color: var(--mui-palette-text-disabled);
+  padding-left: 0.25rem;
+  font-size: 14px;
+  line-height: 24px;
+}

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+export * from './component/Icons';
+export { default as Editor } from './Editor';
+export { default as EditorDiff } from './EditorDiff';
+export { default as EditorThemeProvider } from './EditorThemeProvider';
+export { default as EditorToolbar } from './EditorToolbar';
+export { default as useTiptap } from './hook';
+export { useFn } from './hook/fn';
+export * from './type';

package/dist/index.js

@@ -0,0 +1,8 @@
+export * from "./component/Icons";
+export { default as Editor } from "./Editor";
+export { default as EditorDiff } from "./EditorDiff";
+export { default as EditorThemeProvider } from "./EditorThemeProvider";
+export { default as EditorToolbar } from "./EditorToolbar";
+export { default as useTiptap } from "./hook";
+export { useFn } from "./hook/fn";
+export * from "./type";

package/dist/themes/color.d.ts

@@ -0,0 +1,5 @@
+import custom from './custom';
+import dark from './dark';
+import light from './light';
+export { custom, dark, light };
+export type ThemeColor = typeof light;

package/dist/themes/color.js

@@ -0,0 +1,4 @@
+import custom from "./custom";
+import dark from "./dark";
+import light from "./light";
+export { custom, dark, light };