@halo-dev/richtext-editor 0.0.0-alpha.18-1 → 0.0.0-alpha.18

package/dist/rich-text-editor.es.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, onMounted, onBeforeUnmount, h, reactive, markRaw, getCurrentInstance, watchEffect, nextTick, unref, Teleport, shallowRef, customRef, provide, pushScopeId, popScopeId, openBlock, createBlock, createElementBlock, normalizeClass, renderSlot, normalizeProps, guardReactiveProps, withScopeId, resolveComponent, normalizeStyle, withKeys, createElementVNode, Fragment as Fragment$1, createCommentVNode, withCtx, createVNode, createApp, mergeProps, toDisplayString, renderList, withDirectives, resolveDynamicComponent, watch, computed, isRef, vModelSelect, vModelText } from "vue";
+import { defineComponent, ref, onMounted, onBeforeUnmount, h, reactive, markRaw, getCurrentInstance, watchEffect, nextTick, unref, Teleport, shallowRef, customRef, provide, pushScopeId, popScopeId, openBlock, createBlock, createElementBlock, normalizeClass, renderSlot, normalizeProps, guardReactiveProps, withScopeId, resolveComponent, normalizeStyle, withKeys, createElementVNode, Fragment as Fragment$1, createCommentVNode, withCtx, createVNode, createApp, mergeProps, toDisplayString, renderList, withDirectives, resolveDynamicComponent, computed, isRef, vModelText, vModelCheckbox, watch, vModelSelect } from "vue";
 function OrderedMap(content) {
   this.content = content;
 }
@@ -15026,7 +15026,7 @@ function getChildren(popper2) {
     })
   };
 }
-function render$Q(instance) {
+function render$_(instance) {
   var popper2 = div();
   var box = div();
   box.className = BOX_CLASS;
@@ -15081,7 +15081,7 @@ function render$Q(instance) {
     onUpdate
   };
 }
-render$Q.$$tippy = true;
+render$_.$$tippy = true;
 var idCounter = 1;
 var mouseMoveListeners = [];
 var mountedInstances = [];
@@ -15854,7 +15854,7 @@ Object.assign({}, applyStyles$1, {
   }
 });
 tippy.setDefaultProps({
-  render: render$Q
+  render: render$_
 });
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 function isObject$2(value) {
@@ -19073,10 +19073,10 @@ const _hoisted_1$2$1 = {
   tabindex: "-1"
 };
 popScopeId();
-const render$P = /* @__PURE__ */ _withId((_ctx, _cache, $props, $setup, $data, $options) => {
+const render$Z = /* @__PURE__ */ _withId((_ctx, _cache, $props, $setup, $data, $options) => {
   return openBlock(), createBlock("div", _hoisted_1$2$1);
 });
-script.render = render$P;
+script.render = render$Z;
 script.__scopeId = "data-v-b329ee4c";
 script.__file = "src/components/ResizeObserver.vue";
 var PrivateThemeClass = (prop = "theme") => ({
@@ -19123,11 +19123,11 @@ const _hoisted_2$1$1 = {
   ref: "inner",
   class: "v-popper__inner"
 };
-const _hoisted_3$T = /* @__PURE__ */ createElementVNode("div", { class: "v-popper__arrow-outer" }, null, -1);
-const _hoisted_4$2 = /* @__PURE__ */ createElementVNode("div", { class: "v-popper__arrow-inner" }, null, -1);
+const _hoisted_3$14 = /* @__PURE__ */ createElementVNode("div", { class: "v-popper__arrow-outer" }, null, -1);
+const _hoisted_4$3 = /* @__PURE__ */ createElementVNode("div", { class: "v-popper__arrow-inner" }, null, -1);
 const _hoisted_5$2 = [
-  _hoisted_3$T,
-  _hoisted_4$2
+  _hoisted_3$14,
+  _hoisted_4$3
 ];
 function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_ResizeObserver = resolveComponent("ResizeObserver");
@@ -19304,7 +19304,7 @@ defineComponent(__spreadProps(__spreadValues({}, PrivatePopperWrapper), {
   name: "VTooltip",
   vPopperTheme: "tooltip"
 }));
-const _sfc_main$b = defineComponent({
+const _sfc_main$e = defineComponent({
   name: "VTooltipDirective",
   components: {
     Popper: PrivatePopper(),
@@ -19395,8 +19395,8 @@ const _sfc_main$b = defineComponent({
     }
   }
 });
-const _hoisted_1$Y = ["innerHTML"];
-const _hoisted_2$W = ["textContent"];
+const _hoisted_1$19 = ["innerHTML"];
+const _hoisted_2$17 = ["textContent"];
 function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_PopperContent = resolveComponent("PopperContent");
   const _component_Popper = resolveComponent("Popper");
@@ -19439,10 +19439,10 @@ function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
           _ctx.html ? (openBlock(), createElementBlock("div", {
             key: 0,
             innerHTML: _ctx.finalContent
-          }, null, 8, _hoisted_1$Y)) : (openBlock(), createElementBlock("div", {
+          }, null, 8, _hoisted_1$19)) : (openBlock(), createElementBlock("div", {
             key: 1,
             textContent: toDisplayString(_ctx.finalContent)
-          }, null, 8, _hoisted_2$W))
+          }, null, 8, _hoisted_2$17))
         ]),
         _: 2
       }, 1032, ["class", "popper-id", "theme", "shown", "mounted", "skip-transition", "auto-hide", "handle-resize", "classes", "result", "onHide", "onResize"])
@@ -19450,7 +19450,7 @@ function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 16, ["theme", "popper-node", "onApplyShow", "onApplyHide"]);
 }
-var PrivateTooltipDirective = /* @__PURE__ */ _export_sfc$1(_sfc_main$b, [["render", _sfc_render$4]]);
+var PrivateTooltipDirective = /* @__PURE__ */ _export_sfc$1(_sfc_main$e, [["render", _sfc_render$4]]);
 const TARGET_CLASS = "v-popper--has-tooltip";
 function getPlacement(options2, modifiers2) {
   let result = options2.placement;
@@ -19577,22 +19577,22 @@ var PrivateVTooltip = {
 const VTooltip = PrivateVTooltip;
 const Dropdown = _sfc_main$3$1;
 const Menu = _sfc_main$2$1;
-const _hoisted_1$X = { class: "editor-header flex items-center py-1 space-x-0.5 justify-center border-b drop-shadow-sm bg-white" };
-const _hoisted_2$V = {
+const _hoisted_1$18 = { class: "editor-header flex items-center py-1 space-x-0.5 justify-center border-b drop-shadow-sm bg-white" };
+const _hoisted_2$16 = {
   key: 0,
   class: "px-1"
 };
-const _hoisted_3$S = /* @__PURE__ */ createElementVNode("div", {
+const _hoisted_3$13 = /* @__PURE__ */ createElementVNode("div", {
   class: "h-5 bg-gray-100",
   style: { "width": "1px" }
 }, null, -1);
-const _hoisted_4$1 = [
-  _hoisted_3$S
+const _hoisted_4$2 = [
+  _hoisted_3$13
 ];
 const _hoisted_5$1 = ["onClick"];
 const _hoisted_6$1 = { class: "relative rounded-md bg-white overflow-hidden drop-shadow w-48 p-1 max-h-72 overflow-y-auto" };
 const _hoisted_7 = ["onClick"];
-const _sfc_main$a = /* @__PURE__ */ defineComponent({
+const _sfc_main$d = /* @__PURE__ */ defineComponent({
   __name: "EditorHeader",
   props: {
     menuItems: {
@@ -19603,14 +19603,14 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$X, [
+      return openBlock(), createElementBlock("div", _hoisted_1$18, [
         (openBlock(true), createElementBlock(Fragment$1, null, renderList(__props.menuItems, (menuItem, index2) => {
           var _a, _b;
           return openBlock(), createElementBlock("div", {
             key: index2,
             class: "inline-flex items-center justify-center"
           }, [
-            menuItem.type === "separator" ? (openBlock(), createElementBlock("div", _hoisted_2$V, _hoisted_4$1)) : (openBlock(), createElementBlock(Fragment$1, { key: 1 }, [
+            menuItem.type === "separator" ? (openBlock(), createElementBlock("div", _hoisted_2$16, _hoisted_4$2)) : (openBlock(), createElementBlock(Fragment$1, { key: 1 }, [
               !((_a = menuItem.children) == null ? void 0 : _a.length) ? withDirectives((openBlock(), createElementBlock("button", {
                 key: 0,
                 class: normalizeClass([{ "bg-gray-200": (_b = menuItem.isActive) == null ? void 0 : _b.call(menuItem) }, "hover:bg-gray-100 p-1 rounded-sm"]),
@@ -19662,9 +19662,172 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
   }
 });
 const svgArrow = "";
-const _hoisted_1$W = { class: "bg-white flex items-center rounded p-1 border drop-shadow space-x-0.5" };
-const _hoisted_2$U = ["title", "onClick"];
-const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+const _hoisted_1$17 = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$15 = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M10.59 13.41c.41.39.41 1.03 0 1.42c-.39.39-1.03.39-1.42 0a5.003 5.003 0 0 1 0-7.07l3.54-3.54a5.003 5.003 0 0 1 7.07 0a5.003 5.003 0 0 1 0 7.07l-1.49 1.49c.01-.82-.12-1.64-.4-2.42l.47-.48a2.982 2.982 0 0 0 0-4.24a2.982 2.982 0 0 0-4.24 0l-3.53 3.53a2.982 2.982 0 0 0 0 4.24m2.82-4.24c.39-.39 1.03-.39 1.42 0a5.003 5.003 0 0 1 0 7.07l-3.54 3.54a5.003 5.003 0 0 1-7.07 0a5.003 5.003 0 0 1 0-7.07l1.49-1.49c-.01.82.12 1.64.4 2.43l-.47.47a2.982 2.982 0 0 0 0 4.24a2.982 2.982 0 0 0 4.24 0l3.53-3.53a2.982 2.982 0 0 0 0-4.24a.973.973 0 0 1 0-1.42Z"
+}, null, -1);
+const _hoisted_3$12 = [
+  _hoisted_2$15
+];
+function render$Y(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$17, _hoisted_3$12);
+}
+const MdiLinkVariant = { name: "mdi-link-variant", render: render$Y };
+const _hoisted_1$16 = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$14 = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M2 5.27L3.28 4L20 20.72L18.73 22l-4.83-4.83l-2.61 2.61a5.003 5.003 0 0 1-7.07 0a5.003 5.003 0 0 1 0-7.07l1.49-1.49c-.01.82.12 1.64.4 2.43l-.47.47a2.982 2.982 0 0 0 0 4.24a2.982 2.982 0 0 0 4.24 0l2.62-2.6l-1.62-1.61c-.01.24-.11.49-.29.68c-.39.39-1.03.39-1.42 0A4.973 4.973 0 0 1 7.72 11L2 5.27m10.71-1.05a5.003 5.003 0 0 1 7.07 0a5.003 5.003 0 0 1 0 7.07l-1.49 1.49c.01-.82-.12-1.64-.4-2.42l.47-.48a2.982 2.982 0 0 0 0-4.24a2.982 2.982 0 0 0-4.24 0l-3.33 3.33l-1.41-1.42l3.33-3.33m.7 4.95c.39-.39 1.03-.39 1.42 0a4.999 4.999 0 0 1 1.23 5.06l-1.78-1.77c-.05-.68-.34-1.35-.87-1.87a.973.973 0 0 1 0-1.42Z"
+}, null, -1);
+const _hoisted_3$11 = [
+  _hoisted_2$14
+];
+function render$X(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$16, _hoisted_3$11);
+}
+const MdiLinkVariantOff = { name: "mdi-link-variant-off", render: render$X };
+const _hoisted_1$15 = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$13 = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "m21 12l-7-7v4C7 10 4 15 3 20c2.5-3.5 6-5.1 11-5.1V19l7-7Z"
+}, null, -1);
+const _hoisted_3$10 = [
+  _hoisted_2$13
+];
+function render$W(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$15, _hoisted_3$10);
+}
+const MdiShare = { name: "mdi-share", render: render$W };
+const _hoisted_1$14 = { class: "relative rounded-md bg-white overflow-hidden drop-shadow w-96 p-1 max-h-72 overflow-y-auto" };
+const _hoisted_2$12 = { class: "inline-flex items-center mt-2" };
+const _hoisted_3$$ = /* @__PURE__ */ createElementVNode("span", { class: "ml-2 text-sm text-gray-500" }, "\u5728\u65B0\u7A97\u53E3\u6253\u5F00", -1);
+const _hoisted_4$1 = ["href"];
+const _sfc_main$c = /* @__PURE__ */ defineComponent({
+  __name: "EditorLinkBubbleMenuItems",
+  props: {
+    editor: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const href = computed({
+      get() {
+        const attrs = props.editor.getAttributes("link");
+        return attrs == null ? void 0 : attrs.href;
+      },
+      set(value) {
+        props.editor.commands.setLink({
+          href: value,
+          target: target.value ? "_blank" : "_self"
+        });
+      }
+    });
+    const target = computed({
+      get() {
+        const attrs = props.editor.getAttributes("link");
+        return (attrs == null ? void 0 : attrs.target) === "_blank";
+      },
+      set(value) {
+        props.editor.commands.setLink({
+          href: href.value,
+          target: value ? "_blank" : "_self"
+        });
+      }
+    });
+    function handleUnSetLink() {
+      props.editor.commands.unsetLink();
+    }
+    return (_ctx, _cache) => {
+      var _a;
+      return openBlock(), createElementBlock(Fragment$1, null, [
+        createVNode(unref(Dropdown), {
+          class: "inline-flex",
+          triggers: ["click"],
+          distance: 10
+        }, {
+          popper: withCtx(() => [
+            createElementVNode("div", _hoisted_1$14, [
+              withDirectives(createElementVNode("input", {
+                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(href) ? href.value = $event : null),
+                placeholder: "\u94FE\u63A5\u5730\u5740",
+                class: "bg-gray-50 rounded-md hover:bg-gray-100 block px-2 w-full py-1.5 text-sm text-gray-900 border border-gray-300 focus:ring-blue-500 focus:border-blue-500"
+              }, null, 512), [
+                [
+                  vModelText,
+                  unref(href),
+                  void 0,
+                  { lazy: true }
+                ]
+              ]),
+              createElementVNode("label", _hoisted_2$12, [
+                withDirectives(createElementVNode("input", {
+                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(target) ? target.value = $event : null),
+                  type: "checkbox",
+                  class: "form-checkbox text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
+                }, null, 512), [
+                  [vModelCheckbox, unref(target)]
+                ]),
+                _hoisted_3$$
+              ])
+            ])
+          ]),
+          default: withCtx(() => [
+            withDirectives((openBlock(), createElementBlock("button", {
+              class: normalizeClass(["text-gray-600 text-lg hover:bg-gray-100 p-0.5 rounded-sm", { "bg-gray-200 !text-black": __props.editor.isActive("link") }])
+            }, [
+              createVNode(unref(MdiLinkVariant))
+            ], 2)), [
+              [unref(VTooltip), `${__props.editor.isActive("link") ? "\u4FEE\u6539" : "\u6DFB\u52A0"}\u94FE\u63A5`]
+            ])
+          ]),
+          _: 1
+        }),
+        __props.editor.isActive("link") ? withDirectives((openBlock(), createElementBlock("button", {
+          key: 0,
+          class: "text-gray-600 text-lg hover:bg-gray-100 p-0.5 rounded-sm",
+          onClick: handleUnSetLink
+        }, [
+          createVNode(unref(MdiLinkVariantOff))
+        ])), [
+          [unref(VTooltip), `\u53D6\u6D88\u94FE\u63A5`]
+        ]) : createCommentVNode("", true),
+        __props.editor.isActive("link") ? withDirectives((openBlock(), createElementBlock("a", {
+          key: 1,
+          class: "text-gray-600 text-lg hover:bg-gray-100 p-0.5 rounded-sm",
+          href: (_a = __props.editor.getAttributes("link")) == null ? void 0 : _a.href,
+          target: "_blank"
+        }, [
+          createVNode(unref(MdiShare))
+        ], 8, _hoisted_4$1)), [
+          [unref(VTooltip), `\u6253\u5F00\u94FE\u63A5`]
+        ]) : createCommentVNode("", true)
+      ], 64);
+    };
+  }
+});
+const _hoisted_1$13 = { class: "bg-white flex items-center rounded p-1 border drop-shadow space-x-0.5" };
+const _hoisted_2$11 = ["title", "onClick"];
+const _hoisted_3$_ = /* @__PURE__ */ createElementVNode("div", { class: "px-1" }, [
+  /* @__PURE__ */ createElementVNode("div", {
+    class: "h-5 bg-gray-100",
+    style: { "width": "1px" }
+  })
+], -1);
+const _sfc_main$b = /* @__PURE__ */ defineComponent({
   __name: "EditorBubbleMenu",
   props: {
     editor: {
@@ -19684,10 +19847,10 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
         "tippy-options": { duration: 100, arrow: unref(ROUND_ARROW), maxWidth: "100%" }
       }, {
         default: withCtx(() => [
-          createElementVNode("div", _hoisted_1$W, [
+          createElementVNode("div", _hoisted_1$13, [
             (openBlock(true), createElementBlock(Fragment$1, null, renderList(__props.menuItems, (menuItem, index2) => {
               var _a;
-              return openBlock(), createElementBlock("button", {
+              return withDirectives((openBlock(), createElementBlock("button", {
                 key: index2,
                 class: normalizeClass([{ "bg-gray-200 !text-black": (_a = menuItem.isActive) == null ? void 0 : _a.call(menuItem) }, "text-gray-600 text-lg hover:bg-gray-100 p-0.5 rounded-sm"]),
                 title: menuItem.title,
@@ -19696,11 +19859,13 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
                   return (_a2 = menuItem.action) == null ? void 0 : _a2.call(menuItem);
                 }
               }, [
-                withDirectives((openBlock(), createBlock(resolveDynamicComponent(menuItem.icon), null, null, 512)), [
-                  [unref(VTooltip), menuItem.title]
-                ])
-              ], 10, _hoisted_2$U);
-            }), 128))
+                (openBlock(), createBlock(resolveDynamicComponent(menuItem.icon)))
+              ], 10, _hoisted_2$11)), [
+                [unref(VTooltip), menuItem.title]
+              ]);
+            }), 128)),
+            _hoisted_3$_,
+            createVNode(_sfc_main$c, { editor: __props.editor }, null, 8, ["editor"])
           ])
         ]),
         _: 1
@@ -19708,13 +19873,13 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$V = {
+const _hoisted_1$12 = {
   key: 0,
   class: "halo-rich-text-editor"
 };
-const _hoisted_2$T = { class: "h-full flex flex-row w-full" };
-const _hoisted_3$R = { class: "h-full" };
-const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+const _hoisted_2$10 = { class: "h-full flex flex-row w-full" };
+const _hoisted_3$Z = { class: "h-full" };
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
   __name: "Editor",
   props: {
     editor: {
@@ -19744,19 +19909,19 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return __props.editor ? (openBlock(), createElementBlock("div", _hoisted_1$V, [
-        createVNode(_sfc_main$9, {
+      return __props.editor ? (openBlock(), createElementBlock("div", _hoisted_1$12, [
+        createVNode(_sfc_main$b, {
           editor: __props.editor,
           "menu-items": __props.bubbleMenuItems
         }, null, 8, ["editor", "menu-items"]),
-        createVNode(_sfc_main$a, { "menu-items": __props.toolbarMenuItems }, null, 8, ["menu-items"]),
-        createElementVNode("div", _hoisted_2$T, [
+        createVNode(_sfc_main$d, { "menu-items": __props.toolbarMenuItems }, null, 8, ["menu-items"]),
+        createElementVNode("div", _hoisted_2$10, [
           createVNode(unref(EditorContent), {
             editor: __props.editor,
             style: normalizeStyle(__props.contentStyles),
             class: "editor-content prose prose-base !max-w-none prose-pre:p-0 bg-white prose-p:mt-3 prose-p:mb-3 prose-img:mt-0 prose-img:mb-0"
           }, null, 8, ["editor", "style"]),
-          createElementVNode("div", _hoisted_3$R, [
+          createElementVNode("div", _hoisted_3$Z, [
             renderSlot(_ctx.$slots, "extra")
           ])
         ])
@@ -23016,9 +23181,9 @@ const ExtensionCommands = Extension.create({
     ];
   }
 });
-const _hoisted_1$U = { class: "command-items" };
-const _hoisted_2$S = ["id", "onClick"];
-const _hoisted_3$Q = { class: "command-title group-hover:text-gray-900 group-hover:font-medium" };
+const _hoisted_1$11 = { class: "command-items" };
+const _hoisted_2$$ = ["id", "onClick"];
+const _hoisted_3$Y = { class: "command-title group-hover:text-gray-900 group-hover:font-medium" };
 const _hoisted_4 = {
   key: 1,
   class: "command-empty"
@@ -23027,7 +23192,7 @@ const _hoisted_5 = /* @__PURE__ */ createElementVNode("span", null, "\u6CA1\u670
 const _hoisted_6 = [
   _hoisted_5
 ];
-const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
   __name: "CommandsView",
   props: {
     items: {
@@ -23094,7 +23259,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       onKeyDown
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$U, [
+      return openBlock(), createElementBlock("div", _hoisted_1$11, [
         __props.items.length ? (openBlock(true), createElementBlock(Fragment$1, { key: 0 }, renderList(__props.items, (item, index2) => {
           return openBlock(), createElementBlock("div", {
             id: `command-item-${index2}`,
@@ -23103,222 +23268,254 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
             onClick: ($event) => handleSelectItem(index2)
           }, [
             (openBlock(), createBlock(resolveDynamicComponent(item.icon), { class: "command-icon group-hover:!bg-white" })),
-            createElementVNode("span", _hoisted_3$Q, toDisplayString(item.title), 1)
-          ], 10, _hoisted_2$S);
+            createElementVNode("span", _hoisted_3$Y, toDisplayString(item.title), 1)
+          ], 10, _hoisted_2$$);
         }), 128)) : (openBlock(), createElementBlock("div", _hoisted_4, _hoisted_6))
       ]);
     };
   }
 });
 const CommandsView_vue_vue_type_style_index_0_lang = "";
-const _hoisted_1$T = {
+const _hoisted_1$10 = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$R = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$_ = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M13 4a4 4 0 0 1 4 4a4 4 0 0 1-4 4h-2v6H9V4h4m0 6a2 2 0 0 0 2-2a2 2 0 0 0-2-2h-2v4h2Z"
 }, null, -1);
-const _hoisted_3$P = [
-  _hoisted_2$R
+const _hoisted_3$X = [
+  _hoisted_2$_
 ];
-function render$O(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$T, _hoisted_3$P);
+function render$V(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$10, _hoisted_3$X);
 }
-const MdiFormatParagraph = { name: "mdi-format-paragraph", render: render$O };
-const _hoisted_1$S = {
+const MdiFormatParagraph = { name: "mdi-format-paragraph", render: render$V };
+const _hoisted_1$$ = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$Q = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$Z = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M3 4h2v6h4V4h2v14H9v-6H5v6H3V4m11 14v-2h2V6.31l-2.5 1.44V5.44L16 4h2v12h2v2h-6Z"
 }, null, -1);
-const _hoisted_3$O = [
-  _hoisted_2$Q
+const _hoisted_3$W = [
+  _hoisted_2$Z
 ];
-function render$N(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$S, _hoisted_3$O);
+function render$U(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$$, _hoisted_3$W);
 }
-const MdiFormatHeader1 = { name: "mdi-format-header-1", render: render$N };
-const _hoisted_1$R = {
+const MdiFormatHeader1 = { name: "mdi-format-header-1", render: render$U };
+const _hoisted_1$_ = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$P = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$Y = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M3 4h2v6h4V4h2v14H9v-6H5v6H3V4m18 14h-6a2 2 0 0 1-2-2c0-.53.2-1 .54-1.36l4.87-5.23c.37-.36.59-.86.59-1.41a2 2 0 0 0-2-2a2 2 0 0 0-2 2h-2a4 4 0 0 1 4-4a4 4 0 0 1 4 4c0 1.1-.45 2.1-1.17 2.83L15 16h6v2Z"
 }, null, -1);
-const _hoisted_3$N = [
-  _hoisted_2$P
+const _hoisted_3$V = [
+  _hoisted_2$Y
 ];
-function render$M(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$R, _hoisted_3$N);
+function render$T(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$_, _hoisted_3$V);
 }
-const MdiFormatHeader2 = { name: "mdi-format-header-2", render: render$M };
-const _hoisted_1$Q = {
+const MdiFormatHeader2 = { name: "mdi-format-header-2", render: render$T };
+const _hoisted_1$Z = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$O = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$X = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M3 4h2v6h4V4h2v14H9v-6H5v6H3V4m12 0h4a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2v-1h2v1h4v-4h-4v-2h4V6h-4v1h-2V6a2 2 0 0 1 2-2Z"
 }, null, -1);
-const _hoisted_3$M = [
-  _hoisted_2$O
+const _hoisted_3$U = [
+  _hoisted_2$X
 ];
-function render$L(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$Q, _hoisted_3$M);
+function render$S(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$Z, _hoisted_3$U);
 }
-const MdiFormatHeader3 = { name: "mdi-format-header-3", render: render$L };
-const _hoisted_1$P = {
+const MdiFormatHeader3 = { name: "mdi-format-header-3", render: render$S };
+const _hoisted_1$Y = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$N = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$W = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M3 4h2v6h4V4h2v14H9v-6H5v6H3V4m15 14v-5h-5v-2l5-7h2v7h1v2h-1v5h-2m0-7V7.42L15.45 11H18Z"
 }, null, -1);
-const _hoisted_3$L = [
-  _hoisted_2$N
+const _hoisted_3$T = [
+  _hoisted_2$W
 ];
-function render$K(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$P, _hoisted_3$L);
+function render$R(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$Y, _hoisted_3$T);
 }
-const MdiFormatHeader4 = { name: "mdi-format-header-4", render: render$K };
-const _hoisted_1$O = {
+const MdiFormatHeader4 = { name: "mdi-format-header-4", render: render$R };
+const _hoisted_1$X = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$M = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$V = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M3 4h2v6h4V4h2v14H9v-6H5v6H3V4m12 0h5v2h-5v4h2a4 4 0 0 1 4 4a4 4 0 0 1-4 4h-2a2 2 0 0 1-2-2v-1h2v1h2a2 2 0 0 0 2-2a2 2 0 0 0-2-2h-2a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Z"
 }, null, -1);
-const _hoisted_3$K = [
-  _hoisted_2$M
+const _hoisted_3$S = [
+  _hoisted_2$V
 ];
-function render$J(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$O, _hoisted_3$K);
+function render$Q(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$X, _hoisted_3$S);
 }
-const MdiFormatHeader5 = { name: "mdi-format-header-5", render: render$J };
-const _hoisted_1$N = {
+const MdiFormatHeader5 = { name: "mdi-format-header-5", render: render$Q };
+const _hoisted_1$W = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$L = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$U = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M3 4h2v6h4V4h2v14H9v-6H5v6H3V4m12 0h4a2 2 0 0 1 2 2v1h-2V6h-4v4h4a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2m0 8v4h4v-4h-4Z"
 }, null, -1);
-const _hoisted_3$J = [
-  _hoisted_2$L
+const _hoisted_3$R = [
+  _hoisted_2$U
 ];
-function render$I(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$N, _hoisted_3$J);
+function render$P(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$W, _hoisted_3$R);
 }
-const MdiFormatHeader6 = { name: "mdi-format-header-6", render: render$I };
-const _hoisted_1$M = {
+const MdiFormatHeader6 = { name: "mdi-format-header-6", render: render$P };
+const _hoisted_1$V = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$K = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$T = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2m-8 5H9v2c0 1.1-.9 2-2 2c1.1 0 2 .9 2 2v2h2v2H9c-1.1 0-2-.9-2-2v-1c0-1.1-.9-2-2-2v-2c1.1 0 2-.9 2-2V8c0-1.1.9-2 2-2h2v2m8 5c-1.1 0-2 .9-2 2v1c0 1.1-.9 2-2 2h-2v-2h2v-2c0-1.1.9-2 2-2c-1.1 0-2-.9-2-2V8h-2V6h2c1.1 0 2 .9 2 2v1c0 1.1.9 2 2 2v2Z"
 }, null, -1);
-const _hoisted_3$I = [
-  _hoisted_2$K
+const _hoisted_3$Q = [
+  _hoisted_2$T
 ];
-function render$H(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$M, _hoisted_3$I);
+function render$O(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$V, _hoisted_3$Q);
 }
-const MdiCodeBracesBox = { name: "mdi-code-braces-box", render: render$H };
-const _hoisted_1$L = {
+const MdiCodeBracesBox = { name: "mdi-code-braces-box", render: render$O };
+const _hoisted_1$U = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$J = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$S = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M7 5h14v2H7V5m0 8v-2h14v2H7M4 4.5A1.5 1.5 0 0 1 5.5 6A1.5 1.5 0 0 1 4 7.5A1.5 1.5 0 0 1 2.5 6A1.5 1.5 0 0 1 4 4.5m0 6A1.5 1.5 0 0 1 5.5 12A1.5 1.5 0 0 1 4 13.5A1.5 1.5 0 0 1 2.5 12A1.5 1.5 0 0 1 4 10.5M7 19v-2h14v2H7m-3-2.5A1.5 1.5 0 0 1 5.5 18A1.5 1.5 0 0 1 4 19.5A1.5 1.5 0 0 1 2.5 18A1.5 1.5 0 0 1 4 16.5Z"
 }, null, -1);
-const _hoisted_3$H = [
-  _hoisted_2$J
+const _hoisted_3$P = [
+  _hoisted_2$S
 ];
-function render$G(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$L, _hoisted_3$H);
+function render$N(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$U, _hoisted_3$P);
 }
-const MdiFormatListBulleted = { name: "mdi-format-list-bulleted", render: render$G };
-const _hoisted_1$K = {
+const MdiFormatListBulleted = { name: "mdi-format-list-bulleted", render: render$N };
+const _hoisted_1$T = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$I = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$R = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M21 19v-2H8v2h13m0-6v-2H8v2h13M8 7h13V5H8v2M4 5v2h2V5H4M3 5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5m1 6v2h2v-2H4m-1 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-2m1 6v2h2v-2H4m-1 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-2Z"
 }, null, -1);
-const _hoisted_3$G = [
-  _hoisted_2$I
+const _hoisted_3$O = [
+  _hoisted_2$R
 ];
-function render$F(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$K, _hoisted_3$G);
+function render$M(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$T, _hoisted_3$O);
 }
-const MdiFormatListCheckbox = { name: "mdi-format-list-checkbox", render: render$F };
-const _hoisted_1$J = {
+const MdiFormatListCheckbox = { name: "mdi-format-list-checkbox", render: render$M };
+const _hoisted_1$S = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$H = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$Q = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M7 13v-2h14v2H7m0 6v-2h14v2H7M7 7V5h14v2H7M3 8V5H2V4h2v4H3m-1 9v-1h3v4H2v-1h2v-.5H3v-1h1V17H2m2.25-7a.75.75 0 0 1 .75.75c0 .2-.08.39-.21.52L3.12 13H5v1H2v-.92L4 11H2v-1h2.25Z"
 }, null, -1);
-const _hoisted_3$F = [
-  _hoisted_2$H
+const _hoisted_3$N = [
+  _hoisted_2$Q
 ];
-function render$E(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$J, _hoisted_3$F);
+function render$L(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$S, _hoisted_3$N);
 }
-const MdiFormatListNumbered = { name: "mdi-format-list-numbered", render: render$E };
-const _hoisted_1$I = {
+const MdiFormatListNumbered = { name: "mdi-format-list-numbered", render: render$L };
+const _hoisted_1$R = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$G = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$P = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M5 4h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2m0 4v4h6V8H5m8 0v4h6V8h-6m-8 6v4h6v-4H5m8 0v4h6v-4h-6Z"
 }, null, -1);
-const _hoisted_3$E = [
-  _hoisted_2$G
+const _hoisted_3$M = [
+  _hoisted_2$P
 ];
-function render$D(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$I, _hoisted_3$E);
+function render$K(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$R, _hoisted_3$M);
 }
-const MdiTable = { name: "mdi-table", render: render$D };
-const _hoisted_1$H = {
+const MdiTable = { name: "mdi-table", render: render$K };
+const _hoisted_1$Q = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$F = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$O = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M16.36 14c.08-.66.14-1.32.14-2c0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2m-5.15 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95a8.03 8.03 0 0 1-4.33 3.56M14.34 14H9.66c-.1-.66-.16-1.32-.16-2c0-.68.06-1.35.16-2h4.68c.09.65.16 1.32.16 2c0 .68-.07 1.34-.16 2M12 19.96c-.83-1.2-1.5-2.53-1.91-3.96h3.82c-.41 1.43-1.08 2.76-1.91 3.96M8 8H5.08A7.923 7.923 0 0 1 9.4 4.44C8.8 5.55 8.35 6.75 8 8m-2.92 8H8c.35 1.25.8 2.45 1.4 3.56A8.008 8.008 0 0 1 5.08 16m-.82-2C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2c0 .68.06 1.34.14 2M12 4.03c.83 1.2 1.5 2.54 1.91 3.97h-3.82c.41-1.43 1.08-2.77 1.91-3.97M18.92 8h-2.95a15.65 15.65 0 0 0-1.38-3.56c1.84.63 3.37 1.9 4.33 3.56M12 2C6.47 2 2 6.5 2 12a10 10 0 0 0 10 10a10 10 0 0 0 10-10A10 10 0 0 0 12 2Z"
 }, null, -1);
-const _hoisted_3$D = [
-  _hoisted_2$F
+const _hoisted_3$L = [
+  _hoisted_2$O
 ];
-function render$C(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$H, _hoisted_3$D);
+function render$J(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$Q, _hoisted_3$L);
+}
+const MdiWeb = { name: "mdi-web", render: render$J };
+const _hoisted_1$P = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$N = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M17 10.5V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-3.5l4 4v-11l-4 4Z"
+}, null, -1);
+const _hoisted_3$K = [
+  _hoisted_2$N
+];
+function render$I(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$P, _hoisted_3$K);
+}
+const MdiVideo = { name: "mdi-video", render: render$I };
+const _hoisted_1$O = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$M = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M16 9h-3v5.5a2.5 2.5 0 0 1-2.5 2.5A2.5 2.5 0 0 1 8 14.5a2.5 2.5 0 0 1 2.5-2.5c.57 0 1.08.19 1.5.5V7h4v2m-4-7a10 10 0 0 1 10 10a10 10 0 0 1-10 10A10 10 0 0 1 2 12A10 10 0 0 1 12 2m0 2a8 8 0 0 0-8 8a8 8 0 0 0 8 8a8 8 0 0 0 8-8a8 8 0 0 0-8-8Z"
+}, null, -1);
+const _hoisted_3$J = [
+  _hoisted_2$M
+];
+function render$H(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$O, _hoisted_3$J);
 }
-const MdiWeb = { name: "mdi-web", render: render$C };
+const MdiMusicCircleOutline = { name: "mdi-music-circle-outline", render: render$H };
 const CommentParagraph = {
   icon: markRaw(MdiFormatParagraph),
   title: "\u666E\u901A\u6587\u672C",
@@ -23394,6 +23591,28 @@ const CommandIframe = {
     ]).run();
   }
 };
+const CommandVideo = {
+  icon: markRaw(MdiVideo),
+  title: "\u89C6\u9891",
+  keywords: ["video", "shipin"],
+  command: ({ editor, range }) => {
+    editor.chain().focus().deleteRange(range).insertContent([
+      { type: "video", attrs: { src: "" } },
+      { type: "paragraph", content: "" }
+    ]).run();
+  }
+};
+const CommandAudio = {
+  icon: markRaw(MdiMusicCircleOutline),
+  title: "\u97F3\u9891",
+  keywords: ["audio", "yinpin"],
+  command: ({ editor, range }) => {
+    editor.chain().focus().deleteRange(range).insertContent([
+      { type: "audio", attrs: { src: "" } },
+      { type: "paragraph", content: "" }
+    ]).run();
+  }
+};
 const CommandTable = {
   icon: markRaw(MdiTable),
   title: "\u8868\u683C",
@@ -23441,7 +23660,9 @@ const suggestion = {
       CommandBulletList,
       CommandOrderedList,
       CommandTaskList,
-      CommandIframe
+      CommandIframe,
+      CommandVideo,
+      CommandAudio
     ].filter(
       (item) => [...item.keywords, item.title].some(
         (keyword) => keyword.includes(query)
@@ -23453,7 +23674,7 @@ const suggestion = {
     let popup;
     return {
       onStart: (props) => {
-        component = new VueRenderer(_sfc_main$7, {
+        component = new VueRenderer(_sfc_main$9, {
           props,
           editor: props.editor
         });
@@ -38555,39 +38776,39 @@ lowlight$1.registerLanguage("xml", xml);
 lowlight$1.registerLanguage("yaml", yaml);
 lowlight$1.registerLanguage("html", xml);
 const lowlight = lowlight$1;
-const _hoisted_1$G = {
+const _hoisted_1$N = {
   viewBox: "0 0 24 24",
   color: "red",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$E = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$L = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M14.12 10.47L12 12.59l-2.13-2.12l-1.41 1.41L10.59 14l-2.12 2.12l1.41 1.41L12 15.41l2.12 2.12l1.41-1.41L13.41 14l2.12-2.12l-1.41-1.41M15.5 4l-1-1h-5l-1 1H5v2h14V4h-3.5M6 19a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V7H6v12M8 9h8v10H8V9Z"
 }, null, -1);
-const _hoisted_3$C = [
-  _hoisted_2$E
+const _hoisted_3$I = [
+  _hoisted_2$L
 ];
-function render$B(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$G, _hoisted_3$C);
+function render$G(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$N, _hoisted_3$I);
 }
-const MdiDeleteForeverOutline = { name: "mdi-delete-forever-outline", render: render$B };
-const _hoisted_1$F = {
+const MdiDeleteForeverOutline = { name: "mdi-delete-forever-outline", render: render$G };
+const _hoisted_1$M = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$D = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$K = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M20 10.5a6.5 6.5 0 0 1-6.5 6.5H7.83l3.09 3.09L9.5 21.5L4 16l5.5-5.5l1.41 1.41L7.83 15h5.67c2.5 0 4.5-2 4.5-4.5S16 6 13.5 6H6V4h7.5a6.5 6.5 0 0 1 6.5 6.5Z"
 }, null, -1);
-const _hoisted_3$B = [
-  _hoisted_2$D
+const _hoisted_3$H = [
+  _hoisted_2$K
 ];
-function render$A(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$F, _hoisted_3$B);
+function render$F(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$M, _hoisted_3$H);
 }
-const MdiArrowULeftBottom = { name: "mdi-arrow-u-left-bottom", render: render$A };
+const MdiArrowULeftBottom = { name: "mdi-arrow-u-left-bottom", render: render$F };
 const BlockActionSeparator_vue_vue_type_style_index_0_lang = "";
 const _export_sfc = (sfc, props) => {
   const target = sfc.__vccOpts || sfc;
@@ -38596,13 +38817,13 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const _sfc_main$6 = {};
-const _hoisted_1$E = { class: "editor-block__actions-separator" };
+const _sfc_main$8 = {};
+const _hoisted_1$L = { class: "editor-block__actions-separator" };
 function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$E);
+  return openBlock(), createElementBlock("div", _hoisted_1$L);
 }
-const BlockActionSeparator = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render]]);
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+const BlockActionSeparator = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render]]);
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "BlockActionButton",
   props: {
     tooltip: { default: void 0 },
@@ -38623,9 +38844,9 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   }
 });
 const BlockActionButton_vue_vue_type_style_index_0_lang = "";
-const _hoisted_1$D = { class: "editor-block__content" };
-const _hoisted_2$C = { class: "editor-block__actions" };
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+const _hoisted_1$K = { class: "editor-block__content" };
+const _hoisted_2$J = { class: "editor-block__actions" };
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   __name: "BlockCard",
   props: {
     selected: { type: Boolean, default: false },
@@ -38658,7 +38879,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         onMouseleave: _cache[1] || (_cache[1] = ($event) => hover.value = false)
       }, [
         createVNode(unref(Dropdown), {
-          placement: "top-end",
+          placement: "bottom-end",
           shown: unref(dropdownVisible),
           "auto-hide": false,
           triggers: [],
@@ -38666,9 +38887,9 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
           theme: "editor-block-dropdown"
         }, {
           popper: withCtx(() => [
-            createElementVNode("div", _hoisted_2$C, [
+            createElementVNode("div", _hoisted_2$J, [
               renderSlot(_ctx.$slots, "actions"),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u6362\u884C",
                 onClick: handleInsertNewLine
               }, {
@@ -38678,7 +38899,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
                 _: 1
               }),
               createVNode(BlockActionSeparator),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u5220\u9664",
                 onClick: __props.deleteNode
               }, {
@@ -38690,7 +38911,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
             ])
           ]),
           default: withCtx(() => [
-            createElementVNode("div", _hoisted_1$D, [
+            createElementVNode("div", _hoisted_1$K, [
               renderSlot(_ctx.$slots, "content")
             ])
           ]),
@@ -38701,10 +38922,10 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   }
 });
 const BlockCard_vue_vue_type_style_index_0_lang = "";
-const _hoisted_1$C = { class: "py-1.5" };
-const _hoisted_2$B = /* @__PURE__ */ createElementVNode("option", { value: null }, "auto", -1);
-const _hoisted_3$A = ["value"];
-const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+const _hoisted_1$J = { class: "py-1.5" };
+const _hoisted_2$I = /* @__PURE__ */ createElementVNode("option", { value: null }, "auto", -1);
+const _hoisted_3$G = ["value"];
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   __name: "CodeBlockViewRenderer",
   props: {
     editor: null,
@@ -38733,25 +38954,25 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(NodeViewWrapper), null, {
         default: withCtx(() => [
-          createVNode(_sfc_main$4, {
+          createVNode(_sfc_main$6, {
             editor: __props.editor,
             "delete-node": __props.deleteNode,
             "get-pos": __props.getPos,
             selected: __props.selected
           }, {
             content: withCtx(() => [
-              createElementVNode("div", _hoisted_1$C, [
+              createElementVNode("div", _hoisted_1$J, [
                 withDirectives(createElementVNode("select", {
                   "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(selectedLanguage) ? selectedLanguage.value = $event : null),
                   contenteditable: "false",
                   class: "block px-2 py-1.5 text-sm text-gray-900 border border-gray-300 rounded-md bg-gray-50 focus:ring-blue-500 focus:border-blue-500"
                 }, [
-                  _hoisted_2$B,
+                  _hoisted_2$I,
                   (openBlock(true), createElementBlock(Fragment$1, null, renderList(unref(languages), (language, index2) => {
                     return openBlock(), createElementBlock("option", {
                       key: index2,
                       value: language
-                    }, toDisplayString(language), 9, _hoisted_3$A);
+                    }, toDisplayString(language), 9, _hoisted_3$G);
                   }), 128))
                 ], 512), [
                   [vModelSelect, unref(selectedLanguage)]
@@ -38773,10 +38994,10 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
 });
 const ExtensionCodeBlock = CodeBlockLowlight.extend({
   addNodeView() {
-    return VueNodeViewRenderer(_sfc_main$3);
+    return VueNodeViewRenderer(_sfc_main$5);
   }
 });
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   __name: "BlockActionInput",
   props: {
     tooltip: { default: void 0 },
@@ -38809,105 +39030,89 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   }
 });
 const BlockActionInput_vue_vue_type_style_index_0_lang = "";
-const _hoisted_1$B = {
-  viewBox: "0 0 24 24",
-  width: "1.2em",
-  height: "1.2em"
-};
-const _hoisted_2$A = /* @__PURE__ */ createElementVNode("path", {
-  fill: "currentColor",
-  d: "M10.59 13.41c.41.39.41 1.03 0 1.42c-.39.39-1.03.39-1.42 0a5.003 5.003 0 0 1 0-7.07l3.54-3.54a5.003 5.003 0 0 1 7.07 0a5.003 5.003 0 0 1 0 7.07l-1.49 1.49c.01-.82-.12-1.64-.4-2.42l.47-.48a2.982 2.982 0 0 0 0-4.24a2.982 2.982 0 0 0-4.24 0l-3.53 3.53a2.982 2.982 0 0 0 0 4.24m2.82-4.24c.39-.39 1.03-.39 1.42 0a5.003 5.003 0 0 1 0 7.07l-3.54 3.54a5.003 5.003 0 0 1-7.07 0a5.003 5.003 0 0 1 0-7.07l1.49-1.49c-.01.82.12 1.64.4 2.43l-.47.47a2.982 2.982 0 0 0 0 4.24a2.982 2.982 0 0 0 4.24 0l3.53-3.53a2.982 2.982 0 0 0 0-4.24a.973.973 0 0 1 0-1.42Z"
-}, null, -1);
-const _hoisted_3$z = [
-  _hoisted_2$A
-];
-function render$z(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$B, _hoisted_3$z);
-}
-const MdiLinkVariant = { name: "mdi-link-variant", render: render$z };
-const _hoisted_1$A = {
+const _hoisted_1$I = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$z = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$H = /* @__PURE__ */ createElementVNode("path", {
   d: "M16 18H7V4h9m-4.5 18a1.5 1.5 0 0 1-1.5-1.5a1.5 1.5 0 0 1 1.5-1.5a1.5 1.5 0 0 1 1.5 1.5a1.5 1.5 0 0 1-1.5 1.5m4-21h-8A2.5 2.5 0 0 0 5 3.5v17A2.5 2.5 0 0 0 7.5 23h8a2.5 2.5 0 0 0 2.5-2.5v-17A2.5 2.5 0 0 0 15.5 1z",
   fill: "currentColor"
 }, null, -1);
-const _hoisted_3$y = [
-  _hoisted_2$z
+const _hoisted_3$F = [
+  _hoisted_2$H
 ];
-function render$y(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$A, _hoisted_3$y);
+function render$E(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$I, _hoisted_3$F);
 }
-const MdiCellphoneIphone = { name: "mdi-cellphone-iphone", render: render$y };
-const _hoisted_1$z = {
+const MdiCellphoneIphone = { name: "mdi-cellphone-iphone", render: render$E };
+const _hoisted_1$H = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$y = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$G = /* @__PURE__ */ createElementVNode("path", {
   d: "M19 19H4V3h15m-7.5 20a1.5 1.5 0 0 1-1.5-1.5a1.5 1.5 0 0 1 1.5-1.5a1.5 1.5 0 0 1 1.5 1.5a1.5 1.5 0 0 1-1.5 1.5m7-23h-14A2.5 2.5 0 0 0 2 2.5v19A2.5 2.5 0 0 0 4.5 24h14a2.5 2.5 0 0 0 2.5-2.5v-19A2.5 2.5 0 0 0 18.5 0z",
   fill: "currentColor"
 }, null, -1);
-const _hoisted_3$x = [
-  _hoisted_2$y
+const _hoisted_3$E = [
+  _hoisted_2$G
 ];
-function render$x(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$z, _hoisted_3$x);
+function render$D(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$H, _hoisted_3$E);
 }
-const MdiTabletIpad = { name: "mdi-tablet-ipad", render: render$x };
-const _hoisted_1$y = {
+const MdiTabletIpad = { name: "mdi-tablet-ipad", render: render$D };
+const _hoisted_1$G = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$x = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$F = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M21 14H3V4h18m0-2H3c-1.11 0-2 .89-2 2v12a2 2 0 0 0 2 2h7l-2 3v1h8v-1l-2-3h7a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2Z"
 }, null, -1);
-const _hoisted_3$w = [
-  _hoisted_2$x
+const _hoisted_3$D = [
+  _hoisted_2$F
 ];
-function render$w(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$y, _hoisted_3$w);
+function render$C(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$G, _hoisted_3$D);
 }
-const MdiDesktopMac = { name: "mdi-desktop-mac", render: render$w };
-const _hoisted_1$x = {
+const MdiDesktopMac = { name: "mdi-desktop-mac", render: render$C };
+const _hoisted_1$F = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$w = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$E = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M3 21V3h18v18H3M5 5v14h14V5H5Z"
 }, null, -1);
-const _hoisted_3$v = [
-  _hoisted_2$w
+const _hoisted_3$C = [
+  _hoisted_2$E
 ];
-function render$v(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$x, _hoisted_3$v);
+function render$B(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$F, _hoisted_3$C);
 }
-const MdiBorderAllVariant = { name: "mdi-border-all-variant", render: render$v };
-const _hoisted_1$w = {
+const MdiBorderAllVariant = { name: "mdi-border-all-variant", render: render$B };
+const _hoisted_1$E = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-const _hoisted_2$v = /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_2$D = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M15 5h2V3h-2m0 18h2v-2h-2M11 5h2V3h-2m8 2h2V3h-2m0 6h2V7h-2m0 14h2v-2h-2m0-6h2v-2h-2m0 6h2v-2h-2M3 5h2V3H3m0 6h2V7H3m0 6h2v-2H3m0 6h2v-2H3m0 6h2v-2H3m8 2h2v-2h-2m-4 2h2v-2H7M7 5h2V3H7v2Z"
 }, null, -1);
-const _hoisted_3$u = [
-  _hoisted_2$v
+const _hoisted_3$B = [
+  _hoisted_2$D
 ];
-function render$u(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$w, _hoisted_3$u);
+function render$A(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$E, _hoisted_3$B);
 }
-const MdiBorderNoneVariant = { name: "mdi-border-none-variant", render: render$u };
-const _hoisted_1$v = { class: "py-1.5" };
-const _hoisted_2$u = ["src", "width", "height", "frameborder"];
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+const MdiBorderNoneVariant = { name: "mdi-border-none-variant", render: render$A };
+const _hoisted_1$D = { class: "py-1.5" };
+const _hoisted_2$C = ["src", "width", "height", "frameborder"];
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "IframeView",
   props: {
     editor: null,
@@ -38971,7 +39176,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(NodeViewWrapper), { as: "div" }, {
         default: withCtx(() => [
-          createVNode(_sfc_main$4, {
+          createVNode(_sfc_main$6, {
             editor: __props.editor,
             "get-pos": __props.getPos,
             "delete-node": __props.deleteNode,
@@ -38984,7 +39189,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   width: __props.node.attrs.width
                 })
               }, [
-                createElementVNode("div", _hoisted_1$v, [
+                createElementVNode("div", _hoisted_1$D, [
                   withDirectives(createElementVNode("input", {
                     "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(src) ? src.value = $event : null),
                     class: "block px-2 w-full py-1.5 text-sm text-gray-900 border border-gray-300 rounded-md bg-gray-50 focus:ring-blue-500 focus:border-blue-500",
@@ -39011,12 +39216,13 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   scrolling: "yes",
                   frameborder: unref(frameborder),
                   framespacing: "0",
-                  allowfullscreen: "true"
-                }, null, 10, _hoisted_2$u)) : createCommentVNode("", true)
+                  allowfullscreen: "true",
+                  onMouseenter: handleSetFocus
+                }, null, 42, _hoisted_2$C)) : createCommentVNode("", true)
               ], 4)
             ]),
             actions: withCtx(() => [
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 selected: unref(frameborder) === "1",
                 tooltip: `${unref(frameborder) === "1" ? "\u53D6\u6D88\u8FB9\u6846" : "\u8BBE\u7F6E\u8FB9\u6846"}`,
                 onClick: handleToggleFrameborder
@@ -39027,20 +39233,20 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 _: 1
               }, 8, ["selected", "tooltip"]),
               createVNode(BlockActionSeparator),
-              createVNode(_sfc_main$2, {
+              createVNode(_sfc_main$4, {
                 modelValue: unref(width),
                 "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(width) ? width.value = $event : null),
                 modelModifiers: { lazy: true, trim: true },
                 tooltip: "\u81EA\u5B9A\u4E49\u5BBD\u5EA6\uFF0C\u6309\u56DE\u8F66\u952E\u751F\u6548"
               }, null, 8, ["modelValue"]),
-              createVNode(_sfc_main$2, {
+              createVNode(_sfc_main$4, {
                 modelValue: unref(height),
                 "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(height) ? height.value = $event : null),
                 modelModifiers: { lazy: true, trim: true },
                 tooltip: "\u81EA\u5B9A\u4E49\u9AD8\u5EA6\uFF0C\u6309\u56DE\u8F66\u952E\u751F\u6548"
               }, null, 8, ["modelValue"]),
               createVNode(BlockActionSeparator),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u624B\u673A\u5C3A\u5BF8",
                 selected: sizeMatch("390px", "844px"),
                 onClick: _cache[3] || (_cache[3] = ($event) => handleSetSize("390px", "844px"))
@@ -39050,7 +39256,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               }, 8, ["selected"]),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u5E73\u677F\u7535\u8111\u7EB5\u5411\u5C3A\u5BF8",
                 selected: sizeMatch("834px", "1194px"),
                 onClick: _cache[4] || (_cache[4] = ($event) => handleSetSize("834px", "1194px"))
@@ -39060,7 +39266,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               }, 8, ["selected"]),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u5E73\u677F\u7535\u8111\u6A2A\u5411\u5C3A\u5BF8",
                 selected: sizeMatch("1194px", "834px"),
                 onClick: _cache[5] || (_cache[5] = ($event) => handleSetSize("1194px", "834px"))
@@ -39070,7 +39276,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               }, 8, ["selected"]),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u684C\u9762\u7535\u8111\u5C3A\u5BF8",
                 selected: sizeMatch("100%", "834px"),
                 onClick: _cache[6] || (_cache[6] = ($event) => handleSetSize("100%", "834px"))
@@ -39081,7 +39287,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 _: 1
               }, 8, ["selected"]),
               createVNode(BlockActionSeparator),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u6253\u5F00\u94FE\u63A5",
                 onClick: handleOpenLink
               }, {
@@ -39249,6 +39455,700 @@ const Iframe = Node.create({
       })
     ];
   },
+  addNodeView() {
+    return VueNodeViewRenderer(_sfc_main$3);
+  }
+});
+const _hoisted_1$C = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$B = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M21 3H3C2 3 1 4 1 5v14a2 2 0 0 0 2 2h18c1 0 2-1 2-2V5c0-1-1-2-2-2M5 17l3.5-4.5l2.5 3l3.5-4.5l4.5 6H5Z"
+}, null, -1);
+const _hoisted_3$A = [
+  _hoisted_2$B
+];
+function render$z(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$C, _hoisted_3$A);
+}
+const MdiImageSizeSelectActual = { name: "mdi-image-size-select-actual", render: render$z };
+const _hoisted_1$B = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$A = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M23 15h-2v2h2v-2m0-4h-2v2h2v-2m0 8h-2v2c1 0 2-1 2-2M15 3h-2v2h2V3m8 4h-2v2h2V7m-2-4v2h2c0-1-1-2-2-2M3 21h8v-6H1v4a2 2 0 0 0 2 2M3 7H1v2h2V7m12 12h-2v2h2v-2m4-16h-2v2h2V3m0 16h-2v2h2v-2M3 3C2 3 1 4 1 5h2V3m0 8H1v2h2v-2m8-8H9v2h2V3M7 3H5v2h2V3Z"
+}, null, -1);
+const _hoisted_3$z = [
+  _hoisted_2$A
+];
+function render$y(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$B, _hoisted_3$z);
+}
+const MdiImageSizeSelectSmall = { name: "mdi-image-size-select-small", render: render$y };
+const _hoisted_1$A = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$z = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M21 15h2v2h-2v-2m0-4h2v2h-2v-2m2 8h-2v2c1 0 2-1 2-2M13 3h2v2h-2V3m8 4h2v2h-2V7m0-4v2h2c0-1-1-2-2-2M1 7h2v2H1V7m16-4h2v2h-2V3m0 16h2v2h-2v-2M3 3C2 3 1 4 1 5h2V3m6 0h2v2H9V3M5 3h2v2H5V3m-4 8v8a2 2 0 0 0 2 2h12V11H1m2 8l2.5-3.21l1.79 2.15l2.5-3.22L13 19H3Z"
+}, null, -1);
+const _hoisted_3$y = [
+  _hoisted_2$z
+];
+function render$x(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$A, _hoisted_3$y);
+}
+const MdiImageSizeSelectLarge = { name: "mdi-image-size-select-large", render: render$x };
+const _hoisted_1$z = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$y = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M13.53 22H10c-.25 0-.46-.18-.5-.42l-.37-2.65c-.63-.25-1.17-.59-1.69-.99l-2.49 1.01c-.22.08-.49 0-.61-.22l-2-3.46a.493.493 0 0 1 .12-.64l2.11-1.66c-.04-.32-.07-.64-.07-.97s.03-.66.07-1L2.46 9.37a.493.493 0 0 1-.12-.64l2-3.46c.12-.22.39-.31.61-.22l2.49 1c.52-.39 1.06-.73 1.69-.98l.37-2.65c.04-.24.25-.42.5-.42h4c.25 0 .46.18.5.42l.37 2.65c.63.25 1.17.59 1.69.98l2.49-1c.22-.09.49 0 .61.22l2 3.46c.12.22.07.49-.12.64L19.43 11c.04.34.07.67.07 1v.19c-.5-.12-1-.19-1.5-.19c-.92 0-1.78.21-2.56.58c.03-.19.06-.38.06-.58c0-1.93-1.57-3.5-3.5-3.5S8.5 10.07 8.5 12s1.57 3.5 3.5 3.5c.2 0 .39-.03.58-.06a5.97 5.97 0 0 0 .95 6.56M16 15v6l5-3l-5-3Z"
+}, null, -1);
+const _hoisted_3$x = [
+  _hoisted_2$y
+];
+function render$w(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$z, _hoisted_3$x);
+}
+const MdiCogPlay = { name: "mdi-cog-play", render: render$w };
+const _hoisted_1$y = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$x = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M13.54 22H10c-.25 0-.46-.18-.5-.42l-.37-2.65c-.63-.25-1.17-.59-1.69-.99l-2.49 1.01c-.22.08-.49 0-.61-.22l-2-3.46a.493.493 0 0 1 .12-.64l2.11-1.66L4.5 12l.07-1l-2.11-1.63a.493.493 0 0 1-.12-.64l2-3.46c.12-.22.39-.31.61-.22l2.49 1c.52-.39 1.06-.73 1.69-.98l.37-2.65c.04-.24.25-.42.5-.42h4c.25 0 .46.18.5.42l.37 2.65c.63.25 1.17.59 1.69.98l2.49-1c.22-.09.49 0 .61.22l2 3.46c.13.22.07.49-.12.64L19.43 11l.07 1v.19c-.5-.12-1-.19-1.5-.19c-.17 0-.34 0-.5.03c0-.62-.1-1.24-.3-1.83l2.11-1.55l-.75-1.3l-2.41 1.04a5.42 5.42 0 0 0-3.03-1.77L12.75 4h-1.5l-.37 2.61c-1.2.25-2.26.89-3.03 1.78L5.44 7.35l-.75 1.3L6.8 10.2a5.55 5.55 0 0 0 0 3.6l-2.12 1.56l.75 1.3l2.43-1.04c.77.88 1.82 1.52 3.01 1.76l.37 2.62h1.11c.26.75.65 1.42 1.19 2m2.42-9.64c.04-.12.04-.24.04-.36c0-2.21-1.79-4-4-4s-4 1.79-4 4s1.79 4 4 4c.12 0 .24 0 .36-.04a6.045 6.045 0 0 1 3.6-3.6M12 14c-1.1 0-2-.89-2-2s.9-2 2-2s2 .9 2 2s-.89 2-2 2m4 1v6l5-3l-5-3Z"
+}, null, -1);
+const _hoisted_3$w = [
+  _hoisted_2$x
+];
+function render$v(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$y, _hoisted_3$w);
+}
+const MdiCogPlayOutline = { name: "mdi-cog-play-outline", render: render$v };
+const _hoisted_1$x = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$w = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M10 16.5v-9l6 4.5M12 2A10 10 0 0 0 2 12a10 10 0 0 0 10 10a10 10 0 0 0 10-10A10 10 0 0 0 12 2Z"
+}, null, -1);
+const _hoisted_3$v = [
+  _hoisted_2$w
+];
+function render$u(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$x, _hoisted_3$v);
+}
+const MdiPlayCircle = { name: "mdi-play-circle", render: render$u };
+const _hoisted_1$w = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$v = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M12 20c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10a10 10 0 0 0 10-10A10 10 0 0 0 12 2m-2 14.5l6-4.5l-6-4.5v9Z"
+}, null, -1);
+const _hoisted_3$u = [
+  _hoisted_2$v
+];
+function render$t(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$w, _hoisted_3$u);
+}
+const MdiPlayCircleOutline = { name: "mdi-play-circle-outline", render: render$t };
+const _hoisted_1$v = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$u = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "m10 16.5l6-4.5l-6-4.5M22 12c0-5.54-4.46-10-10-10c-1.17 0-2.3.19-3.38.56l.7 1.94c.85-.34 1.74-.53 2.68-.53c4.41 0 8.03 3.62 8.03 8.03c0 4.41-3.62 8.03-8.03 8.03c-4.41 0-8.03-3.62-8.03-8.03c0-.94.19-1.88.53-2.72l-1.94-.66C2.19 9.7 2 10.83 2 12c0 5.54 4.46 10 10 10s10-4.46 10-10M5.47 3.97c.85 0 1.53.71 1.53 1.5C7 6.32 6.32 7 5.47 7c-.79 0-1.5-.68-1.5-1.53c0-.79.71-1.5 1.5-1.5Z"
+}, null, -1);
+const _hoisted_3$t = [
+  _hoisted_2$u
+];
+function render$s(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$v, _hoisted_3$t);
+}
+const MdiMotionPlayOutline = { name: "mdi-motion-play-outline", render: render$s };
+const _hoisted_1$u = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+const _hoisted_2$t = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M22 12c0-5.54-4.46-10-10-10c-1.17 0-2.3.19-3.38.56l.7 1.94c.85-.34 1.74-.53 2.68-.53c4.41 0 8.03 3.62 8.03 8.03c0 4.41-3.62 8.03-8.03 8.03c-4.41 0-8.03-3.62-8.03-8.03c0-.94.19-1.88.53-2.72l-1.94-.66C2.19 9.7 2 10.83 2 12c0 5.54 4.46 10 10 10s10-4.46 10-10M5.47 3.97c.85 0 1.53.71 1.53 1.5C7 6.32 6.32 7 5.47 7c-.79 0-1.5-.68-1.5-1.53c0-.79.71-1.5 1.5-1.5M18 12c0-3.33-2.67-6-6-6s-6 2.67-6 6s2.67 6 6 6s6-2.67 6-6m-3 0l-5 3V9"
+}, null, -1);
+const _hoisted_3$s = [
+  _hoisted_2$t
+];
+function render$r(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$u, _hoisted_3$s);
+}
+const MdiMotionPlay = { name: "mdi-motion-play", render: render$r };
+const _hoisted_1$t = { class: "py-1.5" };
+const _hoisted_2$s = ["controls", "autoplay", "loop", "src"];
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  __name: "VideoView",
+  props: {
+    editor: null,
+    node: null,
+    decorations: null,
+    selected: { type: Boolean },
+    extension: null,
+    getPos: null,
+    updateAttributes: null,
+    deleteNode: null
+  },
+  setup(__props) {
+    const props = __props;
+    const src = computed({
+      get: () => {
+        var _a;
+        return (_a = props.node) == null ? void 0 : _a.attrs.src;
+      },
+      set: (src2) => {
+        props.updateAttributes({ src: src2 });
+      }
+    });
+    const width = computed({
+      get: () => {
+        return props.node.attrs.width;
+      },
+      set: (value) => {
+        handleSetSize(value, height.value);
+      }
+    });
+    const height = computed({
+      get: () => {
+        return props.node.attrs.height;
+      },
+      set: (value) => {
+        handleSetSize(width.value, value);
+      }
+    });
+    const controls = computed(() => {
+      return props.node.attrs.controls;
+    });
+    const autoplay = computed(() => {
+      return props.node.attrs.autoplay;
+    });
+    const loop = computed(() => {
+      return props.node.attrs.loop;
+    });
+    function handleSetFocus() {
+      props.editor.commands.setNodeSelection(props.getPos());
+    }
+    function handleSetSize(width2, height2) {
+      props.updateAttributes({ width: width2, height: height2 });
+      props.editor.chain().focus().setNodeSelection(props.getPos()).run();
+    }
+    function handleToggleControls() {
+      props.updateAttributes({
+        controls: props.node.attrs.controls ? null : true
+      });
+      props.editor.chain().focus().setNodeSelection(props.getPos()).run();
+    }
+    function handleToggleAutoplay() {
+      props.updateAttributes({
+        autoplay: props.node.attrs.autoplay ? null : true
+      });
+      props.editor.chain().focus().setNodeSelection(props.getPos()).run();
+    }
+    function handleToggleLoop() {
+      props.updateAttributes({
+        loop: props.node.attrs.loop ? null : true
+      });
+      props.editor.chain().focus().setNodeSelection(props.getPos()).run();
+    }
+    function handleOpenLink() {
+      window.open(src.value, "_blank");
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(NodeViewWrapper), { as: "div" }, {
+        default: withCtx(() => [
+          createVNode(_sfc_main$6, {
+            editor: __props.editor,
+            "get-pos": __props.getPos,
+            "delete-node": __props.deleteNode,
+            selected: __props.selected
+          }, {
+            content: withCtx(() => [
+              createElementVNode("div", {
+                class: "inline-block overflow-hidden transition-all text-center relative h-full",
+                style: normalizeStyle({
+                  width: __props.node.attrs.width
+                })
+              }, [
+                createElementVNode("div", _hoisted_1$t, [
+                  withDirectives(createElementVNode("input", {
+                    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(src) ? src.value = $event : null),
+                    class: "block px-2 w-full py-1.5 text-sm text-gray-900 border border-gray-300 rounded-md bg-gray-50 focus:ring-blue-500 focus:border-blue-500",
+                    placeholder: "\u8F93\u5165\u94FE\u63A5\uFF0C\u6309\u56DE\u8F66\u786E\u5B9A",
+                    tabindex: "-1",
+                    onFocus: handleSetFocus
+                  }, null, 544), [
+                    [
+                      vModelText,
+                      unref(src),
+                      void 0,
+                      { lazy: true }
+                    ]
+                  ])
+                ]),
+                unref(src) ? (openBlock(), createElementBlock("video", {
+                  key: 0,
+                  controls: unref(controls),
+                  autoplay: unref(autoplay),
+                  loop: unref(loop),
+                  class: "rounded-md m-0",
+                  src: __props.node.attrs.src,
+                  style: normalizeStyle({
+                    width: __props.node.attrs.width,
+                    height: __props.node.attrs.height
+                  }),
+                  onMouseenter: handleSetFocus
+                }, null, 44, _hoisted_2$s)) : createCommentVNode("", true)
+              ], 4)
+            ]),
+            actions: withCtx(() => [
+              createVNode(_sfc_main$7, {
+                selected: unref(controls),
+                tooltip: `${unref(controls) ? "\u9690\u85CF\u63A7\u5236\u9762\u677F" : "\u663E\u793A\u63A7\u5236\u9762\u677F"}`,
+                onClick: handleToggleControls
+              }, {
+                icon: withCtx(() => [
+                  unref(controls) ? (openBlock(), createBlock(unref(MdiCogPlay), { key: 0 })) : (openBlock(), createBlock(unref(MdiCogPlayOutline), { key: 1 }))
+                ]),
+                _: 1
+              }, 8, ["selected", "tooltip"]),
+              createVNode(_sfc_main$7, {
+                selected: unref(autoplay),
+                tooltip: `${unref(autoplay) ? "\u5173\u95ED\u81EA\u52A8\u64AD\u653E" : "\u5F00\u542F\u81EA\u52A8\u64AD\u653E"}`,
+                onClick: handleToggleAutoplay
+              }, {
+                icon: withCtx(() => [
+                  unref(autoplay) ? (openBlock(), createBlock(unref(MdiPlayCircle), { key: 0 })) : (openBlock(), createBlock(unref(MdiPlayCircleOutline), { key: 1 }))
+                ]),
+                _: 1
+              }, 8, ["selected", "tooltip"]),
+              createVNode(_sfc_main$7, {
+                selected: unref(loop),
+                tooltip: `${unref(loop) ? "\u5173\u95ED\u5FAA\u73AF\u64AD\u653E" : "\u5F00\u542F\u5FAA\u73AF\u64AD\u653E"}`,
+                onClick: handleToggleLoop
+              }, {
+                icon: withCtx(() => [
+                  unref(loop) ? (openBlock(), createBlock(unref(MdiMotionPlay), { key: 0 })) : (openBlock(), createBlock(unref(MdiMotionPlayOutline), { key: 1 }))
+                ]),
+                _: 1
+              }, 8, ["selected", "tooltip"]),
+              createVNode(BlockActionSeparator),
+              createVNode(_sfc_main$4, {
+                modelValue: unref(width),
+                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(width) ? width.value = $event : null),
+                modelModifiers: { lazy: true, trim: true },
+                tooltip: "\u81EA\u5B9A\u4E49\u5BBD\u5EA6\uFF0C\u6309\u56DE\u8F66\u952E\u751F\u6548"
+              }, null, 8, ["modelValue"]),
+              createVNode(_sfc_main$4, {
+                modelValue: unref(height),
+                "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(height) ? height.value = $event : null),
+                modelModifiers: { lazy: true, trim: true },
+                tooltip: "\u81EA\u5B9A\u4E49\u9AD8\u5EA6\uFF0C\u6309\u56DE\u8F66\u952E\u751F\u6548"
+              }, null, 8, ["modelValue"]),
+              createVNode(BlockActionSeparator),
+              createVNode(_sfc_main$7, {
+                tooltip: "\u5C0F\u5C3A\u5BF8",
+                selected: __props.node.attrs.width === "25%",
+                onClick: _cache[3] || (_cache[3] = ($event) => handleSetSize("25%", "auto"))
+              }, {
+                icon: withCtx(() => [
+                  createVNode(unref(MdiImageSizeSelectSmall))
+                ]),
+                _: 1
+              }, 8, ["selected"]),
+              createVNode(_sfc_main$7, {
+                tooltip: "\u4E2D\u5C3A\u5BF8",
+                selected: __props.node.attrs.width === "50%",
+                onClick: _cache[4] || (_cache[4] = ($event) => handleSetSize("50%", "auto"))
+              }, {
+                icon: withCtx(() => [
+                  createVNode(unref(MdiImageSizeSelectLarge))
+                ]),
+                _: 1
+              }, 8, ["selected"]),
+              createVNode(_sfc_main$7, {
+                tooltip: "\u5168\u5C3A\u5BF8",
+                selected: __props.node.attrs.width === "100%",
+                onClick: _cache[5] || (_cache[5] = ($event) => handleSetSize("100%", "auto"))
+              }, {
+                icon: withCtx(() => [
+                  createVNode(unref(MdiImageSizeSelectActual))
+                ]),
+                _: 1
+              }, 8, ["selected"]),
+              createVNode(BlockActionSeparator),
+              createVNode(_sfc_main$7, {
+                tooltip: "\u6253\u5F00\u94FE\u63A5",
+                onClick: handleOpenLink
+              }, {
+                icon: withCtx(() => [
+                  createVNode(unref(MdiLinkVariant))
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["editor", "get-pos", "delete-node", "selected"])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+const Video = Node.create({
+  name: "video",
+  inline() {
+    return true;
+  },
+  group() {
+    return "inline";
+  },
+  addAttributes() {
+    var _a;
+    return {
+      ...(_a = this.parent) == null ? void 0 : _a.call(this),
+      src: {
+        default: null,
+        parseHTML: (element) => {
+          return element.getAttribute("src");
+        }
+      },
+      width: {
+        default: "100%",
+        parseHTML: (element) => {
+          return element.getAttribute("width");
+        },
+        renderHTML(attributes) {
+          return {
+            width: attributes.width
+          };
+        }
+      },
+      height: {
+        default: "auto",
+        parseHTML: (element) => {
+          return element.getAttribute("height");
+        },
+        renderHTML: (attributes) => {
+          return {
+            height: attributes.height
+          };
+        }
+      },
+      autoplay: {
+        default: null,
+        parseHTML: (element) => {
+          return element.getAttribute("autoplay");
+        },
+        renderHTML: (attributes) => {
+          return {
+            autoplay: attributes.autoplay
+          };
+        }
+      },
+      controls: {
+        default: null,
+        parseHTML: (element) => {
+          return element.getAttribute("controls");
+        },
+        renderHTML: (attributes) => {
+          return {
+            controls: attributes.controls
+          };
+        }
+      },
+      loop: {
+        default: null,
+        parseHTML: (element) => {
+          return element.getAttribute("loop");
+        },
+        renderHTML: (attributes) => {
+          return {
+            loop: attributes.loop
+          };
+        }
+      }
+    };
+  },
+  parseHTML() {
+    return [
+      {
+        tag: "video"
+      }
+    ];
+  },
+  renderHTML({ HTMLAttributes }) {
+    return [
+      "video",
+      mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)
+    ];
+  },
+  addCommands() {
+    return {
+      setVideo: (options) => ({ commands: commands2 }) => {
+        return commands2.insertContent({
+          type: this.name,
+          attrs: options
+        });
+      }
+    };
+  },
+  addInputRules() {
+    return [
+      nodeInputRule({
+        find: /^\$video\$$/,
+        type: this.type,
+        getAttributes: () => {
+          return { width: "100%" };
+        }
+      })
+    ];
+  },
+  addNodeView() {
+    return VueNodeViewRenderer(_sfc_main$2);
+  }
+});
+const _hoisted_1$s = { class: "inline-block overflow-hidden transition-all text-center relative h-full w-full" };
+const _hoisted_2$r = { class: "py-1.5" };
+const _hoisted_3$r = ["autoplay", "loop", "src"];
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "AudioView",
+  props: {
+    editor: null,
+    node: null,
+    decorations: null,
+    selected: { type: Boolean },
+    extension: null,
+    getPos: null,
+    updateAttributes: null,
+    deleteNode: null
+  },
+  setup(__props) {
+    const props = __props;
+    const src = computed({
+      get: () => {
+        var _a;
+        return (_a = props.node) == null ? void 0 : _a.attrs.src;
+      },
+      set: (src2) => {
+        props.updateAttributes({ src: src2 });
+      }
+    });
+    const autoplay = computed(() => {
+      return props.node.attrs.autoplay;
+    });
+    const loop = computed(() => {
+      return props.node.attrs.loop;
+    });
+    function handleSetFocus() {
+      props.editor.commands.setNodeSelection(props.getPos());
+    }
+    function handleToggleAutoplay() {
+      props.updateAttributes({
+        autoplay: props.node.attrs.autoplay ? null : true
+      });
+      props.editor.chain().focus().setNodeSelection(props.getPos()).run();
+    }
+    function handleToggleLoop() {
+      props.updateAttributes({
+        loop: props.node.attrs.loop ? null : true
+      });
+      props.editor.chain().focus().setNodeSelection(props.getPos()).run();
+    }
+    function handleOpenLink() {
+      window.open(src.value, "_blank");
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(NodeViewWrapper), { as: "div" }, {
+        default: withCtx(() => [
+          createVNode(_sfc_main$6, {
+            editor: __props.editor,
+            "get-pos": __props.getPos,
+            "delete-node": __props.deleteNode,
+            selected: __props.selected
+          }, {
+            content: withCtx(() => [
+              createElementVNode("div", _hoisted_1$s, [
+                createElementVNode("div", _hoisted_2$r, [
+                  withDirectives(createElementVNode("input", {
+                    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(src) ? src.value = $event : null),
+                    class: "block px-2 w-full py-1.5 text-sm text-gray-900 border border-gray-300 rounded-md bg-gray-50 focus:ring-blue-500 focus:border-blue-500",
+                    placeholder: "\u8F93\u5165\u94FE\u63A5\uFF0C\u6309\u56DE\u8F66\u786E\u5B9A",
+                    tabindex: "-1",
+                    onFocus: handleSetFocus
+                  }, null, 544), [
+                    [
+                      vModelText,
+                      unref(src),
+                      void 0,
+                      { lazy: true }
+                    ]
+                  ])
+                ]),
+                unref(src) ? (openBlock(), createElementBlock("audio", {
+                  key: 0,
+                  controls: "",
+                  autoplay: unref(autoplay),
+                  loop: unref(loop),
+                  src: __props.node.attrs.src,
+                  onMouseenter: handleSetFocus
+                }, null, 40, _hoisted_3$r)) : createCommentVNode("", true)
+              ])
+            ]),
+            actions: withCtx(() => [
+              createVNode(_sfc_main$7, {
+                selected: unref(autoplay),
+                tooltip: `${unref(autoplay) ? "\u5173\u95ED\u81EA\u52A8\u64AD\u653E" : "\u5F00\u542F\u81EA\u52A8\u64AD\u653E"}`,
+                onClick: handleToggleAutoplay
+              }, {
+                icon: withCtx(() => [
+                  unref(autoplay) ? (openBlock(), createBlock(unref(MdiPlayCircle), { key: 0 })) : (openBlock(), createBlock(unref(MdiPlayCircleOutline), { key: 1 }))
+                ]),
+                _: 1
+              }, 8, ["selected", "tooltip"]),
+              createVNode(_sfc_main$7, {
+                selected: unref(loop),
+                tooltip: `${unref(loop) ? "\u5173\u95ED\u5FAA\u73AF\u64AD\u653E" : "\u5F00\u542F\u5FAA\u73AF\u64AD\u653E"}`,
+                onClick: handleToggleLoop
+              }, {
+                icon: withCtx(() => [
+                  unref(loop) ? (openBlock(), createBlock(unref(MdiMotionPlay), { key: 0 })) : (openBlock(), createBlock(unref(MdiMotionPlayOutline), { key: 1 }))
+                ]),
+                _: 1
+              }, 8, ["selected", "tooltip"]),
+              createVNode(BlockActionSeparator),
+              createVNode(_sfc_main$7, {
+                tooltip: "\u6253\u5F00\u94FE\u63A5",
+                onClick: handleOpenLink
+              }, {
+                icon: withCtx(() => [
+                  createVNode(unref(MdiLinkVariant))
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["editor", "get-pos", "delete-node", "selected"])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+const Audio = Node.create({
+  name: "audio",
+  inline() {
+    return true;
+  },
+  group() {
+    return "inline";
+  },
+  addAttributes() {
+    var _a;
+    return {
+      ...(_a = this.parent) == null ? void 0 : _a.call(this),
+      src: {
+        default: null,
+        parseHTML: (element) => {
+          return element.getAttribute("src");
+        }
+      },
+      autoplay: {
+        default: null,
+        parseHTML: (element) => {
+          return element.getAttribute("autoplay");
+        },
+        renderHTML: (attributes) => {
+          return {
+            autoplay: attributes.autoplay
+          };
+        }
+      },
+      controls: {
+        default: true,
+        parseHTML: (element) => {
+          return element.getAttribute("controls");
+        },
+        renderHTML: (attributes) => {
+          return {
+            controls: attributes.controls
+          };
+        }
+      },
+      loop: {
+        default: null,
+        parseHTML: (element) => {
+          return element.getAttribute("loop");
+        },
+        renderHTML: (attributes) => {
+          return {
+            loop: attributes.loop
+          };
+        }
+      }
+    };
+  },
+  parseHTML() {
+    return [
+      {
+        tag: "audio"
+      }
+    ];
+  },
+  renderHTML({ HTMLAttributes }) {
+    return [
+      "audio",
+      mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)
+    ];
+  },
+  addCommands() {
+    return {
+      setAudio: (options) => ({ commands: commands2 }) => {
+        return commands2.insertContent({
+          type: this.name,
+          attrs: options
+        });
+      }
+    };
+  },
+  addInputRules() {
+    return [
+      nodeInputRule({
+        find: /^\$audio\$$/,
+        type: this.type,
+        getAttributes: () => {
+          return { width: "100%" };
+        }
+      })
+    ];
+  },
   addNodeView() {
     return VueNodeViewRenderer(_sfc_main$1);
   }
@@ -39316,54 +40216,6 @@ const Image$1 = Node.create({
     ];
   }
 });
-const _hoisted_1$u = {
-  viewBox: "0 0 24 24",
-  width: "1.2em",
-  height: "1.2em"
-};
-const _hoisted_2$t = /* @__PURE__ */ createElementVNode("path", {
-  fill: "currentColor",
-  d: "M21 3H3C2 3 1 4 1 5v14a2 2 0 0 0 2 2h18c1 0 2-1 2-2V5c0-1-1-2-2-2M5 17l3.5-4.5l2.5 3l3.5-4.5l4.5 6H5Z"
-}, null, -1);
-const _hoisted_3$t = [
-  _hoisted_2$t
-];
-function render$t(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$u, _hoisted_3$t);
-}
-const MdiImageSizeSelectActual = { name: "mdi-image-size-select-actual", render: render$t };
-const _hoisted_1$t = {
-  viewBox: "0 0 24 24",
-  width: "1.2em",
-  height: "1.2em"
-};
-const _hoisted_2$s = /* @__PURE__ */ createElementVNode("path", {
-  fill: "currentColor",
-  d: "M23 15h-2v2h2v-2m0-4h-2v2h2v-2m0 8h-2v2c1 0 2-1 2-2M15 3h-2v2h2V3m8 4h-2v2h2V7m-2-4v2h2c0-1-1-2-2-2M3 21h8v-6H1v4a2 2 0 0 0 2 2M3 7H1v2h2V7m12 12h-2v2h2v-2m4-16h-2v2h2V3m0 16h-2v2h2v-2M3 3C2 3 1 4 1 5h2V3m0 8H1v2h2v-2m8-8H9v2h2V3M7 3H5v2h2V3Z"
-}, null, -1);
-const _hoisted_3$s = [
-  _hoisted_2$s
-];
-function render$s(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$t, _hoisted_3$s);
-}
-const MdiImageSizeSelectSmall = { name: "mdi-image-size-select-small", render: render$s };
-const _hoisted_1$s = {
-  viewBox: "0 0 24 24",
-  width: "1.2em",
-  height: "1.2em"
-};
-const _hoisted_2$r = /* @__PURE__ */ createElementVNode("path", {
-  fill: "currentColor",
-  d: "M21 15h2v2h-2v-2m0-4h2v2h-2v-2m2 8h-2v2c1 0 2-1 2-2M13 3h2v2h-2V3m8 4h2v2h-2V7m0-4v2h2c0-1-1-2-2-2M1 7h2v2H1V7m16-4h2v2h-2V3m0 16h2v2h-2v-2M3 3C2 3 1 4 1 5h2V3m6 0h2v2H9V3M5 3h2v2H5V3m-4 8v8a2 2 0 0 0 2 2h12V11H1m2 8l2.5-3.21l1.79 2.15l2.5-3.22L13 19H3Z"
-}, null, -1);
-const _hoisted_3$r = [
-  _hoisted_2$r
-];
-function render$r(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$s, _hoisted_3$r);
-}
-const MdiImageSizeSelectLarge = { name: "mdi-image-size-select-large", render: render$r };
 const _hoisted_1$r = ["src", "title", "alt"];
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "ImageView",
@@ -39419,7 +40271,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(NodeViewWrapper), { as: "div" }, {
         default: withCtx(() => [
-          createVNode(_sfc_main$4, {
+          createVNode(_sfc_main$6, {
             selected: __props.selected,
             editor: __props.editor,
             "delete-node": __props.deleteNode,
@@ -39444,20 +40296,20 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               ], 6)
             ]),
             actions: withCtx(() => [
-              createVNode(_sfc_main$2, {
+              createVNode(_sfc_main$4, {
                 modelValue: unref(width),
                 "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(width) ? width.value = $event : null),
                 modelModifiers: { lazy: true, trim: true },
                 tooltip: "\u81EA\u5B9A\u4E49\u5BBD\u5EA6\uFF0C\u6309\u56DE\u8F66\u952E\u751F\u6548"
               }, null, 8, ["modelValue"]),
-              createVNode(_sfc_main$2, {
+              createVNode(_sfc_main$4, {
                 modelValue: unref(height),
                 "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(height) ? height.value = $event : null),
                 modelModifiers: { lazy: true, trim: true },
                 tooltip: "\u81EA\u5B9A\u4E49\u9AD8\u5EA6\uFF0C\u6309\u56DE\u8F66\u952E\u751F\u6548"
               }, null, 8, ["modelValue"]),
               createVNode(BlockActionSeparator),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u5C0F\u5C3A\u5BF8",
                 selected: __props.node.attrs.width === "25%",
                 onClick: _cache[2] || (_cache[2] = ($event) => handleSetSize("25%", "auto"))
@@ -39467,7 +40319,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               }, 8, ["selected"]),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u4E2D\u5C3A\u5BF8",
                 selected: __props.node.attrs.width === "50%",
                 onClick: _cache[3] || (_cache[3] = ($event) => handleSetSize("50%", "auto"))
@@ -39477,7 +40329,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               }, 8, ["selected"]),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u5168\u5C3A\u5BF8",
                 selected: __props.node.attrs.width === "100%",
                 onClick: _cache[4] || (_cache[4] = ($event) => handleSetSize("100%", "100%"))
@@ -39488,7 +40340,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 _: 1
               }, 8, ["selected"]),
               createVNode(BlockActionSeparator),
-              createVNode(_sfc_main$5, {
+              createVNode(_sfc_main$7, {
                 tooltip: "\u6253\u5F00\u94FE\u63A5",
                 onClick: handleOpenLink
               }, {
@@ -39557,7 +40409,7 @@ const Image = Image$1.extend({
   parseHTML() {
     return [
       {
-        tag: "img[src]"
+        tag: this.options.allowBase64 ? "img[src]" : 'img[src]:not([src^="data:"])'
       }
     ];
   }
@@ -41850,7 +42702,9 @@ const allExtensions = [
   ExtensionCodeBlock.configure({
     lowlight
   }),
-  Iframe
+  Iframe,
+  Video,
+  Audio
 ];
 const _hoisted_1$q = {
   viewBox: "0 0 24 24",
@@ -42615,7 +43469,7 @@ function Separator() {
 }
 const plugin = {
   install(app) {
-    app.component("RichTextEditor", _sfc_main$8);
+    app.component("RichTextEditor", _sfc_main$a);
   }
 };
 export {
@@ -42628,6 +43482,7 @@ export {
   BulletListMenuItem,
   CodeBlockMenuItem,
   CodeMenuItem,
+  CommandAudio,
   CommandBulletList,
   CommandCodeBlock,
   CommandHeader1,
@@ -42641,11 +43496,13 @@ export {
   CommandOrderedList,
   CommandTable,
   CommandTaskList,
+  CommandVideo,
   suggestion as CommandsSuggestion,
   CommentParagraph,
   Editor,
   EditorContent,
   Extension,
+  Audio as ExtensionAudio,
   Blockquote as ExtensionBlockquote,
   Bold as ExtensionBold,
   BulletList as ExtensionBulletList,
@@ -42677,6 +43534,7 @@ export {
   Text$1 as ExtensionText,
   TextAlign as ExtensionTextAlign,
   Underline as ExtensionUnderline,
+  Video as ExtensionVideo,
   FloatingMenu,
   HeadingMenuItem,
   HighlightMenuItem,
@@ -42691,7 +43549,7 @@ export {
   PasteRule,
   QuoteMenuItem,
   RedoMenuItem,
-  _sfc_main$8 as RichTextEditor,
+  _sfc_main$a as RichTextEditor,
   Separator,
   StrikeMenuItem,
   SubScriptMenuItem,