@crewlethq/ui 0.28.0 → 0.30.0

package/dist/Editor-YZ7KG2RD.js

@@ -0,0 +1,2099 @@
+import { richEditorLabels } from './chunk-A4E5YLXO.js';
+import { schema, readMarkdown, writeMarkdown } from './chunk-YFW4MTK4.js';
+import { safeHref, MARKDOWN_CALLOUT_TONES } from './chunk-SKOYC2CF.js';
+import { Toolbar } from './chunk-PGRPNDWM.js';
+import { FormField, Input } from './chunk-6QFAK2WV.js';
+import './chunk-PQADV6P6.js';
+import { Menu } from './chunk-2HIOJ4YZ.js';
+import { placePopup, viewportBounds } from './chunk-HMPFGIWM.js';
+import { usePopupLayer } from './chunk-R25RGPUB.js';
+import { Button } from './chunk-OG6CL3EB.js';
+import { IconButton } from './chunk-4FQT6ZAY.js';
+import { VisuallyHidden } from './chunk-BZFWDIV6.js';
+import { cx } from './chunk-ODEQTPFM.js';
+import { forwardRef, useMemo, useRef, useState, useId, useSyncExternalStore, useCallback, useLayoutEffect, useEffect, useImperativeHandle } from 'react';
+import { createPortal } from 'react-dom';
+import { gapCursor } from 'prosemirror-gapcursor';
+import { history, redo, undo } from 'prosemirror-history';
+import { TextSelection, PluginKey, Plugin, EditorState, NodeSelection, Selection } from 'prosemirror-state';
+import { EditorView, DecorationSet, Decoration } from 'prosemirror-view';
+import { TypeGlyph, Heading1Glyph, Heading2Glyph, Heading3Glyph, ListGlyph, ListOrderedGlyph, ListChecksGlyph, TextQuoteGlyph, InfoGlyph, SquareCodeGlyph, TableGlyph, MinusGlyph, ImageGlyph, LinkGlyph, BoldGlyph, ItalicGlyph, StrikethroughGlyph, CodeGlyph, PencilGlyph, TrashGlyph, ExternalLinkGlyph, UnlinkGlyph, ChevronDownGlyph, TextAlignStartGlyph, TextAlignCenterGlyph, TextAlignEndGlyph } from '@crewlethq/icons/glyphs';
+import { toggleMark, setBlockType, wrapIn, chainCommands, baseKeymap, exitCode } from 'prosemirror-commands';
+import { Fragment as Fragment$1, Slice, DOMParser } from 'prosemirror-model';
+import { liftListItem, wrapInList, sinkListItem, splitListItem } from 'prosemirror-schema-list';
+import { InputRule, inputRules, textblockTypeInputRule, wrappingInputRule, undoInputRule } from 'prosemirror-inputrules';
+import { keymap } from 'prosemirror-keymap';
+import { findWrapping } from 'prosemirror-transform';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var N = schema.nodes;
+var M = schema.marks;
+function markActive(state, type) {
+  const { from, $from, to, empty } = state.selection;
+  if (empty) return Boolean(type.isInSet(state.storedMarks ?? $from.marks()));
+  return state.doc.rangeHasMark(from, to, type);
+}
+function headingLevel(state) {
+  const parent = state.selection.$from.parent;
+  return parent.type === N.heading ? parent.attrs.level : 0;
+}
+function inCode(state) {
+  return Boolean(state.selection.$from.parent.type.spec.code);
+}
+var toggleStrong = toggleMark(M.strong);
+var toggleEm = toggleMark(M.em);
+var toggleStrike = toggleMark(M.strike);
+var toggleCode = toggleMark(M.code);
+function linkAt(state) {
+  const { $from, from, to, empty } = state.selection;
+  const parent = $from.parent;
+  if (!parent.inlineContent) return null;
+  const runs = [];
+  let pos = $from.start();
+  let run = null;
+  parent.forEach((child) => {
+    const mark = M.link.isInSet(child.marks);
+    const end = pos + child.nodeSize;
+    if (mark && run && run.mark.eq(mark)) {
+      run.to = end;
+    } else {
+      run = mark ? { from: pos, to: end, mark } : null;
+      if (run) runs.push(run);
+    }
+    pos = end;
+  });
+  return runs.find((r) => empty ? from > r.from && from <= r.to : from >= r.from && to <= r.to) ?? null;
+}
+function setLink(href, text) {
+  return (state, dispatch) => {
+    if (inCode(state)) return false;
+    if (!dispatch) return true;
+    const mark = M.link.create({ href });
+    const at = linkAt(state);
+    const { from, to, empty } = state.selection;
+    const tr = state.tr;
+    if (!empty) {
+      tr.removeMark(from, to, M.link).addMark(from, to, mark);
+    } else if (at) {
+      tr.removeMark(at.from, at.to, M.link).addMark(at.from, at.to, mark);
+    } else {
+      const words = text?.trim() || href;
+      tr.insert(from, schema.text(words, [mark, ...state.selection.$from.marks().filter((m) => m.type !== M.link)]));
+      tr.setSelection(TextSelection.create(tr.doc, from + words.length));
+      tr.removeStoredMark(M.link);
+    }
+    dispatch(tr.scrollIntoView());
+    return true;
+  };
+}
+var removeLink = (state, dispatch) => {
+  const at = linkAt(state);
+  const { from, to, empty } = state.selection;
+  if (!at && (empty || !state.doc.rangeHasMark(from, to, M.link))) return false;
+  if (dispatch) {
+    const tr = state.tr;
+    if (at) tr.removeMark(at.from, at.to, M.link);
+    if (!empty) tr.removeMark(from, to, M.link);
+    dispatch(tr);
+  }
+  return true;
+};
+function toggleHeading(level) {
+  return (state, dispatch) => headingLevel(state) === level ? setBlockType(N.paragraph)(state, dispatch) : setBlockType(N.heading, { level })(state, dispatch);
+}
+var setParagraph = setBlockType(N.paragraph);
+function setCodeBlock(lang = "") {
+  return setBlockType(N.code_block, { lang, fence: "```" });
+}
+var wrapQuote = wrapIn(N.blockquote);
+function wrapCallout(tone = "note") {
+  return wrapIn(N.callout, { tone });
+}
+function listAround(state) {
+  const { $from } = state.selection;
+  for (let d = $from.depth - 1; d > 0; d--) {
+    const node = $from.node(d);
+    if (node.type === N.list_item) {
+      const list = $from.node(d - 1);
+      return { node: list, pos: $from.before(d - 1), depth: d - 1 };
+    }
+  }
+  return null;
+}
+function kindOf(list) {
+  if (list.type === N.ordered_list) return "ordered";
+  let task = false;
+  list.forEach((item) => {
+    if (item.attrs.checked !== null) task = true;
+  });
+  return task ? "task" : "bullet";
+}
+function retask(tr, pos, kind) {
+  const list = tr.doc.nodeAt(pos);
+  if (!list) return;
+  let offset = pos + 1;
+  list.forEach((item) => {
+    const checked = kind === "task" ? item.attrs.checked ?? false : null;
+    if (checked !== item.attrs.checked) tr.setNodeMarkup(offset, void 0, { ...item.attrs, checked });
+    offset += item.nodeSize;
+  });
+}
+function setList(kind) {
+  return (state, dispatch) => {
+    const around = listAround(state);
+    if (around) {
+      if (kindOf(around.node) === kind) return liftListItem(N.list_item)(state, dispatch);
+      if (dispatch) {
+        const type2 = kind === "ordered" ? N.ordered_list : N.bullet_list;
+        const tr = state.tr.setNodeMarkup(around.pos, type2, type2 === around.node.type ? around.node.attrs : null);
+        retask(tr, around.pos, kind);
+        dispatch(tr);
+      }
+      return true;
+    }
+    const type = kind === "ordered" ? N.ordered_list : N.bullet_list;
+    let wrapped = null;
+    if (!wrapInList(type)(state, (tr) => wrapped = tr)) return false;
+    if (dispatch && wrapped) {
+      const tr = wrapped;
+      if (kind === "task") {
+        const $pos = tr.selection.$from;
+        for (let d = $pos.depth; d > 0; d--) {
+          if ($pos.node(d).type === type) {
+            retask(tr, $pos.before(d), "task");
+            break;
+          }
+        }
+      }
+      dispatch(tr);
+    }
+    return true;
+  };
+}
+var splitItem = (state, dispatch) => {
+  const { $from } = state.selection;
+  if ($from.depth < 2 || $from.node(-1).type !== N.list_item) return false;
+  const checked = $from.node(-1).attrs.checked;
+  return splitListItem(N.list_item, checked === null ? void 0 : { checked: false })(state, dispatch);
+};
+function toggleTask(pos) {
+  return (state, dispatch) => {
+    const item = state.doc.nodeAt(pos);
+    if (!item || item.type !== N.list_item || item.attrs.checked === null) return false;
+    if (dispatch) dispatch(state.tr.setNodeMarkup(pos, void 0, { ...item.attrs, checked: !item.attrs.checked }));
+    return true;
+  };
+}
+function insertBlock(node, caret) {
+  return (state, dispatch) => {
+    const { $from } = state.selection;
+    if ($from.parent.type.spec.code) return false;
+    const depth = $from.depth;
+    const empty = $from.parent.type === N.paragraph && $from.parent.childCount === 0;
+    const from = empty ? $from.before(depth) : $from.after(depth);
+    const to = empty ? $from.after(depth) : from;
+    const container = $from.node(depth - 1);
+    const index = empty ? $from.index(depth - 1) : $from.indexAfter(depth - 1);
+    const end = empty ? index + 1 : index;
+    const nodes = end >= container.childCount ? [node, N.paragraph.create()] : [node];
+    if (!container.canReplace(index, end, Fragment$1.from(nodes))) return false;
+    if (dispatch) {
+      const tr = state.tr.replaceWith(from, to, nodes);
+      const target = caret === "inside" ? from + 1 : from + node.nodeSize;
+      tr.setSelection(Selection.near(tr.doc.resolve(Math.min(target, tr.doc.content.size)), 1));
+      dispatch(tr.scrollIntoView());
+    }
+    return true;
+  };
+}
+var insertRule = insertBlock(N.horizontal_rule.create(), "after");
+function insertImage(src, alt) {
+  return (state, dispatch) => {
+    if (inCode(state)) return false;
+    const image = N.image.create({ src, alt });
+    if (dispatch) dispatch(state.tr.replaceSelectionWith(image, false).scrollIntoView());
+    return true;
+  };
+}
+function tableAt(state) {
+  const { $from } = state.selection;
+  for (let d = $from.depth; d > 0; d--) {
+    if ($from.node(d).type === N.table) {
+      if ($from.depth < d + 2) return null;
+      return { table: $from.node(d), pos: $from.before(d), row: $from.index(d), col: $from.index(d + 1) };
+    }
+  }
+  return null;
+}
+function gridOf(table) {
+  const cells = [];
+  const align = [];
+  let width = 0;
+  table.forEach((row, _o, r) => {
+    const line = [];
+    row.forEach((cell, _co, c) => {
+      line.push(cell.content);
+      if (r === 0) align[c] = cell.attrs.align;
+    });
+    width = Math.max(width, line.length);
+    cells.push(line);
+  });
+  for (const line of cells) while (line.length < width) line.push(Fragment$1.empty);
+  for (let c = 0; c < width; c++) align[c] ??= "left";
+  return { cells, align };
+}
+function tableOf(grid) {
+  return N.table.create(
+    null,
+    grid.cells.map(
+      (line, r) => N.table_row.create(
+        null,
+        line.map((content, c) => (r === 0 ? N.table_header : N.table_cell).create({ align: grid.align[c] ?? "left" }, content))
+      )
+    )
+  );
+}
+function rebuild(state, at, grid, row, col) {
+  const table = tableOf(grid);
+  const tr = state.tr.replaceWith(at.pos, at.pos + at.table.nodeSize, table);
+  let pos = at.pos + 1;
+  table.forEach((r, _o, ri) => {
+    if (ri < row) pos += r.nodeSize;
+  });
+  pos += 1;
+  const target = table.child(Math.min(row, table.childCount - 1));
+  target.forEach((cell, _o, ci) => {
+    if (ci < col) pos += cell.nodeSize;
+  });
+  tr.setSelection(TextSelection.create(tr.doc, pos + 1));
+  return tr.scrollIntoView();
+}
+function insertTable(rows = 3, cols = 3) {
+  const grid = {
+    cells: Array.from({ length: rows }, () => Array.from({ length: cols }, () => Fragment$1.empty)),
+    align: Array.from({ length: cols }, () => "left")
+  };
+  return insertBlock(tableOf(grid), "inside");
+}
+function tableCommand(edit) {
+  return (state, dispatch) => {
+    const at = tableAt(state);
+    if (!at) return false;
+    if (!dispatch) return true;
+    const grid = gridOf(at.table);
+    const result = edit(grid, at);
+    if (result === "delete") {
+      const tr = state.tr.delete(at.pos, at.pos + at.table.nodeSize);
+      if (tr.doc.childCount === 0) tr.insert(0, N.paragraph.create());
+      tr.setSelection(Selection.near(tr.doc.resolve(Math.min(at.pos, tr.doc.content.size)), -1));
+      dispatch(tr.scrollIntoView());
+      return true;
+    }
+    dispatch(rebuild(state, at, grid, result.row, result.col));
+    return true;
+  };
+}
+var blankRow = (grid) => grid.align.map(() => Fragment$1.empty);
+var addRowBefore = tableCommand((grid, at) => {
+  grid.cells.splice(at.row, 0, blankRow(grid));
+  return { row: at.row, col: at.col };
+});
+var addRowAfter = tableCommand((grid, at) => {
+  grid.cells.splice(at.row + 1, 0, blankRow(grid));
+  return { row: at.row + 1, col: at.col };
+});
+var addColumnBefore = tableCommand((grid, at) => {
+  for (const line of grid.cells) line.splice(at.col, 0, Fragment$1.empty);
+  grid.align.splice(at.col, 0, "left");
+  return { row: at.row, col: at.col };
+});
+var addColumnAfter = tableCommand((grid, at) => {
+  for (const line of grid.cells) line.splice(at.col + 1, 0, Fragment$1.empty);
+  grid.align.splice(at.col + 1, 0, "left");
+  return { row: at.row, col: at.col + 1 };
+});
+var deleteRow = tableCommand((grid, at) => {
+  if (grid.cells.length <= 1) return "delete";
+  grid.cells.splice(at.row, 1);
+  return { row: Math.min(at.row, grid.cells.length - 1), col: at.col };
+});
+var deleteColumn = tableCommand((grid, at) => {
+  if (grid.align.length <= 1) return "delete";
+  for (const line of grid.cells) line.splice(at.col, 1);
+  grid.align.splice(at.col, 1);
+  return { row: at.row, col: Math.min(at.col, grid.align.length - 1) };
+});
+var deleteTable = tableCommand(() => "delete");
+function alignColumn(align) {
+  return tableCommand((grid, at) => {
+    grid.align[at.col] = align;
+    return { row: at.row, col: at.col };
+  });
+}
+function columnAlign(state) {
+  const at = tableAt(state);
+  if (!at) return null;
+  return gridOf(at.table).align[at.col] ?? "left";
+}
+function moveCell(direction) {
+  return (state, dispatch) => {
+    const at = tableAt(state);
+    if (!at) return false;
+    const rows = at.table.childCount;
+    const cols = at.table.child(at.row).childCount;
+    let row = at.row;
+    let col = at.col;
+    if (direction === "next") {
+      col++;
+      if (col >= cols) {
+        col = 0;
+        row++;
+      }
+    } else if (direction === "previous") {
+      col--;
+      if (col < 0) {
+        row--;
+        col = row >= 0 ? at.table.child(row).childCount - 1 : 0;
+      }
+      if (row < 0) return true;
+    } else {
+      row++;
+    }
+    if (!dispatch) return true;
+    if (row >= rows) {
+      const grid = gridOf(at.table);
+      grid.cells.push(blankRow(grid));
+      dispatch(rebuild(state, at, grid, row, direction === "down" ? at.col : 0));
+      return true;
+    }
+    let pos = at.pos + 1;
+    at.table.forEach((r, _o, ri) => {
+      if (ri < row) pos += r.nodeSize;
+    });
+    pos += 1;
+    at.table.child(row).forEach((cell2, _o, ci) => {
+      if (ci < col) pos += cell2.nodeSize;
+    });
+    const cell = at.table.child(row).child(Math.min(col, at.table.child(row).childCount - 1));
+    const tr = state.tr.setSelection(
+      direction === "down" ? TextSelection.create(state.doc, pos + 1) : TextSelection.create(state.doc, pos + 1, pos + 1 + cell.content.size)
+    );
+    dispatch(tr.scrollIntoView());
+    return true;
+  };
+}
+var exitCodeOnBlankLines = (state, dispatch) => {
+  const { $from, empty } = state.selection;
+  if (!empty || !$from.parent.type.spec.code || $from.parentOffset !== $from.parent.content.size) return false;
+  const text = $from.parent.textContent;
+  if (!text.endsWith("\n\n")) return false;
+  if (dispatch) {
+    const end = $from.pos;
+    const tr = state.tr.delete(end - 2, end);
+    const after = tr.mapping.map($from.after());
+    tr.insert(after, N.paragraph.create());
+    tr.setSelection(TextSelection.create(tr.doc, after + 1));
+    dispatch(tr.scrollIntoView());
+  }
+  return true;
+};
+var fenceToCode = (state, dispatch) => {
+  const { $from, empty } = state.selection;
+  if (!empty || $from.parent.type !== N.paragraph || $from.parentOffset !== $from.parent.content.size) return false;
+  const m = /^```([A-Za-z0-9_+-]*)$/.exec($from.parent.textContent);
+  if (!m) return false;
+  if (dispatch) {
+    const start = $from.start();
+    const tr = state.tr.delete(start, $from.pos).setBlockType(start, start, N.code_block, { lang: m[1] ?? "", fence: "```" });
+    dispatch(tr.scrollIntoView());
+  }
+  return true;
+};
+function setCalloutTone(pos, tone) {
+  return (state, dispatch) => {
+    const node = state.doc.nodeAt(pos);
+    if (!node || node.type !== N.callout) return false;
+    if (dispatch) dispatch(state.tr.setNodeMarkup(pos, void 0, { ...node.attrs, tone }));
+    return true;
+  };
+}
+function setCodeLanguage(pos, lang) {
+  return (state, dispatch) => {
+    const node = state.doc.nodeAt(pos);
+    if (!node || node.type !== N.code_block) return false;
+    if (dispatch) dispatch(state.tr.setNodeMarkup(pos, void 0, { ...node.attrs, lang: lang.replace(/[^A-Za-z0-9_+-]/g, "") }));
+    return true;
+  };
+}
+function unwrapAt(pos) {
+  return (state, dispatch) => {
+    const node = state.doc.nodeAt(pos);
+    if (!node || node.type !== N.callout && node.type !== N.blockquote) return false;
+    if (dispatch) {
+      const tr = state.tr.replaceWith(pos, pos + node.nodeSize, node.content);
+      tr.setSelection(Selection.near(tr.doc.resolve(Math.min(pos + 1, tr.doc.content.size))));
+      dispatch(tr.scrollIntoView());
+    }
+    return true;
+  };
+}
+var N2 = schema.nodes;
+var M2 = schema.marks;
+function markRule(pattern, type, delimiter, attrs) {
+  return new InputRule(pattern, (state, match, start, end) => {
+    const whole = match[1] ?? "";
+    const inner = match[2] ?? "";
+    const from = start + (match[0].length - whole.length);
+    const innerFrom = from + delimiter;
+    const innerTo = innerFrom + inner.length;
+    const tr = state.tr;
+    tr.delete(innerTo, end);
+    tr.delete(from, innerFrom);
+    tr.addMark(from, from + inner.length, type.create(attrs));
+    tr.removeStoredMark(type);
+    return tr;
+  });
+}
+var taskRule = new InputRule(/^\[( |x|X)?\]\s$/, (state, match, start, end) => {
+  const checked = (match[1] ?? " ").toLowerCase() === "x";
+  const tr = state.tr.delete(start, end);
+  const $start = tr.doc.resolve(start);
+  const item = $start.depth >= 2 ? $start.node(-1) : null;
+  if (item && item.type === N2.list_item && $start.index(-1) === 0) {
+    return tr.setNodeMarkup($start.before(-1), void 0, { ...item.attrs, checked });
+  }
+  const range = $start.blockRange();
+  const wrapping = range && findWrapping(range, N2.bullet_list);
+  if (!range || !wrapping) return null;
+  tr.wrap(range, wrapping);
+  const $inner = tr.doc.resolve(tr.mapping.map(start));
+  for (let d = $inner.depth; d > 0; d--) {
+    if ($inner.node(d).type === N2.list_item) {
+      tr.setNodeMarkup($inner.before(d), void 0, { checked });
+      break;
+    }
+  }
+  return tr;
+});
+var ruleRule = new InputRule(/^(?:---|\*\*\*|___)$/, (state, _match, start, end) => {
+  const $start = state.doc.resolve(start);
+  if ($start.parent.type !== N2.paragraph || $start.parent.content.size !== end - start) return null;
+  const from = $start.before();
+  const to = $start.after();
+  const tr = state.tr.replaceWith(from, to, [N2.horizontal_rule.create(), N2.paragraph.create()]);
+  return tr.setSelection(TextSelection.create(tr.doc, from + 2));
+});
+var linkRule = new InputRule(/(?:^|[^!])(\[([^\]]+)\]\(([^)\s]+)\))$/, (state, match, start, end) => {
+  const whole = match[1] ?? "";
+  const text = match[2] ?? "";
+  const href = safeHref(match[3] ?? "");
+  if (!href) return null;
+  const from = start + (match[0].length - whole.length);
+  return state.tr.replaceWith(from, end, schema.text(text, [M2.link.create({ href })]));
+});
+function buildInputRules() {
+  return inputRules({
+    rules: [
+      textblockTypeInputRule(/^(#{1,6})\s$/, N2.heading, (m) => ({ level: (m[1] ?? "#").length })),
+      taskRule,
+      wrappingInputRule(/^\s*([-+*])\s$/, N2.bullet_list, (m) => ({ marker: m[1] })),
+      wrappingInputRule(
+        /^(\d{1,9})([.)])\s$/,
+        N2.ordered_list,
+        (m) => ({ start: Number(m[1]), marker: m[2] }),
+        (m, node) => node.childCount + node.attrs.start === Number(m[1])
+      ),
+      wrappingInputRule(/^\s*>\s$/, N2.blockquote),
+      textblockTypeInputRule(/^```([A-Za-z0-9_+-]*)\s$/, N2.code_block, (m) => ({ lang: m[1] ?? "", fence: "```" })),
+      ruleRule,
+      linkRule,
+      markRule(/(?:^|[^*\w])(\*\*([^*\s](?:[^*]*[^*\s])?)\*\*)$/, M2.strong, 2, { marker: "**" }),
+      markRule(/(?:^|[^_\p{L}\p{N}])(__([^_\s](?:[^_]*[^_\s])?)__)$/u, M2.strong, 2, { marker: "__" }),
+      markRule(/(?:^|[^*\w])(\*([^*\s](?:[^*]*[^*\s])?)\*)$/, M2.em, 1, { marker: "*" }),
+      markRule(/(?:^|[^_\p{L}\p{N}])(_([^_\s](?:[^_]*[^_\s])?)_)$/u, M2.em, 1, { marker: "_" }),
+      markRule(/(?:^|[^~])(~~([^~\s](?:[^~]*[^~\s])?)~~)$/, M2.strike, 2),
+      markRule(/(?:^|[^`])(`([^`]+)`)$/, M2.code, 1)
+    ]
+  });
+}
+var softBreak = (state, dispatch) => {
+  if (tableAt(state)) return true;
+  if (state.selection.$from.parent.type === N2.heading) return false;
+  if (exitCode(state, dispatch)) return true;
+  if (dispatch) dispatch(state.tr.replaceSelectionWith(N2.hard_break.create()).scrollIntoView());
+  return true;
+};
+var indentCode = (state, dispatch) => {
+  if (!state.selection.$from.parent.type.spec.code) return false;
+  if (dispatch) dispatch(state.tr.insertText("  ").scrollIntoView());
+  return true;
+};
+var outdentCode = (state, dispatch) => {
+  const { $from, empty } = state.selection;
+  if (!$from.parent.type.spec.code || !empty) return false;
+  const text = $from.parent.textContent;
+  const lineStart = text.lastIndexOf("\n", $from.parentOffset - 1) + 1;
+  const spaces = /^ {1,2}/.exec(text.slice(lineStart))?.[0].length ?? 0;
+  if (spaces > 0 && dispatch) dispatch(state.tr.delete($from.start() + lineStart, $from.start() + lineStart + spaces));
+  return true;
+};
+function buildKeymap(hooks) {
+  const keys = {
+    "Mod-z": undo,
+    "Shift-Mod-z": redo,
+    "Mod-y": redo,
+    Backspace: undoInputRule,
+    "Mod-b": toggleStrong,
+    "Mod-i": toggleEm,
+    "Mod-e": toggleCode,
+    "Mod-Shift-s": toggleStrike,
+    "Mod-Shift-x": toggleStrike,
+    "Mod-k": () => hooks.link(),
+    "Mod-Alt-0": setParagraph,
+    "Mod-Shift-7": setList("ordered"),
+    "Mod-Shift-8": setList("bullet"),
+    "Mod-Shift-9": setList("task"),
+    "Mod-Enter": () => hooks.submit(),
+    "Shift-Enter": softBreak,
+    Enter: chainCommands(moveCell("down"), fenceToCode, exitCodeOnBlankLines, splitItem),
+    Tab: chainCommands(moveCell("next"), sinkListItem(N2.list_item), indentCode),
+    "Shift-Tab": chainCommands(moveCell("previous"), liftListItem(N2.list_item), outdentCode),
+    "Alt-F10": () => hooks.toolbar()
+  };
+  for (let level = 1; level <= 6; level++) {
+    keys[`Mod-Alt-${level}`] = level <= 3 ? toggleHeading(level) : setBlockType(N2.heading, { level });
+  }
+  return [keymap(keys), keymap(baseKeymap)];
+}
+
+// src/RichEditor/nodeviews.ts
+var SlotStore = class {
+  slots = /* @__PURE__ */ new Set();
+  listeners = /* @__PURE__ */ new Set();
+  snapshot = [];
+  add(slot) {
+    this.slots.add(slot);
+    this.emit();
+  }
+  remove(slot) {
+    this.slots.delete(slot);
+    this.emit();
+  }
+  changed() {
+    this.emit();
+  }
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  };
+  get = () => this.snapshot;
+  emit() {
+    this.snapshot = [...this.slots];
+    for (const listener of this.listeners) listener();
+  }
+};
+function slotElement(className) {
+  const el = document.createElement("div");
+  el.className = className;
+  el.contentEditable = "false";
+  return el;
+}
+var SlotView = class {
+  constructor(node, store, getPos, build) {
+    this.node = node;
+    this.store = store;
+    const built = build();
+    this.dom = built.dom;
+    this.contentDOM = built.contentDOM;
+    this.slot = { kind: built.kind, element: built.slot, node, getPos };
+    store.add(this.slot);
+  }
+  node;
+  store;
+  dom;
+  contentDOM;
+  slot;
+  update(node) {
+    if (node.type !== this.node.type) return false;
+    this.node = node;
+    this.slot.node = node;
+    this.paint(node);
+    this.store.changed();
+    return true;
+  }
+  paint(node) {
+    if (node.type.name === "callout") this.dom.setAttribute("data-callout", node.attrs.tone);
+    if (node.type.name === "code_block") {
+      const pre = this.contentDOM.parentElement;
+      if (node.attrs.lang) pre?.setAttribute("data-lang", node.attrs.lang);
+      else pre?.removeAttribute("data-lang");
+    }
+  }
+  stopEvent(event) {
+    return this.slot.element.contains(event.target);
+  }
+  ignoreMutation(mutation) {
+    return this.slot.element.contains(mutation.target);
+  }
+  destroy() {
+    this.store.remove(this.slot);
+  }
+};
+function codeBlockView(store) {
+  return (node, _view, getPos) => {
+    const view = new SlotView(node, store, getPos, () => {
+      const dom = document.createElement("div");
+      dom.className = "crewlet-rich-editor__code";
+      const slot = slotElement("crewlet-rich-editor__code-bar");
+      const pre = document.createElement("pre");
+      pre.className = "md-code";
+      const code = document.createElement("code");
+      pre.appendChild(code);
+      dom.append(slot, pre);
+      return { dom, contentDOM: code, slot, kind: "code" };
+    });
+    view.paint(node);
+    return view;
+  };
+}
+function calloutView(store) {
+  return (node, _view, getPos) => {
+    const view = new SlotView(node, store, getPos, () => {
+      const dom = document.createElement("div");
+      dom.setAttribute("role", "note");
+      const slot = slotElement("crewlet-rich-editor__callout-bar");
+      slot.setAttribute("data-callout-label", "");
+      const body = document.createElement("div");
+      body.setAttribute("data-callout-body", "");
+      dom.append(slot, body);
+      return { dom, contentDOM: body, slot, kind: "callout" };
+    });
+    view.paint(node);
+    return view;
+  };
+}
+function listItemView(labels) {
+  return (node, view, getPos) => {
+    const li = document.createElement("li");
+    if (node.attrs.checked === null) return { dom: li, contentDOM: li };
+    const box = document.createElement("input");
+    box.type = "checkbox";
+    box.contentEditable = "false";
+    const body = document.createElement("div");
+    body.className = "md-task-body";
+    li.append(box, body);
+    const paint = (checked) => {
+      box.checked = checked;
+      box.setAttribute("aria-label", checked ? labels().notDone : labels().done);
+    };
+    paint(Boolean(node.attrs.checked));
+    box.addEventListener("mousedown", (event) => event.preventDefault());
+    box.addEventListener("click", (event) => {
+      event.preventDefault();
+      const pos = getPos();
+      if (pos === void 0 || !view.editable) return;
+      toggleTask(pos)(view.state, view.dispatch);
+    });
+    let current = node;
+    return {
+      dom: li,
+      contentDOM: body,
+      update(next) {
+        if (next.type !== current.type || next.attrs.checked === null !== (current.attrs.checked === null)) return false;
+        current = next;
+        paint(Boolean(next.attrs.checked));
+        return true;
+      },
+      stopEvent: (event) => event.target === box,
+      ignoreMutation: (mutation) => mutation.target === box
+    };
+  };
+}
+function tableView(node) {
+  const dom = document.createElement("div");
+  dom.className = "md-table";
+  const table = document.createElement("table");
+  const body = document.createElement("tbody");
+  table.appendChild(body);
+  dom.appendChild(table);
+  return { dom, contentDOM: body };
+}
+var ImageViews = class {
+  constructor(resolve) {
+    this.resolve = resolve;
+  }
+  resolve;
+  views = /* @__PURE__ */ new Set();
+  /** Paint every picture again, when what the resolver can answer has changed. */
+  refresh() {
+    for (const view of this.views) view.paint();
+  }
+  view = (node) => {
+    const dom = document.createElement("span");
+    dom.className = "crewlet-rich-editor__image";
+    const entry = {
+      node,
+      paint: () => {
+        const src = entry.node.attrs.src;
+        const alt = entry.node.attrs.alt;
+        const resolver = this.resolve();
+        const shown = resolver ? resolver(src) : safeHref(src);
+        dom.replaceChildren();
+        if (shown) {
+          const img = document.createElement("img");
+          img.alt = alt;
+          img.src = shown;
+          img.draggable = false;
+          dom.appendChild(img);
+        } else {
+          const text = document.createElement("span");
+          text.className = "crewlet-rich-editor__image-alt";
+          text.textContent = alt || src;
+          dom.appendChild(text);
+        }
+      }
+    };
+    entry.paint();
+    this.views.add(entry);
+    return {
+      dom,
+      update: (next) => {
+        if (next.type !== entry.node.type) return false;
+        const same = next.attrs.src === entry.node.attrs.src && next.attrs.alt === entry.node.attrs.alt;
+        entry.node = next;
+        if (!same) entry.paint();
+        return true;
+      },
+      destroy: () => {
+        this.views.delete(entry);
+      }
+    };
+  };
+};
+var SKIP = /* @__PURE__ */ new Set([
+  "script",
+  "style",
+  "template",
+  "iframe",
+  "object",
+  "embed",
+  "noscript",
+  "head",
+  "title",
+  "svg",
+  "math",
+  "canvas",
+  "video",
+  "audio",
+  "select",
+  "textarea",
+  "button",
+  "xml"
+]);
+var VOID = /* @__PURE__ */ new Set(["br", "hr", "img", "input", "meta", "link", "area", "base", "col", "embed", "source", "track", "wbr", "param"]);
+var KEEP = /* @__PURE__ */ new Set([
+  "p",
+  "div",
+  "br",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "ul",
+  "ol",
+  "li",
+  "blockquote",
+  "pre",
+  "code",
+  "table",
+  "thead",
+  "tbody",
+  "tfoot",
+  "tr",
+  "th",
+  "td",
+  "a",
+  "img",
+  "strong",
+  "b",
+  "em",
+  "i",
+  "s",
+  "del",
+  "strike",
+  "hr",
+  "input"
+]);
+var BLOCK = /* @__PURE__ */ new Set([
+  "p",
+  "div",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "ul",
+  "ol",
+  "li",
+  "blockquote",
+  "pre",
+  "table",
+  "hr",
+  "section",
+  "article",
+  "header",
+  "footer",
+  "main",
+  "aside",
+  "nav",
+  "figure"
+]);
+var ENTITIES = {
+  amp: "&",
+  lt: "<",
+  gt: ">",
+  quot: '"',
+  apos: "'",
+  nbsp: "\xA0",
+  ndash: "\u2013",
+  mdash: "\u2014",
+  hellip: "\u2026",
+  lsquo: "\u2018",
+  rsquo: "\u2019",
+  ldquo: "\u201C",
+  rdquo: "\u201D",
+  bull: "\u2022",
+  middot: "\xB7",
+  copy: "\xA9",
+  reg: "\xAE",
+  trade: "\u2122",
+  times: "\xD7",
+  laquo: "\xAB",
+  raquo: "\xBB"
+};
+function decode(text) {
+  return text.replace(/&(#x[0-9a-f]+|#\d+|[a-z]+);/gi, (whole, name) => {
+    if (name[0] === "#") {
+      const code = name[1] === "x" || name[1] === "X" ? parseInt(name.slice(2), 16) : parseInt(name.slice(1), 10);
+      return Number.isFinite(code) && code > 0 && code <= 1114111 ? String.fromCodePoint(code) : whole;
+    }
+    return ENTITIES[name.toLowerCase()] ?? whole;
+  });
+}
+var TAG = /<(\/?)([a-zA-Z][a-zA-Z0-9-]*)((?:\s+[^\s"'>/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]+))?)*)\s*\/?>/y;
+var ATTR = /([^\s"'>/=]+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s>]+)))?/g;
+function tokenize(html) {
+  const out = [];
+  let i = 0;
+  let text = "";
+  const flush = () => {
+    if (text) out.push({ kind: "text", text: decode(text) });
+    text = "";
+  };
+  while (i < html.length) {
+    const c = html[i];
+    if (c !== "<") {
+      text += c;
+      i++;
+      continue;
+    }
+    if (html.startsWith("<!--", i)) {
+      const end = html.indexOf("-->", i + 4);
+      i = end < 0 ? html.length : end + 3;
+      continue;
+    }
+    if (html[i + 1] === "!" || html[i + 1] === "?") {
+      const end = html.indexOf(">", i);
+      i = end < 0 ? html.length : end + 1;
+      continue;
+    }
+    TAG.lastIndex = i;
+    const m = TAG.exec(html);
+    if (!m) {
+      text += c;
+      i++;
+      continue;
+    }
+    flush();
+    const name = (m[2] ?? "").toLowerCase();
+    if (m[1]) {
+      out.push({ kind: "close", name });
+    } else {
+      const attrs = {};
+      for (const a of (m[3] ?? "").matchAll(ATTR)) {
+        attrs[(a[1] ?? "").toLowerCase()] = decode(a[2] ?? a[3] ?? a[4] ?? "");
+      }
+      out.push({ kind: "open", name, attrs });
+      if (SKIP.has(name)) {
+        const end = html.toLowerCase().indexOf(`</${name}`, TAG.lastIndex);
+        i = end < 0 ? html.length : end;
+        continue;
+      }
+    }
+    i = TAG.lastIndex;
+  }
+  flush();
+  return out;
+}
+function styleOf(style) {
+  const read2 = (prop) => new RegExp(`(?:^|;)\\s*${prop}\\s*:\\s*([^;]+)`, "i").exec(style)?.[1]?.trim().toLowerCase();
+  const weight = read2("font-weight");
+  const out = {};
+  if (weight) {
+    if (weight === "bold" || weight === "bolder" || Number(weight) >= 600) out.bold = true;
+    if (weight === "normal" || Number(weight) <= 400) out.normal = true;
+  }
+  if (read2("font-style") === "italic") out.italic = true;
+  if (/line-through/.test(read2("text-decoration") ?? read2("text-decoration-line") ?? "")) out.strike = true;
+  const align = read2("text-align");
+  if (align === "center" || align === "right") out.align = align;
+  return out;
+}
+function htmlTree(html, doc = document.implementation.createHTMLDocument("")) {
+  const root = doc.createElement("div");
+  const stack = [{ name: "#root", el: root }];
+  const top = () => stack[stack.length - 1];
+  const closeTo = (names, stop = []) => {
+    for (let k = stack.length - 1; k > 0; k--) {
+      const n = stack[k].name;
+      if (stop.includes(n)) return;
+      if (names.includes(n)) {
+        stack.length = k;
+        return;
+      }
+    }
+  };
+  for (const token of tokenize(html)) {
+    if (token.kind === "text") {
+      top().el.appendChild(doc.createTextNode(token.text ?? ""));
+      continue;
+    }
+    const name = token.name ?? "";
+    if (token.kind === "close") {
+      if (SKIP.has(name)) continue;
+      for (let k = stack.length - 1; k > 0; k--) {
+        if (stack[k].name === name) {
+          stack.length = k;
+          break;
+        }
+      }
+      continue;
+    }
+    if (SKIP.has(name)) continue;
+    if (BLOCK.has(name)) closeTo(["p"], ["li", "td", "th", "blockquote"]);
+    if (name === "li") closeTo(["li"], ["ul", "ol"]);
+    if (name === "tr") closeTo(["tr"], ["table"]);
+    if (name === "td" || name === "th") closeTo(["td", "th"], ["tr", "table"]);
+    const attrs = token.attrs ?? {};
+    const style = styleOf(attrs.style ?? "");
+    let el = null;
+    if (KEEP.has(name)) {
+      el = element(doc, name, attrs, style);
+    } else if (style.bold || style.italic || style.strike) {
+      el = doc.createElement(style.bold ? "strong" : style.italic ? "em" : "s");
+    } else if (BLOCK.has(name)) {
+      el = doc.createElement("div");
+    }
+    if (el === null) {
+      if (VOID.has(name)) continue;
+      el = doc.createElement("span");
+    }
+    top().el.appendChild(el);
+    if (!VOID.has(name)) stack.push({ name, el });
+  }
+  return root;
+}
+function element(doc, name, attrs, style) {
+  if (name === "a") {
+    const href = safeHref(attrs.href ?? "");
+    if (!href) return doc.createElement("span");
+    const a = doc.createElement("a");
+    a.setAttribute("href", href);
+    if (attrs.title) a.setAttribute("title", attrs.title);
+    return a;
+  }
+  if (name === "img") {
+    const own = attrs["data-src"];
+    const src = own ?? attrs.src ?? "";
+    if (!src) return null;
+    if (own === void 0 ? !safeHref(src) : /^[a-z][a-z0-9+.-]*:/i.test(src) && !safeHref(src)) return null;
+    const img = doc.createElement("img");
+    img.setAttribute("data-src", src);
+    img.setAttribute("alt", attrs.alt ?? "");
+    if (attrs.title) img.setAttribute("title", attrs.title);
+    return img;
+  }
+  if (name === "input") {
+    if ((attrs.type ?? "").toLowerCase() !== "checkbox") return null;
+    const box = doc.createElement("input");
+    box.setAttribute("type", "checkbox");
+    if ("checked" in attrs) box.setAttribute("checked", "");
+    return box;
+  }
+  if (name === "b" && style.normal) return doc.createElement("span");
+  const el = doc.createElement(name);
+  if (name === "ol" && attrs.start) el.setAttribute("start", attrs.start.replace(/\D/g, "") || "1");
+  if ((name === "pre" || name === "code") && attrs.class) {
+    const lang = /(?:^|\s)(?:language|lang)-([A-Za-z0-9_+-]+)/.exec(attrs.class)?.[1];
+    if (lang) el.setAttribute("class", `language-${lang}`);
+  }
+  if (name === "pre" && attrs["data-lang"] && /^[A-Za-z0-9_+-]+$/.test(attrs["data-lang"])) {
+    el.setAttribute("data-lang", attrs["data-lang"]);
+  }
+  if (/^h[1-6]$/.test(name) && /^[1-6]$/.test(attrs["data-level"] ?? "")) el.setAttribute("data-level", attrs["data-level"]);
+  if (name === "div" && attrs["data-callout"] !== void 0) el.setAttribute("data-callout", attrs["data-callout"]);
+  if (name === "div" && attrs["data-callout-body"] !== void 0) el.setAttribute("data-callout-body", "");
+  if ((name === "td" || name === "th") && (style.align || attrs.align || attrs["data-align"])) {
+    const align = style.align ?? (attrs["data-align"] ?? attrs.align)?.toLowerCase();
+    if (align === "center" || align === "right") el.setAttribute("data-align", align);
+  }
+  return el;
+}
+function htmlSlice(html, $context) {
+  return DOMParser.fromSchema(schema).parseSlice(htmlTree(html), { context: $context });
+}
+function looksLikeMarkdown(text) {
+  return /^(#{1,6}\s|[-*+]\s|\d{1,9}[.)]\s|>|```|~~~|\|.*\|)/m.test(text) || /\*\*[^*\n]+\*\*|__[^_\n]+__|\[[^\]\n]+\]\([^)\s]+\)|`[^`\n]+`|~~[^~\n]+~~/.test(text);
+}
+function markdownSlice(text) {
+  const doc = readMarkdown(text).doc;
+  return Slice.maxOpen(doc.content);
+}
+function textSlice(text) {
+  const lines = text.replace(/\r\n?/g, "\n").split("\n");
+  const paragraphs = lines.map((line) => schema.node("paragraph", null, line ? schema.text(line) : void 0));
+  return Slice.maxOpen(Fragment$1.from(paragraphs));
+}
+function richHtml(html, types) {
+  if (!html) return false;
+  if (types.includes("vscode-editor-data")) return false;
+  return /<(p|h[1-6]|ul|ol|li|table|blockquote|pre|strong|b|em|i|a|img|code|br)[\s>]/i.test(html);
+}
+
+// src/RichEditor/plugins.ts
+var slashKey = new PluginKey("crewlet-slash");
+var CLOSED = { open: false, from: 0, query: "" };
+function slashPlugin(keys) {
+  return new Plugin({
+    key: slashKey,
+    state: {
+      init: () => CLOSED,
+      apply(tr, prev, _old, state) {
+        const meta = tr.getMeta(slashKey);
+        if (meta) return meta.open ? read(state, meta.from ?? 0) : CLOSED;
+        if (!prev.open) return prev;
+        return read(state, tr.mapping.map(prev.from));
+      }
+    },
+    props: {
+      handleTextInput(view, from, to, text) {
+        if (text !== "/" || from !== to) return false;
+        const $from = view.state.doc.resolve(from);
+        if (!$from.parent.isTextblock || $from.parent.type.spec.code) return false;
+        const before = $from.parent.textBetween(0, $from.parentOffset, void 0, "\uFFFC");
+        if (before !== "" && !/\s$/.test(before)) return false;
+        view.dispatch(view.state.tr.insertText("/", from, to).setMeta(slashKey, { open: true, from }));
+        return true;
+      },
+      handleKeyDown(_view, event) {
+        return keys.current?.(event) ?? false;
+      },
+      decorations(state) {
+        const slash = slashKey.getState(state);
+        if (!slash?.open) return null;
+        const to = slash.from + 1 + slash.query.length;
+        return DecorationSet.create(state.doc, [Decoration.inline(slash.from, to, { class: "crewlet-rich-editor__slash" })]);
+      }
+    }
+  });
+}
+function read(state, from) {
+  const { selection } = state;
+  if (!(selection instanceof TextSelection) || !selection.empty) return CLOSED;
+  const cursor = selection.from;
+  if (cursor <= from || from < 0 || from >= state.doc.content.size) return CLOSED;
+  const $from = state.doc.resolve(from);
+  const $cursor = selection.$from;
+  if ($from.parent !== $cursor.parent) return CLOSED;
+  const typed = state.doc.textBetween(from, cursor, "\n", "\uFFFC");
+  if (!typed.startsWith("/") || /\s/.test(typed) || typed.length > 32) return CLOSED;
+  return { open: true, from, query: typed.slice(1) };
+}
+var focusKey = new PluginKey("crewlet-focus");
+var focusPlugin = new Plugin({
+  key: focusKey,
+  state: {
+    init: () => false,
+    apply: (tr, prev) => tr.getMeta(focusKey) ?? prev
+  },
+  props: {
+    handleDOMEvents: {
+      focus(view) {
+        if (!focusKey.getState(view.state)) view.dispatch(view.state.tr.setMeta(focusKey, true));
+        return false;
+      },
+      blur(view) {
+        if (focusKey.getState(view.state)) view.dispatch(view.state.tr.setMeta(focusKey, false));
+        return false;
+      }
+    }
+  }
+});
+function placeholderPlugin(text) {
+  return new Plugin({
+    props: {
+      decorations(state) {
+        const doc = state.doc;
+        const words = text();
+        if (doc.childCount === 1 && doc.firstChild.isTextblock && doc.firstChild.content.size === 0) {
+          return DecorationSet.create(doc, [
+            Decoration.node(0, doc.firstChild.nodeSize, { class: "is-empty", "data-placeholder": words.empty })
+          ]);
+        }
+        const { $from, empty } = state.selection;
+        if (!empty || !focusKey.getState(state) || slashKey.getState(state)?.open) return null;
+        const parent = $from.parent;
+        if (parent.type !== schema.nodes.paragraph || parent.content.size > 0) return null;
+        const pos = $from.before();
+        return DecorationSet.create(doc, [Decoration.node(pos, pos + parent.nodeSize, { class: "is-empty", "data-placeholder": words.line })]);
+      }
+    }
+  });
+}
+function sliceMarkdown(slice) {
+  const content = slice.content;
+  const first = content.firstChild;
+  const blocks = first && first.isInline ? Fragment$1.from(schema.node("paragraph", null, content)) : content;
+  const doc = schema.topNodeType.createAndFill(null, blocks);
+  return doc ? writeMarkdown(doc) : "";
+}
+var lastCopy = null;
+function remember(view) {
+  const slice = view.state.selection.content();
+  lastCopy = { text: sliceMarkdown(slice), slice };
+}
+function insert(view, slice, text) {
+  const { state } = view;
+  const href = text.trim();
+  if (!state.selection.empty && !/\s/.test(href) && safeHref(href) && slice.content.childCount <= 1) {
+    const mark = schema.marks.link.create({ href: safeHref(href) });
+    view.dispatch(state.tr.addMark(state.selection.from, state.selection.to, mark).scrollIntoView());
+    return;
+  }
+  view.dispatch(state.tr.replaceSelection(slice).scrollIntoView().setMeta("paste", true).setMeta("uiEvent", "paste"));
+}
+function sliceOf(view, data, at, plain) {
+  const text = data.getData("text/plain");
+  const html = data.getData("text/html");
+  const $at = view.state.doc.resolve(at);
+  if ($at.parent.type.spec.code) {
+    return text ? { slice: new Slice(Fragment$1.from(schema.text(text.replace(/\r\n?/g, "\n"))), 0, 0), text } : null;
+  }
+  if (lastCopy && text && text === lastCopy.text && !plain) return { slice: lastCopy.slice, text };
+  if (!plain && richHtml(html, [...data.types])) return { slice: htmlSlice(html, $at), text };
+  if (!text) return null;
+  if (!plain && looksLikeMarkdown(text)) return { slice: markdownSlice(text), text };
+  return { slice: textSlice(text), text };
+}
+function clipboardPlugin(shift) {
+  return new Plugin({
+    props: {
+      clipboardTextSerializer: (slice) => sliceMarkdown(slice),
+      handleDOMEvents: {
+        keydown(_view, event) {
+          shift.current = event.shiftKey;
+          return false;
+        },
+        keyup(_view, event) {
+          shift.current = event.shiftKey;
+          return false;
+        },
+        copy(view) {
+          remember(view);
+          return false;
+        },
+        cut(view) {
+          remember(view);
+          return false;
+        },
+        paste(view, event) {
+          const data = event.clipboardData;
+          event.preventDefault();
+          if (!data || !view.editable) return true;
+          const found = sliceOf(view, data, view.state.selection.from, shift.current);
+          if (found) insert(view, found.slice, found.text);
+          return true;
+        },
+        drop(view, event) {
+          if (view.dragging) return false;
+          event.preventDefault();
+          const data = event.dataTransfer;
+          if (!data || !view.editable) return true;
+          const at = view.posAtCoords({ left: event.clientX, top: event.clientY });
+          if (!at) return true;
+          const found = sliceOf(view, data, at.pos, false);
+          if (!found) return true;
+          const tr = view.state.tr.setSelection(TextSelection.near(view.state.doc.resolve(at.pos)));
+          view.dispatch(tr);
+          insert(view, found.slice, found.text);
+          return true;
+        }
+      }
+    }
+  });
+}
+var N3 = schema.nodes;
+var M3 = schema.marks;
+var BLOCKS = [
+  { key: "paragraph", icon: /* @__PURE__ */ jsx(TypeGlyph, {}), keywords: ["text", "paragraph", "plain"], run: setParagraph },
+  { key: "heading1", icon: /* @__PURE__ */ jsx(Heading1Glyph, {}), hint: "#", keywords: ["h1", "title", "heading"], run: toggleHeading(1) },
+  { key: "heading2", icon: /* @__PURE__ */ jsx(Heading2Glyph, {}), hint: "##", keywords: ["h2", "subtitle", "heading"], run: toggleHeading(2) },
+  { key: "heading3", icon: /* @__PURE__ */ jsx(Heading3Glyph, {}), hint: "###", keywords: ["h3", "heading"], run: toggleHeading(3) },
+  { key: "bullet", icon: /* @__PURE__ */ jsx(ListGlyph, {}), hint: "-", keywords: ["bullet", "unordered", "list"], run: setList("bullet") },
+  { key: "ordered", icon: /* @__PURE__ */ jsx(ListOrderedGlyph, {}), hint: "1.", keywords: ["numbered", "ordered", "list"], run: setList("ordered") },
+  { key: "task", icon: /* @__PURE__ */ jsx(ListChecksGlyph, {}), hint: "[ ]", keywords: ["todo", "task", "checkbox", "checklist"], run: setList("task") },
+  { key: "quote", icon: /* @__PURE__ */ jsx(TextQuoteGlyph, {}), hint: ">", keywords: ["quote", "blockquote", "citation"], run: wrapQuote },
+  { key: "callout", icon: /* @__PURE__ */ jsx(InfoGlyph, {}), keywords: ["callout", "note", "tip", "warning", "alert", "admonition"], run: wrapCallout("note") },
+  { key: "code", icon: /* @__PURE__ */ jsx(SquareCodeGlyph, {}), hint: "```", keywords: ["code", "snippet", "pre"], run: setCodeBlock() },
+  { key: "table", icon: /* @__PURE__ */ jsx(TableGlyph, {}), keywords: ["table", "grid", "columns", "rows"], run: insertTable() },
+  { key: "divider", icon: /* @__PURE__ */ jsx(MinusGlyph, {}), hint: "-".repeat(3), keywords: ["divider", "rule", "separator", "line", "hr"], run: insertRule },
+  { key: "image", icon: /* @__PURE__ */ jsx(ImageGlyph, {}), keywords: ["image", "picture", "photo", "figure"] }
+];
+function matches(item, query) {
+  const q = query.toLowerCase();
+  if (!q) return 1;
+  const label = item.label.toLowerCase();
+  if (label.startsWith(q)) return 3;
+  if (label.split(/\s+/).some((word) => word.startsWith(q))) return 2;
+  if (item.keywords.some((word) => word.startsWith(q))) return 1;
+  return 0;
+}
+function useViewportTick(active) {
+  const [, setTick] = useState(0);
+  useEffect(() => {
+    if (!active) return;
+    let frame = 0;
+    const tick = () => {
+      cancelAnimationFrame(frame);
+      frame = requestAnimationFrame(() => setTick((n) => n + 1));
+    };
+    window.addEventListener("scroll", tick, true);
+    window.addEventListener("resize", tick);
+    return () => {
+      cancelAnimationFrame(frame);
+      window.removeEventListener("scroll", tick, true);
+      window.removeEventListener("resize", tick);
+    };
+  }, [active]);
+}
+function rectOf(view, from, to = from) {
+  try {
+    const a = view.coordsAtPos(from);
+    const b = view.coordsAtPos(to, -1);
+    const left = Math.min(a.left, b.left);
+    const top = Math.min(a.top, b.top);
+    return { x: left, y: top, width: Math.max(1, Math.max(a.right, b.right) - left), height: Math.max(a.bottom, b.bottom) - top };
+  } catch {
+    return null;
+  }
+}
+function coarse() {
+  return typeof window.matchMedia === "function" && window.matchMedia("(pointer: coarse)").matches;
+}
+function Floating({
+  anchor,
+  prefer = "above",
+  popup,
+  center = false,
+  className,
+  children,
+  ...rest
+}) {
+  const layer = usePopupLayer({ open: popup !== void 0, onDismiss: () => popup?.onDismiss() });
+  const node = useRef(null);
+  const [place, setPlace] = useState(null);
+  const { x, y, width, height } = anchor;
+  useLayoutEffect(() => {
+    const el = node.current;
+    if (!el) return;
+    const size = { width: el.offsetWidth, height: el.offsetHeight };
+    const target = center ? { x: x + width / 2 - size.width / 2, y, width: size.width, height } : { x, y, width, height };
+    const at = placePopup(target, size, viewportBounds(), 8, prefer);
+    setPlace((prev) => prev && prev.left === at.left && prev.top === at.top ? prev : { left: at.left, top: at.top });
+  }, [x, y, width, height, center, prefer]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...rest,
+      ref: (el) => {
+        node.current = el;
+        layer.panelRef(el);
+      },
+      className,
+      style: {
+        left: place?.left ?? 0,
+        top: place?.top ?? 0,
+        visibility: place ? "visible" : "hidden",
+        ...popup ? { zIndex: layer.zIndex } : {}
+      },
+      children
+    }
+  );
+}
+var Editor = forwardRef(function Editor2(props, ref) {
+  const {
+    value,
+    label,
+    disabled = false,
+    imageVersion,
+    commands,
+    size = "md",
+    className
+  } = props;
+  const text = useMemo(() => richEditorLabels(props.labels), [props.labels]);
+  const latest = useRef(props);
+  latest.current = props;
+  const labelsRef = useRef(text);
+  labelsRef.current = text;
+  const mount = useRef(null);
+  const viewRef = useRef(null);
+  const source = useRef(null);
+  const emitted = useRef(value);
+  const slashKeys = useRef(null);
+  const shift = useRef(false);
+  const toolbarRef = useRef(null);
+  const [state, setState] = useState(null);
+  const [panel, setPanel] = useState(null);
+  const [active, setActive] = useState(0);
+  const [pointerDown, setPointerDown] = useState(false);
+  const [barFocus, setBarFocus] = useState(false);
+  const descriptionId = useId();
+  const listboxId = useId();
+  const slots = useMemo(() => new SlotStore(), []);
+  const images = useMemo(() => new ImageViews(() => latest.current.resolveImage), []);
+  const openSlots = useSyncExternalStore(slots.subscribe, slots.get, slots.get);
+  const hooks = useRef({
+    submit: () => {
+      latest.current.onSubmit?.();
+      return Boolean(latest.current.onSubmit);
+    },
+    link: () => false,
+    toolbar: () => false
+  });
+  const plugins = useMemo(
+    () => [
+      slashPlugin(slashKeys),
+      buildInputRules(),
+      ...buildKeymap({
+        submit: () => hooks.current.submit(),
+        link: () => hooks.current.link(),
+        toolbar: () => hooks.current.toolbar()
+      }),
+      history(),
+      gapCursor(),
+      focusPlugin,
+      placeholderPlugin(() => ({
+        empty: latest.current.placeholder ?? labelsRef.current.placeholder,
+        line: labelsRef.current.emptyLine
+      })),
+      clipboardPlugin(shift)
+    ],
+    []
+  );
+  const stateFor = useCallback(
+    (markdown) => {
+      const loaded = readMarkdown(markdown);
+      source.current = loaded.source;
+      return EditorState.create({ doc: loaded.doc, plugins });
+    },
+    [plugins]
+  );
+  useLayoutEffect(() => {
+    const host = mount.current;
+    if (!host) return;
+    const initial = stateFor(latest.current.value);
+    emitted.current = latest.current.value;
+    const view2 = new EditorView(
+      { mount: host },
+      {
+        state: initial,
+        nodeViews: {
+          code_block: codeBlockView(slots),
+          callout: calloutView(slots),
+          list_item: listItemView(() => ({ done: labelsRef.current.taskDone, notDone: labelsRef.current.taskNotDone })),
+          table: tableView,
+          image: images.view
+        },
+        handleDOMEvents: {
+          // The pointer, so the toolbar waits for a drag-selection to finish.
+          mousedown: () => {
+            setPointerDown(true);
+            return false;
+          }
+        },
+        dispatchTransaction(tr) {
+          const next = view2.state.apply(tr);
+          view2.updateState(next);
+          setState(next);
+          if (tr.docChanged) {
+            const markdown = writeMarkdown(next.doc, source.current ?? void 0);
+            if (markdown !== emitted.current) {
+              emitted.current = markdown;
+              latest.current.onChange(markdown);
+            }
+          }
+        }
+      }
+    );
+    viewRef.current = view2;
+    setState(view2.state);
+    if (latest.current.autoFocus) view2.focus();
+    return () => {
+      view2.destroy();
+      viewRef.current = null;
+    };
+  }, [images, slots, stateFor]);
+  useEffect(() => {
+    const view2 = viewRef.current;
+    if (!view2 || value === emitted.current) return;
+    emitted.current = value;
+    const next = stateFor(value);
+    view2.updateState(next);
+    setState(next);
+    setPanel(null);
+  }, [value, stateFor]);
+  useEffect(() => {
+    images.refresh();
+  }, [images, imageVersion, props.resolveImage]);
+  const slash = state ? slashKey.getState(state) : void 0;
+  const slashOpen = Boolean(slash?.open) && !disabled && panel === null;
+  useEffect(() => {
+    const view2 = viewRef.current;
+    if (!view2) return;
+    view2.setProps({
+      editable: () => !disabled,
+      attributes: {
+        role: "textbox",
+        "aria-multiline": "true",
+        "aria-label": label,
+        "aria-describedby": descriptionId,
+        ...disabled ? { "aria-readonly": "true" } : {},
+        ...slashOpen ? { "aria-controls": listboxId, "aria-activedescendant": `${listboxId}-${active}` } : {},
+        class: cx(
+          "crewlet-rich-editor__content",
+          "crewlet-document",
+          `crewlet-document--${size}`,
+          "crewlet-document--measure"
+        ),
+        spellcheck: "true"
+      }
+    });
+  });
+  useImperativeHandle(ref, () => ({ focus: () => viewRef.current?.focus(), view: () => viewRef.current }), []);
+  useEffect(() => {
+    if (!pointerDown) return;
+    const up = () => setPointerDown(false);
+    window.addEventListener("pointerup", up);
+    return () => window.removeEventListener("pointerup", up);
+  }, [pointerDown]);
+  const focused = state ? Boolean(focusKey.getState(state)) : false;
+  const view = viewRef.current;
+  const run = (command) => {
+    const v = viewRef.current;
+    if (!v) return;
+    command(v.state, v.dispatch, v);
+    v.focus();
+  };
+  const items = useMemo(() => {
+    const blocks = BLOCKS.map((b) => ({
+      key: b.key,
+      label: text.blocks[b.key].label,
+      description: text.blocks[b.key].description,
+      icon: b.icon,
+      hint: b.hint,
+      group: b.key === "image" || b.key === "table" || b.key === "divider" ? "insert" : "blocks",
+      keywords: b.keywords,
+      ...b.run ? { run: b.run } : { panel: "image" }
+    }));
+    const own = (commands ?? []).map((command) => ({
+      key: `command:${command.key}`,
+      label: command.label,
+      description: command.description,
+      icon: command.icon ?? /* @__PURE__ */ jsx(LinkGlyph, {}),
+      group: "insert",
+      keywords: (command.keywords ?? []).map((k) => k.toLowerCase()),
+      panel: { command }
+    }));
+    return [...blocks, ...own];
+  }, [commands, text]);
+  const shown = useMemo(() => {
+    if (!slashOpen || !state || !slash) return [];
+    const without = state.apply(state.tr.delete(slash.from, state.selection.from));
+    return items.map((item) => ({ item, score: matches(item, slash.query) })).filter(({ item, score }) => score > 0 && (!item.run || item.key === "paragraph" || item.run(without))).sort((a, b) => b.score - a.score || (a.item.group === b.item.group ? 0 : a.item.group === "blocks" ? -1 : 1)).map(({ item }) => item);
+  }, [items, slash, slashOpen, state]);
+  useEffect(() => setActive(0), [slash?.query, slashOpen]);
+  const choose = (item) => {
+    const v = viewRef.current;
+    const s = v ? slashKey.getState(v.state) : void 0;
+    if (!v || !s?.open) return;
+    v.dispatch(v.state.tr.delete(s.from, v.state.selection.from).setMeta(slashKey, { open: false }));
+    const at = v.state.selection.from;
+    if (item.panel === "image") setPanel({ kind: "image", at, editing: null });
+    else if (item.panel) setPanel({ kind: "command", command: item.panel.command, at });
+    else if (item.run) item.run(v.state, v.dispatch, v);
+    v.focus();
+  };
+  const closeSlash = () => {
+    const v = viewRef.current;
+    if (v && slashKey.getState(v.state)?.open) v.dispatch(v.state.tr.setMeta(slashKey, { open: false }));
+  };
+  slashKeys.current = (event) => {
+    if (event.key === "Escape") {
+      if (slashOpen) {
+        closeSlash();
+        return true;
+      }
+      if (panel) {
+        setPanel(null);
+        return true;
+      }
+      if (latest.current.onEscape) {
+        event.preventDefault();
+        latest.current.onEscape();
+        return true;
+      }
+      return false;
+    }
+    if (!slashOpen) return false;
+    const count = shown.length;
+    if (event.key === "ArrowDown" || event.key === "n" && event.ctrlKey) {
+      if (count) setActive((i) => (i + 1) % count);
+      return true;
+    }
+    if (event.key === "ArrowUp" || event.key === "p" && event.ctrlKey) {
+      if (count) setActive((i) => (i - 1 + count) % count);
+      return true;
+    }
+    if (event.key === "Home" && count) {
+      setActive(0);
+      return true;
+    }
+    if (event.key === "End" && count) {
+      setActive(count - 1);
+      return true;
+    }
+    if (event.key === "Enter" || event.key === "Tab") {
+      const item = shown[active];
+      if (!item) {
+        closeSlash();
+        return event.key === "Tab";
+      }
+      choose(item);
+      return true;
+    }
+    return false;
+  };
+  const openLink = () => {
+    const v = viewRef.current;
+    if (!v || disabled || inCode(v.state)) return false;
+    const at = linkAt(v.state);
+    const { from, to } = v.state.selection;
+    if (at) setPanel({ kind: "link", from: at.from, to: at.to, href: at.mark.attrs.href, creating: false });
+    else setPanel({ kind: "link", from, to, href: "", creating: from === to });
+    return true;
+  };
+  hooks.current.link = openLink;
+  hooks.current.toolbar = () => {
+    const first = toolbarRef.current?.querySelector("button:not([disabled])");
+    if (!first) return false;
+    first.focus();
+    return true;
+  };
+  const closePanel = () => {
+    setPanel(null);
+    viewRef.current?.focus();
+  };
+  const selection = state?.selection;
+  const textSelected = Boolean(selection && selection instanceof TextSelection && !selection.empty);
+  const showFormat = Boolean(state && view) && !disabled && !panel && !slashOpen && (focused || barFocus) && textSelected && !pointerDown && !inCode(state);
+  const link = state && selection?.empty && focused && !panel && !slashOpen ? linkAt(state) : null;
+  const table = state && (focused || barFocus) && !panel && !slashOpen && !disabled ? tableAt(state) : null;
+  const imageSelected = state && selection instanceof NodeSelection && selection.node.type === N3.image && (focused || barFocus) && !panel && !disabled ? selection : null;
+  useViewportTick(Boolean(slashOpen || showFormat || link || table || panel || imageSelected));
+  const barScope = {
+    onFocus: () => setBarFocus(true),
+    onBlur: (event) => {
+      if (!event.currentTarget.contains(event.relatedTarget)) setBarFocus(false);
+    },
+    onKeyDown: (event) => {
+      if (event.key !== "Escape" || event.defaultPrevented) return;
+      event.preventDefault();
+      setBarFocus(false);
+      viewRef.current?.focus();
+    }
+  };
+  const formatBar = showFormat && view && state && selection ? /* @__PURE__ */ jsx(
+    Floating,
+    {
+      anchor: rectOf(view, selection.from, selection.to) ?? { x: 0, y: 0, width: 0, height: 0 },
+      prefer: coarse() ? "below" : "above",
+      center: true,
+      className: "crewlet-rich-editor__bar",
+      children: /* @__PURE__ */ jsx("div", { ref: toolbarRef, ...barScope, children: /* @__PURE__ */ jsxs(Toolbar, { label: text.toolbar, children: [
+        /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__group", children: [1, 2, 3].map((level) => /* @__PURE__ */ jsx(
+          BarButton,
+          {
+            label: text.heading(level),
+            icon: level === 1 ? /* @__PURE__ */ jsx(Heading1Glyph, {}) : level === 2 ? /* @__PURE__ */ jsx(Heading2Glyph, {}) : /* @__PURE__ */ jsx(Heading3Glyph, {}),
+            pressed: headingLevel(state) === level,
+            onPress: () => run(toggleHeading(level))
+          },
+          level
+        )) }),
+        /* @__PURE__ */ jsxs("span", { className: "crewlet-rich-editor__group", children: [
+          /* @__PURE__ */ jsx(BarButton, { label: text.bold, icon: /* @__PURE__ */ jsx(BoldGlyph, {}), pressed: markActive(state, M3.strong), onPress: () => run(toggleStrong) }),
+          /* @__PURE__ */ jsx(BarButton, { label: text.italic, icon: /* @__PURE__ */ jsx(ItalicGlyph, {}), pressed: markActive(state, M3.em), onPress: () => run(toggleEm) }),
+          /* @__PURE__ */ jsx(
+            BarButton,
+            {
+              label: text.strike,
+              icon: /* @__PURE__ */ jsx(StrikethroughGlyph, {}),
+              pressed: markActive(state, M3.strike),
+              onPress: () => run(toggleStrike)
+            }
+          ),
+          /* @__PURE__ */ jsx(BarButton, { label: text.code, icon: /* @__PURE__ */ jsx(CodeGlyph, {}), pressed: markActive(state, M3.code), onPress: () => run(toggleCode) })
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__group", children: /* @__PURE__ */ jsx(BarButton, { label: text.link, icon: /* @__PURE__ */ jsx(LinkGlyph, {}), pressed: markActive(state, M3.link), onPress: () => openLink() }) })
+      ] }) })
+    }
+  ) : null;
+  const linkBubble = link && view && !showFormat ? /* @__PURE__ */ jsx(Floating, { anchor: rectOf(view, link.from, link.to) ?? { x: 0, y: 0, width: 0, height: 0 }, prefer: "below", className: "crewlet-rich-editor__bubble", children: /* @__PURE__ */ jsx(
+    LinkBubble,
+    {
+      href: link.mark.attrs.href,
+      text,
+      onEdit: () => openLink(),
+      onRemove: () => run(removeLink)
+    }
+  ) }) : null;
+  const tableBar = table && view && !showFormat ? /* @__PURE__ */ jsx(
+    Floating,
+    {
+      anchor: view.nodeDOM(table.pos)?.getBoundingClientRect() ?? { x: 0, y: 0, width: 0, height: 0 },
+      prefer: "below",
+      className: "crewlet-rich-editor__bar",
+      children: /* @__PURE__ */ jsx("div", { ...barScope, children: /* @__PURE__ */ jsx(TableBar, { text, align: state ? columnAlign(state) : null, run }) })
+    }
+  ) : null;
+  const imageBar = imageSelected && view ? /* @__PURE__ */ jsx(Floating, { anchor: rectOf(view, imageSelected.from, imageSelected.to) ?? { x: 0, y: 0, width: 0, height: 0 }, prefer: "below", className: "crewlet-rich-editor__bar", children: /* @__PURE__ */ jsx("div", { ...barScope, children: /* @__PURE__ */ jsxs(Toolbar, { label: text.imagePanel, children: [
+    /* @__PURE__ */ jsx(
+      BarButton,
+      {
+        label: text.imageEdit,
+        icon: /* @__PURE__ */ jsx(PencilGlyph, {}),
+        onPress: () => setPanel({
+          kind: "image",
+          at: imageSelected.from,
+          editing: {
+            pos: imageSelected.from,
+            src: imageSelected.node.attrs.src,
+            alt: imageSelected.node.attrs.alt
+          }
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      BarButton,
+      {
+        label: text.imageRemove,
+        icon: /* @__PURE__ */ jsx(TrashGlyph, {}),
+        onPress: () => run((s, d) => d ? (d(s.tr.deleteSelection()), true) : true)
+      }
+    )
+  ] }) }) }) : null;
+  const slashMenu = slashOpen && view && slash ? /* @__PURE__ */ jsx(
+    Floating,
+    {
+      anchor: rectOf(view, slash.from) ?? { x: 0, y: 0, width: 0, height: 0 },
+      prefer: "below",
+      popup: { onDismiss: closeSlash },
+      className: "crewlet-rich-editor__menu",
+      children: /* @__PURE__ */ jsx("div", { role: "listbox", id: listboxId, "aria-label": text.slashMenu, className: "crewlet-rich-editor__options", children: shown.length === 0 ? /* @__PURE__ */ jsxs("p", { className: "crewlet-rich-editor__empty", role: "presentation", children: [
+        text.slashEmpty,
+        " \u201C",
+        slash.query,
+        "\u201D"
+      ] }) : shown.map((item, i) => {
+        const group = i === 0 || shown[i - 1].group !== item.group ? item.group : null;
+        return /* @__PURE__ */ jsx(
+          SlashOption,
+          {
+            id: `${listboxId}-${i}`,
+            item,
+            heading: group === null ? null : group === "blocks" ? text.slashGroupBlocks : text.slashGroupInsert,
+            selected: i === active,
+            onHover: () => setActive(i),
+            onChoose: () => choose(item)
+          },
+          item.key
+        );
+      }) })
+    }
+  ) : null;
+  const panelAnchor = (at, to = at) => view ? rectOf(view, at, to) ?? { x: 0, y: 0, width: 0, height: 0 } : { x: 0, y: 0, width: 0, height: 0 };
+  const panelView = panel && view ? /* @__PURE__ */ jsx(
+    Floating,
+    {
+      anchor: panel.kind === "link" ? panelAnchor(panel.from, panel.to) : panelAnchor(panel.at),
+      prefer: "below",
+      popup: { onDismiss: closePanel },
+      className: "crewlet-rich-editor__panel",
+      role: "dialog",
+      "aria-label": panel.kind === "link" ? text.linkPanel : panel.kind === "image" ? text.imagePanel : panel.command.label,
+      children: panel.kind === "link" ? /* @__PURE__ */ jsx(
+        LinkPanel,
+        {
+          text,
+          href: panel.href,
+          creating: panel.creating,
+          existing: !panel.creating && panel.href !== "",
+          onApply: (href, words) => {
+            const v = viewRef.current;
+            if (!v) return;
+            v.dispatch(v.state.tr.setSelection(TextSelection.create(v.state.doc, panel.from, panel.to)));
+            setLink(href, words)(v.state, v.dispatch);
+            closePanel();
+          },
+          onRemove: () => {
+            const v = viewRef.current;
+            if (!v) return;
+            v.dispatch(v.state.tr.removeMark(panel.from, panel.to, M3.link));
+            closePanel();
+          }
+        }
+      ) : panel.kind === "image" ? /* @__PURE__ */ jsx(
+        ImagePanel,
+        {
+          text,
+          initial: panel.editing,
+          onApply: (src, alt) => {
+            const v = viewRef.current;
+            if (!v) return;
+            if (panel.editing) {
+              const node = v.state.doc.nodeAt(panel.editing.pos);
+              if (node?.type === N3.image) v.dispatch(v.state.tr.setNodeMarkup(panel.editing.pos, void 0, { ...node.attrs, src, alt }));
+            } else {
+              v.dispatch(v.state.tr.setSelection(TextSelection.create(v.state.doc, Math.min(panel.at, v.state.doc.content.size))));
+              insertImage(src, alt)(v.state, v.dispatch);
+            }
+            closePanel();
+          }
+        }
+      ) : panel.command.panel({
+        insertLink: (words, href) => {
+          const v = viewRef.current;
+          if (!v) return;
+          v.dispatch(v.state.tr.setSelection(TextSelection.create(v.state.doc, Math.min(panel.at, v.state.doc.content.size))));
+          setLink(href, words)(v.state, v.dispatch);
+          closePanel();
+        },
+        close: closePanel
+      })
+    }
+  ) : null;
+  return /* @__PURE__ */ jsxs("div", { className: cx("crewlet-rich-editor", disabled && "crewlet-rich-editor--disabled", className), children: [
+    /* @__PURE__ */ jsx("div", { ref: mount, className: "crewlet-rich-editor__mount" }),
+    /* @__PURE__ */ jsx(VisuallyHidden, { id: descriptionId, children: text.description }),
+    openSlots.map((slot) => createPortal(/* @__PURE__ */ jsx(SlotControls, { slot, text, run, disabled }), slot.element)),
+    slashMenu,
+    formatBar,
+    linkBubble,
+    tableBar,
+    imageBar,
+    panelView
+  ] });
+});
+function BarButton({ label, icon, pressed, onPress }) {
+  return /* @__PURE__ */ jsx(
+    IconButton,
+    {
+      size: "sm",
+      variant: "ghost",
+      label,
+      icon,
+      pressed,
+      onMouseDown: (event) => event.preventDefault(),
+      onClick: onPress
+    }
+  );
+}
+function SlashOption({
+  id,
+  item,
+  heading,
+  selected,
+  onHover,
+  onChoose
+}) {
+  const node = useRef(null);
+  useEffect(() => {
+    const option = node.current;
+    const menu = option?.closest(".crewlet-rich-editor__menu");
+    if (!selected || !option || !menu) return;
+    const top = option.offsetTop;
+    const bottom = top + option.offsetHeight;
+    if (top < menu.scrollTop) menu.scrollTop = top;
+    else if (bottom > menu.scrollTop + menu.clientHeight) menu.scrollTop = bottom - menu.clientHeight;
+  }, [selected]);
+  const pointer = {
+    onMouseDown: (event) => event.preventDefault(),
+    onMouseMove: onHover,
+    onClick: onChoose
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    heading && /* @__PURE__ */ jsx("div", { className: "crewlet-rich-editor__group-heading", role: "presentation", children: heading }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: node,
+        id,
+        role: "option",
+        "aria-selected": selected,
+        className: cx("crewlet-rich-editor__option", selected && "is-active"),
+        ...pointer,
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__option-icon", "aria-hidden": "true", children: item.icon }),
+          /* @__PURE__ */ jsxs("span", { className: "crewlet-rich-editor__option-text", children: [
+            /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__option-label", children: item.label }),
+            item.description && /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__option-description", children: item.description })
+          ] }),
+          item.hint && /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__option-hint", "aria-hidden": "true", children: item.hint })
+        ]
+      }
+    )
+  ] });
+}
+function LinkBubble({ href, text, onEdit, onRemove }) {
+  const safe = safeHref(href);
+  const internal = safe?.startsWith("#/") ?? false;
+  return /* @__PURE__ */ jsxs(Toolbar, { label: text.linkPanel, children: [
+    safe ? /* @__PURE__ */ jsxs(
+      "a",
+      {
+        className: "crewlet-rich-editor__bubble-link",
+        href: safe,
+        ...internal ? {} : { target: "_blank", rel: "noopener noreferrer" },
+        title: text.linkOpen,
+        onMouseDown: (event) => event.preventDefault(),
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__bubble-href", children: href }),
+          !internal && /* @__PURE__ */ jsx(ExternalLinkGlyph, { size: "sm" })
+        ]
+      }
+    ) : /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__bubble-refused", children: text.linkRefused }),
+    /* @__PURE__ */ jsx(BarButton, { label: text.linkEdit, icon: /* @__PURE__ */ jsx(PencilGlyph, {}), onPress: onEdit }),
+    /* @__PURE__ */ jsx(BarButton, { label: text.linkRemove, icon: /* @__PURE__ */ jsx(UnlinkGlyph, {}), onPress: onRemove })
+  ] });
+}
+function LinkPanel({
+  text,
+  href,
+  creating,
+  existing,
+  onApply,
+  onRemove
+}) {
+  const [address, setAddress] = useState(href);
+  const [words, setWords] = useState("");
+  const [tried, setTried] = useState(false);
+  const addressId = useId();
+  const wordsId = useId();
+  const field = useRef(null);
+  useEffect(() => field.current?.focus(), []);
+  const safe = safeHref(address);
+  const submit = () => {
+    setTried(true);
+    if (safe) onApply(safe, words);
+  };
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      className: "crewlet-rich-editor__form",
+      onSubmit: (event) => {
+        event.preventDefault();
+        submit();
+      },
+      children: [
+        /* @__PURE__ */ jsx(FormField, { label: text.linkAddress, htmlFor: addressId, error: tried && !safe ? text.linkInvalid : void 0, children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: addressId,
+            ref: field,
+            inputSize: "sm",
+            value: address,
+            error: tried && !safe,
+            placeholder: "https://",
+            onChange: (event) => setAddress(event.target.value)
+          }
+        ) }),
+        creating && /* @__PURE__ */ jsx(FormField, { label: text.linkText, htmlFor: wordsId, optional: true, children: /* @__PURE__ */ jsx(Input, { id: wordsId, inputSize: "sm", value: words, onChange: (event) => setWords(event.target.value) }) }),
+        /* @__PURE__ */ jsxs("div", { className: "crewlet-rich-editor__form-actions", children: [
+          existing && /* @__PURE__ */ jsx(Button, { type: "button", size: "small", variant: "ghost", onClick: onRemove, children: text.linkRemove }),
+          /* @__PURE__ */ jsx(Button, { type: "submit", size: "small", variant: "primary", children: text.linkApply })
+        ] })
+      ]
+    }
+  );
+}
+function ImagePanel({
+  text,
+  initial,
+  onApply
+}) {
+  const [src, setSrc] = useState(initial?.src ?? "");
+  const [alt, setAlt] = useState(initial?.alt ?? "");
+  const srcId = useId();
+  const altId = useId();
+  const field = useRef(null);
+  useEffect(() => field.current?.focus(), []);
+  const address = src.trim();
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      className: "crewlet-rich-editor__form",
+      onSubmit: (event) => {
+        event.preventDefault();
+        if (address) onApply(address.replace(/\s/g, "%20"), alt.trim());
+      },
+      children: [
+        /* @__PURE__ */ jsx(FormField, { label: text.imageAddress, htmlFor: srcId, children: /* @__PURE__ */ jsx(Input, { id: srcId, ref: field, inputSize: "sm", value: src, onChange: (event) => setSrc(event.target.value) }) }),
+        /* @__PURE__ */ jsx(FormField, { label: text.imageAlt, htmlFor: altId, helper: text.imageAltHelp, children: /* @__PURE__ */ jsx(Input, { id: altId, inputSize: "sm", value: alt, onChange: (event) => setAlt(event.target.value) }) }),
+        /* @__PURE__ */ jsx("div", { className: "crewlet-rich-editor__form-actions", children: /* @__PURE__ */ jsx(Button, { type: "submit", size: "small", variant: "primary", disabledReason: address ? void 0 : text.imageAddress, children: initial ? text.linkApply : text.imageInsert }) })
+      ]
+    }
+  );
+}
+function TableBar({ text, align, run }) {
+  return /* @__PURE__ */ jsxs(Toolbar, { label: text.tableBar, children: [
+    /* @__PURE__ */ jsxs("span", { className: "crewlet-rich-editor__group", children: [
+      /* @__PURE__ */ jsx(
+        Menu,
+        {
+          label: text.tableRow,
+          trigger: text.tableRow,
+          trailingIcon: /* @__PURE__ */ jsx(ChevronDownGlyph, { size: "sm" }),
+          items: [
+            { key: "above", label: text.rowAbove, onSelect: () => run(addRowBefore) },
+            { key: "below", label: text.rowBelow, onSelect: () => run(addRowAfter) },
+            { kind: "separator", key: "sep" },
+            { key: "delete", label: text.rowDelete, danger: true, onSelect: () => run(deleteRow) }
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Menu,
+        {
+          label: text.tableColumn,
+          trigger: text.tableColumn,
+          trailingIcon: /* @__PURE__ */ jsx(ChevronDownGlyph, { size: "sm" }),
+          items: [
+            { key: "left", label: text.columnLeft, onSelect: () => run(addColumnBefore) },
+            { key: "right", label: text.columnRight, onSelect: () => run(addColumnAfter) },
+            { kind: "separator", key: "sep" },
+            { key: "delete", label: text.columnDelete, danger: true, onSelect: () => run(deleteColumn) }
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("span", { className: "crewlet-rich-editor__group", children: [
+      /* @__PURE__ */ jsx(BarButton, { label: text.alignStart, icon: /* @__PURE__ */ jsx(TextAlignStartGlyph, {}), pressed: align === "left", onPress: () => run(alignColumn("left")) }),
+      /* @__PURE__ */ jsx(BarButton, { label: text.alignCenter, icon: /* @__PURE__ */ jsx(TextAlignCenterGlyph, {}), pressed: align === "center", onPress: () => run(alignColumn("center")) }),
+      /* @__PURE__ */ jsx(BarButton, { label: text.alignEnd, icon: /* @__PURE__ */ jsx(TextAlignEndGlyph, {}), pressed: align === "right", onPress: () => run(alignColumn("right")) })
+    ] }),
+    /* @__PURE__ */ jsx("span", { className: "crewlet-rich-editor__group", children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        size: "sm",
+        variant: "ghost-danger",
+        label: text.tableDelete,
+        icon: /* @__PURE__ */ jsx(TrashGlyph, {}),
+        onMouseDown: (event) => event.preventDefault(),
+        onClick: () => run(deleteTable)
+      }
+    ) })
+  ] });
+}
+function SlotControls({ slot, text, run, disabled }) {
+  if (slot.kind === "code") {
+    return /* @__PURE__ */ jsx(
+      "input",
+      {
+        className: "crewlet-rich-editor__lang",
+        "aria-label": text.codeLanguage,
+        placeholder: text.codeLanguagePlaceholder,
+        value: slot.node.attrs.lang,
+        disabled,
+        spellCheck: false,
+        onChange: (event) => {
+          const pos = slot.getPos();
+          if (pos !== void 0) run(setCodeLanguage(pos, event.target.value));
+        },
+        onKeyDown: (event) => {
+          if (event.key === "Enter" || event.key === "Escape") {
+            event.preventDefault();
+            const pos = slot.getPos();
+            if (pos !== void 0) run((s, d) => d ? (d(s.tr.setSelection(TextSelection.create(s.doc, pos + 1))), true) : true);
+          }
+        }
+      }
+    );
+  }
+  const tone = slot.node.attrs.tone;
+  return /* @__PURE__ */ jsx(
+    Menu,
+    {
+      label: text.calloutTone,
+      items: [
+        ...MARKDOWN_CALLOUT_TONES.map((t) => ({
+          key: t,
+          label: text.tones[t],
+          checked: t === tone,
+          onSelect: () => {
+            const pos = slot.getPos();
+            if (pos !== void 0) run(setCalloutTone(pos, t));
+          }
+        })),
+        { kind: "separator", key: "sep" },
+        {
+          key: "remove",
+          label: text.calloutRemove,
+          onSelect: () => {
+            const pos = slot.getPos();
+            if (pos !== void 0) run(unwrapAt(pos));
+          }
+        }
+      ],
+      renderTrigger: (trigger) => /* @__PURE__ */ jsxs(
+        "button",
+        {
+          ...trigger,
+          ref: trigger.ref,
+          type: "button",
+          className: "crewlet-rich-editor__tone",
+          disabled,
+          "aria-label": `${text.calloutTone}: ${text.tones[tone]}`,
+          children: [
+            text.tones[tone],
+            /* @__PURE__ */ jsx(ChevronDownGlyph, { size: "sm" })
+          ]
+        }
+      )
+    }
+  );
+}
+
+export { Editor };