tiptap-markdown-react 0.18.0 → 0.19.0

package/dist/index.js

@@ -1,7 +1,7 @@
 "use client";
 import { Markdown, MarkdownManager } from "@tiptap/markdown";
-import { c as renderOrUpdateChart, d as destroyChart } from "./scrollToTocHeading-BTQWajGD.js";
-import { C, a, R, b, f, m, r, s } from "./scrollToTocHeading-BTQWajGD.js";
+import { c as renderOrUpdateChart, d as destroyChart } from "./scrollToTocHeading-B2QmL4wi.js";
+import { C, a, R, b, f, m, r, s } from "./scrollToTocHeading-B2QmL4wi.js";
 import { jsx, jsxs, Fragment as Fragment$2 } from "react/jsx-runtime";
 import CodeBlockLowlight from "@tiptap/extension-code-block-lowlight";
 import FindAndReplace, { FindAndReplacePluginKey, createSearchRegex } from "@tiptap/extension-find-and-replace";
@@ -10,15 +10,15 @@ import Image from "@tiptap/extension-image";
 import { TableOfContents } from "@tiptap/extension-table-of-contents";
 import { skipTrailingNodeMeta, Placeholder } from "@tiptap/extensions";
 import { NodeViewWrapper, ReactNodeViewRenderer, useEditorState, ReactRenderer, NodeViewContent, useEditor, EditorContent } from "@tiptap/react";
+import { Extension, Node as Node$1, mergeAttributes } from "@tiptap/core";
 import { createPortal } from "react-dom";
 import { useState, useEffect, useCallback, useRef, useMemo, forwardRef, useImperativeHandle, Fragment as Fragment$1, useLayoutEffect, useId, useContext, createContext } from "react";
-import { e as enrichMarkdownCitations, c as styles$a } from "./ReportContent-MgbebxPV.js";
-import { R as R2, a as a2, b as b2, s as s2 } from "./ReportContent-MgbebxPV.js";
-import { C as CitationRef, i as mergeCommentIntervals, h as mapCommentAnchors, p as prepareChartMarkdown, j as reportChart, b as baseExtensions, f as CommentMark, l as lowlight, m as makeTocGetId, k as parseCodeTokenAsChartOrCodeBlock, a as pureCodeBlock, c as pureImage, n as renderMathInto, o as subscribeMathClick, d as pureChart } from "./extractToc-BaR6LP1f.js";
-import { g, e, s as s3 } from "./extractToc-BaR6LP1f.js";
+import { e as enrichMarkdownCitations, c as styles$c } from "./ReportContent-B8jIzhy3.js";
+import { R as R2, a as a2, b as b2, s as s2 } from "./ReportContent-B8jIzhy3.js";
+import { C as CitationRef, i as mergeCommentIntervals, h as mapCommentAnchors, n as normalizeImageAlign, p as prepareChartMarkdown, j as reportChart, b as baseExtensions, f as CommentMark, l as lowlight, m as makeTocGetId, k as parseCodeTokenAsChartOrCodeBlock, o as imageMarkdownTokenizer, q as imageParseMarkdown, t as imageRenderMarkdown, u as imageNodeHtml, v as imageFigureParseRule, w as imageCaptionAttribute, x as imageAlignAttribute, y as normalizeImageCaption, a as pureCodeBlock, c as pureImage, z as renderMathInto, A as subscribeMathClick, d as pureChart } from "./extractToc-CGrBMGvM.js";
+import { P, g, e, s as s3 } from "./extractToc-CGrBMGvM.js";
 import { Slice, Fragment } from "@tiptap/pm/model";
-import { Extension, Node as Node$1 } from "@tiptap/core";
-import { PluginKey, Plugin, NodeSelection, TextSelection } from "@tiptap/pm/state";
+import { PluginKey, Plugin, Selection, TextSelection, NodeSelection } from "@tiptap/pm/state";
 import { DecorationSet, Decoration } from "@tiptap/pm/view";
 import Suggestion from "@tiptap/suggestion";
 import { FileHandlePlugin } from "@tiptap/extension-file-handler";
@@ -425,6 +425,71 @@ const ImageIcon = (p) => /* @__PURE__ */ jsxs(Svg, { ...p, children: [
   /* @__PURE__ */ jsx("circle", { cx: "9", cy: "9", r: "2" }),
   /* @__PURE__ */ jsx("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" })
 ] });
+const BlockSvg = ({ size = "1em", children, ...rest }) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: size,
+    height: size,
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    stroke: "none",
+    "aria-hidden": "true",
+    focusable: "false",
+    ...rest,
+    children
+  }
+);
+const AlignLeftIcon = (p) => /* @__PURE__ */ jsxs(BlockSvg, { ...p, children: [
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "3.4", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "8.6", width: "12", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "13.8", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "19", width: "12", height: "2.4", rx: "1.2" })
+] });
+const AlignCenterIcon = (p) => /* @__PURE__ */ jsxs(BlockSvg, { ...p, children: [
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "3.4", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "6", y: "8.6", width: "12", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "13.8", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "6", y: "19", width: "12", height: "2.4", rx: "1.2" })
+] });
+const AlignRightIcon = (p) => /* @__PURE__ */ jsxs(BlockSvg, { ...p, children: [
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "3.4", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "9", y: "8.6", width: "12", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "13.8", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "9", y: "19", width: "12", height: "2.4", rx: "1.2" })
+] });
+const AlignJustifyIcon = (p) => /* @__PURE__ */ jsxs(BlockSvg, { ...p, children: [
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "3.4", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "8.6", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "13.8", width: "18", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "3", y: "19", width: "18", height: "2.4", rx: "1.2" })
+] });
+const IndentIncreaseIcon = (p) => /* @__PURE__ */ jsxs(BlockSvg, { ...p, children: [
+  /* @__PURE__ */ jsx("path", { d: "M3 6.6 8.5 10.8 3 15 Z" }),
+  /* @__PURE__ */ jsx("rect", { x: "10.5", y: "3.6", width: "10.5", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "10.5", y: "10.8", width: "10.5", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "10.5", y: "18", width: "10.5", height: "2.4", rx: "1.2" })
+] });
+const IndentDecreaseIcon = (p) => /* @__PURE__ */ jsxs(BlockSvg, { ...p, children: [
+  /* @__PURE__ */ jsx("path", { d: "M8.5 6.6 3 10.8 8.5 15 Z" }),
+  /* @__PURE__ */ jsx("rect", { x: "10.5", y: "3.6", width: "10.5", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "10.5", y: "10.8", width: "10.5", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "10.5", y: "18", width: "10.5", height: "2.4", rx: "1.2" })
+] });
+const LineHeightIcon = (p) => /* @__PURE__ */ jsxs(BlockSvg, { ...p, children: [
+  /* @__PURE__ */ jsx("rect", { x: "1.8", y: "4.4", width: "2.4", height: "15.2", rx: "1.2" }),
+  /* @__PURE__ */ jsx("path", { d: "M3 2.4 5.4 5.8 H0.6 Z" }),
+  /* @__PURE__ */ jsx("path", { d: "M3 21.6 0.6 18.2 H5.4 Z" }),
+  /* @__PURE__ */ jsx("rect", { x: "9", y: "5.6", width: "12", height: "2.4", rx: "1.2" }),
+  /* @__PURE__ */ jsx("rect", { x: "9", y: "16", width: "12", height: "2.4", rx: "1.2" })
+] });
+const CaptionsIcon = (p) => /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+  /* @__PURE__ */ jsx("rect", { width: "18", height: "14", x: "3", y: "5", rx: "2", ry: "2" }),
+  /* @__PURE__ */ jsx("path", { d: "M7 15h4" }),
+  /* @__PURE__ */ jsx("path", { d: "M15 15h2" }),
+  /* @__PURE__ */ jsx("path", { d: "M7 11h2" }),
+  /* @__PURE__ */ jsx("path", { d: "M13 11h4" })
+] });
 const ImportIcon = (p) => /* @__PURE__ */ jsxs(Svg, { ...p, children: [
   /* @__PURE__ */ jsx("path", { d: "M12 3v12" }),
   /* @__PURE__ */ jsx("path", { d: "m8 11 4 4 4-4" }),
@@ -601,6 +666,16 @@ const defaultToolbarLabels = {
   superscript: "Superscript",
   subscript: "Subscript",
   link: "Link",
+  align: "Alignment",
+  alignLeft: "Align left",
+  alignCenter: "Align center",
+  alignRight: "Align right",
+  alignJustify: "Justify",
+  indent: "Indent",
+  indentIncrease: "Increase indent",
+  indentDecrease: "Decrease indent",
+  lineHeight: "Line height",
+  lineHeightDefault: "Default",
   linkPrompt: "Enter URL",
   linkApply: "Apply link",
   linkOpen: "Open in new window",
@@ -608,6 +683,12 @@ const defaultToolbarLabels = {
   linkInvalid: "The editor rejected this address",
   image: "Image",
   imageUploadFailed: "Image upload failed",
+  imageAlign: "Image alignment",
+  imageAlignLeft: "Align left",
+  imageAlignCenter: "Align center",
+  imageAlignRight: "Align right",
+  imageCaption: "Caption",
+  imageCaptionPlaceholder: "Add a caption…",
   importMarkdownFailed: "Markdown import failed",
   importDocument: "Import",
   importDocumentHint: "Import a file",
@@ -697,7 +778,12 @@ const defaultShortcutLabels = {
   undo: "Undo",
   redo: "Redo",
   hardBreak: "Hard break",
-  findReplace: "Find & replace"
+  findReplace: "Find & replace",
+  alignLeft: "Align left",
+  alignCenter: "Align center",
+  alignRight: "Align right",
+  alignJustify: "Justify",
+  imageUpload: "Upload image"
 };
 const defaultLinkPopoverLabels = {
   field: "Enter URL",
@@ -746,28 +832,41 @@ const defaultFindLabels = {
   invalidRegex: "Invalid pattern",
   readOnly: "Read-only"
 };
-const bar = "_bar_1h61e_3";
+const defaultImageUploadLabels = {
+  dropzoneClick: "Click to upload",
+  dropzoneRest: " or drag and drop",
+  dropzoneLimits: (limit, maxSizeMb) => {
+    const count = `Maximum ${limit} file${limit === 1 ? "" : "s"}`;
+    return maxSizeMb == null ? `${count}.` : `${count}, ${maxSizeMb}MB each.`;
+  },
+  uploadingCount: (count) => `Uploading ${count} files`,
+  clearAll: "Clear all",
+  remove: "Remove",
+  failed: "Upload failed",
+  fallbackAlt: "image"
+};
+const bar$1 = "_bar_1h61e_3";
 const row$1 = "_row_1h61e_25";
 const field$1 = "_field_1h61e_43";
 const fieldIcon = "_fieldIcon_1h61e_62";
 const input$1 = "_input_1h61e_67";
 const counter = "_counter_1h61e_79";
 const counterInvalid = "_counterInvalid_1h61e_89";
-const btn$2 = "_btn_1h61e_93";
+const btn$3 = "_btn_1h61e_93";
 const toggle = "_toggle_1h61e_29";
 const toggleOn = "_toggleOn_1h61e_135";
 const iconGroup = "_iconGroup_1h61e_29";
 const spacer = "_spacer_1h61e_150";
 const readOnly = "_readOnly_1h61e_155";
-const styles$9 = {
-  bar,
+const styles$b = {
+  bar: bar$1,
   row: row$1,
   field: field$1,
   fieldIcon,
   input: input$1,
   counter,
   counterInvalid,
-  btn: btn$2,
+  btn: btn$3,
   toggle,
   toggleOn,
   iconGroup,
@@ -883,11 +982,11 @@ function FindReplaceBar({
     });
   };
   if (!hasExtension) return null;
-  const toggleClass = (on) => `${styles$9.btn} ${styles$9.toggle}${on ? ` ${styles$9.toggleOn}` : ""}`;
+  const toggleClass = (on) => `${styles$b.btn} ${styles$b.toggle}${on ? ` ${styles$b.toggleOn}` : ""}`;
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: className ? `${styles$9.bar} ${className}` : styles$9.bar,
+      className: className ? `${styles$b.bar} ${className}` : styles$b.bar,
       style,
       "data-find-bar": "",
       role: "dialog",
@@ -900,14 +999,14 @@ function FindReplaceBar({
         onClose();
       },
       children: [
-        /* @__PURE__ */ jsxs("div", { className: styles$9.row, children: [
-          /* @__PURE__ */ jsxs("span", { className: styles$9.field, children: [
-            /* @__PURE__ */ jsx(SearchIcon, { size: 14, className: styles$9.fieldIcon }),
+        /* @__PURE__ */ jsxs("div", { className: styles$b.row, children: [
+          /* @__PURE__ */ jsxs("span", { className: styles$b.field, children: [
+            /* @__PURE__ */ jsx(SearchIcon, { size: 14, className: styles$b.fieldIcon }),
             /* @__PURE__ */ jsx(
               "input",
               {
                 ref: inputRef,
-                className: styles$9.input,
+                className: styles$b.input,
                 "data-find-field": "search",
                 value: term,
                 onChange: (e2) => setTerm(e2.target.value),
@@ -921,7 +1020,7 @@ function FindReplaceBar({
             /* @__PURE__ */ jsx(
               "span",
               {
-                className: `${styles$9.counter}${invalidPattern ? ` ${styles$9.counterInvalid}` : ""}`,
+                className: `${styles$b.counter}${invalidPattern ? ` ${styles$b.counterInvalid}` : ""}`,
                 "data-find-counter": "",
                 "aria-live": "polite",
                 title: invalidPattern ? t.invalidRegex : void 0,
@@ -957,13 +1056,13 @@ function FindReplaceBar({
               children: "ab"
             }
           ),
-          /* @__PURE__ */ jsx("span", { className: styles$9.spacer }),
-          /* @__PURE__ */ jsxs("span", { className: styles$9.iconGroup, children: [
+          /* @__PURE__ */ jsx("span", { className: styles$b.spacer }),
+          /* @__PURE__ */ jsxs("span", { className: styles$b.iconGroup, children: [
             /* @__PURE__ */ jsx(
               "button",
               {
                 type: "button",
-                className: styles$9.btn,
+                className: styles$b.btn,
                 "data-find-action": "previous",
                 title: t.previous,
                 "aria-label": t.previous,
@@ -977,7 +1076,7 @@ function FindReplaceBar({
               "button",
               {
                 type: "button",
-                className: styles$9.btn,
+                className: styles$b.btn,
                 "data-find-action": "next",
                 title: t.next,
                 "aria-label": t.next,
@@ -991,7 +1090,7 @@ function FindReplaceBar({
               "button",
               {
                 type: "button",
-                className: styles$9.btn,
+                className: styles$b.btn,
                 "data-find-action": "close",
                 title: t.close,
                 "aria-label": t.close,
@@ -1001,11 +1100,11 @@ function FindReplaceBar({
             )
           ] })
         ] }),
-        editor.isEditable ? /* @__PURE__ */ jsxs("div", { className: styles$9.row, children: [
-          /* @__PURE__ */ jsx("span", { className: styles$9.field, children: /* @__PURE__ */ jsx(
+        editor.isEditable ? /* @__PURE__ */ jsxs("div", { className: styles$b.row, children: [
+          /* @__PURE__ */ jsx("span", { className: styles$b.field, children: /* @__PURE__ */ jsx(
             "input",
             {
-              className: styles$9.input,
+              className: styles$b.input,
               "data-find-field": "replace",
               value: replaceTerm,
               onChange: (e2) => setReplaceTerm(e2.target.value),
@@ -1015,12 +1114,12 @@ function FindReplaceBar({
               spellCheck: false
             }
           ) }),
-          /* @__PURE__ */ jsx("span", { className: styles$9.spacer }),
+          /* @__PURE__ */ jsx("span", { className: styles$b.spacer }),
           /* @__PURE__ */ jsx(
             "button",
             {
               type: "button",
-              className: styles$9.btn,
+              className: styles$b.btn,
               "data-find-action": "replace",
               title: t.replaceOne,
               "aria-label": t.replaceOne,
@@ -1034,7 +1133,7 @@ function FindReplaceBar({
             "button",
             {
               type: "button",
-              className: styles$9.btn,
+              className: styles$b.btn,
               "data-find-action": "replace-all",
               title: t.replaceAll,
               "aria-label": t.replaceAll,
@@ -1044,7 +1143,7 @@ function FindReplaceBar({
               children: /* @__PURE__ */ jsx(ReplaceAllIcon, { size: 16 })
             }
           )
-        ] }) : /* @__PURE__ */ jsx("div", { className: styles$9.row, children: /* @__PURE__ */ jsx("span", { className: styles$9.readOnly, children: t.readOnly }) })
+        ] }) : /* @__PURE__ */ jsx("div", { className: styles$b.row, children: /* @__PURE__ */ jsx("span", { className: styles$b.readOnly, children: t.readOnly }) })
       ]
     }
   );
@@ -1131,6 +1230,515 @@ const ImportPlaceholder = Node$1.create({
     };
   }
 });
+const wrap = "_wrap_1k6n1_8";
+const dropzone = "_dropzone_1k6n1_24";
+const dragActive = "_dragActive_1k6n1_43";
+const dragOver = "_dragOver_1k6n1_51";
+const fileShape = "_fileShape_1k6n1_56";
+const fileShapeDoc = "_fileShapeDoc_1k6n1_65";
+const fileShapeCorner = "_fileShapeCorner_1k6n1_71";
+const fileBadge = "_fileBadge_1k6n1_78";
+const text = "_text_1k6n1_92";
+const textMain = "_textMain_1k6n1_100";
+const textEm = "_textEm_1k6n1_107";
+const subtext = "_subtext_1k6n1_112";
+const previews = "_previews_1k6n1_121";
+const header$2 = "_header_1k6n1_127";
+const clearAll = "_clearAll_1k6n1_139";
+const preview = "_preview_1k6n1_121";
+const progress = "_progress_1k6n1_161";
+const previewContent = "_previewContent_1k6n1_169";
+const fileInfo = "_fileInfo_1k6n1_180";
+const fileIcon = "_fileIcon_1k6n1_187";
+const details = "_details_1k6n1_199";
+const fileName = "_fileName_1k6n1_205";
+const actions = "_actions_1k6n1_215";
+const progressText = "_progressText_1k6n1_222";
+const remove = "_remove_1k6n1_228";
+const styles$a = {
+  wrap,
+  dropzone,
+  dragActive,
+  dragOver,
+  fileShape,
+  fileShapeDoc,
+  fileShapeCorner,
+  fileBadge,
+  text,
+  textMain,
+  textEm,
+  subtext,
+  previews,
+  header: header$2,
+  clearAll,
+  preview,
+  progress,
+  previewContent,
+  fileInfo,
+  fileIcon,
+  details,
+  fileName,
+  actions,
+  progressText,
+  remove
+};
+let seq = 0;
+const nextId = () => `image-upload-${++seq}`;
+function formatFileSize(bytes) {
+  if (bytes <= 0) return "0 B";
+  const units = ["B", "KB", "MB", "GB"];
+  const i = Math.min(
+    Math.floor(Math.log(bytes) / Math.log(1024)),
+    units.length - 1
+  );
+  return `${parseFloat((bytes / 1024 ** i).toFixed(1))} ${units[i]}`;
+}
+const toMb = (bytes) => parseFloat((bytes / 1024 / 1024).toFixed(1));
+function focusNextNode(editor) {
+  const { state, view } = editor;
+  const next = Selection.findFrom(state.selection.$to, 1, true);
+  if (next) {
+    view.dispatch(state.tr.setSelection(next).scrollIntoView());
+    return;
+  }
+  const paragraph = state.schema.nodes.paragraph;
+  if (!paragraph) return;
+  const end = state.doc.content.size;
+  const tr = state.tr.insert(end, paragraph.create());
+  view.dispatch(
+    tr.setSelection(TextSelection.near(tr.doc.resolve(end + 1))).scrollIntoView()
+  );
+}
+function ImageUploadView(props) {
+  const { node, extension, editor, getPos } = props;
+  const options = extension.options;
+  const labels = {
+    ...defaultImageUploadLabels,
+    ...options.labels
+  };
+  const accept = String(node.attrs.accept ?? "image/*");
+  const limit = Number(node.attrs.limit ?? 1) || 1;
+  const maxSize = Number(node.attrs.maxSize ?? 0) || 0;
+  const [items, setItems] = useState([]);
+  const [dragActive2, setDragActive] = useState(false);
+  const [dragOver2, setDragOver] = useState(false);
+  const inputRef = useRef(null);
+  const itemsRef = useRef(items);
+  itemsRef.current = items;
+  useEffect(
+    () => () => itemsRef.current.forEach((it) => it.abort.abort()),
+    []
+  );
+  const patchItem = (id, partial) => {
+    setItems(
+      (prev) => prev.map((it) => it.id === id ? { ...it, ...partial } : it)
+    );
+  };
+  const uploadOne = async (file) => {
+    var _a, _b, _c, _d;
+    if (maxSize > 0 && file.size > maxSize) {
+      (_a = options.onError) == null ? void 0 : _a.call(
+        options,
+        new Error(
+          `File size exceeds the maximum of ${formatFileSize(maxSize)}`
+        )
+      );
+      return null;
+    }
+    if (!options.upload) {
+      (_b = options.onError) == null ? void 0 : _b.call(options, new Error("Upload function is not defined"));
+      return null;
+    }
+    const abort = new AbortController();
+    const id = nextId();
+    setItems((prev) => [
+      ...prev,
+      { id, file, progress: 0, status: "uploading", abort }
+    ]);
+    try {
+      const url = await options.upload(
+        file,
+        ({ progress: progress2 }) => patchItem(id, { progress: progress2 }),
+        abort.signal
+      );
+      if (!url) throw new Error("Upload returned no URL");
+      if (abort.signal.aborted) return null;
+      (_c = options.onSuccess) == null ? void 0 : _c.call(options, url);
+      return url;
+    } catch (err) {
+      if (!abort.signal.aborted) {
+        patchItem(id, { status: "error", progress: 0 });
+        (_d = options.onError) == null ? void 0 : _d.call(options, err instanceof Error ? err : new Error(String(err)));
+      }
+      return null;
+    }
+  };
+  const uploadFiles = async (files) => {
+    var _a;
+    if (files.length === 0) return;
+    if (limit > 0 && files.length > limit) {
+      (_a = options.onError) == null ? void 0 : _a.call(
+        options,
+        new Error(`Maximum ${limit} file${limit === 1 ? "" : "s"} at a time`)
+      );
+      return;
+    }
+    const settled = await Promise.all(
+      files.map(async (file) => ({ file, url: await uploadOne(file) }))
+    );
+    const uploaded = settled.filter(
+      (s4) => s4.url != null
+    );
+    if (uploaded.length === 0) return;
+    const pos = getPos();
+    if (typeof pos !== "number") return;
+    const imageType = options.type ?? "image";
+    const nodes = uploaded.map(({ file, url }) => {
+      const alt = file.name.replace(/\.[^/.]+$/, "") || labels.fallbackAlt;
+      return { type: imageType, attrs: { src: url, alt, title: alt } };
+    });
+    editor.chain().focus().deleteRange({ from: pos, to: pos + node.nodeSize }).insertContentAt(pos, nodes).run();
+    focusNextNode(editor);
+  };
+  const removeItem = (id) => {
+    var _a;
+    (_a = itemsRef.current.find((it) => it.id === id)) == null ? void 0 : _a.abort.abort();
+    setItems((prev) => prev.filter((it) => it.id !== id));
+  };
+  const clearAll2 = () => {
+    itemsRef.current.forEach((it) => it.abort.abort());
+    setItems([]);
+  };
+  const openPicker = () => {
+    if (!editor.isEditable || items.length > 0) return;
+    const input2 = inputRef.current;
+    if (!input2) return;
+    input2.value = "";
+    input2.click();
+  };
+  const onInputChange = (e2) => {
+    const files = Array.from(e2.target.files ?? []);
+    e2.target.value = "";
+    if (files.length > 0) void uploadFiles(files);
+  };
+  const onDrop = (e2) => {
+    e2.preventDefault();
+    e2.stopPropagation();
+    setDragActive(false);
+    setDragOver(false);
+    const files = Array.from(e2.dataTransfer.files);
+    if (files.length > 0) void uploadFiles(files);
+  };
+  const editable = editor.isEditable;
+  const hasFiles = items.length > 0;
+  const maxSizeMb = maxSize > 0 ? toMb(maxSize) : null;
+  const dropzoneClass = [
+    styles$a.dropzone,
+    dragActive2 ? styles$a.dragActive : "",
+    dragOver2 ? styles$a.dragOver : ""
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(
+    NodeViewWrapper,
+    {
+      className: styles$a.wrap,
+      "data-image-upload": "",
+      tabIndex: editable ? 0 : void 0,
+      onClick: openPicker,
+      children: [
+        !hasFiles ? /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: dropzoneClass,
+            "data-image-upload-dropzone": "",
+            role: editable ? "button" : void 0,
+            "aria-label": editable ? `${labels.dropzoneClick}${labels.dropzoneRest}` : void 0,
+            onDragEnter: (e2) => {
+              e2.preventDefault();
+              e2.stopPropagation();
+              setDragActive(true);
+            },
+            onDragOver: (e2) => {
+              e2.preventDefault();
+              e2.stopPropagation();
+              setDragOver(true);
+            },
+            onDragLeave: (e2) => {
+              e2.preventDefault();
+              e2.stopPropagation();
+              if (!e2.currentTarget.contains(e2.relatedTarget)) {
+                setDragActive(false);
+                setDragOver(false);
+              }
+            },
+            onDrop,
+            children: [
+              /* @__PURE__ */ jsxs("span", { className: styles$a.fileShape, "aria-hidden": true, children: [
+                /* @__PURE__ */ jsx(FileDocIcon, {}),
+                /* @__PURE__ */ jsx(FileCornerIcon, {}),
+                /* @__PURE__ */ jsx("span", { className: styles$a.fileBadge, children: /* @__PURE__ */ jsx(CloudUploadIcon, {}) })
+              ] }),
+              /* @__PURE__ */ jsxs("span", { className: styles$a.text, children: [
+                /* @__PURE__ */ jsxs("span", { className: styles$a.textMain, children: [
+                  /* @__PURE__ */ jsx("em", { className: styles$a.textEm, children: labels.dropzoneClick }),
+                  labels.dropzoneRest
+                ] }),
+                /* @__PURE__ */ jsx("span", { className: styles$a.subtext, children: labels.dropzoneLimits(limit, maxSizeMb) })
+              ] })
+            ]
+          }
+        ) : /* @__PURE__ */ jsxs("div", { className: styles$a.previews, "data-image-upload-list": "", children: [
+          items.length > 1 && /* @__PURE__ */ jsxs("div", { className: styles$a.header, children: [
+            /* @__PURE__ */ jsx("span", { children: labels.uploadingCount(items.length) }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: styles$a.clearAll,
+                onClick: (e2) => {
+                  e2.stopPropagation();
+                  clearAll2();
+                },
+                children: labels.clearAll
+              }
+            )
+          ] }),
+          items.map((it) => /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: styles$a.preview,
+              "data-image-upload-item": "",
+              children: [
+                it.status === "uploading" && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: styles$a.progress,
+                    style: { width: `${it.progress}%` },
+                    "aria-hidden": true
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: styles$a.previewContent, children: [
+                  /* @__PURE__ */ jsxs("span", { className: styles$a.fileInfo, children: [
+                    /* @__PURE__ */ jsx("span", { className: styles$a.fileIcon, "aria-hidden": true, children: /* @__PURE__ */ jsx(CloudUploadIcon, {}) }),
+                    /* @__PURE__ */ jsxs("span", { className: styles$a.details, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$a.fileName, children: it.file.name }),
+                      /* @__PURE__ */ jsx("span", { className: styles$a.subtext, children: it.status === "error" ? labels.failed : formatFileSize(it.file.size) })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs("span", { className: styles$a.actions, children: [
+                    it.status === "uploading" && /* @__PURE__ */ jsxs("span", { className: styles$a.progressText, children: [
+                      Math.round(it.progress),
+                      "%"
+                    ] }),
+                    /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        className: styles$a.remove,
+                        "data-image-upload-remove": "",
+                        title: labels.remove,
+                        "aria-label": labels.remove,
+                        onClick: (e2) => {
+                          e2.stopPropagation();
+                          removeItem(it.id);
+                        },
+                        children: /* @__PURE__ */ jsx(XIcon, { size: 14 })
+                      }
+                    )
+                  ] })
+                ] })
+              ]
+            },
+            it.id
+          ))
+        ] }),
+        editable && /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: inputRef,
+            type: "file",
+            accept,
+            multiple: limit > 1,
+            hidden: true,
+            onChange: onInputChange,
+            onClick: (e2) => e2.stopPropagation()
+          }
+        )
+      ]
+    }
+  );
+}
+function CloudUploadIcon({ size = 14 }) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      "aria-hidden": true,
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "M11.1953 4.41771C10.3478 4.08499 9.43578 3.94949 8.5282 4.02147C7.62062 4.09345 6.74133 4.37102 5.95691 4.83316C5.1725 5.2953 4.50354 5.92989 4.00071 6.68886C3.49788 7.44783 3.17436 8.31128 3.05465 9.2138C2.93495 10.1163 3.0222 11.0343 3.3098 11.8981C3.5974 12.7619 4.07781 13.5489 4.71463 14.1995C5.10094 14.5942 5.09414 15.2274 4.69945 15.6137C4.30476 16 3.67163 15.9932 3.28532 15.5985C2.43622 14.731 1.79568 13.6816 1.41221 12.5299C1.02875 11.3781 0.91241 10.1542 1.07201 8.95084C1.23162 7.74748 1.66298 6.59621 2.33343 5.58425C3.00387 4.57229 3.89581 3.72617 4.9417 3.10998C5.98758 2.4938 7.15998 2.1237 8.37008 2.02773C9.58018 1.93176 10.7963 2.11243 11.9262 2.55605C13.0561 2.99968 14.0703 3.69462 14.8919 4.58825C15.5423 5.29573 16.0585 6.11304 16.4177 7.00002H17.4999C18.6799 6.99991 19.8288 7.37933 20.7766 8.08222C21.7245 8.78515 22.4212 9.7743 22.7637 10.9036C23.1062 12.0328 23.0765 13.2423 22.6788 14.3534C22.2812 15.4644 21.5367 16.4181 20.5554 17.0736C20.0962 17.3803 19.4752 17.2567 19.1684 16.7975C18.8617 16.3382 18.9853 15.7172 19.4445 15.4105C20.069 14.9934 20.5427 14.3865 20.7958 13.6794C21.0488 12.9724 21.0678 12.2027 20.8498 11.4841C20.6318 10.7655 20.1885 10.136 19.5853 9.6887C18.9821 9.24138 18.251 8.99993 17.5001 9.00002H15.71C15.2679 9.00002 14.8783 8.70973 14.7518 8.28611C14.4913 7.41374 14.0357 6.61208 13.4195 5.94186C12.8034 5.27164 12.0427 4.75043 11.1953 4.41771Z" }),
+        /* @__PURE__ */ jsx("path", { d: "M11 14.4142V21C11 21.5523 11.4477 22 12 22C12.5523 22 13 21.5523 13 21V14.4142L15.2929 16.7071C15.6834 17.0976 16.3166 17.0976 16.7071 16.7071C17.0976 16.3166 17.0976 15.6834 16.7071 15.2929L12.7078 11.2936C12.7054 11.2912 12.703 11.2888 12.7005 11.2864C12.5208 11.1099 12.2746 11.0008 12.003 11L12 11L11.997 11C11.8625 11.0004 11.7343 11.0273 11.6172 11.0759C11.502 11.1236 11.3938 11.1937 11.2995 11.2864C11.297 11.2888 11.2946 11.2912 11.2922 11.2936L7.29289 15.2929C6.90237 15.6834 6.90237 16.3166 7.29289 16.7071C7.68342 17.0976 8.31658 17.0976 8.70711 16.7071L11 14.4142Z" })
+      ]
+    }
+  );
+}
+function FileDocIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: "43",
+      height: "57",
+      viewBox: "0 0 43 57",
+      fill: "none",
+      "aria-hidden": true,
+      className: styles$a.fileShapeDoc,
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M0.75 10.75C0.75 5.64137 4.89137 1.5 10 1.5H32.3431C33.2051 1.5 34.0317 1.84241 34.6412 2.4519L40.2981 8.10876C40.9076 8.71825 41.25 9.5449 41.25 10.4069V46.75C41.25 51.8586 37.1086 56 32 56H10C4.89137 56 0.75 51.8586 0.75 46.75V10.75Z",
+          fill: "currentColor",
+          fillOpacity: "0.11",
+          stroke: "currentColor",
+          strokeWidth: "1.5"
+        }
+      )
+    }
+  );
+}
+function FileCornerIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: "10",
+      height: "10",
+      viewBox: "0 0 10 10",
+      fill: "currentColor",
+      "aria-hidden": true,
+      className: styles$a.fileShapeCorner,
+      children: /* @__PURE__ */ jsx("path", { d: "M0 0.75H0.343146C1.40401 0.75 2.42143 1.17143 3.17157 1.92157L8.82843 7.57843C9.57857 8.32857 10 9.34599 10 10.4069V10.75H4C1.79086 10.75 0 8.95914 0 6.75V0.75Z" })
+    }
+  );
+}
+function hasImageUpload(editor) {
+  return editor.extensionManager.extensions.some(
+    (ext) => ext.name === ImageUploadNode.name
+  );
+}
+const ImageUploadNode = Node$1.create({
+  name: "imageUpload",
+  group: "block",
+  atom: true,
+  draggable: true,
+  selectable: true,
+  addOptions() {
+    return {
+      upload: void 0,
+      accept: "image/*",
+      limit: 1,
+      maxSize: 0,
+      type: "image",
+      onError: void 0,
+      onSuccess: void 0,
+      labels: void 0
+    };
+  },
+  addAttributes() {
+    return {
+      accept: { default: this.options.accept },
+      limit: { default: this.options.limit },
+      maxSize: { default: this.options.maxSize }
+    };
+  },
+  parseHTML() {
+    return [{ tag: 'div[data-type="image-upload"]' }];
+  },
+  renderHTML({ HTMLAttributes }) {
+    return [
+      "div",
+      mergeAttributes({ "data-type": "image-upload" }, HTMLAttributes)
+    ];
+  },
+  /** 占位块不进 Markdown（与 ImportPlaceholder 同）：上传中的状态不该被保存。 */
+  renderMarkdown() {
+    return "";
+  },
+  addNodeView() {
+    return ReactNodeViewRenderer(ImageUploadView);
+  },
+  addCommands() {
+    return {
+      setImageUploadNode: (options) => ({ commands }) => commands.insertContent({ type: this.name, attrs: options })
+    };
+  },
+  addKeyboardShortcuts() {
+    return {
+      // 官方图片按钮的快捷键（Cmd/Ctrl+Shift+I）。Windows 上 Ctrl+Shift+I 是
+      // DevTools 的键位，冲突时浏览器优先——与官方行为一致。
+      "Mod-Shift-i": () => this.editor.commands.setImageUploadNode(),
+      // 选中占位块时按 Enter = 打开文件选择框。借 NodeView 的点击路径（NodeViewWrapper
+      // 外包一层 div，所以要点它的第一个子元素），与官方同款实现。
+      Enter: ({ editor }) => {
+        const { selection } = editor.state;
+        const { nodeAfter } = selection.$from;
+        if ((nodeAfter == null ? void 0 : nodeAfter.type.name) !== this.name || !editor.isActive(this.name)) {
+          return false;
+        }
+        const nodeEl = editor.view.nodeDOM(selection.$from.pos);
+        const clickable = nodeEl instanceof HTMLElement ? nodeEl.firstChild : null;
+        if (clickable instanceof HTMLElement) {
+          clickable.click();
+          return true;
+        }
+        return false;
+      }
+    };
+  }
+});
+function findImagePos(editor) {
+  var _a, _b;
+  const { selection } = editor.state;
+  if (selection instanceof NodeSelection && selection.node.type.name === "image") {
+    return selection.from;
+  }
+  const { $from } = selection;
+  if (((_a = $from.nodeAfter) == null ? void 0 : _a.type.name) === "image") return $from.pos;
+  if (((_b = $from.nodeBefore) == null ? void 0 : _b.type.name) === "image") {
+    return $from.pos - $from.nodeBefore.nodeSize;
+  }
+  return null;
+}
+function readAlign(editor, pos) {
+  var _a;
+  return normalizeImageAlign((_a = editor.state.doc.nodeAt(pos)) == null ? void 0 : _a.attrs.align);
+}
+function isImageAlignActive(editor, align) {
+  const pos = findImagePos(editor);
+  return pos != null && readAlign(editor, pos) === align;
+}
+function setImageAlign(editor, align) {
+  const pos = findImagePos(editor);
+  if (pos == null) return false;
+  if (readAlign(editor, pos) === align) return true;
+  return editor.chain().focus().setNodeSelection(pos).updateAttributes("image", { align }).run();
+}
+function setImageAlignAtPos(editor, pos, align) {
+  const node = editor.state.doc.nodeAt(pos);
+  if (!node || node.type.name !== "image") return false;
+  if (normalizeImageAlign(node.attrs.align) === align) return true;
+  editor.view.dispatch(editor.state.tr.setNodeAttribute(pos, "align", align));
+  return true;
+}
+function setImageAlignAt(editor, imageElement, align) {
+  try {
+    const pos = editor.view.posAtDOM(imageElement, 0);
+    const node = editor.state.doc.nodeAt(pos);
+    if (!node || node.type.name !== "image") return false;
+    return setImageAlignAtPos(editor, pos, align);
+  } catch {
+    return false;
+  }
+}
 const popupHost = "_popupHost_1noza_11";
 const menu$1 = "_menu_1noza_1";
 const groupLabel = "_groupLabel_1noza_43";
@@ -1138,7 +1746,7 @@ const item$1 = "_item_1noza_53";
 const itemActive = "_itemActive_1noza_54";
 const itemIcon = "_itemIcon_1noza_79";
 const itemTitle = "_itemTitle_1noza_102";
-const styles$8 = {
+const styles$9 = {
   popupHost,
   menu: menu$1,
   groupLabel,
@@ -1327,11 +1935,11 @@ const SlashMenuPopup = forwardRef(function SlashMenuPopup2({ items, query, menuL
   );
   if (!items.length) return null;
   let optionIndex = -1;
-  return /* @__PURE__ */ jsx("div", { className: styles$8.menu, role: "listbox", "aria-label": menuLabel, children: withGroupHeaders(items).map(([header2, item2]) => {
+  return /* @__PURE__ */ jsx("div", { className: styles$9.menu, role: "listbox", "aria-label": menuLabel, children: withGroupHeaders(items).map(([header2, item2]) => {
     optionIndex += 1;
     const i = optionIndex;
     return /* @__PURE__ */ jsxs(Fragment$1, { children: [
-      header2 !== null ? /* @__PURE__ */ jsx("div", { className: styles$8.groupLabel, "aria-hidden": "true", children: header2 }) : null,
+      header2 !== null ? /* @__PURE__ */ jsx("div", { className: styles$9.groupLabel, "aria-hidden": "true", children: header2 }) : null,
       /* @__PURE__ */ jsxs(
         "button",
         {
@@ -1339,7 +1947,7 @@ const SlashMenuPopup = forwardRef(function SlashMenuPopup2({ items, query, menuL
           role: "option",
           "aria-selected": i === index,
           title: item2.title,
-          className: i === index ? styles$8.itemActive : styles$8.item,
+          className: i === index ? styles$9.itemActive : styles$9.item,
           tabIndex: -1,
           onMouseEnter: () => setIndex(i),
           onMouseDown: (e2) => {
@@ -1347,8 +1955,8 @@ const SlashMenuPopup = forwardRef(function SlashMenuPopup2({ items, query, menuL
             command(item2);
           },
           children: [
-            item2.icon != null ? /* @__PURE__ */ jsx("span", { className: styles$8.itemIcon, "aria-hidden": "true", children: item2.icon }) : /* @__PURE__ */ jsx("span", { className: styles$8.itemIcon, "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx("span", { className: styles$8.itemTitle, children: item2.title })
+            item2.icon != null ? /* @__PURE__ */ jsx("span", { className: styles$9.itemIcon, "aria-hidden": "true", children: item2.icon }) : /* @__PURE__ */ jsx("span", { className: styles$9.itemIcon, "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx("span", { className: styles$9.itemTitle, children: item2.title })
           ]
         }
       )
@@ -1399,7 +2007,7 @@ const SlashMenu = Extension.create({
                   menuLabel: ((_a = this.options.labels) == null ? void 0 : _a.menuLabel) ?? defaultSlashMenuLabels.menuLabel,
                   command: props.command
                 },
-                className: styles$8.popupHost
+                className: styles$9.popupHost
               }
             );
             const pmStyle = getComputedStyle(props.editor.view.dom);
@@ -1451,7 +2059,7 @@ const rowKeys = "_rowKeys_ljnq6_127";
 const rowMd = "_rowMd_ljnq6_128";
 const keycap = "_keycap_ljnq6_138";
 const none = "_none_ljnq6_163";
-const styles$7 = {
+const styles$8 = {
   drawer,
   closeBtn,
   head,
@@ -1479,6 +2087,10 @@ function buildShortcutGroups(labels) {
         { id: "underline", label: labels.underline, keys: ["Mod", "u"] },
         { id: "inline-code", label: labels.inlineCode, keys: ["Mod", "e"], markdown: { marker: "`x`" } },
         { id: "highlight", label: labels.highlight, keys: ["Mod", "Shift", "h"], markdown: { marker: "==x==" } },
+        { id: "align-left", label: labels.alignLeft, keys: ["Mod", "Shift", "l"] },
+        { id: "align-center", label: labels.alignCenter, keys: ["Mod", "Shift", "e"] },
+        { id: "align-right", label: labels.alignRight, keys: ["Mod", "Shift", "r"] },
+        { id: "align-justify", label: labels.alignJustify, keys: ["Mod", "Shift", "j"] },
         ...[1, 2, 3, 4, 5, 6].map((level) => ({
           id: `heading-${level}`,
           label: labels.headingLabel(level),
@@ -1492,6 +2104,7 @@ function buildShortcutGroups(labels) {
       id: "insert",
       title: labels.insertGroup,
       entries: [
+        { id: "image-upload", label: labels.imageUpload, keys: ["Mod", "Shift", "i"] },
         { id: "blockquote", label: labels.blockquote, keys: ["Mod", "Shift", "b"], markdown: { marker: ">", terminator: "Space" } },
         { id: "bullet-list", label: labels.bulletList, keys: ["Mod", "Shift", "8"], markdown: { marker: "-", terminator: "Space" } },
         { id: "ordered-list", label: labels.orderedList, keys: ["Mod", "Shift", "7"], markdown: { marker: "1.", terminator: "Space" } },
@@ -1544,7 +2157,7 @@ function ShortcutPanel({ open, onClose, labels }) {
   return /* @__PURE__ */ jsxs(
     "aside",
     {
-      className: styles$7.drawer,
+      className: styles$8.drawer,
       role: "dialog",
       "aria-modal": "false",
       "aria-label": t.panelTitle,
@@ -1553,27 +2166,27 @@ function ShortcutPanel({ open, onClose, labels }) {
           "button",
           {
             type: "button",
-            className: styles$7.closeBtn,
+            className: styles$8.closeBtn,
             title: t.close,
             "aria-label": t.close,
             onClick: onClose,
             children: /* @__PURE__ */ jsx(XIcon, { size: 16 })
           }
         ),
-        /* @__PURE__ */ jsxs("div", { className: styles$7.head, children: [
-          /* @__PURE__ */ jsx("span", { className: styles$7.colFormat, children: t.colFormat }),
-          /* @__PURE__ */ jsx("span", { className: styles$7.colShortcut, children: t.colShortcut }),
-          /* @__PURE__ */ jsx("span", { className: styles$7.colMarkdown, children: t.colMarkdown })
+        /* @__PURE__ */ jsxs("div", { className: styles$8.head, children: [
+          /* @__PURE__ */ jsx("span", { className: styles$8.colFormat, children: t.colFormat }),
+          /* @__PURE__ */ jsx("span", { className: styles$8.colShortcut, children: t.colShortcut }),
+          /* @__PURE__ */ jsx("span", { className: styles$8.colMarkdown, children: t.colMarkdown })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: styles$7.body, children: groups.map((group2) => /* @__PURE__ */ jsxs("section", { className: styles$7.group, children: [
-          /* @__PURE__ */ jsx("h3", { className: styles$7.groupTitle, children: group2.title }),
-          group2.entries.map((entry) => /* @__PURE__ */ jsxs("div", { className: styles$7.row, children: [
-            /* @__PURE__ */ jsx("span", { className: styles$7.rowLabel, children: entry.label }),
-            /* @__PURE__ */ jsx("span", { className: styles$7.rowKeys, children: entry.keys ? entry.keys.map((key, i) => /* @__PURE__ */ jsx("kbd", { className: styles$7.keycap, children: keycapText(key, mac) }, i)) : /* @__PURE__ */ jsx("span", { className: styles$7.none, children: "—" }) }),
-            /* @__PURE__ */ jsx("span", { className: styles$7.rowMd, children: entry.markdown ? /* @__PURE__ */ jsxs(Fragment$2, { children: [
-              /* @__PURE__ */ jsx("kbd", { className: styles$7.keycap, children: entry.markdown.marker }),
-              entry.markdown.terminator ? /* @__PURE__ */ jsx("kbd", { className: styles$7.keycap, children: entry.markdown.terminator }) : null
-            ] }) : /* @__PURE__ */ jsx("span", { className: styles$7.none, children: "—" }) })
+        /* @__PURE__ */ jsx("div", { className: styles$8.body, children: groups.map((group2) => /* @__PURE__ */ jsxs("section", { className: styles$8.group, children: [
+          /* @__PURE__ */ jsx("h3", { className: styles$8.groupTitle, children: group2.title }),
+          group2.entries.map((entry) => /* @__PURE__ */ jsxs("div", { className: styles$8.row, children: [
+            /* @__PURE__ */ jsx("span", { className: styles$8.rowLabel, children: entry.label }),
+            /* @__PURE__ */ jsx("span", { className: styles$8.rowKeys, children: entry.keys ? entry.keys.map((key, i) => /* @__PURE__ */ jsx("kbd", { className: styles$8.keycap, children: keycapText(key, mac) }, i)) : /* @__PURE__ */ jsx("span", { className: styles$8.none, children: "—" }) }),
+            /* @__PURE__ */ jsx("span", { className: styles$8.rowMd, children: entry.markdown ? /* @__PURE__ */ jsxs(Fragment$2, { children: [
+              /* @__PURE__ */ jsx("kbd", { className: styles$8.keycap, children: entry.markdown.marker }),
+              entry.markdown.terminator ? /* @__PURE__ */ jsx("kbd", { className: styles$8.keycap, children: entry.markdown.terminator }) : null
+            ] }) : /* @__PURE__ */ jsx("span", { className: styles$8.none, children: "—" }) })
           ] }, entry.id))
         ] }, group2.id)) })
       ]
@@ -1690,18 +2303,18 @@ function selectionKind(selection) {
   if (selection instanceof TextSelection) return "text";
   return "text";
 }
-function looksLikeMarkdown(text) {
-  return /^#{1,6}\s/m.test(text) || // 标题
-  /\*\*[^*\n]+\*\*/.test(text) || // 加粗
-  /(^|[^!])\[[^\]\n]+\]\([^)\n]+\)/.test(text) || // 链接
-  /!\[[^\]\n]*\]\([^)\n]+\)/.test(text) || // 图片
-  /^[-*+]\s+\S/m.test(text) || // 无序列表
-  /^\d+\.\s+\S/m.test(text) || // 有序列表
-  /^>\s/m.test(text) || // 引用
-  /^```/m.test(text) || // 代码围栏
-  /^\|.+\|\s*$/m.test(text) || // 表格行
-  /^(-{3,}|\*{3,})\s*$/m.test(text) || // 分割线
-  /<!--\s*[\[{][\s\S]*?"chartType"[\s\S]*?-->/.test(text);
+function looksLikeMarkdown(text2) {
+  return /^#{1,6}\s/m.test(text2) || // 标题
+  /\*\*[^*\n]+\*\*/.test(text2) || // 加粗
+  /(^|[^!])\[[^\]\n]+\]\([^)\n]+\)/.test(text2) || // 链接
+  /!\[[^\]\n]*\]\([^)\n]+\)/.test(text2) || // 图片
+  /^[-*+]\s+\S/m.test(text2) || // 无序列表
+  /^\d+\.\s+\S/m.test(text2) || // 有序列表
+  /^>\s/m.test(text2) || // 引用
+  /^```/m.test(text2) || // 代码围栏
+  /^\|.+\|\s*$/m.test(text2) || // 表格行
+  /^(-{3,}|\*{3,})\s*$/m.test(text2) || // 分割线
+  /<!--\s*[\[{][\s\S]*?"chartType"[\s\S]*?-->/.test(text2);
 }
 const MarkdownPaste = Extension.create({
   name: "markdownPaste",
@@ -1714,16 +2327,16 @@ const MarkdownPaste = Extension.create({
           handlePaste(view, event) {
             const clipboard = event.clipboardData;
             if (!clipboard) return false;
-            const text = clipboard.getData("text/plain");
-            if (!text) return false;
+            const text2 = clipboard.getData("text/plain");
+            if (!text2) return false;
             const input2 = view.input;
             if (input2 == null ? void 0 : input2.shiftKey) return false;
             if (view.state.selection.$from.parent.type.spec.code) return false;
-            if (!looksLikeMarkdown(text)) return false;
+            if (!looksLikeMarkdown(text2)) return false;
             const markdown = editor.markdown;
             if (!markdown) return false;
             try {
-              const json = markdown.parse(prepareChartMarkdown(text));
+              const json = markdown.parse(prepareChartMarkdown(text2));
               editor.commands.insertContent(json);
               return true;
             } catch (err) {
@@ -1877,7 +2490,7 @@ const gutterLine = "_gutterLine_k8th1_184";
 const readonlyActions = "_readonlyActions_k8th1_188";
 const actionBtn = "_actionBtn_k8th1_194";
 const langBraces = "_langBraces_k8th1_213";
-const styles$6 = {
+const styles$7 = {
   wrapper,
   header: header$1,
   langTrigger,
@@ -1955,18 +2568,18 @@ function CodeBlockView({
   }, [readonly2]);
   const handleCopy = () => {
     var _a2;
-    const text = node.textContent ?? "";
+    const text2 = node.textContent ?? "";
     const done = () => {
       setCopied(true);
       window.setTimeout(() => setCopied(false), 1500);
     };
     if ((_a2 = navigator.clipboard) == null ? void 0 : _a2.writeText) {
-      navigator.clipboard.writeText(text).then(done, () => {
+      navigator.clipboard.writeText(text2).then(done, () => {
       });
       return;
     }
     const ta = document.createElement("textarea");
-    ta.value = text;
+    ta.value = text2;
     document.body.appendChild(ta);
     ta.select();
     try {
@@ -1977,29 +2590,29 @@ function CodeBlockView({
     ta.remove();
   };
   const wrapperClass = [
-    styles$6.wrapper,
-    readonly2 ? styles$6.readonly : "",
-    folded2 ? styles$6.folded : ""
+    styles$7.wrapper,
+    readonly2 ? styles$7.readonly : "",
+    folded2 ? styles$7.folded : ""
   ].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxs(NodeViewWrapper, { className: wrapperClass, children: [
-    editable ? /* @__PURE__ */ jsxs("div", { className: styles$6.header, contentEditable: false, children: [
+    editable ? /* @__PURE__ */ jsxs("div", { className: styles$7.header, contentEditable: false, children: [
       /* @__PURE__ */ jsxs(DropdownMenu.Root, { children: [
         /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs(
           "button",
           {
             type: "button",
-            className: styles$6.langTrigger,
+            className: styles$7.langTrigger,
             "aria-label": "Code language",
             children: [
               /* @__PURE__ */ jsx("span", { children: currentLabel }),
-              /* @__PURE__ */ jsx(ChevronDownIcon, { size: 14, className: styles$6.langChevron })
+              /* @__PURE__ */ jsx(ChevronDownIcon, { size: 14, className: styles$7.langChevron })
             ]
           }
         ) }),
         /* @__PURE__ */ jsx(DropdownMenu.Portal, { children: /* @__PURE__ */ jsx(
           DropdownMenu.Content,
           {
-            className: styles$6.langMenu,
+            className: styles$7.langMenu,
             sideOffset: 4,
             align: "end",
             children: LANGUAGES.map((l) => {
@@ -2008,10 +2621,10 @@ function CodeBlockView({
               return /* @__PURE__ */ jsxs(
                 DropdownMenu.Item,
                 {
-                  className: `${styles$6.langItem}${selected ? ` ${styles$6.langItemSelected}` : ""}`,
+                  className: `${styles$7.langItem}${selected ? ` ${styles$7.langItemSelected}` : ""}`,
                   onSelect: () => updateAttributes({ language: l.value }),
                   children: [
-                    /* @__PURE__ */ jsx("span", { className: styles$6.langItemCheck, children: selected ? /* @__PURE__ */ jsx(CheckIcon, { size: 14 }) : null }),
+                    /* @__PURE__ */ jsx("span", { className: styles$7.langItemCheck, children: selected ? /* @__PURE__ */ jsx(CheckIcon, { size: 14 }) : null }),
                     optionLabel
                   ]
                 },
@@ -2025,7 +2638,7 @@ function CodeBlockView({
         "button",
         {
           type: "button",
-          className: styles$6.deleteBtn,
+          className: styles$7.deleteBtn,
           title: labels.delete,
           "aria-label": labels.delete,
           onClick: () => deleteNode(),
@@ -2034,17 +2647,17 @@ function CodeBlockView({
       )
     ] }) : (
       // 只读头部：左侧语言标签，右侧复制 + 展开收起（展开后按钮保留，供收回）
-      /* @__PURE__ */ jsxs("div", { className: styles$6.readonlyHeader, contentEditable: false, children: [
-        /* @__PURE__ */ jsxs("span", { className: styles$6.langBadge, children: [
-          /* @__PURE__ */ jsx("span", { className: styles$6.langBraces, children: "{}" }),
+      /* @__PURE__ */ jsxs("div", { className: styles$7.readonlyHeader, contentEditable: false, children: [
+        /* @__PURE__ */ jsxs("span", { className: styles$7.langBadge, children: [
+          /* @__PURE__ */ jsx("span", { className: styles$7.langBraces, children: "{}" }),
           currentLabel
         ] }),
-        /* @__PURE__ */ jsxs("span", { className: styles$6.readonlyActions, children: [
+        /* @__PURE__ */ jsxs("span", { className: styles$7.readonlyActions, children: [
           /* @__PURE__ */ jsx(
             "button",
             {
               type: "button",
-              className: styles$6.actionBtn,
+              className: styles$7.actionBtn,
               onClick: handleCopy,
               "aria-label": labels.copy,
               title: labels.copy,
@@ -2055,7 +2668,7 @@ function CodeBlockView({
             "button",
             {
               type: "button",
-              className: styles$6.actionBtn,
+              className: styles$7.actionBtn,
               onClick: () => setFolded((v) => !v),
               "aria-label": folded2 ? labels.expand : labels.collapse,
               title: folded2 ? labels.expand : labels.collapse,
@@ -2066,14 +2679,14 @@ function CodeBlockView({
         ] })
       ] })
     ),
-    /* @__PURE__ */ jsxs("pre", { ref: preRef, className: styles$6.pre, children: [
+    /* @__PURE__ */ jsxs("pre", { ref: preRef, className: styles$7.pre, children: [
       readonly2 ? /* @__PURE__ */ jsx(
         "span",
         {
-          className: styles$6.gutter,
+          className: styles$7.gutter,
           contentEditable: false,
           "aria-hidden": "true",
-          children: Array.from({ length: lineCount }, (_, i) => /* @__PURE__ */ jsx("span", { className: styles$6.gutterLine, children: i + 1 }, i))
+          children: Array.from({ length: lineCount }, (_, i) => /* @__PURE__ */ jsx("span", { className: styles$7.gutterLine, children: i + 1 }, i))
         }
       ) : null,
       /* @__PURE__ */ jsx(NodeViewContent, { as: "code" })
@@ -2118,6 +2731,34 @@ const CodeBlock = CodeBlockLowlight.extend({
   }
 });
 const ImageWithConfirmDelete = Image.extend({
+  addAttributes() {
+    var _a;
+    return {
+      ...((_a = Image.config.addAttributes) == null ? void 0 : _a.call(this)) ?? {},
+      align: imageAlignAttribute,
+      caption: imageCaptionAttribute
+    };
+  },
+  parseHTML() {
+    return [
+      imageFigureParseRule(),
+      {
+        tag: this.options.allowBase64 ? "img[src]" : 'img[src]:not([src^="data:"])'
+      }
+    ];
+  },
+  renderHTML({ node, HTMLAttributes }) {
+    return imageNodeHtml({
+      attrs: node.attrs,
+      htmlAttributes: mergeAttributes(
+        this.options.HTMLAttributes,
+        HTMLAttributes
+      )
+    });
+  },
+  renderMarkdown: imageRenderMarkdown,
+  parseMarkdown: imageParseMarkdown,
+  markdownTokenizer: imageMarkdownTokenizer,
   addKeyboardShortcuts() {
     return {
       Backspace: () => {
@@ -2133,7 +2774,74 @@ const ImageWithConfirmDelete = Image.extend({
           }
         }
         return false;
+      },
+      // 图片对齐：键位对齐官方 image-align-button（L 左 / E 中 / R 右），
+      // 选中图片或光标紧邻图片时生效。工具函数见 imageAlign.ts。
+      "Alt-Shift-l": () => setImageAlign(this.editor, "left"),
+      "Alt-Shift-e": () => setImageAlign(this.editor, "center"),
+      "Alt-Shift-r": () => setImageAlign(this.editor, "right")
+    };
+  },
+  addNodeView() {
+    var _a;
+    const createView = (_a = Image.config.addNodeView) == null ? void 0 : _a.call(this);
+    if (!createView) return null;
+    const resizeOptions = this.options.resize;
+    const explicitMaxWidth = resizeOptions && typeof resizeOptions === "object" ? resizeOptions.maxWidth : void 0;
+    const explicitMaxHeight = resizeOptions && typeof resizeOptions === "object" ? resizeOptions.maxHeight : void 0;
+    return (props) => {
+      var _a2, _b;
+      const nodeView = createView(props);
+      if (!nodeView) return nodeView;
+      const resizable = nodeView;
+      if (!props.editor.isEditable) (_a2 = resizable.removeHandles) == null ? void 0 : _a2.call(resizable);
+      const applyMaxSize = () => {
+        resizable.maxSize = explicitMaxWidth || explicitMaxHeight ? { width: explicitMaxWidth, height: explicitMaxHeight } : { width: props.editor.view.dom.clientWidth || void 0 };
+      };
+      if (explicitMaxWidth || explicitMaxHeight) applyMaxSize();
+      let syncCaption = null;
+      if (nodeView.dom instanceof HTMLElement && resizable.element) {
+        const { element } = resizable;
+        const container = nodeView.dom;
+        const captionEl = document.createElement("div");
+        captionEl.className = "tmr-image-caption";
+        captionEl.dataset.imageCaption = "";
+        (element.parentElement ?? container).appendChild(captionEl);
+        const syncHandleTop = () => {
+          const height = element.offsetHeight;
+          if (height > 0) {
+            container.style.setProperty("--tmr-image-h", `${height}px`);
+          } else {
+            container.style.removeProperty("--tmr-image-h");
+          }
+        };
+        syncCaption = (attrs) => {
+          const caption = normalizeImageCaption(attrs.caption) ?? "";
+          captionEl.textContent = caption;
+          captionEl.hidden = caption === "";
+          syncHandleTop();
+        };
+        syncCaption(props.node.attrs);
+        element.addEventListener("load", syncHandleTop);
+        container.addEventListener("mousedown", applyMaxSize, true);
       }
+      if (resizable.element) {
+        const { element } = resizable;
+        const originalUpdate = (_b = nodeView.update) == null ? void 0 : _b.bind(nodeView);
+        if (originalUpdate) {
+          nodeView.update = (...args) => {
+            const ok = originalUpdate(...args);
+            if (ok) {
+              const attrs = args[0].attrs;
+              element.style.width = attrs.width ? `${attrs.width}px` : "";
+              element.style.height = attrs.height ? `${attrs.height}px` : "";
+              syncCaption == null ? void 0 : syncCaption(attrs);
+            }
+            return ok;
+          };
+        }
+      }
+      return nodeView;
     };
   }
 });
@@ -2188,7 +2896,9 @@ const MarkdownWysiwygEditor = forwardRef(function MarkdownWysiwygEditor2({
   slashMenuLabels,
   shortcutPanel = true,
   shortcutLabels,
-  shortcutFabContainer
+  shortcutFabContainer,
+  imageUpload,
+  imageResize = true
 }, ref) {
   const preparedInitial = prepareChartMarkdown(
     enrichMarkdownCitations(initialMarkdown, sources ?? [])
@@ -2200,7 +2910,24 @@ const MarkdownWysiwygEditor = forwardRef(function MarkdownWysiwygEditor2({
     extensions: [
       ...baseExtensions,
       CodeBlock.configure({ lowlight, codeBlockLabels }),
-      ImageWithConfirmDelete.configure({ inline: false }),
+      ImageWithConfirmDelete.configure({
+        inline: false,
+        // 图片缩放（默认开、默认等比、默认左右两条手柄）：false 关掉；对象透传官方配置
+        // ——等比与手柄方向都有本库默认，显式传值可覆盖。
+        resize: imageResize === false ? false : {
+          enabled: true,
+          alwaysPreserveAspectRatio: true,
+          directions: ["left", "right"],
+          // 默认下限。上限默认跟随内容区宽度（maxWidth/maxHeight 由 addNodeView
+          // 包装读取并注入 maxSize，见 ImageWithConfirmDelete）。
+          minWidth: 80,
+          minHeight: 80,
+          ...typeof imageResize === "object" ? imageResize : null
+        }
+      }),
+      // 图片上传占位块：空态拖拽 / 点选 → 进度就地 → 成功原地换成 image。
+      // 不配置 imageUpload 就不注册（工具栏退回旧的直传路径）。
+      ...imageUpload ? [ImageUploadNode.configure(imageUpload)] : [],
       ImportPlaceholder,
       // 空文档占位符：官方 Placeholder 把 data-placeholder 属性与
       // is-empty / is-editor-empty 类打在**空文本块节点**上——CSS
@@ -2244,7 +2971,7 @@ const MarkdownWysiwygEditor = forwardRef(function MarkdownWysiwygEditor2({
     immediatelyRender: false,
     editorProps: {
       attributes: {
-        class: styles$a.editorContent
+        class: styles$c.editorContent
       }
     }
   });
@@ -2443,7 +3170,7 @@ const MarkdownWysiwygEditor = forwardRef(function MarkdownWysiwygEditor2({
       labels: findLabels,
       onClose: closeFind,
       inputRef: findInputRef,
-      className: styles$a.findBar,
+      className: styles$c.findBar,
       style: findBarOffsetStyle(findBarOffset)
     }
   ) : null;
@@ -2463,7 +3190,7 @@ const MarkdownWysiwygEditor = forwardRef(function MarkdownWysiwygEditor2({
     "button",
     {
       type: "button",
-      className: shortcutFabTarget ? `${styles$a.shortcutFab} ${styles$a.shortcutFabHosted}` : styles$a.shortcutFab,
+      className: shortcutFabTarget ? `${styles$c.shortcutFab} ${styles$c.shortcutFabHosted}` : styles$c.shortcutFab,
       title: shortcutT.panelTitle,
       "aria-label": shortcutT.panelTitle,
       "aria-expanded": shortcutsOpen,
@@ -2471,14 +3198,14 @@ const MarkdownWysiwygEditor = forwardRef(function MarkdownWysiwygEditor2({
       children: /* @__PURE__ */ jsx(KeyboardIcon, { size: 18 })
     }
   ) : null;
-  return /* @__PURE__ */ jsxs("div", { className: styles$a.editorHost, children: [
-    findBarNode && !findBarTarget ? /* @__PURE__ */ jsx("div", { className: styles$a.findBarAnchor, children: findBarNode }) : null,
+  return /* @__PURE__ */ jsxs("div", { className: styles$c.editorHost, children: [
+    findBarNode && !findBarTarget ? /* @__PURE__ */ jsx("div", { className: styles$c.findBarAnchor, children: findBarNode }) : null,
     findBarNode && findBarTarget ? createPortal(findBarNode, findBarTarget) : null,
     /* @__PURE__ */ jsx(
       EditorContent,
       {
         editor,
-        className: className ? `${styles$a.editorScroll} ${className}` : styles$a.editorScroll
+        className: className ? `${styles$c.editorScroll} ${className}` : styles$c.editorScroll
       }
     ),
     shortcutFabNode && shortcutFabTarget ? createPortal(shortcutFabNode, shortcutFabTarget) : shortcutFabNode,
@@ -2531,7 +3258,7 @@ function MarkdownPreview({
       editable: false,
       immediatelyRender: false,
       editorProps: {
-        attributes: { class: styles$a.editorContent }
+        attributes: { class: styles$c.editorContent }
       }
     },
     [extensions]
@@ -2544,7 +3271,7 @@ function MarkdownPreview({
     EditorContent,
     {
       editor,
-      className: className ?? styles$a.editorScroll
+      className: className ?? styles$c.editorScroll
     }
   );
 }
@@ -2592,11 +3319,11 @@ function tryInsertMarkdown(editor, markdown) {
     return false;
   }
 }
-function insertPlainParagraph(editor, text) {
-  if (!text) return;
+function insertPlainParagraph(editor, text2) {
+  if (!text2) return;
   editor.chain().focus().insertContent({
     type: "paragraph",
-    content: [{ type: "text", text }]
+    content: [{ type: "text", text: text2 }]
   }).run();
 }
 function splitTopLevelBlocks(markdown) {
@@ -2616,59 +3343,61 @@ function splitTopLevelBlocks(markdown) {
 function stripToPlainText(markdown) {
   return markdown.replace(/!\[[^\]]*\]\([^)]+\)/g, "").replace(/\[([^\]]+)\]\([^)]+\)/g, "$1").replace(/^#{1,6}\s+/gm, "").replace(/^[ \t]*[-*+]\s+/gm, "").replace(/^[ \t]*\d+\.\s+/gm, "").replace(/[*_~`]+/g, "").replace(/<[^>]+>/g, "").replace(/\|/g, " ").replace(/\s+/g, " ").trim();
 }
-const toolbar = "_toolbar_6osph_2";
-const inner = "_inner_6osph_15";
-const btn$1 = "_btn_6osph_33";
-const btnActive = "_btnActive_6osph_56";
-const txtIcon = "_txtIcon_6osph_72";
-const colorIcon = "_colorIcon_6osph_80";
-const colorIconGlyph = "_colorIconGlyph_6osph_88";
-const colorIconBar = "_colorIconBar_6osph_94";
-const scriptTrigger = "_scriptTrigger_6osph_101";
-const scriptTriggerGlyph = "_scriptTriggerGlyph_6osph_121";
-const divider$1 = "_divider_6osph_129";
-const styleTrigger = "_styleTrigger_6osph_138";
-const styleTriggerLabel = "_styleTriggerLabel_6osph_167";
-const styleTriggerCaret = "_styleTriggerCaret_6osph_175";
-const styleItem = "_styleItem_6osph_181";
-const styleIcon = "_styleIcon_6osph_187";
-const scriptGlyph = "_scriptGlyph_6osph_197";
-const menu = "_menu_6osph_209";
-const menuItem = "_menuItem_6osph_220";
-const menuItemSelected = "_menuItemSelected_6osph_247";
-const tableInsertCaret = "_tableInsertCaret_6osph_260";
-const tableSizePicker = "_tableSizePicker_6osph_268";
-const tableSizeGrid = "_tableSizeGrid_6osph_278";
-const tableSizeCell = "_tableSizeCell_6osph_283";
-const tableSizeCellActive = "_tableSizeCellActive_6osph_293";
-const tableSizeLabel = "_tableSizeLabel_6osph_298";
-const popoverContent$1 = "_popoverContent_6osph_307";
-const mathLayer = "_mathLayer_6osph_311";
-const mathStack = "_mathStack_6osph_316";
-const mathStackBlock = "_mathStackBlock_6osph_323";
-const mathHint = "_mathHint_6osph_328";
-const mathHintBlock = "_mathHintBlock_6osph_340";
-const mathHintIcon = "_mathHintIcon_6osph_346";
-const mathField = "_mathField_6osph_377";
-const mathFieldBlock = "_mathFieldBlock_6osph_389";
-const mathInput = "_mathInput_6osph_396";
-const mathDone = "_mathDone_6osph_414";
-const mathDoneKbd = "_mathDoneKbd_6osph_439";
-const styles$5 = {
+const toolbar = "_toolbar_vghdk_2";
+const inner = "_inner_vghdk_15";
+const btn$2 = "_btn_vghdk_35";
+const btnActive$1 = "_btnActive_vghdk_58";
+const txtIcon = "_txtIcon_vghdk_74";
+const colorIcon = "_colorIcon_vghdk_82";
+const colorIconGlyph = "_colorIconGlyph_vghdk_90";
+const colorIconBar = "_colorIconBar_vghdk_96";
+const scriptTrigger = "_scriptTrigger_vghdk_103";
+const scriptTriggerGlyph = "_scriptTriggerGlyph_vghdk_123";
+const divider$2 = "_divider_vghdk_131";
+const styleTrigger = "_styleTrigger_vghdk_140";
+const styleTriggerLabel = "_styleTriggerLabel_vghdk_169";
+const styleTriggerCaret = "_styleTriggerCaret_vghdk_177";
+const iconTrigger = "_iconTrigger_vghdk_184";
+const styleItem = "_styleItem_vghdk_192";
+const styleIcon = "_styleIcon_vghdk_198";
+const scriptGlyph = "_scriptGlyph_vghdk_208";
+const menu = "_menu_vghdk_220";
+const menuItem = "_menuItem_vghdk_231";
+const menuItemSelected = "_menuItemSelected_vghdk_258";
+const tableInsertCaret = "_tableInsertCaret_vghdk_271";
+const tableSizePicker = "_tableSizePicker_vghdk_279";
+const tableSizeGrid = "_tableSizeGrid_vghdk_289";
+const tableSizeCell = "_tableSizeCell_vghdk_294";
+const tableSizeCellActive = "_tableSizeCellActive_vghdk_304";
+const tableSizeLabel = "_tableSizeLabel_vghdk_309";
+const popoverContent$1 = "_popoverContent_vghdk_318";
+const mathLayer = "_mathLayer_vghdk_322";
+const mathStack = "_mathStack_vghdk_327";
+const mathStackBlock = "_mathStackBlock_vghdk_334";
+const mathHint = "_mathHint_vghdk_339";
+const mathHintBlock = "_mathHintBlock_vghdk_351";
+const mathHintIcon = "_mathHintIcon_vghdk_357";
+const mathField = "_mathField_vghdk_388";
+const mathFieldBlock = "_mathFieldBlock_vghdk_400";
+const mathInput = "_mathInput_vghdk_407";
+const mathDone = "_mathDone_vghdk_425";
+const mathDoneKbd = "_mathDoneKbd_vghdk_450";
+const styles$6 = {
   toolbar,
   inner,
-  btn: btn$1,
-  btnActive,
+  btn: btn$2,
+  btnActive: btnActive$1,
   txtIcon,
   colorIcon,
   colorIconGlyph,
   colorIconBar,
   scriptTrigger,
   scriptTriggerGlyph,
-  divider: divider$1,
+  divider: divider$2,
   styleTrigger,
   styleTriggerLabel,
   styleTriggerCaret,
+  iconTrigger,
   styleItem,
   styleIcon,
   scriptGlyph,
@@ -2703,7 +3432,7 @@ const swatch = "_swatch_x5lrq_54";
 const swatchActive = "_swatchActive_x5lrq_70";
 const themeLabel = "_themeLabel_x5lrq_76";
 const themeRow = "_themeRow_x5lrq_84";
-const styles$4 = {
+const styles$5 = {
   palette,
   noneRow,
   noneIcon,
@@ -2726,25 +3455,25 @@ const THEME_COLORS = ["#ff6719", "#ff5500"];
 function ColorPalette({ value, onPick, labels }) {
   const t = { ...defaultColorPaletteLabels, ...labels };
   const current = value == null ? void 0 : value.toLowerCase();
-  return /* @__PURE__ */ jsxs("div", { className: styles$4.palette, children: [
+  return /* @__PURE__ */ jsxs("div", { className: styles$5.palette, children: [
     /* @__PURE__ */ jsxs(
       "button",
       {
         type: "button",
-        className: styles$4.noneRow,
+        className: styles$5.noneRow,
         onMouseDown: (e2) => e2.preventDefault(),
         onClick: () => onPick(null),
         children: [
-          /* @__PURE__ */ jsx("span", { className: styles$4.noneIcon, "aria-hidden": true }),
-          /* @__PURE__ */ jsx("span", { className: styles$4.noneLabel, children: t.none })
+          /* @__PURE__ */ jsx("span", { className: styles$5.noneIcon, "aria-hidden": true }),
+          /* @__PURE__ */ jsx("span", { className: styles$5.noneLabel, children: t.none })
         ]
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: styles$4.grid, children: PALETTE.flat().map((c) => /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: styles$5.grid, children: PALETTE.flat().map((c) => /* @__PURE__ */ jsx(
       "button",
       {
         type: "button",
-        className: `${styles$4.swatch} ${current === c.toLowerCase() ? styles$4.swatchActive : ""}`,
+        className: `${styles$5.swatch} ${current === c.toLowerCase() ? styles$5.swatchActive : ""}`,
         style: { background: c },
         title: c,
         "aria-label": c,
@@ -2753,12 +3482,12 @@ function ColorPalette({ value, onPick, labels }) {
       },
       c
     )) }),
-    /* @__PURE__ */ jsx("div", { className: styles$4.themeLabel, children: t.theme }),
-    /* @__PURE__ */ jsx("div", { className: styles$4.themeRow, children: THEME_COLORS.map((c) => /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: styles$5.themeLabel, children: t.theme }),
+    /* @__PURE__ */ jsx("div", { className: styles$5.themeRow, children: THEME_COLORS.map((c) => /* @__PURE__ */ jsx(
       "button",
       {
         type: "button",
-        className: `${styles$4.swatch} ${current === c.toLowerCase() ? styles$4.swatchActive : ""}`,
+        className: `${styles$5.swatch} ${current === c.toLowerCase() ? styles$5.swatchActive : ""}`,
         style: { background: c },
         title: c,
         "aria-label": c,
@@ -2769,6 +3498,235 @@ function ColorPalette({ value, onPick, labels }) {
     )) })
   ] });
 }
+function setImageCaptionAtPos(editor, pos, caption) {
+  const node = editor.state.doc.nodeAt(pos);
+  if (!node || node.type.name !== "image") return false;
+  const next = normalizeImageCaption(caption);
+  const current = normalizeImageCaption(node.attrs.caption);
+  if (current === next) return true;
+  editor.view.dispatch(editor.state.tr.setNodeAttribute(pos, "caption", next));
+  return true;
+}
+function setImageCaption(editor, caption) {
+  const pos = findImagePos(editor);
+  if (pos == null) return false;
+  return setImageCaptionAtPos(editor, pos, caption);
+}
+const bar = "_bar_mp2o5_7";
+const divider$1 = "_divider_mp2o5_24";
+const captionRow = "_captionRow_mp2o5_13";
+const captionInput = "_captionInput_mp2o5_40";
+const btn$1 = "_btn_mp2o5_58";
+const btnActive = "_btnActive_mp2o5_76";
+const styles$4 = {
+  bar,
+  divider: divider$1,
+  captionRow,
+  captionInput,
+  btn: btn$1,
+  btnActive
+};
+const TOOLBAR_HEIGHT = 34;
+const TOOLBAR_GAP = 8;
+const HOVER_KEEP_MS$1 = 160;
+const ALIGNS = ["left", "center", "right"];
+const ICONS = {
+  left: AlignLeftIcon,
+  center: AlignCenterIcon,
+  right: AlignRightIcon
+};
+function measureImage(editor, img) {
+  if (!img.isConnected) return null;
+  let pos;
+  try {
+    pos = editor.view.posAtDOM(img, 0);
+  } catch {
+    return null;
+  }
+  const node = editor.state.doc.nodeAt(pos);
+  if (!node || node.type.name !== "image") return null;
+  const rect = img.getBoundingClientRect();
+  return {
+    pos,
+    img,
+    left: rect.left,
+    top: rect.top,
+    right: rect.right,
+    bottom: rect.bottom
+  };
+}
+function ImageAlignTools({ editor, labels }) {
+  var _a;
+  const [hover, setHover] = useState(null);
+  const hoverRef = useRef(null);
+  const [captionDraft, setCaptionDraft] = useState(null);
+  const captionDraftRef = useRef(null);
+  captionDraftRef.current = captionDraft;
+  const clearHover = useCallback(() => {
+    if (!hoverRef.current) return;
+    hoverRef.current = null;
+    setHover(null);
+    setCaptionDraft(null);
+  }, []);
+  const remeasureHover = useCallback(() => {
+    const current = hoverRef.current;
+    if (!current) return;
+    const el = editor.view.nodeDOM(current.pos);
+    const img = el instanceof HTMLImageElement ? el : el instanceof HTMLElement ? el.querySelector("img") : null;
+    const next = img ? measureImage(editor, img) : null;
+    hoverRef.current = next;
+    setHover(next);
+  }, [editor]);
+  const clearTimerRef = useRef(null);
+  const cancelPendingClear = useCallback(() => {
+    if (clearTimerRef.current === null) return;
+    clearTimeout(clearTimerRef.current);
+    clearTimerRef.current = null;
+  }, []);
+  useEffect(() => {
+    const onMove = (event) => {
+      var _a2, _b;
+      if (!editor.isEditable) return;
+      const target = event.target;
+      if ((_a2 = target == null ? void 0 : target.closest) == null ? void 0 : _a2.call(target, "[data-image-align]")) {
+        cancelPendingClear();
+        return;
+      }
+      const img = target && editor.view.dom.contains(target) ? target.closest("img") : null;
+      if (!img) {
+        if (captionDraftRef.current !== null) return;
+        if (hoverRef.current && clearTimerRef.current === null) {
+          clearTimerRef.current = setTimeout(() => {
+            clearTimerRef.current = null;
+            clearHover();
+          }, HOVER_KEEP_MS$1);
+        }
+        return;
+      }
+      cancelPendingClear();
+      if (((_b = hoverRef.current) == null ? void 0 : _b.img) === img) return;
+      const next = measureImage(editor, img);
+      hoverRef.current = next;
+      setHover(next);
+    };
+    const onBlurWindow = () => {
+      cancelPendingClear();
+      clearHover();
+    };
+    document.addEventListener("mousemove", onMove);
+    document.addEventListener("mouseleave", onBlurWindow);
+    window.addEventListener("scroll", remeasureHover, true);
+    window.addEventListener("resize", remeasureHover);
+    return () => {
+      cancelPendingClear();
+      document.removeEventListener("mousemove", onMove);
+      document.removeEventListener("mouseleave", onBlurWindow);
+      window.removeEventListener("scroll", remeasureHover, true);
+      window.removeEventListener("resize", remeasureHover);
+    };
+  }, [editor, clearHover, cancelPendingClear, remeasureHover]);
+  useEffect(() => {
+    const onUpdate = () => remeasureHover();
+    editor.on("update", onUpdate);
+    return () => {
+      editor.off("update", onUpdate);
+    };
+  }, [editor, remeasureHover]);
+  if (typeof document === "undefined") return null;
+  if (!hover || !editor.isEditable) return null;
+  const above = hover.top - TOOLBAR_HEIGHT - TOOLBAR_GAP >= 8;
+  const nodeAttrs = (_a = editor.state.doc.nodeAt(hover.pos)) == null ? void 0 : _a.attrs;
+  const active2 = normalizeImageAlign(nodeAttrs == null ? void 0 : nodeAttrs.align);
+  const caption = normalizeImageCaption(nodeAttrs == null ? void 0 : nodeAttrs.caption);
+  const labelOf = {
+    left: labels.imageAlignLeft,
+    center: labels.imageAlignCenter,
+    right: labels.imageAlignRight
+  };
+  const commitCaption = () => {
+    if (captionDraft === null) return;
+    setImageCaptionAtPos(editor, hover.pos, captionDraft);
+    setCaptionDraft(null);
+    remeasureHover();
+  };
+  return createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-image-align": "",
+        className: styles$4.bar,
+        role: "toolbar",
+        "aria-label": labels.imageAlign,
+        style: {
+          left: hover.left,
+          top: above ? hover.top - TOOLBAR_HEIGHT - TOOLBAR_GAP : hover.bottom + TOOLBAR_GAP
+        },
+        onMouseDown: (e2) => {
+          var _a2, _b;
+          if ((_b = (_a2 = e2.target) == null ? void 0 : _a2.closest) == null ? void 0 : _b.call(_a2, "input")) return;
+          e2.preventDefault();
+        },
+        children: [
+          ALIGNS.map((align) => {
+            const Icon = ICONS[align];
+            return /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "data-image-align-action": align,
+                className: `${styles$4.btn} ${active2 === align ? styles$4.btnActive : ""}`,
+                title: labelOf[align],
+                "aria-label": labelOf[align],
+                "aria-pressed": active2 === align,
+                onClick: () => {
+                  setImageAlignAtPos(editor, hover.pos, align);
+                  remeasureHover();
+                },
+                children: /* @__PURE__ */ jsx(Icon, { size: 14 })
+              },
+              align
+            );
+          }),
+          /* @__PURE__ */ jsx("span", { className: styles$4.divider, "aria-hidden": true }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "data-image-align-action": "caption",
+              className: `${styles$4.btn} ${caption ? styles$4.btnActive : ""}`,
+              title: labels.imageCaption,
+              "aria-label": labels.imageCaption,
+              "aria-pressed": !!caption,
+              onClick: () => {
+                if (captionDraftRef.current !== null) return;
+                setCaptionDraft(caption ?? "");
+              },
+              children: /* @__PURE__ */ jsx(CaptionsIcon, { size: 14 })
+            }
+          ),
+          captionDraft !== null ? /* @__PURE__ */ jsx("div", { className: styles$4.captionRow, children: /* @__PURE__ */ jsx(
+            "input",
+            {
+              className: styles$4.captionInput,
+              value: captionDraft,
+              placeholder: labels.imageCaptionPlaceholder,
+              "aria-label": labels.imageCaptionPlaceholder,
+              autoFocus: true,
+              onChange: (e2) => setCaptionDraft(e2.target.value),
+              onKeyDown: (e2) => {
+                e2.stopPropagation();
+                if (e2.key === "Enter") commitCaption();
+                else if (e2.key === "Escape") setCaptionDraft(null);
+              },
+              onBlur: commitCaption
+            }
+          ) }) : null
+        ]
+      }
+    ),
+    document.body
+  );
+}
 const OPENABLE_PROTOCOLS = /* @__PURE__ */ new Set([
   "http:",
   "https:",
@@ -2923,7 +3881,7 @@ function LinkPanel({
   const openInNewWindow = () => {
     openLinkUrl(normalizeLinkHref(editor, url), window.location.href);
   };
-  const remove = () => {
+  const remove2 = () => {
     removeLink(editor);
     onClose();
   };
@@ -3004,7 +3962,7 @@ function LinkPanel({
             "aria-label": t.remove,
             disabled: !canEdit,
             onMouseDown: keepFocus,
-            onClick: remove,
+            onClick: remove2,
             children: /* @__PURE__ */ jsx(TrashIcon, { size: 16 })
           }
         )
@@ -3188,15 +4146,15 @@ function appendColumnToTable(editor) {
   selectLineAt(editor, table, "col", TableMap.get(table.node).width - 1);
   return addColumnsAfter(editor, 1);
 }
-const handle = "_handle_cco3n_9";
-const handleRow = "_handleRow_cco3n_30";
-const handleCol = "_handleCol_cco3n_40";
-const extend = "_extend_cco3n_70";
-const tableBubble = "_tableBubble_cco3n_115";
-const tableMenuItem = "_tableMenuItem_cco3n_128";
-const tableMenuItemIcon = "_tableMenuItemIcon_cco3n_154";
-const tableMenuItemLabel = "_tableMenuItemLabel_cco3n_164";
-const tableMenuDivider = "_tableMenuDivider_cco3n_169";
+const handle = "_handle_qjreh_9";
+const handleRow = "_handleRow_qjreh_30";
+const handleCol = "_handleCol_qjreh_40";
+const extend = "_extend_qjreh_71";
+const tableBubble = "_tableBubble_qjreh_117";
+const tableMenuItem = "_tableMenuItem_qjreh_130";
+const tableMenuItemIcon = "_tableMenuItemIcon_qjreh_156";
+const tableMenuItemLabel = "_tableMenuItemLabel_qjreh_166";
+const tableMenuDivider = "_tableMenuDivider_qjreh_171";
 const styles$2 = {
   handle,
   handleRow,
@@ -3749,7 +4707,7 @@ function MathEditorPopover({
     "textarea",
     {
       ref: inputRef,
-      className: styles$5.mathInput,
+      className: styles$6.mathInput,
       value: draft,
       placeholder,
       rows: Math.max(3, draft.split("\n").length),
@@ -3761,7 +4719,7 @@ function MathEditorPopover({
     "input",
     {
       ref: inputRef,
-      className: styles$5.mathInput,
+      className: styles$6.mathInput,
       value: draft,
       placeholder,
       "aria-labelledby": titleId,
@@ -3775,7 +4733,7 @@ function MathEditorPopover({
       "div",
       {
         ref: rootRef,
-        className: styles$5.mathLayer,
+        className: styles$6.mathLayer,
         style: layerStyle,
         role: "dialog",
         "aria-modal": "false",
@@ -3783,15 +4741,15 @@ function MathEditorPopover({
         children: /* @__PURE__ */ jsxs(
           "div",
           {
-            className: isBlock ? `${styles$5.mathStack} ${styles$5.mathStackBlock}` : styles$5.mathStack,
+            className: isBlock ? `${styles$6.mathStack} ${styles$6.mathStackBlock}` : styles$6.mathStack,
             children: [
               showHint ? /* @__PURE__ */ jsxs(
                 "div",
                 {
                   id: titleId,
-                  className: isBlock ? `${styles$5.mathHint} ${styles$5.mathHintBlock}` : styles$5.mathHint,
+                  className: isBlock ? `${styles$6.mathHint} ${styles$6.mathHintBlock}` : styles$6.mathHint,
                   children: [
-                    /* @__PURE__ */ jsx("span", { className: styles$5.mathHintIcon, "aria-hidden": true, children: isBlock ? "TeX" : "√x" }),
+                    /* @__PURE__ */ jsx("span", { className: styles$6.mathHintIcon, "aria-hidden": true, children: isBlock ? "TeX" : "√x" }),
                     newLabel
                   ]
                 }
@@ -3800,20 +4758,20 @@ function MathEditorPopover({
                 "div",
                 {
                   id: showHint ? void 0 : titleId,
-                  className: isBlock ? `${styles$5.mathField} ${styles$5.mathFieldBlock}` : styles$5.mathField,
+                  className: isBlock ? `${styles$6.mathField} ${styles$6.mathFieldBlock}` : styles$6.mathField,
                   children: [
                     field2,
                     /* @__PURE__ */ jsxs(
                       "button",
                       {
                         type: "button",
-                        className: styles$5.mathDone,
+                        className: styles$6.mathDone,
                         disabled: !canSubmit,
                         title: isBlock ? `${doneLabel} (⌘/Ctrl+Enter)` : `${doneLabel} (Enter)`,
                         onClick: submit,
                         children: [
                           doneLabel,
-                          /* @__PURE__ */ jsx("span", { className: styles$5.mathDoneKbd, "aria-hidden": true, children: "↵" })
+                          /* @__PURE__ */ jsx("span", { className: styles$6.mathDoneKbd, "aria-hidden": true, children: "↵" })
                         ]
                       }
                     )
@@ -3840,7 +4798,7 @@ const ToolbarButton = forwardRef(function ToolbarButton2({ title, active: active
       "aria-pressed": active2,
       "aria-busy": busy,
       disabled,
-      className: `${styles$5.btn} ${active2 ? styles$5.btnActive : ""}${className ? ` ${className}` : ""}`,
+      className: `${styles$6.btn} ${active2 ? styles$6.btnActive : ""}${className ? ` ${className}` : ""}`,
       onMouseDown: (e2) => e2.preventDefault(),
       onClick,
       children
@@ -3848,7 +4806,11 @@ const ToolbarButton = forwardRef(function ToolbarButton2({ title, active: active
   );
 });
 function Divider() {
-  return /* @__PURE__ */ jsx("span", { className: styles$5.divider, "aria-hidden": true });
+  return /* @__PURE__ */ jsx("span", { className: styles$6.divider, "aria-hidden": true });
+}
+const LINE_HEIGHTS = ["1", "1.15", "1.5", "2", "2.5", "3"];
+function readParaAttr(editor, name) {
+  return editor.getAttributes("paragraph")[name] ?? editor.getAttributes("heading")[name] ?? null;
 }
 const MenuCloseCtx = createContext(() => {
 });
@@ -3863,7 +4825,7 @@ function MenuPopover({
     /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsx(
       Popover.Content,
       {
-        className: styles$5.menu,
+        className: styles$6.menu,
         sideOffset: 4,
         align: "start",
         onOpenAutoFocus: (e2) => e2.preventDefault(),
@@ -3885,7 +4847,7 @@ function MenuItem({
     {
       type: "button",
       disabled,
-      className: `${styles$5.menuItem} ${selected ? styles$5.menuItemSelected : ""}`,
+      className: `${styles$6.menuItem} ${selected ? styles$6.menuItemSelected : ""}`,
       onMouseDown: (e2) => e2.preventDefault(),
       onClick: () => {
         onSelect();
@@ -3920,21 +4882,21 @@ function TableInsertItem({
           {
             type: "button",
             disabled,
-            className: `${styles$5.menuItem} ${open ? styles$5.menuItemSelected : ""}`,
+            className: `${styles$6.menuItem} ${open ? styles$6.menuItemSelected : ""}`,
             onMouseDown: (e2) => e2.preventDefault(),
             children: [
-              /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: "⊞" }),
+              /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "⊞" }),
                 labels.tableInsert
               ] }),
-              /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$5.tableInsertCaret })
+              /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$6.tableInsertCaret })
             ]
           }
         ) }),
         /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsxs(
           Popover.Content,
           {
-            className: styles$5.tableSizePicker,
+            className: styles$6.tableSizePicker,
             side: "right",
             align: "start",
             sideOffset: 6,
@@ -3944,7 +4906,7 @@ function TableInsertItem({
               /* @__PURE__ */ jsx(
                 "div",
                 {
-                  className: styles$5.tableSizeGrid,
+                  className: styles$6.tableSizeGrid,
                   style: {
                     gridTemplateColumns: `repeat(${TABLE_PICKER_COLS}, 1fr)`
                   },
@@ -3958,7 +4920,7 @@ function TableInsertItem({
                       {
                         type: "button",
                         "aria-label": labels.tableSizeSelected(col, row2),
-                        className: `${styles$5.tableSizeCell} ${active2 ? styles$5.tableSizeCellActive : ""}`,
+                        className: `${styles$6.tableSizeCell} ${active2 ? styles$6.tableSizeCellActive : ""}`,
                         onMouseDown: (e2) => e2.preventDefault(),
                         onMouseEnter: () => setHover({ cols: col, rows: row2 }),
                         onClick: () => {
@@ -3973,7 +4935,7 @@ function TableInsertItem({
                   })
                 }
               ),
-              /* @__PURE__ */ jsx("div", { className: styles$5.tableSizeLabel, children: hover.cols > 0 ? labels.tableSizeSelected(hover.cols, hover.rows) : labels.tableInsert })
+              /* @__PURE__ */ jsx("div", { className: styles$6.tableSizeLabel, children: hover.cols > 0 ? labels.tableSizeSelected(hover.cols, hover.rows) : labels.tableInsert })
             ]
           }
         ) })
@@ -3995,20 +4957,20 @@ function ColorPopover({
       "button",
       {
         type: "button",
-        className: styles$5.btn,
+        className: styles$6.btn,
         title,
         "aria-label": title,
         onMouseDown: (e2) => e2.preventDefault(),
-        children: /* @__PURE__ */ jsxs("span", { className: styles$5.colorIcon, children: [
-          /* @__PURE__ */ jsx("span", { className: styles$5.colorIconGlyph, children: glyph }),
-          /* @__PURE__ */ jsx("span", { className: styles$5.colorIconBar, style: { background: bar2 } })
+        children: /* @__PURE__ */ jsxs("span", { className: styles$6.colorIcon, children: [
+          /* @__PURE__ */ jsx("span", { className: styles$6.colorIconGlyph, children: glyph }),
+          /* @__PURE__ */ jsx("span", { className: styles$6.colorIconBar, style: { background: bar2 } })
         ] })
       }
     ) }),
     /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsx(
       Popover.Content,
       {
-        className: styles$5.popoverContent,
+        className: styles$6.popoverContent,
         sideOffset: 4,
         align: "start",
         onOpenAutoFocus: (e2) => e2.preventDefault(),
@@ -4067,6 +5029,9 @@ function EditorToolbar({
       highlightColor: e2.getAttributes("highlight").color || void 0,
       superscript: e2.isActive("superscript"),
       subscript: e2.isActive("subscript"),
+      textAlign: readParaAttr(e2, "textAlign"),
+      indent: readParaAttr(e2, "indent"),
+      lineHeight: readParaAttr(e2, "lineHeight"),
       inTable: e2.isActive("table"),
       canUndo: e2.can().undo(),
       canRedo: e2.can().redo()
@@ -4085,9 +5050,14 @@ function EditorToolbar({
   }, [editor]);
   const fileInputRef = useRef(null);
   const chain = () => editor.chain().focus();
+  const imageUploadEnabled = hasImageUpload(editor);
   const handlePickImage = () => {
     var _a;
-    return (_a = fileInputRef.current) == null ? void 0 : _a.click();
+    if (imageUploadEnabled) {
+      chain().setImageUploadNode().run();
+      return;
+    }
+    (_a = fileInputRef.current) == null ? void 0 : _a.click();
   };
   const handleImageChange = async (e2) => {
     var _a;
@@ -4264,8 +5234,8 @@ function EditorToolbar({
     /* @__PURE__ */ jsx(
       "div",
       {
-        className: className ? `${styles$5.toolbar} ${className}` : styles$5.toolbar,
-        children: /* @__PURE__ */ jsxs("div", { className: styles$5.inner, children: [
+        className: className ? `${styles$6.toolbar} ${className}` : styles$6.toolbar,
+        children: /* @__PURE__ */ jsxs("div", { className: styles$6.inner, children: [
           /* @__PURE__ */ jsx(
             ToolbarButton,
             {
@@ -4292,12 +5262,12 @@ function EditorToolbar({
                 "button",
                 {
                   type: "button",
-                  className: styles$5.styleTrigger,
+                  className: styles$6.styleTrigger,
                   title: t.style,
                   onMouseDown: (e2) => e2.preventDefault(),
                   children: [
-                    /* @__PURE__ */ jsx("span", { className: styles$5.styleTriggerLabel, children: t.style }),
-                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$5.styleTriggerCaret })
+                    /* @__PURE__ */ jsx("span", { className: styles$6.styleTriggerLabel, children: t.style }),
+                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$6.styleTriggerCaret })
                   ]
                 }
               ),
@@ -4307,8 +5277,8 @@ function EditorToolbar({
                   {
                     selected: (state.headingLevel ?? 0) === 0,
                     onSelect: () => setBlockStyle(0),
-                    children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                      /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: "¶" }),
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "¶" }),
                       t.normalText
                     ] })
                   }
@@ -4318,8 +5288,8 @@ function EditorToolbar({
                   {
                     selected: state.headingLevel === lv,
                     onSelect: () => setBlockStyle(lv),
-                    children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                      /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: `H${lv}` }),
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: `H${lv}` }),
                       t.headingLabel(lv)
                     ] })
                   },
@@ -4335,14 +5305,14 @@ function EditorToolbar({
                 "button",
                 {
                   type: "button",
-                  className: styles$5.styleTrigger,
+                  className: styles$6.styleTrigger,
                   title: t.fontSize,
                   "aria-label": t.fontSize,
                   disabled: !canEditFontSize,
                   onMouseDown: (e2) => e2.preventDefault(),
                   children: [
-                    /* @__PURE__ */ jsx("span", { className: styles$5.styleTriggerLabel, children: state.fontSize || t.fontSize }),
-                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$5.styleTriggerCaret })
+                    /* @__PURE__ */ jsx("span", { className: styles$6.styleTriggerLabel, children: state.fontSize || t.fontSize }),
+                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$6.styleTriggerCaret })
                   ]
                 }
               ),
@@ -4352,8 +5322,8 @@ function EditorToolbar({
                   {
                     selected: !state.fontSize,
                     onSelect: () => applyFontSize(""),
-                    children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                      /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: "A" }),
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "A" }),
                       t.fontSizeDefault
                     ] })
                   }
@@ -4363,8 +5333,8 @@ function EditorToolbar({
                   {
                     selected: state.fontSize === size,
                     onSelect: () => applyFontSize(size),
-                    children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                      /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: parseInt(size, 10) }),
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: parseInt(size, 10) }),
                       size
                     ] })
                   },
@@ -4448,13 +5418,13 @@ function EditorToolbar({
                 "button",
                 {
                   type: "button",
-                  className: `${styles$5.scriptTrigger} ${scriptActive !== "normal" ? styles$5.btnActive : ""}`,
+                  className: `${styles$6.scriptTrigger} ${scriptActive !== "normal" ? styles$6.btnActive : ""}`,
                   title: t.scriptMenu,
                   "aria-label": t.scriptMenu,
                   onMouseDown: (e2) => e2.preventDefault(),
                   children: [
-                    /* @__PURE__ */ jsx("span", { className: styles$5.scriptTriggerGlyph, children: "A" }),
-                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$5.styleTriggerCaret })
+                    /* @__PURE__ */ jsx("span", { className: styles$6.scriptTriggerGlyph, children: "A" }),
+                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$6.styleTriggerCaret })
                   ]
                 }
               ),
@@ -4464,8 +5434,8 @@ function EditorToolbar({
                   {
                     selected: scriptActive === "normal",
                     onSelect: () => chain().unsetSuperscript().unsetSubscript().run(),
-                    children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                      /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: "A" }),
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "A" }),
                       t.scriptNormal
                     ] })
                   }
@@ -4475,8 +5445,8 @@ function EditorToolbar({
                   {
                     selected: scriptActive === "superscript",
                     onSelect: () => chain().unsetSubscript().toggleSuperscript().run(),
-                    children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                      /* @__PURE__ */ jsxs("span", { className: `${styles$5.styleIcon} ${styles$5.scriptGlyph}`, children: [
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsxs("span", { className: `${styles$6.styleIcon} ${styles$6.scriptGlyph}`, children: [
                         "x",
                         /* @__PURE__ */ jsx("sup", { children: "2" })
                       ] }),
@@ -4489,8 +5459,8 @@ function EditorToolbar({
                   {
                     selected: scriptActive === "subscript",
                     onSelect: () => chain().unsetSuperscript().toggleSubscript().run(),
-                    children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                      /* @__PURE__ */ jsxs("span", { className: `${styles$5.styleIcon} ${styles$5.scriptGlyph}`, children: [
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsxs("span", { className: `${styles$6.styleIcon} ${styles$6.scriptGlyph}`, children: [
                         "x",
                         /* @__PURE__ */ jsx("sub", { children: "2" })
                       ] }),
@@ -4516,9 +5486,9 @@ function EditorToolbar({
               trigger: /* @__PURE__ */ jsx(ToolbarButton, { title: t.link, active: state.link, children: /* @__PURE__ */ jsx(LinkIcon, {}) })
             }
           ),
-          onImageUpload ? /* @__PURE__ */ jsxs(Fragment$2, { children: [
+          imageUploadEnabled || onImageUpload ? /* @__PURE__ */ jsxs(Fragment$2, { children: [
             /* @__PURE__ */ jsx(ToolbarButton, { title: t.image, onClick: handlePickImage, children: /* @__PURE__ */ jsx(ImageIcon, {}) }),
-            /* @__PURE__ */ jsx(
+            !imageUploadEnabled && /* @__PURE__ */ jsx(
               "input",
               {
                 ref: fileInputRef,
@@ -4536,19 +5506,19 @@ function EditorToolbar({
                 "button",
                 {
                   type: "button",
-                  className: styles$5.styleTrigger,
+                  className: styles$6.styleTrigger,
                   title: importTitle,
                   "aria-label": importTitle,
                   "aria-busy": !!importing,
                   disabled: !!importing,
                   onMouseDown: (e2) => e2.preventDefault(),
                   children: [
-                    /* @__PURE__ */ jsx("span", { className: styles$5.styleTriggerLabel, children: t.importDocument }),
+                    /* @__PURE__ */ jsx("span", { className: styles$6.styleTriggerLabel, children: t.importDocument }),
                     /* @__PURE__ */ jsx(
                       ChevronDownIcon,
                       {
                         size: 12,
-                        className: styles$5.styleTriggerCaret
+                        className: styles$6.styleTriggerCaret
                       }
                     )
                   ]
@@ -4570,7 +5540,117 @@ function EditorToolbar({
               title: t.blockquote,
               active: state.blockquote,
               onClick: () => chain().toggleBlockquote().run(),
-              children: /* @__PURE__ */ jsx("span", { className: styles$5.txtIcon, children: "❝" })
+              children: /* @__PURE__ */ jsx("span", { className: styles$6.txtIcon, children: "❝" })
+            }
+          ),
+          /* @__PURE__ */ jsx(Divider, {}),
+          /* @__PURE__ */ jsx(
+            MenuPopover,
+            {
+              trigger: /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  className: `${styles$6.styleTrigger} ${styles$6.iconTrigger}`,
+                  title: t.align,
+                  "aria-label": t.align,
+                  onMouseDown: (e2) => e2.preventDefault(),
+                  children: [
+                    state.textAlign === "center" ? /* @__PURE__ */ jsx(AlignCenterIcon, {}) : state.textAlign === "right" ? /* @__PURE__ */ jsx(AlignRightIcon, {}) : state.textAlign === "justify" ? /* @__PURE__ */ jsx(AlignJustifyIcon, {}) : /* @__PURE__ */ jsx(AlignLeftIcon, {}),
+                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$6.styleTriggerCaret })
+                  ]
+                }
+              ),
+              children: [
+                { value: "left", label: t.alignLeft, Icon: AlignLeftIcon },
+                { value: "center", label: t.alignCenter, Icon: AlignCenterIcon },
+                { value: "right", label: t.alignRight, Icon: AlignRightIcon },
+                { value: "justify", label: t.alignJustify, Icon: AlignJustifyIcon }
+              ].map(({ value, label, Icon }) => /* @__PURE__ */ jsx(
+                MenuItem,
+                {
+                  selected: state.textAlign === value,
+                  onSelect: () => chain().setTextAlign(value).run(),
+                  children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                    /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: /* @__PURE__ */ jsx(Icon, { size: 14 }) }),
+                    label
+                  ] })
+                },
+                value
+              ))
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            MenuPopover,
+            {
+              trigger: /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  className: `${styles$6.styleTrigger} ${styles$6.iconTrigger}`,
+                  title: t.indent,
+                  "aria-label": t.indent,
+                  onMouseDown: (e2) => e2.preventDefault(),
+                  children: [
+                    /* @__PURE__ */ jsx(IndentIncreaseIcon, {}),
+                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$6.styleTriggerCaret })
+                  ]
+                }
+              ),
+              children: [
+                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => chain().increaseIndent().run(), children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                  /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: /* @__PURE__ */ jsx(IndentIncreaseIcon, { size: 14 }) }),
+                  t.indentIncrease
+                ] }) }),
+                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => chain().decreaseIndent().run(), children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                  /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: /* @__PURE__ */ jsx(IndentDecreaseIcon, { size: 14 }) }),
+                  t.indentDecrease
+                ] }) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            MenuPopover,
+            {
+              trigger: /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  className: `${styles$6.styleTrigger} ${styles$6.iconTrigger}`,
+                  title: t.lineHeight,
+                  "aria-label": t.lineHeight,
+                  onMouseDown: (e2) => e2.preventDefault(),
+                  children: [
+                    /* @__PURE__ */ jsx(LineHeightIcon, {}),
+                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$6.styleTriggerCaret })
+                  ]
+                }
+              ),
+              children: [
+                /* @__PURE__ */ jsx(
+                  MenuItem,
+                  {
+                    selected: !state.lineHeight,
+                    onSelect: () => chain().setLineHeight(null).run(),
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "—" }),
+                      t.lineHeightDefault
+                    ] })
+                  }
+                ),
+                LINE_HEIGHTS.map((value) => /* @__PURE__ */ jsx(
+                  MenuItem,
+                  {
+                    selected: state.lineHeight === Number(value),
+                    onSelect: () => chain().setLineHeight(Number(value)).run(),
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "≡" }),
+                      value
+                    ] })
+                  },
+                  value
+                ))
+              ]
             }
           ),
           /* @__PURE__ */ jsx(Divider, {}),
@@ -4618,30 +5698,30 @@ function EditorToolbar({
                 "button",
                 {
                   type: "button",
-                  className: styles$5.styleTrigger,
+                  className: styles$6.styleTrigger,
                   title: t.more,
                   onMouseDown: (e2) => e2.preventDefault(),
                   children: [
-                    /* @__PURE__ */ jsx("span", { className: styles$5.styleTriggerLabel, children: t.more }),
-                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$5.styleTriggerCaret })
+                    /* @__PURE__ */ jsx("span", { className: styles$6.styleTriggerLabel, children: t.more }),
+                    /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12, className: styles$6.styleTriggerCaret })
                   ]
                 }
               ),
               children: [
-                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => chain().toggleCodeBlock().run(), children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                  /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: "{ }" }),
+                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => chain().toggleCodeBlock().run(), children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                  /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "{ }" }),
                   t.codeBlock
                 ] }) }),
-                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => openInsertMath("inline"), children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                  /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: "√x" }),
+                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => openInsertMath("inline"), children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                  /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "√x" }),
                   t.inlineMath
                 ] }) }),
-                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => openInsertMath("block"), children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                  /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: "∑" }),
+                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => openInsertMath("block"), children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                  /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "∑" }),
                   t.blockMath
                 ] }) }),
-                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => chain().setHorizontalRule().run(), children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                  /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: "—" }),
+                /* @__PURE__ */ jsx(MenuItem, { onSelect: () => chain().setHorizontalRule().run(), children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                  /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: "—" }),
                   t.hr
                 ] }) }),
                 /* @__PURE__ */ jsx(
@@ -4657,8 +5737,8 @@ function EditorToolbar({
                   {
                     disabled: item2.disabled,
                     onSelect: () => item2.onSelect(editor),
-                    children: /* @__PURE__ */ jsxs("span", { className: styles$5.styleItem, children: [
-                      /* @__PURE__ */ jsx("span", { className: styles$5.styleIcon, children: item2.icon }),
+                    children: /* @__PURE__ */ jsxs("span", { className: styles$6.styleItem, children: [
+                      /* @__PURE__ */ jsx("span", { className: styles$6.styleIcon, children: item2.icon }),
                       item2.label
                     ] })
                   },
@@ -4695,7 +5775,8 @@ function EditorToolbar({
         onCancel: cancelMath
       }
     ) : null,
-    /* @__PURE__ */ jsx(TableHandles, { editor, labels: t })
+    /* @__PURE__ */ jsx(TableHandles, { editor, labels: t }),
+    /* @__PURE__ */ jsx(ImageAlignTools, { editor, labels: t })
   ] });
 }
 function useIsMobile(breakpoint = 768) {
@@ -4857,6 +5938,11 @@ function TocPanel({ items, activeId, onItemClick, labels }) {
     list2
   ] });
 }
+function resetImageSize(editor) {
+  const pos = findImagePos(editor);
+  if (pos == null) return false;
+  return editor.chain().focus().setNodeSelection(pos).updateAttributes("image", { width: null, height: null }).run();
+}
 const popoverAnchor = "_popoverAnchor_9y5t0_55";
 const popoverContent = "_popoverContent_9y5t0_62";
 const styles = {
@@ -5001,11 +6087,11 @@ function tryInsertMarkdownAt(editor, from, to, markdown) {
     return false;
   }
 }
-function insertPlainParagraphAt(editor, from, to, text) {
+function insertPlainParagraphAt(editor, from, to, text2) {
   try {
     return editor.chain().insertContentAt(
       { from, to },
-      { type: "paragraph", content: text ? [{ type: "text", text }] : [] }
+      { type: "paragraph", content: text2 ? [{ type: "text", text: text2 }] : [] }
     ).run();
   } catch {
     return false;
@@ -5023,10 +6109,15 @@ function insertSlashMarkdown(editor, range, markdown) {
   insertMarkdown(editor, prepared);
 }
 export {
+  AlignCenterIcon,
+  AlignJustifyIcon,
+  AlignLeftIcon,
+  AlignRightIcon,
   BoldIcon,
   COMMENT_ACTIVE_META,
   COMMENT_CLICK_META,
   COMMENT_GUTTER_META,
+  CaptionsIcon,
   C as ChartMount,
   CheckIcon,
   ChevronDownIcon,
@@ -5049,11 +6140,16 @@ export {
   FIND_DEBOUNCE_MS,
   default2 as FindAndReplace,
   FindReplaceBar,
+  ImageAlignTools,
   ImageIcon,
+  ImageUploadNode,
   ImportIcon,
   ImportPlaceholder,
+  IndentDecreaseIcon,
+  IndentIncreaseIcon,
   ItalicIcon,
   KeyboardIcon,
+  LineHeightIcon,
   LinkIcon,
   LinkPopover,
   ListChecksIcon,
@@ -5066,6 +6162,7 @@ export {
   MarkdownWysiwygEditor,
   MenuIcon,
   PENDING_ANCHOR_CLASS,
+  P as ParagraphStyles,
   RedoIcon,
   ReplaceAllIcon,
   ReplaceIcon,
@@ -5106,6 +6203,7 @@ export {
   defaultColorPaletteLabels,
   defaultCommentLabels,
   defaultFindLabels,
+  defaultImageUploadLabels,
   defaultLinkPopoverLabels,
   defaultShortcutLabels,
   defaultSlashMenuLabels,
@@ -5119,8 +6217,13 @@ export {
   findRangeByAnchor,
   focusComment,
   getMarkdownForRange,
+  hasImageUpload,
+  imageMarkdownTokenizer,
+  imageParseMarkdown,
+  imageRenderMarkdown,
   insertMarkdown,
   insertSlashMarkdown,
+  isImageAlignActive,
   isLinkActive,
   looksLikeMarkdown,
   lowlight,
@@ -5129,6 +6232,8 @@ export {
   mergeCommentIntervals,
   m as mountChartsInContainer,
   nextComment,
+  normalizeImageAlign,
+  normalizeImageCaption,
   normalizeLinkHref,
   normalizeMarkdown,
   openLinkUrl,
@@ -5141,11 +6246,16 @@ export {
   removeLink,
   replaceRangeWithMarkdown,
   reportChart,
+  resetImageSize,
   runFindCommand,
   sanitizeLinkUrl,
   s as scrollToTocHeading,
   selectionKind,
   s2 as serializeChartPayload,
+  setImageAlign,
+  setImageAlignAt,
+  setImageCaption,
+  setImageCaptionAtPos,
   s3 as stabilizeMarkdown,
   stripCommentAnchorMarks,
   useIsMobile