@ctzhian/tiptap 2.5.1 → 2.6.0

package/dist/extension/node/FlipGrid.js

@@ -0,0 +1,131 @@
+import { mergeAttributes, Node } from '@tiptap/core';
+import { TextSelection } from '@tiptap/pm/state';
+import { ReactNodeViewRenderer } from '@tiptap/react';
+import FlipGridView from "../component/FlipGrid";
+import FlipGridColumnView from "../component/FlipGrid/ColumnView";
+export var MIN_WIDTH = 5;
+export var MAX_COLUMNS = 10;
+export var DEFAULT_GAP = '16px';
+var normalizeWidths = function normalizeWidths(widths) {
+  var total = widths.reduce(function (acc, cur) {
+    return acc + cur;
+  }, 0) || 1;
+  return widths.map(function (width) {
+    return width / total * 100;
+  });
+};
+export var FlipGridColumnExtension = Node.create({
+  name: 'flipGridColumn',
+  content: 'block+',
+  isolating: true,
+  defining: true,
+  addAttributes: function addAttributes() {
+    return {
+      width: {
+        default: 50,
+        parseHTML: function parseHTML(element) {
+          var _element$style$width;
+          var value = Number(element.getAttribute('data-width') || ((_element$style$width = element.style.width) === null || _element$style$width === void 0 ? void 0 : _element$style$width.replace('%', '')));
+          if (Number.isFinite(value)) return value;
+          return 50;
+        },
+        renderHTML: function renderHTML(attributes) {
+          var width = Number(attributes.width) || 50;
+          return {
+            'data-width': width,
+            style: "width: ".concat(width, "%;")
+          };
+        }
+      }
+    };
+  },
+  parseHTML: function parseHTML() {
+    return [{
+      tag: 'div[data-type="flip-grid-column"]'
+    }];
+  },
+  renderHTML: function renderHTML(_ref) {
+    var HTMLAttributes = _ref.HTMLAttributes;
+    return ['div', mergeAttributes({
+      'data-type': 'flip-grid-column'
+    }, this.options.HTMLAttributes, HTMLAttributes), 0];
+  },
+  addNodeView: function addNodeView() {
+    return ReactNodeViewRenderer(FlipGridColumnView);
+  }
+});
+export var FlipGridExtension = Node.create({
+  name: 'flipGrid',
+  group: 'block',
+  content: 'flipGridColumn{2,10}',
+  isolating: true,
+  defining: true,
+  addOptions: function addOptions() {
+    return {
+      HTMLAttributes: {
+        class: 'flip-grid'
+      }
+    };
+  },
+  parseHTML: function parseHTML() {
+    return [{
+      tag: 'div[data-type="flip-grid"]'
+    }];
+  },
+  renderHTML: function renderHTML(_ref2) {
+    var HTMLAttributes = _ref2.HTMLAttributes;
+    return ['div', mergeAttributes({
+      'data-type': 'flip-grid'
+    }, this.options.HTMLAttributes, HTMLAttributes), 0];
+  },
+  addCommands: function addCommands() {
+    return {
+      setFlipGrid: function setFlipGrid() {
+        var columns = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 2;
+        return function (_ref3) {
+          var state = _ref3.state,
+            dispatch = _ref3.dispatch;
+          var columnCount = Math.max(2, Math.min(MAX_COLUMNS, Math.floor(columns)));
+          var widths = normalizeWidths(new Array(columnCount).fill(1));
+          var schema = state.schema,
+            selection = state.selection;
+          var gridType = schema.nodes.flipGrid;
+          var colType = schema.nodes.flipGridColumn;
+          var paraType = schema.nodes.paragraph;
+          if (!gridType || !colType || !paraType) return false;
+          var gridNode = gridType.create({}, widths.map(function (width) {
+            return colType.create({
+              width: width
+            }, paraType.createAndFill());
+          }));
+          var tr = state.tr.replaceSelectionWith(gridNode, false);
+          var $from = tr.selection.$from;
+          var tryResolveGridStart = function tryResolveGridStart() {
+            var _$prev$nodeAfter, _$prev$nodeBefore, _$prev$nodeBefore2;
+            var after = $from.nodeAfter;
+            if ((after === null || after === void 0 ? void 0 : after.type) === gridType) return $from.pos;
+            var before = $from.nodeBefore;
+            if ((before === null || before === void 0 ? void 0 : before.type) === gridType) return $from.pos - before.nodeSize;
+            var $prev = tr.doc.resolve(Math.max(0, $from.pos - 1));
+            if (((_$prev$nodeAfter = $prev.nodeAfter) === null || _$prev$nodeAfter === void 0 ? void 0 : _$prev$nodeAfter.type) === gridType) return $prev.pos;
+            if (((_$prev$nodeBefore = $prev.nodeBefore) === null || _$prev$nodeBefore === void 0 ? void 0 : _$prev$nodeBefore.type) === gridType) return $prev.pos - (((_$prev$nodeBefore2 = $prev.nodeBefore) === null || _$prev$nodeBefore2 === void 0 ? void 0 : _$prev$nodeBefore2.nodeSize) || 0);
+            return null;
+          };
+          var gridStart = tryResolveGridStart();
+          if (gridStart !== null) {
+            var textPos = Math.min(tr.doc.content.size, gridStart + 3);
+            tr = tr.setSelection(TextSelection.near(tr.doc.resolve(textPos)));
+          }
+          if (dispatch) {
+            dispatch(tr.scrollIntoView());
+          }
+          return true;
+        };
+      }
+    };
+  },
+  addNodeView: function addNodeView() {
+    return ReactNodeViewRenderer(FlipGridView);
+  }
+});
+export default FlipGridExtension;

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

@@ -1,5 +1,5 @@
 import { Extension } from '@tiptap/core';
 export declare const TableExtension: ({ editable }: {
     editable: boolean;
-}) => (import("@tiptap/core").Node<import("@tiptap/extension-table").TableOptions, any> | import("@tiptap/core").Node<import("@tiptap/extension-table").TableHeaderOptions, any> | Extension<any, any>)[];
+}) => (Extension<any, any> | import("@tiptap/core").Node<import("@tiptap/extension-table").TableOptions, any> | import("@tiptap/core").Node<import("@tiptap/extension-table").TableHeaderOptions, any>)[];
 export default TableExtension;

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

@@ -5,6 +5,7 @@ export * from './CodeBlockLowlight';
 export * from './Details';
 export * from './Emoji';
 export * from './FileHandler';
+export * from './FlipGrid';
 export * from './Flow';
 export * from './HorizontalRule';
 export * from './Iframe';

package/dist/extension/node/index.js

@@ -5,6 +5,7 @@ export * from "./CodeBlockLowlight";
 export * from "./Details";
 export * from "./Emoji";
 export * from "./FileHandler";
+export * from "./FlipGrid";
 export * from "./Flow";
 export * from "./HorizontalRule";
 export * from "./Iframe";

package/package.json

@@ -1,24 +1,10 @@
 {
   "name": "@ctzhian/tiptap",
-  "version": "2.5.1",
+  "version": "2.6.0",
   "description": "基于 Tiptap 二次开发的编辑器组件",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
-  "scripts": {
-    "start": "npm run dev",
-    "dev": "dumi dev",
-    "build": "rm -rf dist && father build",
-    "build:watch": "father dev",
-    "docs:build": "dumi build",
-    "docs:preview": "dumi preview",
-    "prepare": "husky install && dumi setup",
-    "doctor": "father doctor",
-    "lint": "npm run lint:es && npm run lint:css",
-    "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
-    "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
-    "pre": "pnpm build && pnpm link --global"
-  },
   "authors": [
     "ky.kyy@qq.com"
   ],
@@ -142,5 +128,18 @@
     "react-image-crop": "^11.0.10",
     "react-photo-view": "^1.2.7",
     "uuid": "^11.1.0"
+  },
+  "scripts": {
+    "start": "npm run dev",
+    "dev": "dumi dev",
+    "build": "rm -rf dist && father build",
+    "build:watch": "father dev",
+    "docs:build": "dumi build",
+    "docs:preview": "dumi preview",
+    "doctor": "father doctor",
+    "lint": "npm run lint:es && npm run lint:css",
+    "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
+    "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
+    "pre": "pnpm build && pnpm link --global"
   }
-}
+}