@ctzhian/tiptap 2.5.2 → 2.6.1

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

@@ -0,0 +1,284 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+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 { alpha, Box, useTheme } from '@mui/material';
+import { NodeViewContent, NodeViewWrapper } from '@tiptap/react';
+import React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { DEFAULT_GAP, MIN_WIDTH } from "../../node/FlipGrid";
+import { applyFlipGridWidths, collectWidths, normalizeWithMin } from "./utils";
+var clampPair = function clampPair(left, right, delta) {
+  var nextLeft = Math.min(Math.max(left + delta, MIN_WIDTH), left + right - MIN_WIDTH);
+  var nextRight = left + right - nextLeft;
+  return [nextLeft, nextRight];
+};
+var FlipGridView = function FlipGridView(_ref) {
+  var node = _ref.node,
+    editor = _ref.editor,
+    getPos = _ref.getPos;
+  var theme = useTheme();
+  var containerRef = useRef(null);
+  var cleanupRef = useRef(null);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    hovering = _useState2[0],
+    setHovering = _useState2[1];
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    hoverGapIndex = _useState4[0],
+    setHoverGapIndex = _useState4[1];
+  var _useState5 = useState(null),
+    _useState6 = _slicedToArray(_useState5, 2),
+    dragIndex = _useState6[0],
+    setDragIndex = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    showPercents = _useState8[0],
+    setShowPercents = _useState8[1];
+  var _useState9 = useState(1),
+    _useState10 = _slicedToArray(_useState9, 2),
+    containerWidth = _useState10[0],
+    setContainerWidth = _useState10[1];
+  var _useState11 = useState(function () {
+      var parsed = parseFloat(DEFAULT_GAP || '0');
+      return Number.isFinite(parsed) ? parsed : 0;
+    }),
+    _useState12 = _slicedToArray(_useState11, 2),
+    gapPx = _useState12[0],
+    setGapPx = _useState12[1];
+  var widths = useMemo(function () {
+    return collectWidths(node);
+  }, [node]);
+  var safeWidths = useMemo(function () {
+    return normalizeWithMin(widths, MIN_WIDTH);
+  }, [widths]);
+  useLayoutEffect(function () {
+    var element = containerRef.current;
+    if (!element) return;
+    var updateMetrics = function updateMetrics() {
+      var content = element.querySelector('[data-node-view-content-react]') || element.querySelector('[data-node-view-content]');
+      var contentWidth = content === null || content === void 0 ? void 0 : content.getBoundingClientRect().width;
+      var nextWidth = Math.max(1, contentWidth || element.getBoundingClientRect().width || 1);
+      var gapValue = content ? getComputedStyle(content).gap : DEFAULT_GAP;
+      var parsedGap = parseFloat(gapValue || '0');
+      var nextGap = Number.isFinite(parsedGap) ? parsedGap : 0;
+      setContainerWidth(function (prev) {
+        return prev !== nextWidth ? nextWidth : prev;
+      });
+      setGapPx(function (prev) {
+        return prev !== nextGap ? nextGap : prev;
+      });
+    };
+    updateMetrics();
+    var observer = new ResizeObserver(updateMetrics);
+    observer.observe(element);
+    return function () {
+      observer.disconnect();
+    };
+  }, []);
+  var layout = useMemo(function () {
+    var gapsTotal = gapPx * Math.max(0, safeWidths.length - 1);
+    var availableWidth = Math.max(1, containerWidth - gapsTotal);
+    var widthsPx = safeWidths.map(function (w) {
+      return w / 100 * availableWidth;
+    });
+    var accPx = 0;
+    var handlePercents = [];
+    var labelPercents = [];
+    widthsPx.forEach(function (w, idx) {
+      var startPx = accPx;
+      var labelPx = startPx + w;
+      labelPercents.push(labelPx / containerWidth * 100);
+      accPx += w;
+      if (idx < widthsPx.length - 1) {
+        var centerPx = accPx + gapPx / 2;
+        handlePercents.push(centerPx / containerWidth * 100);
+        accPx += gapPx;
+      }
+    });
+    return {
+      handlePercents: handlePercents,
+      labelPercents: labelPercents
+    };
+  }, [safeWidths, node.childCount, gapPx, containerWidth]);
+  var applyWidths = function applyWidths(nextWidths, insertAt) {
+    if (!(editor !== null && editor !== void 0 && editor.state)) return;
+    var position = typeof getPos === 'function' ? getPos() : getPos;
+    if (typeof position !== 'number') return;
+    var tr = editor.state.tr;
+    var _applyFlipGridWidths = applyFlipGridWidths({
+        tr: tr,
+        parentNode: node,
+        parentPos: position,
+        nextWidths: nextWidths,
+        minWidth: MIN_WIDTH,
+        insertAt: insertAt,
+        selection: editor.state.selection
+      }),
+      changed = _applyFlipGridWidths.changed;
+    if (changed) {
+      editor.view.dispatch(tr);
+    }
+  };
+  useEffect(function () {
+    if (widths.length !== safeWidths.length) {
+      applyWidths(safeWidths);
+      return;
+    }
+    var diff = widths.some(function (w, idx) {
+      return Math.abs(w - safeWidths[idx]) > 0.01;
+    });
+    if (diff) {
+      applyWidths(safeWidths);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [widths, safeWidths]);
+  var handleResizeStart = function handleResizeStart(index, event) {
+    var _containerRef$current;
+    event.preventDefault();
+    event.stopPropagation();
+    if (!editor.isEditable) return;
+    var containerWidth = ((_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.getBoundingClientRect().width) || 1;
+    var startX = event.clientX;
+    var startWidths = _toConsumableArray(safeWidths);
+    setDragIndex(index);
+    setShowPercents(true);
+    var rafId = null;
+    var handleMouseMove = function handleMouseMove(e) {
+      if (rafId) return;
+      rafId = requestAnimationFrame(function () {
+        rafId = null;
+        var deltaPx = e.clientX - startX;
+        var deltaPercent = deltaPx / containerWidth * 100;
+        var _clampPair = clampPair(startWidths[index], startWidths[index + 1], deltaPercent),
+          _clampPair2 = _slicedToArray(_clampPair, 2),
+          nextLeft = _clampPair2[0],
+          nextRight = _clampPair2[1];
+        var nextWidths = _toConsumableArray(startWidths);
+        nextWidths[index] = nextLeft;
+        nextWidths[index + 1] = nextRight;
+        applyWidths(nextWidths);
+      });
+    };
+    var handleMouseUp = function handleMouseUp() {
+      setDragIndex(null);
+      setShowPercents(false);
+      document.removeEventListener('mousemove', handleMouseMove);
+      document.removeEventListener('mouseup', handleMouseUp);
+      if (rafId) {
+        cancelAnimationFrame(rafId);
+        rafId = null;
+      }
+      cleanupRef.current = null;
+    };
+    document.addEventListener('mousemove', handleMouseMove);
+    document.addEventListener('mouseup', handleMouseUp);
+    cleanupRef.current = function () {
+      document.removeEventListener('mousemove', handleMouseMove);
+      document.removeEventListener('mouseup', handleMouseUp);
+    };
+  };
+  useEffect(function () {
+    return function () {
+      var _cleanupRef$current;
+      (_cleanupRef$current = cleanupRef.current) === null || _cleanupRef$current === void 0 || _cleanupRef$current.call(cleanupRef);
+    };
+  }, []);
+  var showHandles = (editor === null || editor === void 0 ? void 0 : editor.isEditable) && (hovering || dragIndex !== null || hoverGapIndex !== null);
+  return /*#__PURE__*/React.createElement(NodeViewWrapper, {
+    ref: containerRef,
+    as: "div",
+    onMouseEnter: function onMouseEnter() {
+      return setHovering(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return !dragIndex && setHovering(false);
+    },
+    "data-type": "flip-grid",
+    style: {
+      position: 'relative'
+    }
+  }, /*#__PURE__*/React.createElement(Box, {
+    sx: {
+      '.flip-grid-content > div[data-node-view-content-react]': {
+        display: 'flex',
+        gap: DEFAULT_GAP,
+        alignItems: 'stretch',
+        position: 'relative'
+      }
+    }
+  }, /*#__PURE__*/React.createElement(NodeViewContent, {
+    className: "flip-grid-content"
+  })), (editor === null || editor === void 0 ? void 0 : editor.isEditable) && /*#__PURE__*/React.createElement(React.Fragment, null, layout.handlePercents.map(function (percent, index) {
+    var gapActive = dragIndex !== null || hoverGapIndex === index;
+    return /*#__PURE__*/React.createElement(Box, {
+      key: index,
+      sx: {
+        position: 'absolute',
+        left: "".concat(percent, "%"),
+        width: gapPx,
+        top: 0,
+        bottom: 0,
+        transform: 'translateX(-50%)',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        pointerEvents: 'auto',
+        zIndex: 2,
+        ':hover > div': {
+          bgcolor: alpha(theme.palette.primary.main, 0.7)
+        }
+      },
+      onMouseEnter: function onMouseEnter() {
+        return setHoverGapIndex(index);
+      },
+      onMouseLeave: function onMouseLeave() {
+        return setHoverGapIndex(null);
+      }
+    }, /*#__PURE__*/React.createElement(Box, {
+      sx: {
+        position: 'absolute',
+        left: '50%',
+        height: 'calc(100% - 16px)',
+        width: 2,
+        minHeight: 16,
+        borderRadius: '4px',
+        cursor: 'ew-resize',
+        opacity: showHandles && gapActive ? 1 : 0,
+        transition: 'opacity 0.2s ease',
+        pointerEvents: 'auto',
+        transform: 'translate(-50%, 0)'
+      },
+      onMouseDown: function onMouseDown(e) {
+        return handleResizeStart(index, e);
+      }
+    }));
+  }), showPercents && layout.labelPercents.map(function (offset, idx) {
+    var _safeWidths$idx;
+    return /*#__PURE__*/React.createElement(Box, {
+      key: "percent-".concat(idx),
+      sx: {
+        position: 'absolute',
+        top: 4,
+        left: "calc(".concat(offset, "% - 4px)"),
+        transform: 'translate(-100%, 0)',
+        px: 0.75,
+        py: 0.25,
+        borderRadius: '4px',
+        bgcolor: 'rgba(0,0,0,0.5)',
+        color: '#fff',
+        fontSize: '10px',
+        lineHeight: 1.2,
+        pointerEvents: 'none',
+        whiteSpace: 'nowrap'
+      }
+    }, "".concat(Math.round((_safeWidths$idx = safeWidths[idx]) !== null && _safeWidths$idx !== void 0 ? _safeWidths$idx : 0), "%"));
+  })));
+};
+export default FlipGridView;

package/dist/extension/component/FlipGrid/utils.d.ts

@@ -0,0 +1,24 @@
+import type { Node as PMNode, ResolvedPos } from '@tiptap/pm/model';
+import type { Selection, Transaction } from '@tiptap/pm/state';
+export declare const normalizeWithMin: (widths: number[], minWidth: number) => number[];
+export declare const findFlipGridAncestor: ($pos: ResolvedPos) => {
+    node: PMNode;
+    depth: number;
+} | null;
+export declare const findChildIndex: (parent: PMNode, node: PMNode) => number;
+export declare const collectWidths: (parent: PMNode) => number[];
+type AdjustParams = {
+    tr: Transaction;
+    parentNode: PMNode;
+    parentPos: number;
+    nextWidths: number[];
+    minWidth: number;
+    insertAt?: number;
+    removeIndex?: number;
+    selection?: Selection;
+    focusIndex?: number;
+};
+export declare const applyFlipGridWidths: ({ tr, parentNode, parentPos, nextWidths, minWidth, insertAt, removeIndex, selection, focusIndex, }: AdjustParams) => {
+    changed: boolean;
+};
+export {};

package/dist/extension/component/FlipGrid/utils.js

@@ -0,0 +1,180 @@
+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); }
+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); }
+import { TextSelection } from '@tiptap/pm/state';
+export var normalizeWithMin = function normalizeWithMin(widths, minWidth) {
+  var total = widths.reduce(function (acc, cur) {
+    return acc + cur;
+  }, 0) || 1;
+  var normalized = widths.map(function (w) {
+    return w / total * 100;
+  });
+  var deficit = 0;
+  normalized = normalized.map(function (w) {
+    if (w < minWidth) {
+      deficit += minWidth - w;
+      return minWidth;
+    }
+    return w;
+  });
+  if (deficit > 0) {
+    var adjustable = normalized.map(function (w, idx) {
+      return {
+        w: w,
+        idx: idx
+      };
+    }).filter(function (item) {
+      return item.w > minWidth;
+    });
+    var adjustableTotal = adjustable.reduce(function (acc, cur) {
+      return acc + (cur.w - minWidth);
+    }, 0);
+    if (adjustableTotal > 0) {
+      adjustable.forEach(function (item) {
+        var reduceValue = deficit * ((item.w - minWidth) / adjustableTotal);
+        normalized[item.idx] = Math.max(minWidth, item.w - reduceValue);
+      });
+    }
+  }
+  var finalTotal = normalized.reduce(function (acc, cur) {
+    return acc + cur;
+  }, 0) || 1;
+  return normalized.map(function (w) {
+    return Number((w / finalTotal * 100).toFixed(2));
+  });
+};
+export var findFlipGridAncestor = function findFlipGridAncestor($pos) {
+  for (var d = $pos.depth; d >= 0; d -= 1) {
+    var _candidate$type;
+    var candidate = $pos.node(d);
+    if ((candidate === null || candidate === void 0 || (_candidate$type = candidate.type) === null || _candidate$type === void 0 ? void 0 : _candidate$type.name) === 'flipGrid') {
+      return {
+        node: candidate,
+        depth: d
+      };
+    }
+  }
+  return null;
+};
+export var findChildIndex = function findChildIndex(parent, node) {
+  for (var i = 0; i < parent.childCount; i += 1) {
+    if (parent.child(i) === node) return i;
+  }
+  return -1;
+};
+export var collectWidths = function collectWidths(parent) {
+  var list = [];
+  for (var i = 0; i < parent.childCount; i += 1) {
+    var _child$attrs$width;
+    var child = parent.child(i);
+    var raw = Number((_child$attrs$width = child.attrs.width) !== null && _child$attrs$width !== void 0 ? _child$attrs$width : 0);
+    list.push(Number.isFinite(raw) ? raw : 0);
+  }
+  return list;
+};
+export var applyFlipGridWidths = function applyFlipGridWidths(_ref) {
+  var tr = _ref.tr,
+    parentNode = _ref.parentNode,
+    parentPos = _ref.parentPos,
+    nextWidths = _ref.nextWidths,
+    minWidth = _ref.minWidth,
+    insertAt = _ref.insertAt,
+    removeIndex = _ref.removeIndex,
+    selection = _ref.selection,
+    focusIndex = _ref.focusIndex;
+  if (parentPos < 0) return {
+    changed: false
+  };
+  var mappedWidths = normalizeWithMin(nextWidths, minWidth);
+  var colType = tr.doc.type.schema.nodes.flipGridColumn;
+  var paragraphType = tr.doc.type.schema.nodes.paragraph;
+  if (!colType || !paragraphType) return {
+    changed: false
+  };
+  var onlyResize = mappedWidths.length === parentNode.childCount && typeof insertAt === 'undefined' && typeof removeIndex === 'undefined';
+  if (onlyResize) {
+    var basePos = parentPos + 1;
+    var offset = 0;
+    for (var i = 0; i < parentNode.childCount; i += 1) {
+      var child = parentNode.child(i);
+      var childPos = basePos + offset;
+      tr.setNodeMarkup(childPos, undefined, _objectSpread(_objectSpread({}, child.attrs || {}), {}, {
+        width: Number(mappedWidths[i].toFixed(2))
+      }));
+      offset += child.nodeSize;
+    }
+    if (tr.docChanged) {
+      if (typeof focusIndex === 'number') {
+        var _parentAfter$type;
+        var parentAfter = tr.doc.nodeAt(parentPos);
+        if ((parentAfter === null || parentAfter === void 0 || (_parentAfter$type = parentAfter.type) === null || _parentAfter$type === void 0 ? void 0 : _parentAfter$type.name) === 'flipGrid' && focusIndex >= 0 && focusIndex < parentAfter.childCount) {
+          var offsetToCol = 0;
+          for (var _i = 0; _i < focusIndex; _i += 1) {
+            offsetToCol += parentAfter.child(_i).nodeSize;
+          }
+          var colStart = parentPos + 1 + offsetToCol;
+          var textPos = colStart + 2; // column start + 1 (para start) + 1 (text)
+          var safePos = Math.min(tr.doc.content.size, Math.max(0, textPos));
+          tr.setSelection(TextSelection.near(tr.doc.resolve(safePos)));
+        } else if (selection) {
+          var mappedSelection = selection.map(tr.doc, tr.mapping);
+          tr.setSelection(mappedSelection);
+        }
+      } else if (selection) {
+        var _mappedSelection = selection.map(tr.doc, tr.mapping);
+        tr.setSelection(_mappedSelection);
+      }
+    }
+    return {
+      changed: tr.docChanged
+    };
+  }
+  var children = [];
+  var sourceIndex = 0;
+  for (var _i2 = 0; _i2 < mappedWidths.length; _i2 += 1) {
+    var shouldInsertNew = typeof insertAt === 'number' && _i2 === insertAt;
+    if (!shouldInsertNew && typeof removeIndex === 'number') {
+      while (sourceIndex === removeIndex) {
+        sourceIndex += 1;
+      }
+    }
+    var existing = shouldInsertNew ? null : sourceIndex < parentNode.childCount ? parentNode.child(sourceIndex) : null;
+    if (!shouldInsertNew) {
+      sourceIndex += 1;
+    }
+    var content = existing ? existing.content : paragraphType.createAndFill();
+    children.push(colType.create(_objectSpread(_objectSpread({}, (existing === null || existing === void 0 ? void 0 : existing.attrs) || {}), {}, {
+      width: Number(mappedWidths[_i2].toFixed(2))
+    }), content || undefined));
+  }
+  var newNode = parentNode.type.create(parentNode.attrs, children, parentNode.marks);
+  tr.replaceRangeWith(parentPos, parentPos + parentNode.nodeSize, newNode);
+  if (tr.docChanged) {
+    if (typeof focusIndex === 'number') {
+      var _parentAfter$type2;
+      var _parentAfter = tr.doc.nodeAt(parentPos);
+      if ((_parentAfter === null || _parentAfter === void 0 || (_parentAfter$type2 = _parentAfter.type) === null || _parentAfter$type2 === void 0 ? void 0 : _parentAfter$type2.name) === 'flipGrid' && focusIndex >= 0 && focusIndex < _parentAfter.childCount) {
+        var _offsetToCol = 0;
+        for (var _i3 = 0; _i3 < focusIndex; _i3 += 1) {
+          _offsetToCol += _parentAfter.child(_i3).nodeSize;
+        }
+        var _colStart = parentPos + 1 + _offsetToCol;
+        var _textPos = _colStart + 2; // column start + 1 (para start) + 1 (text)
+        var _safePos = Math.min(tr.doc.content.size, Math.max(0, _textPos));
+        tr.setSelection(TextSelection.near(tr.doc.resolve(_safePos)));
+      } else if (selection) {
+        var _mappedSelection2 = selection.map(tr.doc, tr.mapping);
+        tr.setSelection(_mappedSelection2);
+      }
+    } else if (selection) {
+      var _mappedSelection3 = selection.map(tr.doc, tr.mapping);
+      tr.setSelection(_mappedSelection3);
+    }
+  }
+  return {
+    changed: tr.docChanged
+  };
+};

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

@@ -25,7 +25,7 @@ var SlashCommandsList = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, /*#__PURE__*/React.createElement(Stack, {
     direction: 'row',
     flexWrap: 'wrap'
-  }, items.slice(0, 16).map(function (item, index) {
+  }, items.slice(0, 17).map(function (item, index) {
     return /*#__PURE__*/React.createElement(ToolbarItem, {
       key: index,
       shortcutKey: (item === null || item === void 0 ? void 0 : item.shortcutKey) || [],

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

@@ -14,7 +14,7 @@ import StarterKit from '@tiptap/starter-kit';
 import { PLACEHOLDER } from "../contants/placeholder";
 import { AiWritingExtension, ImeComposition, SlashCommands, StructuredDiffExtension } from "./extension";
 import { CodeExtension } from "./mark/Code";
-import { AlertExtension, AudioExtension, BlockAttachmentExtension, BlockLinkExtension, CodeBlockLowlightExtension, CustomBlockMathExtension, CustomHorizontalRule, CustomInlineMathExtension, CustomSubscript, CustomSuperscript, DetailsContentExtension, DetailsExtension, DetailsSummaryExtension, EmojiExtension, FileHandlerExtension, FlowExtension, IframeExtension, ImageExtension, Indent, InlineAttachmentExtension, InlineLinkExtension, InlineUploadProgressExtension, ListExtension, MentionExtension, TableExtension, TableOfContents, UploadProgressExtension, VerticalAlign, VideoExtension, YamlFormat, YoutubeExtension } from "./node";
+import { AlertExtension, AudioExtension, BlockAttachmentExtension, BlockLinkExtension, CodeBlockLowlightExtension, CustomBlockMathExtension, CustomHorizontalRule, CustomInlineMathExtension, CustomSubscript, CustomSuperscript, DetailsContentExtension, DetailsExtension, DetailsSummaryExtension, EmojiExtension, FileHandlerExtension, FlipGridColumnExtension, FlipGridExtension, FlowExtension, IframeExtension, ImageExtension, Indent, InlineAttachmentExtension, InlineLinkExtension, InlineUploadProgressExtension, ListExtension, MentionExtension, TableExtension, TableOfContents, UploadProgressExtension, VerticalAlign, VideoExtension, YamlFormat, YoutubeExtension } from "./node";
 export var getExtensions = function getExtensions(_ref) {
   var limit = _ref.limit,
     exclude = _ref.exclude,
@@ -48,7 +48,7 @@ export var getExtensions = function getExtensions(_ref) {
     }
   }), YamlFormat, TextStyleKit, CodeExtension, ListExtension, EmojiExtension, AlertExtension, CustomSubscript, DetailsExtension, CustomSuperscript, DetailsContentExtension, DetailsSummaryExtension, CodeBlockLowlightExtension, InlineUploadProgressExtension, CustomHorizontalRule].concat(_toConsumableArray(TableExtension({
     editable: editable
-  })), [CustomBlockMathExtension({
+  })), [FlipGridColumnExtension, FlipGridExtension, CustomBlockMathExtension({
     onError: onError
   }), CustomInlineMathExtension({
     onError: onError

package/dist/extension/node/Attachment.js

@@ -22,7 +22,7 @@ export var InlineAttachmentExtension = function InlineAttachmentExtension(props)
         url: {
           default: '',
           parseHTML: function parseHTML(element) {
-            return withBaseUrl(element.getAttribute('data-url') || '', props.baseUrl);
+            return withBaseUrl(element.getAttribute('data-url') || element.getAttribute('href') || '', props.baseUrl);
           },
           renderHTML: function renderHTML(attributes) {
             return {
@@ -33,7 +33,7 @@ export var InlineAttachmentExtension = function InlineAttachmentExtension(props)
         title: {
           default: '',
           parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-title');
+            return element.getAttribute('data-title') || element.getAttribute('title') || element.getAttribute('aria-label') || element.textContent;
           },
           renderHTML: function renderHTML(attributes) {
             return {
@@ -154,7 +154,7 @@ export var BlockAttachmentExtension = function BlockAttachmentExtension(props) {
         url: {
           default: '',
           parseHTML: function parseHTML(element) {
-            return withBaseUrl(element.getAttribute('data-url') || '', props.baseUrl);
+            return withBaseUrl(element.getAttribute('data-url') || element.getAttribute('href') || '', props.baseUrl);
           },
           renderHTML: function renderHTML(attributes) {
             if (!attributes.url) return {};
@@ -166,7 +166,7 @@ export var BlockAttachmentExtension = function BlockAttachmentExtension(props) {
         title: {
           default: '',
           parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-title');
+            return element.getAttribute('data-title') || element.getAttribute('title') || element.getAttribute('aria-label') || element.textContent;
           },
           renderHTML: function renderHTML(attributes) {
             return {

package/dist/extension/node/FlipGrid.d.ts

@@ -0,0 +1,14 @@
+import { Node } from '@tiptap/core';
+export declare const MIN_WIDTH = 5;
+export declare const MAX_COLUMNS = 10;
+export declare const DEFAULT_GAP = "16px";
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        flipGrid: {
+            setFlipGrid: (columns?: number) => ReturnType;
+        };
+    }
+}
+export declare const FlipGridColumnExtension: Node<any, any>;
+export declare const FlipGridExtension: Node<any, any>;
+export default FlipGridExtension;