@jvs-milkdown/crepe 1.2.33 → 1.2.35

package/lib/esm/index.js

@@ -5,7 +5,7 @@ import { languages } from '@codemirror/language-data';
 import { oneDark } from '@codemirror/theme-one-dark';
 import { createSlice } from '@jvs-milkdown/kit/ctx';
 import { $ctx, $nodeSchema, $view, $remark, $markAttr, $markSchema, $command, $prose, $useKeymap, getMarkdown, $inputRule } from '@jvs-milkdown/kit/utils';
-import { defineComponent, shallowRef, ref, computed, h, createApp, watchEffect, watch, onUnmounted, Fragment, reactive, onMounted, onBeforeUnmount, nextTick } from 'vue';
+import { defineComponent, shallowRef, ref, computed, h, createApp, watchEffect, watch, onUnmounted, Fragment as Fragment$1, reactive, onMounted, onBeforeUnmount, nextTick } from 'vue';
 import { Icon } from '@jvs-milkdown/kit/component';
 import { blockConfig, block, BlockProvider } from '@jvs-milkdown/kit/plugin/block';
 import { commandsCtx, editorViewCtx, schemaCtx, editorCtx, EditorStatus, rootCtx, parserCtx, editorViewOptionsCtx, Editor, defaultValueCtx } from '@jvs-milkdown/kit/core';
@@ -3898,7 +3898,7 @@ function getBlockKey(node) {
   }
 }
 
-keepAlive(h, Fragment);
+keepAlive(h, Fragment$1);
 const BlockHandle = defineComponent({
   props: {
     onAdd: {
@@ -3946,7 +3946,7 @@ const BlockHandle = defineComponent({
     const addButton = ref();
     const menuButton = ref();
     return () => {
-      return /* @__PURE__ */ h(Fragment, null, /* @__PURE__ */ h(
+      return /* @__PURE__ */ h(Fragment$1, null, /* @__PURE__ */ h(
         "div",
         {
           ref: addButton,
@@ -5509,7 +5509,7 @@ const activeIconMap = {
   [dividerIcon]: dividerIconActive
   // [highLineCodeIcon]: highLineCodeIconActive,
 };
-keepAlive(h, Fragment);
+keepAlive(h, Fragment$1);
 const formatPainterStates = /* @__PURE__ */ new WeakMap();
 const formatPainterHandlers = /* @__PURE__ */ new WeakMap();
 const formatPainterIgnoreNext = /* @__PURE__ */ new WeakMap();
@@ -5835,8 +5835,7 @@ const Toolbar = defineComponent({
               siblingsWidth += s.offsetWidth;
             }
           }
-          const gapCount = Math.max(0, siblings.length);
-          containerWidth = parent.clientWidth - siblingsWidth - gapCount * 12;
+          containerWidth = parent.clientWidth - siblingsWidth - 12;
         } else {
           containerWidth = container.clientWidth;
         }
@@ -6863,7 +6862,7 @@ const Toolbar = defineComponent({
             if (groupIndex < nonHeadingGroups.length - 1 && group.items.length > 0) {
               sectionIdx++;
             }
-            return /* @__PURE__ */ h(Fragment, { key: group.key }, items, groupIndex < nonHeadingGroups.length - 1 && group.items.length > 0 ? /* @__PURE__ */ h(
+            return /* @__PURE__ */ h(Fragment$1, { key: group.key }, items, groupIndex < nonHeadingGroups.length - 1 && group.items.length > 0 ? /* @__PURE__ */ h(
               "div",
               {
                 class: "divider",
@@ -7068,7 +7067,7 @@ const Toolbar = defineComponent({
             () => setIndent(-1),
             currentAlignIndent.value.indent <= 0
           ),
-          canMerge.value || canSplit.value ? /* @__PURE__ */ h(Fragment, null, /* @__PURE__ */ h(
+          canMerge.value || canSplit.value ? /* @__PURE__ */ h(Fragment$1, null, /* @__PURE__ */ h(
             "div",
             {
               style: {
@@ -8635,241 +8634,214 @@ const FixedToolbarComponent = defineComponent({
       const isFull = computed(() => maxWidth.value === "none");
       if (!viewState.fixedToolbarVisible) {
         return /* @__PURE__ */ h(
-          "div",
+          "button",
           {
+            type: "button",
+            class: "fixed-toolbar-expand-btn",
+            title: "\u5C55\u5F00\u5DE5\u5177\u680F",
+            onClick: (e) => {
+              e.preventDefault();
+              e.stopPropagation();
+              viewState.fixedToolbarVisible = true;
+            },
             style: {
-              position: "relative",
-              width: "100%",
-              height: "100%",
+              position: "absolute",
+              top: "0",
+              right: "40px",
               display: "flex",
               alignItems: "center",
-              justifyContent: "center"
+              justifyContent: "center",
+              width: "28px",
+              height: "24px",
+              border: "1px solid var(--crepe-color-outline-variant, color-mix(in srgb, var(--crepe-color-outline), transparent 85%))",
+              borderTop: "none",
+              background: "var(--crepe-color-surface, #ffffff)",
+              cursor: "pointer",
+              borderRadius: "0 0 6px 6px",
+              boxShadow: "0 4px 8px rgba(0, 0, 0, 0.06)",
+              color: "var(--crepe-color-on-surface, #363b4c)",
+              pointerEvents: "auto",
+              zIndex: 200
             }
           },
+          /* @__PURE__ */ h(
+            "span",
+            {
+              style: { display: "inline-flex", alignItems: "center" },
+              innerHTML: chevronDownIcon
+            }
+          )
+        );
+      }
+      return /* @__PURE__ */ h(Fragment, null, /* @__PURE__ */ h(
+        "div",
+        {
+          style: {
+            position: "relative",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "flex-start",
+            width: "100%",
+            maxWidth: isFull.value ? "100%" : maxWidth.value,
+            margin: isFull.value ? "0" : "0 auto",
+            padding: "0px 10px",
+            gap: "0px",
+            minWidth: "0",
+            overflow: "hidden"
+          }
+        },
+        ((_d = props.config) == null ? void 0 : _d.showMenuBar) !== false && [
+          /* @__PURE__ */ h(MenuBar, { ctx: props.ctx, config: props.config }),
+          /* @__PURE__ */ h(
+            "div",
+            {
+              style: {
+                width: "1px",
+                minWidth: "1px",
+                height: "20px",
+                backgroundColor: "var(--crepe-color-outline-variant, color-mix(in srgb, var(--crepe-color-outline), transparent 80%))"
+              }
+            }
+          )
+        ],
+        ((_e = props.config) == null ? void 0 : _e.showHistory) !== false && [
           /* @__PURE__ */ h(
             "button",
             {
               type: "button",
-              class: "fixed-toolbar-expand-btn",
-              title: "\u5C55\u5F00\u5DE5\u5177\u680F",
+              class: ["toolbar-item", !canUndo && "disabled"],
+              disabled: !canUndo,
+              title: "\u64A4\u9500",
+              onPointerdown: (e) => {
+                e.preventDefault();
+                e.stopPropagation();
+              },
               onClick: (e) => {
                 e.preventDefault();
                 e.stopPropagation();
-                viewState.fixedToolbarVisible = true;
+                if (canUndo) {
+                  props.ctx.get(commandsCtx).call("Undo");
+                }
               },
               style: {
-                position: "absolute",
-                top: "0",
-                right: "40px",
                 display: "flex",
                 alignItems: "center",
                 justifyContent: "center",
-                width: "28px",
-                height: "24px",
-                border: "1px solid var(--crepe-color-outline-variant, color-mix(in srgb, var(--crepe-color-outline), transparent 85%))",
-                borderTop: "none",
-                background: "var(--crepe-color-surface, #ffffff)",
-                cursor: "pointer",
-                borderRadius: "0 0 6px 6px",
-                boxShadow: "0 4px 8px rgba(0, 0, 0, 0.06)",
-                color: "var(--crepe-color-on-surface, #363b4c)",
-                pointerEvents: "auto",
-                zIndex: 200
+                border: "none",
+                background: "transparent",
+                cursor: canUndo ? "pointer" : "default",
+                padding: "6px",
+                borderRadius: "4px",
+                color: canUndo ? "#363b4c" : "#c0c4cc",
+                "--toolbar-icon-color": canUndo ? "#363b4c" : "#c0c4cc"
               }
             },
             /* @__PURE__ */ h(
               "span",
               {
                 style: { display: "inline-flex", alignItems: "center" },
-                innerHTML: chevronDownIcon
-              }
-            )
-          )
-        );
-      }
-      return /* @__PURE__ */ h(
-        "div",
-        {
-          style: {
-            position: "relative",
-            width: "100%",
-            height: "100%",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center"
-          }
-        },
-        /* @__PURE__ */ h(
-          "div",
-          {
-            style: {
-              position: "relative",
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "flex-start",
-              width: "100%",
-              maxWidth: isFull.value ? "100%" : maxWidth.value,
-              margin: isFull.value ? "0" : "0 auto",
-              // paddingRight: '40px',
-              gap: "0px",
-              minWidth: "0",
-              overflow: "hidden"
-            }
-          },
-          ((_d = props.config) == null ? void 0 : _d.showMenuBar) !== false && [
-            /* @__PURE__ */ h(MenuBar, { ctx: props.ctx, config: props.config }),
-            /* @__PURE__ */ h(
-              "div",
-              {
-                style: {
-                  width: "1px",
-                  minWidth: "1px",
-                  height: "20px",
-                  backgroundColor: "var(--crepe-color-outline-variant, color-mix(in srgb, var(--crepe-color-outline), transparent 80%))"
-                }
+                innerHTML: undoIcon
               }
             )
-          ],
-          ((_e = props.config) == null ? void 0 : _e.showHistory) !== false && [
-            /* @__PURE__ */ h(
-              "button",
-              {
-                type: "button",
-                class: ["toolbar-item", !canUndo && "disabled"],
-                disabled: !canUndo,
-                title: "\u64A4\u9500",
-                onPointerdown: (e) => {
-                  e.preventDefault();
-                  e.stopPropagation();
-                },
-                onClick: (e) => {
-                  e.preventDefault();
-                  e.stopPropagation();
-                  if (canUndo) {
-                    props.ctx.get(commandsCtx).call("Undo");
-                  }
-                },
-                style: {
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  border: "none",
-                  background: "transparent",
-                  cursor: canUndo ? "pointer" : "default",
-                  padding: "6px",
-                  borderRadius: "4px",
-                  color: canUndo ? "#363b4c" : "#c0c4cc",
-                  "--toolbar-icon-color": canUndo ? "#363b4c" : "#c0c4cc"
-                }
+          ),
+          /* @__PURE__ */ h(
+            "button",
+            {
+              type: "button",
+              class: ["toolbar-item", !canRedo && "disabled"],
+              disabled: !canRedo,
+              title: "\u6062\u590D",
+              onPointerdown: (e) => {
+                e.preventDefault();
+                e.stopPropagation();
               },
-              /* @__PURE__ */ h(
-                "span",
-                {
-                  style: { display: "inline-flex", alignItems: "center" },
-                  innerHTML: undoIcon
-                }
-              )
-            ),
-            /* @__PURE__ */ h(
-              "button",
-              {
-                type: "button",
-                class: ["toolbar-item", !canRedo && "disabled"],
-                disabled: !canRedo,
-                title: "\u6062\u590D",
-                onPointerdown: (e) => {
-                  e.preventDefault();
-                  e.stopPropagation();
-                },
-                onClick: (e) => {
-                  e.preventDefault();
-                  e.stopPropagation();
-                  if (canRedo) {
-                    props.ctx.get(commandsCtx).call("Redo");
-                  }
-                },
-                style: {
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  border: "none",
-                  background: "transparent",
-                  cursor: canRedo ? "pointer" : "default",
-                  padding: "6px",
-                  borderRadius: "4px",
-                  color: canRedo ? "#363b4c" : "#c0c4cc",
-                  "--toolbar-icon-color": canRedo ? "#363b4c" : "#c0c4cc"
+              onClick: (e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                if (canRedo) {
+                  props.ctx.get(commandsCtx).call("Redo");
                 }
               },
-              /* @__PURE__ */ h(
-                "span",
-                {
-                  style: { display: "inline-flex", alignItems: "center" },
-                  innerHTML: redoIcon
-                }
-              )
-            ),
+              style: {
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                border: "none",
+                background: "transparent",
+                cursor: canRedo ? "pointer" : "default",
+                padding: "6px",
+                borderRadius: "4px",
+                color: canRedo ? "#363b4c" : "#c0c4cc",
+                "--toolbar-icon-color": canRedo ? "#363b4c" : "#c0c4cc"
+              }
+            },
             /* @__PURE__ */ h(
-              "div",
+              "span",
               {
-                style: {
-                  width: "1px",
-                  minWidth: "1px",
-                  height: "20px",
-                  backgroundColor: "var(--crepe-color-outline-variant, color-mix(in srgb, var(--crepe-color-outline), transparent 80%))"
-                }
+                style: { display: "inline-flex", alignItems: "center" },
+                innerHTML: redoIcon
               }
             )
-          ],
+          ),
           /* @__PURE__ */ h(
-            Toolbar,
+            "div",
             {
-              ctx: props.ctx,
-              hide: props.hide,
-              show: props.show,
-              state: props.state,
-              config: props.config,
-              isFixed: true
+              style: {
+                width: "1px",
+                minWidth: "1px",
+                height: "20px",
+                backgroundColor: "var(--crepe-color-outline-variant, color-mix(in srgb, var(--crepe-color-outline), transparent 80%))"
+              }
             }
-          ),
-          showShortcuts.value && /* @__PURE__ */ h(ShortcutHelpModal, { ctx: props.ctx, visible: showShortcuts })
+          )
+        ],
+        /* @__PURE__ */ h(
+          Toolbar,
+          {
+            ctx: props.ctx,
+            hide: props.hide,
+            show: props.show,
+            state: props.state,
+            config: props.config,
+            isFixed: true
+          }
         ),
+        showShortcuts.value && /* @__PURE__ */ h(ShortcutHelpModal, { ctx: props.ctx, visible: showShortcuts })
+      ), /* @__PURE__ */ h(
+        "button",
+        {
+          type: "button",
+          class: "toolbar-item collapse-btn",
+          title: "\u6298\u53E0\u5DE5\u5177\u680F",
+          onClick: (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            viewState.fixedToolbarVisible = false;
+          },
+          style: {
+            position: "absolute",
+            top: "6px",
+            right: "40px",
+            margin: "0",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            pointerEvents: "auto",
+            zIndex: 200
+          }
+        },
         /* @__PURE__ */ h(
-          "button",
+          "span",
           {
-            type: "button",
-            class: "toolbar-item collapse-btn",
-            title: "\u6298\u53E0\u5DE5\u5177\u680F",
-            onClick: (e) => {
-              e.preventDefault();
-              e.stopPropagation();
-              viewState.fixedToolbarVisible = false;
-            },
             style: {
-              position: "absolute",
-              top: "6px",
-              right: "40px",
-              margin: "0",
-              display: "flex",
+              display: "inline-flex",
               alignItems: "center",
-              justifyContent: "center",
-              pointerEvents: "auto",
-              zIndex: 200
-            }
-          },
-          /* @__PURE__ */ h(
-            "span",
-            {
-              style: {
-                display: "inline-flex",
-                alignItems: "center",
-                transform: "rotate(180deg)"
-              },
-              innerHTML: chevronDownIcon
-            }
-          )
+              transform: "rotate(180deg)"
+            },
+            innerHTML: chevronDownIcon
+          }
         )
-      );
+      ));
     };
   }
 });