@milkdown/preset-commonmark 6.1.3 → 6.2.0

package/lib/index.d.ts

@@ -3,13 +3,9 @@ import { commonmarkPlugins } from './plugin';
 export * from './mark';
 export * from './node';
 export * from './supported-keys';
-export declare const commonmarkNodes: AtomList<(import("@milkdown/utils/lib/types").Metadata<import("@milkdown/utils/lib/types").GetPlugin<"CodeFence", {
-    languageList?: string[] | undefined;
-}>> & import("@milkdown/core").MilkdownPlugin) | (import("@milkdown/utils/lib/types").Metadata<import("@milkdown/utils/lib/types").GetPlugin<string, import("./node").ImageOptions>> & import("@milkdown/core").MilkdownPlugin)>;
+export declare const commonmarkNodes: AtomList<import("@milkdown/utils").AtomPlugin>;
 export { commonmarkPlugins };
-export declare const commonmark: AtomList<(import("@milkdown/utils/lib/types").Metadata<import("@milkdown/utils/lib/types").GetPlugin<"CodeFence", {
-    languageList?: string[] | undefined;
-}>> & import("@milkdown/core").MilkdownPlugin) | (import("@milkdown/utils/lib/types").Metadata<import("@milkdown/utils/lib/types").GetPlugin<string, import("./node").ImageOptions>> & import("@milkdown/core").MilkdownPlugin)>;
+export declare const commonmark: AtomList<import("@milkdown/utils").AtomPlugin>;
 export declare const commands: {
     readonly ToggleInlineCode: import("@milkdown/core").CmdKey<undefined>;
     readonly ToggleItalic: import("@milkdown/core").CmdKey<undefined>;

package/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAmB3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AAEjC,eAAO,MAAM,eAAe;;gOAAwC,CAAC;AACrE,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAC7B,eAAO,MAAM,UAAU;;gOAA8D,CAAC;AAEtF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;CAwBX,CAAC;AACX,oBAAY,QAAQ,GAAG,OAAO,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAmB3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AAEjC,eAAO,MAAM,eAAe,gDAAwC,CAAC;AACrE,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAC7B,eAAO,MAAM,UAAU,gDAA8D,CAAC;AAEtF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;CAwBX,CAAC;AACX,oBAAY,QAAQ,GAAG,OAAO,QAAQ,CAAC"}

package/lib/index.es.js

@@ -19,10 +19,10 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { createMark, createShortcut, createNode, createPlugin, AtomList } from "@milkdown/utils";
 import { createCmdKey, createCmd, schemaCtx, commandsCtx, editorViewCtx } from "@milkdown/core";
-import { markRule, findSelectedNodeOfType } from "@milkdown/prose";
+import { markRule, calculateTextPosition, findSelectedNodeOfType } from "@milkdown/prose";
 import { toggleMark, wrapIn, setBlockType } from "@milkdown/prose/commands";
 import { InputRule, wrappingInputRule, textblockTypeInputRule } from "@milkdown/prose/inputrules";
-import { PluginKey, TextSelection, Plugin, Selection } from "@milkdown/prose/state";
+import { PluginKey, TextSelection, Plugin, NodeSelection, Selection } from "@milkdown/prose/state";
 import { Fragment } from "@milkdown/prose/model";
 import { ReplaceStep, AddMarkStep } from "@milkdown/prose/transform";
 import { splitListItem, sinkListItem, liftListItem } from "@milkdown/prose/schema-list";
@@ -164,14 +164,17 @@ const link = createMark((utils, options) => {
     commands: (markType) => [
       createCmd(ToggleLink, (href = "") => toggleMark(markType, { href })),
       createCmd(ModifyLink, (href = "") => (state, dispatch) => {
+        var _a;
         if (!dispatch)
           return false;
         const { marks: marks2 } = state.schema;
         let node;
         let pos = -1;
         const { selection } = state;
-        state.doc.nodesBetween(selection.from, selection.to, (n, p) => {
-          if (marks2.link.isInSet(n.marks)) {
+        const { from, to } = selection;
+        state.doc.nodesBetween(from, from === to ? to + 1 : to, (n, p) => {
+          var _a2;
+          if ((_a2 = marks2["link"]) == null ? void 0 : _a2.isInSet(n.marks)) {
             node = n;
             pos = p;
             return false;
@@ -186,7 +189,9 @@ const link = createMark((utils, options) => {
         const start = pos;
         const end = pos + node.nodeSize;
         const { tr } = state;
-        const linkMark = marks2.link.create(__spreadProps(__spreadValues({}, mark.attrs), { href }));
+        const linkMark = (_a = marks2["link"]) == null ? void 0 : _a.create(__spreadProps(__spreadValues({}, mark.attrs), { href }));
+        if (!linkMark)
+          return false;
         dispatch(tr.removeMark(start, end, mark).addMark(start, end, linkMark).setSelection(new TextSelection(tr.selection.$anchor)).scrollIntoView());
         return true;
       })
@@ -203,6 +208,7 @@ const link = createMark((utils, options) => {
       })
     ],
     prosePlugins: (type, ctx) => {
+      let renderOnTop = false;
       return [
         new Plugin({
           key: key$1,
@@ -213,6 +219,23 @@ const link = createMark((utils, options) => {
               buttonText: (_c = options == null ? void 0 : options.input) == null ? void 0 : _c.buttonText,
               onUpdate: (value) => {
                 ctx.get(commandsCtx).call(ModifyLink, value);
+              },
+              calculatePosition: (view, input) => {
+                calculateTextPosition(view, input, (start, end, target, parent) => {
+                  const $editor = view.dom.parentElement;
+                  if (!$editor) {
+                    throw new Error();
+                  }
+                  const selectionWidth = end.left - start.left;
+                  let left = start.left - parent.left - (target.width - selectionWidth) / 2;
+                  let top = start.bottom - parent.top + 14 + $editor.scrollTop;
+                  if (renderOnTop) {
+                    top = start.top - parent.top - target.height - 14 + $editor.scrollTop;
+                  }
+                  if (left < 0)
+                    left = 0;
+                  return [top, left];
+                });
               }
             });
             if (!inputChipRenderer)
@@ -220,7 +243,21 @@ const link = createMark((utils, options) => {
             const shouldDisplay = (view) => {
               const { selection, doc: doc2 } = view.state;
               const { from, to } = selection;
-              return view.hasFocus() && selection.empty && selection instanceof TextSelection && to < doc2.content.size && from < doc2.content.size && doc2.rangeHasMark(from, from === to ? to + 1 : to, type);
+              if (!view.hasFocus()) {
+                return false;
+              }
+              if (selection.empty && selection instanceof TextSelection && to < doc2.content.size && from < doc2.content.size && doc2.rangeHasMark(from, from === to ? to + 1 : to, type)) {
+                renderOnTop = false;
+                return true;
+              }
+              if (selection instanceof NodeSelection) {
+                const { node } = selection;
+                if (node.type.name === "image" && node.marks.findIndex((mark) => mark.type.name === id$8) > -1) {
+                  renderOnTop = true;
+                  return true;
+                }
+              }
+              return false;
             };
             const getCurrentLink = (view) => {
               const { selection } = view.state;
@@ -260,7 +297,9 @@ const link = createMark((utils, options) => {
                 const isEqualSelection = (prevState == null ? void 0 : prevState.doc.eq(view.state.doc)) && prevState.selection.eq(view.state.selection);
                 if (isEqualSelection)
                   return;
-                renderByView(view);
+                requestAnimationFrame(() => {
+                  renderByView(view);
+                });
               },
               destroy: () => {
                 inputChipRenderer.destroy();
@@ -623,7 +662,16 @@ const hardbreak = createNode((utils) => {
     }),
     commands: (type) => [
       createCmd(InsertHardbreak, () => (state, dispatch) => {
-        dispatch == null ? void 0 : dispatch(state.tr.setMeta("hardbreak", true).replaceSelectionWith(type.create()).scrollIntoView());
+        var _a;
+        const { selection, tr } = state;
+        if (selection.empty) {
+          const node = selection.$from.node();
+          if (node.childCount > 0 && ((_a = node.lastChild) == null ? void 0 : _a.type.name) === "hardbreak") {
+            dispatch == null ? void 0 : dispatch(tr.replaceRangeWith(selection.to - 1, selection.to, state.schema.node("paragraph")).setSelection(Selection.near(tr.doc.resolve(selection.to))).scrollIntoView());
+            return true;
+          }
+        }
+        dispatch == null ? void 0 : dispatch(tr.setMeta("hardbreak", true).replaceSelectionWith(type.create()).scrollIntoView());
         return true;
       })
     ],
@@ -668,8 +716,11 @@ const hardbreak = createNode((utils) => {
 const headingIndex = Array(6).fill(0).map((_, i) => i + 1);
 const TurnIntoHeading = createCmdKey("TurnIntoHeading");
 const headingPluginKey = new PluginKey("MILKDOWN_ID");
-const heading = createNode((utils) => {
+const createId = (node) => node.textContent.replace(/[\p{P}\p{S}]/gu, "").replace(/\s/g, "-").toLowerCase().trim();
+const heading = createNode((utils, options) => {
+  var _a;
   const id2 = "heading";
+  const getId = (_a = options == null ? void 0 : options.getId) != null ? _a : createId;
   return {
     id: id2,
     schema: () => ({
@@ -697,7 +748,7 @@ const heading = createNode((utils) => {
         return [
           `h${node.attrs["level"]}`,
           {
-            id: node.attrs["id"] || node.textContent.split(" ").join("-").toLocaleLowerCase(),
+            id: node.attrs["id"] || getId(node),
             class: utils.getClassName(node.attrs, `heading h${node.attrs["level"]}`)
           },
           0
@@ -715,8 +766,21 @@ const heading = createNode((utils) => {
       toMarkdown: {
         match: (node) => node.type.name === id2,
         runner: (state, node) => {
+          var _a2;
           state.openNode("heading", void 0, { depth: node.attrs["level"] });
-          state.next(node.content);
+          const lastIsHardbreak = node.childCount >= 1 && ((_a2 = node.lastChild) == null ? void 0 : _a2.type.name) === "hardbreak";
+          if (lastIsHardbreak) {
+            const contentArr = [];
+            node.content.forEach((n, _, i) => {
+              if (i === node.childCount - 1) {
+                return;
+              }
+              contentArr.push(n);
+            });
+            state.next(Fragment.fromArray(contentArr));
+          } else {
+            state.next(node.content);
+          }
           state.closeNode();
         }
       }
@@ -735,9 +799,6 @@ const heading = createNode((utils) => {
     },
     prosePlugins: (type, ctx) => {
       let lock = false;
-      const createId = (node) => {
-        return node.textContent.replace(/[\p{P}\p{S}]/gu, "").replace(/\s/g, "").trim();
-      };
       const walkThrough = (state, callback) => {
         const tr = state.tr;
         state.doc.descendants((node, pos) => {
@@ -746,7 +807,7 @@ const heading = createNode((utils) => {
               return;
             }
             const attrs = node.attrs;
-            const id22 = createId(node);
+            const id22 = getId(node);
             if (attrs["id"] !== id22) {
               tr.setMeta(headingPluginKey, true).setNodeMarkup(pos, void 0, __spreadProps(__spreadValues({}, attrs), {
                 id: id22
@@ -783,6 +844,21 @@ const heading = createNode((utils) => {
               });
             }
             return tr;
+          },
+          view: (view) => {
+            const doc2 = view.state.doc;
+            let tr = view.state.tr;
+            doc2.descendants((node, pos) => {
+              if (node.type.name === "heading" && node.attrs["level"]) {
+                if (!node.attrs["id"]) {
+                  tr = tr.setNodeMarkup(pos, void 0, __spreadProps(__spreadValues({}, node.attrs), {
+                    id: getId(node)
+                  }));
+                }
+              }
+            });
+            view.dispatch(tr);
+            return {};
           }
         })
       ];
@@ -824,13 +900,14 @@ const hr = createNode((utils) => {
       createCmd(InsertHr, () => (state, dispatch) => {
         if (!dispatch)
           return true;
+        const paragraph2 = ctx.get(schemaCtx).node("paragraph");
         const { tr, selection } = state;
-        const from = selection.from;
+        const { from } = selection;
         const node = type.create();
         if (!node) {
           return true;
         }
-        const _tr = tr.replaceSelectionWith(node).insert(from, ctx.get(schemaCtx).node("paragraph"));
+        const _tr = tr.replaceSelectionWith(node).insert(from, paragraph2);
         const sel = Selection.findFrom(_tr.doc.resolve(from), 1, true);
         if (!sel) {
           return true;
@@ -1150,8 +1227,17 @@ const paragraph = createNode((utils) => {
         runner: (state, node) => {
           var _a;
           state.openNode("paragraph");
-          const onlyHardbreak = node.childCount === 1 && ((_a = node.firstChild) == null ? void 0 : _a.type.name) === "hardbreak";
-          if (!onlyHardbreak) {
+          const lastIsHardbreak = node.childCount >= 1 && ((_a = node.lastChild) == null ? void 0 : _a.type.name) === "hardbreak";
+          if (lastIsHardbreak) {
+            const contentArr = [];
+            node.content.forEach((n, _, i) => {
+              if (i === node.childCount - 1) {
+                return;
+              }
+              contentArr.push(n);
+            });
+            state.next(Fragment.fromArray(contentArr));
+          } else {
             state.next(node.content);
           }
           state.closeNode();
@@ -1257,7 +1343,7 @@ const inlineNodesCursorPlugin = new Plugin({
     handleDOMEvents: {
       beforeinput: (view, e) => {
         const active = inlineNodesCursorPlugin.getState(view.state);
-        if (active) {
+        if (active && e instanceof InputEvent) {
           const from = view.state.selection.from;
           e.preventDefault();
           view.dispatch(view.state.tr.insertText(e.data || "", from));