@inkbrick/react 0.0.0-stage → 0.1.0-alpha.0

package/dist/index.js

@@ -0,0 +1,4880 @@
+import {
+  EditorUIContext,
+  HIGHLIGHT_LIMIT,
+  ICON_SHAPES,
+  Icon,
+  applyInlineFormula,
+  applySlashItem,
+  availableSlashItems,
+  createTranslator,
+  defaultKeymap,
+  defaultSlashItems,
+  deleteForwardAtEnd,
+  en,
+  ensureMathStyles,
+  filterSlashItems,
+  getLocales,
+  highlightCode,
+  matchInlineFormula,
+  mountFormula,
+  normalizeLanguage,
+  openFormulaAt,
+  openInlineFormula,
+  readDocSelection,
+  registerLocale,
+  resolveMessages,
+  resolveSlashItems,
+  ru,
+  setAlignInSelection,
+  setColorInSelection,
+  setDomSelection,
+  setLinkInSelection,
+  syncToolbar,
+  temmlRenderer,
+  toggleFormatInSelection,
+  useEditorUI,
+  useLocale,
+  useSnippetInsert,
+  useT,
+  visibleSlashItems
+} from "./chunk-TPUX4C45.js";
+
+// src/context/EditorContext.ts
+import { createContext } from "react";
+var EditorContext = createContext(null);
+var EditorViewContext = createContext(null);
+
+// src/context/EditorProvider.tsx
+import { useLayoutEffect, useMemo } from "react";
+
+// src/block-handle/BlockHandleController.ts
+var IDLE = Object.freeze({ hover: null, menu: null, drag: null });
+var sameAnchor = (a, b) => a === b || !!a && !!b && a.blockId === b.blockId && a.x === b.x && a.y === b.y;
+var BlockHandleController = class {
+  state = IDLE;
+  listeners = /* @__PURE__ */ new Set();
+  getState = () => this.state;
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  setHover(hover) {
+    if (!sameAnchor(this.state.hover, hover)) this.set({ ...this.state, hover });
+  }
+  openMenu(menu) {
+    this.set({ ...this.state, menu });
+  }
+  closeMenu() {
+    if (this.state.menu) this.set({ ...this.state, menu: null });
+  }
+  startDrag(blockId) {
+    this.set({
+      ...this.state,
+      menu: null,
+      drag: { blockId, targetId: null, position: null, indicator: null }
+    });
+  }
+  updateDrag(patch) {
+    const drag = this.state.drag;
+    if (!drag) return;
+    const next = { ...drag, ...patch };
+    const same = next.targetId === drag.targetId && next.position === drag.position && next.indicator?.left === drag.indicator?.left && next.indicator?.top === drag.indicator?.top && next.indicator?.width === drag.indicator?.width;
+    if (!same) this.set({ ...this.state, drag: next });
+  }
+  endDrag() {
+    if (this.state.drag) this.set({ ...this.state, drag: null });
+  }
+  set(state) {
+    this.state = state;
+    for (const listener of [...this.listeners]) listener();
+  }
+};
+
+// src/images/UploadTracker.ts
+var UploadTracker = class {
+  active = /* @__PURE__ */ new Set();
+  errors = /* @__PURE__ */ new Map();
+  listeners = /* @__PURE__ */ new Set();
+  has = (blockId) => this.active.has(blockId);
+  errorOf = (blockId) => this.errors.get(blockId)?.message;
+  errorDetailsOf = (blockId) => this.errors.get(blockId);
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  start(blockId) {
+    this.errors.delete(blockId);
+    this.active.add(blockId);
+    this.notify();
+  }
+  finish(blockId, error) {
+    const changed = this.active.delete(blockId);
+    if (error) this.errors.set(blockId, typeof error === "string" ? { message: error } : error);
+    if (changed || error) this.notify();
+  }
+  clearError(blockId) {
+    if (this.errors.delete(blockId)) this.notify();
+  }
+  notify() {
+    for (const listener of [...this.listeners]) listener();
+  }
+};
+
+// src/editing/BlockSelectionController.ts
+var BlockSelectionController = class {
+  selected = /* @__PURE__ */ new Set();
+  listeners = /* @__PURE__ */ new Set();
+  isSelected = (blockId) => this.selected.has(blockId);
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  set(ids) {
+    if (ids.length === this.selected.size && ids.every((id) => this.selected.has(id))) return;
+    this.selected = new Set(ids);
+    for (const listener of [...this.listeners]) listener();
+  }
+};
+
+// src/formula/FormulaController.ts
+var CLOSED = Object.freeze({
+  open: false,
+  mode: "insert",
+  blockId: "",
+  from: 0,
+  to: 0,
+  latex: "",
+  position: { x: 0, y: 0, top: 0 }
+});
+var FormulaController = class {
+  state = CLOSED;
+  listeners = /* @__PURE__ */ new Set();
+  getState = () => this.state;
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  open(state) {
+    this.set({ ...state, open: true });
+  }
+  close() {
+    if (this.state.open) this.set(CLOSED);
+  }
+  set(state) {
+    this.state = state;
+    for (const listener of [...this.listeners]) listener();
+  }
+};
+
+// src/editing/CaretController.ts
+var CaretController = class {
+  blockId = null;
+  listeners = /* @__PURE__ */ new Set();
+  has = (blockId) => this.blockId === blockId;
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  set(blockId) {
+    if (this.blockId === blockId) return;
+    this.blockId = blockId;
+    for (const listener of [...this.listeners]) listener();
+  }
+};
+
+// src/slash/SlashMenuController.ts
+var CLOSED2 = Object.freeze({
+  open: false,
+  blockId: null,
+  slashOffset: 0,
+  query: "",
+  activeIndex: 0,
+  position: null
+});
+var SlashMenuController = class {
+  state = CLOSED2;
+  listeners = /* @__PURE__ */ new Set();
+  getState = () => this.state;
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  open(blockId, slashOffset) {
+    this.set({ ...CLOSED2, open: true, blockId, slashOffset });
+  }
+  close() {
+    if (this.state.open) this.set(CLOSED2);
+  }
+  update(patch) {
+    if (!this.state.open) return;
+    const next = { ...this.state, ...patch };
+    const same = next.query === this.state.query && next.activeIndex === this.state.activeIndex && next.position?.x === this.state.position?.x && next.position?.y === this.state.position?.y;
+    if (!same) this.set(next);
+  }
+  move(delta, count) {
+    if (!this.state.open || count === 0) return;
+    this.update({ activeIndex: (this.state.activeIndex + delta + count) % count });
+  }
+  set(state) {
+    this.state = state;
+    for (const listener of [...this.listeners]) listener();
+  }
+};
+
+// src/toolbar/ToolbarController.ts
+var HIDDEN = Object.freeze({
+  visible: false,
+  position: null,
+  formats: null,
+  range: null,
+  linkOpen: false,
+  panel: null
+});
+function sameFormats(a, b) {
+  return a === b || !!a && !!b && a.bold === b.bold && a.italic === b.italic && a.underline === b.underline && a.strike === b.strike && a.code === b.code && a.link === b.link && a.color === b.color && a.backgroundColor === b.backgroundColor && a.align === b.align;
+}
+var ToolbarController = class {
+  state = HIDDEN;
+  listeners = /* @__PURE__ */ new Set();
+  getState = () => this.state;
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  show(range, formats, position) {
+    const prev = this.state;
+    const same = prev.visible && sameFormats(prev.formats, formats) && prev.position?.x === position.x && prev.position?.y === position.y && prev.range?.from.blockId === range.from.blockId && prev.range?.from.offset === range.from.offset && prev.range?.to.blockId === range.to.blockId && prev.range?.to.offset === range.to.offset;
+    if (!same) this.set({ ...prev, visible: true, position, formats, range });
+  }
+  hide() {
+    if (this.state.visible) this.set(HIDDEN);
+  }
+  openLink() {
+    if (this.state.visible && !this.state.linkOpen) {
+      this.set({ ...this.state, linkOpen: true, panel: null });
+    }
+  }
+  togglePanel(panel) {
+    if (!this.state.visible || this.state.linkOpen) return;
+    this.set({ ...this.state, panel: this.state.panel === panel ? null : panel });
+  }
+  closePanel() {
+    if (this.state.panel) this.set({ ...this.state, panel: null });
+  }
+  closeLink() {
+    if (this.state.linkOpen) this.set({ ...this.state, linkOpen: false });
+  }
+  set(state) {
+    this.state = state;
+    for (const listener of [...this.listeners]) listener();
+  }
+};
+
+// src/editing/ViewportController.ts
+var ViewportController = class {
+  edges = [];
+  revealed = [];
+  lists = 0;
+  version = 0;
+  listeners = /* @__PURE__ */ new Set();
+  getVersion = () => this.version;
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  getPinned() {
+    return this.revealed.length === 0 ? this.edges : [...this.edges, ...this.revealed];
+  }
+  get virtual() {
+    return this.lists > 0;
+  }
+  attach() {
+    this.lists += 1;
+    return () => {
+      this.lists -= 1;
+    };
+  }
+  setEdges(ids) {
+    if (ids.length === this.edges.length && ids.every((id, i) => this.edges[i] === id)) return;
+    this.edges = ids;
+    this.notify();
+  }
+  reveal(ids) {
+    if (!this.virtual) return false;
+    this.revealed = ids;
+    this.notify();
+    return true;
+  }
+  notify() {
+    this.version += 1;
+    for (const listener of [...this.listeners]) listener();
+  }
+};
+
+// src/editing/EditorView.ts
+var EditorView = class {
+  elements = /* @__PURE__ */ new Map();
+  root = null;
+  slash = new SlashMenuController();
+  uploads = new UploadTracker();
+  selection = new BlockSelectionController();
+  caret = new CaretController();
+  blocks = new BlockHandleController();
+  formula = new FormulaController();
+  toolbar = new ToolbarController();
+  viewport = new ViewportController();
+  pointerDown = false;
+  pending = null;
+  setRoot(element) {
+    this.root = element;
+    return () => {
+      if (this.root === element) this.root = null;
+    };
+  }
+  getRoot() {
+    return this.root;
+  }
+  register(id, element) {
+    this.elements.set(id, element);
+    const pending = this.pending;
+    if (pending && this.elements.has(pending.from.blockId) && this.elements.has(pending.to.blockId)) {
+      queueMicrotask(() => {
+        if (this.pending === pending) this.placeSelection(pending.from, pending.to);
+      });
+    }
+    return () => {
+      if (this.elements.get(id) === element) {
+        this.elements.delete(id);
+      }
+    };
+  }
+  getElement(id) {
+    return this.elements.get(id);
+  }
+  placeCaret(id, offset) {
+    this.placeSelection({ blockId: id, offset }, { blockId: id, offset });
+  }
+  placeSelection(from, to) {
+    const start = this.elements.get(from.blockId);
+    const end = this.elements.get(to.blockId);
+    if (!start || !end) {
+      this.pending = this.viewport.reveal([from.blockId, to.blockId]) ? { from, to } : null;
+      return;
+    }
+    this.pending = null;
+    if (this.root && globalThis.document.activeElement !== this.root) {
+      this.root.focus({ preventScroll: true });
+    }
+    setDomSelection(start, from.offset, end, to.offset);
+    end.scrollIntoView?.({ block: "nearest" });
+  }
+};
+
+// src/keymap/shortcut.ts
+var MODIFIER = /^(mod|ctrl|control|meta|cmd|alt|option|shift)-/i;
+var KEY_ALIASES = {
+  esc: "escape",
+  space: " ",
+  up: "arrowup",
+  down: "arrowdown",
+  left: "arrowleft",
+  right: "arrowright",
+  del: "delete",
+  return: "enter"
+};
+var cache = /* @__PURE__ */ new Map();
+function parse(spec) {
+  const cached = cache.get(spec);
+  if (cached) return cached;
+  const shortcut = {
+    mod: false,
+    ctrl: false,
+    meta: false,
+    alt: false,
+    shift: false,
+    key: ""
+  };
+  let rest = spec.trim();
+  for (let match = MODIFIER.exec(rest); match; match = MODIFIER.exec(rest)) {
+    switch (match[1].toLowerCase()) {
+      case "mod":
+        shortcut.mod = true;
+        break;
+      case "ctrl":
+      case "control":
+        shortcut.ctrl = true;
+        break;
+      case "meta":
+      case "cmd":
+        shortcut.meta = true;
+        break;
+      case "alt":
+      case "option":
+        shortcut.alt = true;
+        break;
+      default:
+        shortcut.shift = true;
+    }
+    rest = rest.slice(match[0].length);
+  }
+  const key = rest.toLowerCase();
+  if (key === "") throw new Error(`Invalid shortcut "${spec}": no key`);
+  shortcut.key = KEY_ALIASES[key] ?? key;
+  cache.set(spec, shortcut);
+  return shortcut;
+}
+function matchesKey(event, key) {
+  const pressed = event.key.toLowerCase();
+  if (pressed === key) return true;
+  return /^[a-z]$/.test(key) && !/^[a-z]$/.test(pressed) && event.code === `Key${key.toUpperCase()}`;
+}
+function matchesShortcut(event, spec) {
+  const shortcut = parse(spec);
+  if (event.shiftKey !== shortcut.shift || event.altKey !== shortcut.alt) return false;
+  if (shortcut.mod) {
+    if (!(event.ctrlKey || event.metaKey)) return false;
+  } else if (event.ctrlKey !== shortcut.ctrl || event.metaKey !== shortcut.meta) {
+    return false;
+  }
+  return matchesKey(event, shortcut.key);
+}
+
+// src/keymap/keymap.ts
+function resolveKeymap(custom = []) {
+  if (custom.length === 0) return defaultKeymap;
+  const overrides = new Map(custom.map((binding) => [binding.id, binding]));
+  const defaultIds = new Set(defaultKeymap.map((binding) => binding.id));
+  return [
+    ...custom.filter((binding) => !defaultIds.has(binding.id)),
+    ...defaultKeymap.map((binding) => overrides.get(binding.id) ?? binding)
+  ];
+}
+function unbind(id) {
+  return { id, keys: [], run: () => false };
+}
+function handleKeyDown(bindings, context) {
+  const { event } = context;
+  for (const binding of bindings) {
+    const keys = typeof binding.keys === "string" ? [binding.keys] : binding.keys;
+    if (!keys.some((spec) => matchesShortcut(event, spec))) continue;
+    if (binding.when && !binding.when(context)) continue;
+    if (binding.run(context) === false) continue;
+    event.preventDefault();
+    return true;
+  }
+  return false;
+}
+
+// src/blocks/defineBlock.ts
+function defineBlock(definition) {
+  return definition;
+}
+function blockComponentsOf(blocks) {
+  const registry = {};
+  for (const block2 of blocks ?? []) {
+    registry[block2.schema.flavour] = block2.component;
+  }
+  return registry;
+}
+
+// src/controllers/adapters.tsx
+import { jsx } from "react/jsx-runtime";
+function iconByName(name) {
+  return name && Object.hasOwn(ICON_SHAPES, name) ? /* @__PURE__ */ jsx(Icon, { name }) : void 0;
+}
+function controllerSlashItems(editor) {
+  return editor.controllers.entries().flatMap(
+    ([flavour, controller]) => (controller.slashItems ?? []).map((item) => ({
+      id: item.id,
+      title: item.title,
+      description: item.description,
+      keywords: item.keywords,
+      icon: iconByName(item.icon),
+      flavour,
+      props: item.props
+    }))
+  );
+}
+function controlledBlockAt(context, flavour) {
+  const selection = context.selection();
+  const block2 = selection && context.editor.store.getBlock(selection.from.blockId);
+  return block2?.flavour === flavour ? block2 : void 0;
+}
+function controllerKeymap(editor) {
+  return editor.controllers.entries().flatMap(
+    ([flavour, controller]) => (controller.keymap ?? []).map((binding) => ({
+      id: binding.id,
+      keys: binding.keys,
+      when: (context) => controlledBlockAt(context, flavour) !== void 0,
+      run: (context) => {
+        const block2 = controlledBlockAt(context, flavour);
+        return block2 ? binding.run(context.editor.controllers.contextOf(block2)) : false;
+      }
+    }))
+  );
+}
+function mergeById(base, preferred, order = "base-first") {
+  const ids = new Set(preferred.map((item) => item.id));
+  const rest = base.filter((item) => !ids.has(item.id));
+  return order === "base-first" ? [...rest, ...preferred] : [...preferred, ...rest];
+}
+
+// src/context/EditorProvider.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function EditorProvider({
+  editor,
+  children,
+  presentation,
+  blocks,
+  components,
+  slots,
+  slashItems,
+  keymap,
+  highlighter,
+  formulaRenderer,
+  locale,
+  locales,
+  messages,
+  readOnly,
+  images
+}) {
+  const view = useMemo(() => new EditorView(), [editor]);
+  useLayoutEffect(() => {
+    if (readOnly === void 0) return;
+    const previous = editor.readOnly;
+    editor.setReadOnly(readOnly);
+    return () => editor.setReadOnly(previous);
+  }, [editor, readOnly]);
+  const t = useMemo(
+    () => createTranslator(resolveMessages({ locale, locales, messages })),
+    [locale, locales, messages]
+  );
+  const ui = useMemo(() => {
+    const visual = presentation ?? {};
+    const code = highlighter ?? visual.highlighter;
+    const math = formulaRenderer ?? visual.formulaRenderer;
+    const customSlash = slashItems ?? visual.slashItems;
+    const customKeys = keymap ?? [];
+    return {
+      components: { ...blockComponentsOf(blocks), ...visual.components, ...components },
+      slots: { ...visual.slots, ...slots },
+      // Пункты контроллеров идут после стандартных; пункт приложения с тем же id важнее.
+      slashItems: customSlash === false ? [] : resolveSlashItems(mergeById(controllerSlashItems(editor), customSlash ?? []), t),
+      highlighter: code === false ? null : code ?? highlightCode,
+      formulaRenderer: math === false ? null : math ?? temmlRenderer,
+      locale: locale ?? "en",
+      t,
+      keymap: resolveKeymap(mergeById(controllerKeymap(editor), customKeys, "preferred-first")),
+      images: images ?? {},
+      readOnly
+    };
+  }, [
+    editor,
+    presentation,
+    blocks,
+    components,
+    slots,
+    slashItems,
+    keymap,
+    highlighter,
+    formulaRenderer,
+    locale,
+    t,
+    readOnly,
+    images
+  ]);
+  return /* @__PURE__ */ jsx2(EditorContext.Provider, { value: editor, children: /* @__PURE__ */ jsx2(EditorViewContext.Provider, { value: view, children: /* @__PURE__ */ jsx2(EditorUIContext.Provider, { value: ui, children }) }) });
+}
+
+// src/ui/presentation.ts
+function definePresentation(presentation) {
+  return presentation;
+}
+
+// src/hooks/useEditor.ts
+import { useContext } from "react";
+function useEditor() {
+  const editor = useContext(EditorContext);
+  if (!editor) {
+    throw new Error("useEditor must be used inside <EditorProvider>");
+  }
+  return editor;
+}
+
+// src/hooks/useEditorView.ts
+import { useContext as useContext2 } from "react";
+function useEditorView() {
+  const view = useContext2(EditorViewContext);
+  if (!view) {
+    throw new Error("useEditorView must be used inside <EditorProvider>");
+  }
+  return view;
+}
+
+// src/hooks/useDocument.ts
+import { useSyncExternalStore } from "react";
+function useDocument() {
+  const editor = useEditor();
+  const { store } = editor;
+  useSyncExternalStore(
+    (listener) => store.subscribe(listener),
+    () => store.getVersion(),
+    () => store.getVersion()
+  );
+  return editor.document;
+}
+
+// src/hooks/useBlock.ts
+import { useCallback, useSyncExternalStore as useSyncExternalStore2 } from "react";
+function useBlock(id) {
+  const { store } = useEditor();
+  const subscribe = useCallback(
+    (listener) => store.subscribeBlock(id, listener),
+    [store, id]
+  );
+  const getSnapshot = useCallback(() => store.getBlock(id), [store, id]);
+  return useSyncExternalStore2(subscribe, getSnapshot, getSnapshot);
+}
+
+// src/hooks/useChildren.ts
+var NO_CHILDREN = [];
+function useChildren(parentId) {
+  const parent = useBlock(parentId);
+  return parent?.children ?? NO_CHILDREN;
+}
+
+// src/hooks/useHistory.ts
+import { useCallback as useCallback2, useSyncExternalStore as useSyncExternalStore3 } from "react";
+import { flushSync } from "react-dom";
+function useHistory() {
+  const editor = useEditor();
+  const view = useEditorView();
+  const { store } = editor;
+  useSyncExternalStore3(
+    (listener) => store.subscribe(listener),
+    () => store.getHistoryVersion(),
+    () => store.getHistoryVersion()
+  );
+  const apply = useCallback2(
+    (action) => {
+      let result;
+      flushSync(() => {
+        result = action();
+      });
+      if (result?.caret) view.placeCaret(result.caret.blockId, result.caret.offset);
+      return result !== void 0;
+    },
+    [view]
+  );
+  const undo = useCallback2(() => apply(() => editor.undo()), [apply, editor]);
+  const redo = useCallback2(() => apply(() => editor.redo()), [apply, editor]);
+  return { canUndo: editor.canUndo, canRedo: editor.canRedo, undo, redo };
+}
+
+// src/hooks/useReadOnly.ts
+import { useSyncExternalStore as useSyncExternalStore4 } from "react";
+function useReadOnly() {
+  const editor = useEditor();
+  const { readOnly } = useEditorUI();
+  const state = useSyncExternalStore4(
+    (listener) => editor.subscribeReadOnly(listener),
+    () => editor.readOnly,
+    () => editor.readOnly
+  );
+  return readOnly ?? state;
+}
+
+// src/hooks/useBlockController.ts
+import { useMemo as useMemo2 } from "react";
+function useBlockController(block2) {
+  const editor = useEditor();
+  return useMemo2(() => {
+    const context = editor.controllers.contextOf(block2);
+    return Object.assign(Object.create(context), {
+      controller: editor.controllers.get(block2.flavour)
+    });
+  }, [editor, block2]);
+}
+
+// src/clipboard/htmlToFragment.ts
+import { sanitizeFragment } from "@inkbrick/engine";
+
+// src/clipboard/html/blocks.ts
+import { isSafeImageUrl, normalizeInlineNodes as normalizeInlineNodes2 } from "@inkbrick/document";
+
+// src/clipboard/html/inline.ts
+import { normalizeInlineNodes } from "@inkbrick/document";
+
+// src/clipboard/html/style.ts
+import { isSafeUrl, normalizeLinkUrl } from "@inkbrick/document";
+
+// src/clipboard/html/tags.ts
+var MAX_DEPTH = 60;
+var SKIP_TAGS = /* @__PURE__ */ new Set([
+  "MATH",
+  "SCRIPT",
+  "STYLE",
+  "HEAD",
+  "TEMPLATE",
+  "NOSCRIPT",
+  "IFRAME",
+  "OBJECT",
+  "EMBED",
+  "SVG",
+  "CANVAS",
+  "IMG",
+  "VIDEO",
+  "AUDIO",
+  "TITLE",
+  "META",
+  "LINK",
+  "INPUT",
+  "BUTTON",
+  "SELECT",
+  "TEXTAREA",
+  "FORM"
+]);
+var BLOCK_TAGS = /* @__PURE__ */ new Set([
+  "P",
+  "DIV",
+  "H1",
+  "H2",
+  "H3",
+  "H4",
+  "H5",
+  "H6",
+  "UL",
+  "OL",
+  "LI",
+  "BLOCKQUOTE",
+  "PRE",
+  "HR",
+  "TABLE",
+  "TR",
+  "SECTION",
+  "ARTICLE",
+  "HEADER",
+  "FOOTER",
+  "MAIN",
+  "ASIDE",
+  "NAV",
+  "FIGURE",
+  "FIGCAPTION",
+  "DL",
+  "DT",
+  "DD",
+  "ADDRESS",
+  "FIELDSET",
+  "BODY",
+  "HTML",
+  "TBODY",
+  "THEAD",
+  "TFOOT",
+  "CAPTION"
+]);
+var tagOf = (element) => element.localName.toUpperCase();
+
+// src/clipboard/html/style.ts
+function weight(value) {
+  const v = value.trim().toLowerCase();
+  if (v === "") return void 0;
+  if (v === "bold" || v === "bolder") return true;
+  if (v === "normal" || v === "lighter") return false;
+  const n = Number(v);
+  return Number.isNaN(n) ? void 0 : n >= 600;
+}
+function styleOf(element, base) {
+  const style = { ...base };
+  switch (tagOf(element)) {
+    case "B":
+    case "STRONG":
+      style.bold = true;
+      break;
+    case "I":
+    case "EM":
+    case "CITE":
+    case "DFN":
+      style.italic = true;
+      break;
+    case "U":
+    case "INS":
+      style.underline = true;
+      break;
+    case "S":
+    case "DEL":
+    case "STRIKE":
+      style.strike = true;
+      break;
+    case "CODE":
+    case "KBD":
+    case "SAMP":
+    case "TT":
+      style.code = true;
+      break;
+    case "A": {
+      const href = element.getAttribute("href");
+      const link = href ? normalizeLinkUrl(href) : null;
+      if (link) style.link = link;
+      break;
+    }
+  }
+  const css = element.style;
+  if (css) {
+    const bold = weight(css.fontWeight ?? "");
+    if (bold !== void 0) style.bold = bold;
+    const italic = (css.fontStyle ?? "").toLowerCase();
+    if (italic === "italic" || italic === "oblique") style.italic = true;
+    else if (italic === "normal") style.italic = false;
+    const decoration = `${css.textDecorationLine ?? ""} ${css.textDecoration ?? ""}`.toLowerCase();
+    if (decoration.includes("underline")) style.underline = true;
+    if (decoration.includes("line-through")) style.strike = true;
+  }
+  return style;
+}
+function attributesOf(style) {
+  const attributes = {};
+  if (style.bold) attributes.bold = true;
+  if (style.italic) attributes.italic = true;
+  if (style.underline) attributes.underline = true;
+  if (style.strike) attributes.strike = true;
+  if (style.code) attributes.code = true;
+  if (style.link && isSafeUrl(style.link)) attributes.link = style.link;
+  return Object.keys(attributes).length > 0 ? attributes : void 0;
+}
+function isHidden(element) {
+  return element.hasAttribute("hidden") || element.style?.display === "none" || element.style?.visibility === "hidden";
+}
+
+// src/clipboard/html/inline.ts
+function cleanInline(nodes, preserve = false) {
+  if (preserve) return normalizeInlineNodes(nodes.filter((n) => n.insert.length > 0));
+  const cleaned = [];
+  let previousSpace = true;
+  for (const node of nodes) {
+    let text = "";
+    for (const ch of node.insert.replace(/\u00a0/g, " ")) {
+      if (ch === "\n") {
+        text = text.replace(/ $/, "") + ch;
+        previousSpace = true;
+      } else if (/\s/.test(ch)) {
+        if (!previousSpace) text += " ";
+        previousSpace = true;
+      } else {
+        text += ch;
+        previousSpace = false;
+      }
+    }
+    if (text)
+      cleaned.push({ insert: text, ...node.attributes ? { attributes: node.attributes } : {} });
+  }
+  while (cleaned.length > 0) {
+    const last = cleaned[cleaned.length - 1];
+    const trimmed = last.insert.replace(/[ \n]+$/, "");
+    if (trimmed === "") cleaned.pop();
+    else {
+      last.insert = trimmed;
+      break;
+    }
+  }
+  while (cleaned.length > 0 && /^\n+/.test(cleaned[0].insert)) {
+    cleaned[0].insert = cleaned[0].insert.replace(/^\n+/, "");
+    if (cleaned[0].insert === "") cleaned.shift();
+  }
+  return normalizeInlineNodes(cleaned);
+}
+function inlineOf(node, style, out, depth, preserve = false) {
+  if (depth > MAX_DEPTH) return;
+  if (node.nodeType === Node.TEXT_NODE) {
+    const raw = node.textContent ?? "";
+    const text = preserve ? raw : raw.replace(/[\t\n\r\f ]+/g, " ");
+    const attributes = attributesOf(style);
+    if (text) out.push({ insert: text, ...attributes ? { attributes } : {} });
+    return;
+  }
+  if (node.nodeType !== Node.ELEMENT_NODE) return;
+  const element = node;
+  if (SKIP_TAGS.has(tagOf(element)) || isHidden(element)) return;
+  if (/mso-list:\s*ignore/i.test(element.getAttribute("style") ?? "")) return;
+  if (tagOf(element) === "BR") {
+    out.push({ insert: "\n" });
+    return;
+  }
+  const next = styleOf(element, style);
+  const isBlock = BLOCK_TAGS.has(tagOf(element));
+  if (isBlock && out.length > 0) out.push({ insert: "\n" });
+  element.childNodes.forEach((child) => inlineOf(child, next, out, depth + 1, preserve));
+  if (isBlock) out.push({ insert: "\n" });
+}
+
+// src/clipboard/html/blocks.ts
+function pastedImageSrc(src) {
+  const value = (src ?? "").trim();
+  return value !== "" && !value.startsWith("/") && isSafeImageUrl(value) ? value : null;
+}
+function imageBlock(img, caption = "") {
+  const src = pastedImageSrc(img.getAttribute("src"));
+  if (!src) return null;
+  return block("block:image", [], {
+    src,
+    alt: (img.getAttribute("alt") ?? "").slice(0, 1e3),
+    caption: caption.slice(0, 2e3)
+  });
+}
+var block = (flavour, content, props = {}) => ({
+  flavour,
+  props,
+  content,
+  children: []
+});
+function hasBlockDescendant(element) {
+  const stack = [];
+  for (let child = element.lastElementChild; child; child = child.previousElementSibling)
+    stack.push(child);
+  while (stack.length > 0) {
+    const current = stack.pop();
+    const tag = tagOf(current);
+    if (BLOCK_TAGS.has(tag) && !SKIP_TAGS.has(tag)) return true;
+    for (let child = current.lastElementChild; child; child = child.previousElementSibling)
+      stack.push(child);
+  }
+  return false;
+}
+function wordListLevel(element) {
+  const style = element.getAttribute("style") ?? "";
+  const match = /mso-list:[^;]*level(\d+)/i.exec(style);
+  if (match) return Number(match[1]);
+  return /^MsoListParagraph/i.test(element.className) ? 1 : null;
+}
+function wordListMarker(element) {
+  for (const span of element.querySelectorAll("span")) {
+    if (/mso-list:\s*ignore/i.test(span.getAttribute("style") ?? "")) return span.textContent ?? "";
+  }
+  return "";
+}
+function listItems(list, ordered, style, depth) {
+  const result = [];
+  for (const child of Array.from(list.children)) {
+    if (SKIP_TAGS.has(tagOf(child)) || isHidden(child)) continue;
+    if (tagOf(child) === "UL" || tagOf(child) === "OL") {
+      const nested = listItems(child, tagOf(child) === "OL", style, depth + 1);
+      const parent = result[result.length - 1];
+      if (parent) parent.children.push(...nested);
+      else result.push(...nested);
+      continue;
+    }
+    if (tagOf(child) !== "LI") continue;
+    const content = [];
+    const children = [];
+    const itemStyle = styleOf(child, style);
+    const checkbox = child.querySelector(
+      ':scope > input[type="checkbox"], :scope > p > input[type="checkbox"]'
+    );
+    const todo = !!checkbox || /task-list-item/.test(child.className);
+    child.childNodes.forEach((node) => {
+      if (node.nodeType === Node.ELEMENT_NODE) {
+        const element = node;
+        if (tagOf(element) === "UL" || tagOf(element) === "OL") {
+          children.push(...listItems(element, tagOf(element) === "OL", itemStyle, depth + 1));
+          return;
+        }
+      }
+      inlineOf(node, itemStyle, content, depth + 1);
+    });
+    const props = { type: todo ? "todo" : ordered ? "ordered" : "bullet" };
+    if (todo) props.checked = !!checkbox?.checked || checkbox?.hasAttribute("checked") === true;
+    const item = block("block:list", cleanInline(content), props);
+    item.children = children;
+    result.push(item);
+  }
+  return result;
+}
+function pushWordItem(out, stack, item, level) {
+  while (stack.length > 0 && stack[stack.length - 1].level >= level) stack.pop();
+  const parent = stack[stack.length - 1];
+  if (parent) parent.block.children.push(item);
+  else out.push(item);
+  stack.push({ block: item, level });
+}
+function collect(container, style, out, depth) {
+  if (depth > MAX_DEPTH) return;
+  let run = [];
+  let wordStack = [];
+  const flush = () => {
+    const content = cleanInline(run);
+    if (content.length > 0) out.push(block("block:paragraph", content));
+    run = [];
+  };
+  const endWordList = () => {
+    wordStack = [];
+  };
+  container.childNodes.forEach((node) => {
+    if (node.nodeType === Node.TEXT_NODE) {
+      inlineOf(node, style, run, depth + 1);
+      return;
+    }
+    if (node.nodeType !== Node.ELEMENT_NODE) return;
+    const element = node;
+    if (SKIP_TAGS.has(tagOf(element)) || isHidden(element)) return;
+    const tag = tagOf(element);
+    const next = styleOf(element, style);
+    const level = tag === "P" ? wordListLevel(element) : null;
+    if (level !== null) {
+      flush();
+      const marker = wordListMarker(element).trim();
+      const content = [];
+      element.childNodes.forEach((child) => inlineOf(child, next, content, depth + 1));
+      pushWordItem(
+        out,
+        wordStack,
+        block("block:list", cleanInline(content), {
+          type: /^(\d+|[a-z]|[ivxlc]+)[.)]/i.test(marker) ? "ordered" : "bullet"
+        }),
+        level
+      );
+      return;
+    }
+    endWordList();
+    if (/^H[1-6]$/.test(tag)) {
+      flush();
+      const content = [];
+      element.childNodes.forEach((child) => inlineOf(child, next, content, depth + 1));
+      const cleaned = cleanInline(content);
+      if (cleaned.length > 0) out.push(block("block:heading", cleaned, { level: Number(tag[1]) }));
+      return;
+    }
+    if (tag === "IMG") {
+      flush();
+      const image = imageBlock(element);
+      if (image) out.push(image);
+      return;
+    }
+    switch (tag) {
+      case "FIGURE": {
+        const img = element.querySelector("img");
+        if (img) {
+          flush();
+          const caption = (element.querySelector("figcaption")?.textContent ?? "").replace(/\s+/g, " ").trim();
+          const image = imageBlock(img, caption);
+          if (image) out.push(image);
+          return;
+        }
+        break;
+      }
+      case "ASIDE": {
+        const tone = element.getAttribute("data-callout");
+        if (tone !== null) {
+          flush();
+          const content = [];
+          element.childNodes.forEach((child) => inlineOf(child, next, content, depth + 1));
+          const cleaned = cleanInline(content);
+          if (cleaned.length > 0) {
+            out.push(
+              block(
+                "block:callout",
+                cleaned,
+                /^(info|warning|success|danger)$/.test(tone) ? { tone } : {}
+              )
+            );
+          }
+          return;
+        }
+        break;
+      }
+      case "UL":
+      case "OL":
+        flush();
+        out.push(...listItems(element, tag === "OL", next, depth + 1));
+        return;
+      case "LI":
+        flush();
+        out.push(
+          ...listItems(element.parentElement ?? element, false, next, depth + 1).slice(0, 1)
+        );
+        return;
+      case "PRE": {
+        flush();
+        const code = element.querySelector("code");
+        const language = /language-([\w+#-]+)/.exec(code?.className ?? element.className)?.[1] ?? element.getAttribute("data-language") ?? "plain";
+        const text = (element.textContent ?? "").replace(/\n$/, "");
+        out.push(block("block:code", text ? [{ insert: text }] : [], { language }));
+        return;
+      }
+      case "HR":
+        flush();
+        out.push(block("block:divider", []));
+        return;
+      case "BLOCKQUOTE": {
+        flush();
+        if (hasBlockDescendant(element)) {
+          const inner = [];
+          collect(element, next, inner, depth + 1);
+          out.push(
+            ...inner.map(
+              (b) => b.flavour === "block:paragraph" ? { ...b, flavour: "block:quote" } : b
+            )
+          );
+        } else {
+          const content = [];
+          element.childNodes.forEach((child) => inlineOf(child, next, content, depth + 1));
+          const cleaned = cleanInline(content);
+          if (cleaned.length > 0) out.push(block("block:quote", cleaned));
+        }
+        return;
+      }
+      case "TABLE": {
+        flush();
+        element.querySelectorAll("tr").forEach((row) => {
+          const cells = [];
+          row.querySelectorAll(":scope > td, :scope > th").forEach((cell, index) => {
+            const content = [];
+            if (index > 0) cells.push({ insert: "	" });
+            cell.childNodes.forEach((child) => inlineOf(child, next, content, depth + 1));
+            cells.push(...cleanInline(content));
+          });
+          const cleaned = normalizeInlineNodes2(cells);
+          if (cleaned.length > 0) out.push(block("block:paragraph", cleaned));
+        });
+        return;
+      }
+    }
+    if (hasBlockDescendant(element)) {
+      flush();
+      collect(element, next, out, depth + 1);
+      return;
+    }
+    if (BLOCK_TAGS.has(tag)) {
+      flush();
+      const content = [];
+      element.childNodes.forEach((child) => inlineOf(child, next, content, depth + 1));
+      const cleaned = cleanInline(content);
+      if (cleaned.length > 0) out.push(block("block:paragraph", cleaned));
+      element.querySelectorAll("img").forEach((img) => {
+        const image = imageBlock(img);
+        if (image) out.push(image);
+      });
+      return;
+    }
+    inlineOf(element, style, run, depth + 1);
+  });
+  flush();
+}
+
+// src/clipboard/htmlToFragment.ts
+var MAX_HTML = 2e6;
+function embeddedFragment(html) {
+  if (!html.includes("data-inkbrick-fragment")) return null;
+  const doc = new DOMParser().parseFromString(html.slice(0, MAX_HTML), "text/html");
+  const raw = doc.querySelector("[data-inkbrick-fragment]")?.getAttribute("data-inkbrick-fragment");
+  if (!raw) return null;
+  try {
+    return sanitizeFragment(JSON.parse(decodeURIComponent(raw)));
+  } catch {
+    return null;
+  }
+}
+function htmlToFragment(html) {
+  if (!html || html.length > MAX_HTML) return null;
+  const doc = new DOMParser().parseFromString(html, "text/html");
+  const blocks = [];
+  collect(doc.body, {}, blocks, 0);
+  const sanitized = sanitizeFragment({ blocks: blocks.map((b) => ({ ...b, complete: true })) });
+  return sanitized;
+}
+
+// src/images/upload.ts
+import { isSafeImageUrl as isSafeImageUrl2 } from "@inkbrick/document";
+
+// src/images/ImageError.ts
+var ImageError = class extends Error {
+  constructor(code, message, params) {
+    super(message);
+    this.code = code;
+    this.params = params;
+    this.name = "ImageError";
+  }
+};
+function toImageErrorInfo(error) {
+  if (error instanceof ImageError) {
+    return { message: error.message, code: error.code, params: error.params };
+  }
+  return { message: error instanceof Error ? error.message : "" };
+}
+function formatImageError(info, t) {
+  if (info.code) return t(`image.error.${info.code}`, info.params);
+  return info.message || t("image.error.generic");
+}
+
+// src/images/types.ts
+var DEFAULT_IMAGE_TYPES = [
+  "image/png",
+  "image/jpeg",
+  "image/gif",
+  "image/webp",
+  "image/avif"
+];
+var DEFAULT_MAX_INLINE_BYTES = 15e5;
+
+// src/images/upload.ts
+function isAcceptedImage(file, options) {
+  return (options.acceptedTypes ?? DEFAULT_IMAGE_TYPES).includes(file.type.toLowerCase());
+}
+function readAsDataUrl(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => resolve(String(reader.result));
+    reader.onerror = () => reject(new ImageError("read", "Could not read the file"));
+    reader.readAsDataURL(file);
+  });
+}
+async function uploadImage(file, options) {
+  if (!isAcceptedImage(file, options)) {
+    const type = file.type || "unknown";
+    throw new ImageError("type", `Unsupported image type "${type}"`, { type });
+  }
+  let url;
+  if (options.upload) {
+    url = await options.upload(file);
+  } else {
+    const limit = options.maxInlineBytes ?? DEFAULT_MAX_INLINE_BYTES;
+    if (file.size > limit) {
+      const size = Math.round(limit / 1024);
+      throw new ImageError(
+        "size",
+        `The image is larger than ${size} KB. Provide "images.upload" to store larger images.`,
+        { size }
+      );
+    }
+    url = await readAsDataUrl(file);
+  }
+  if (!isSafeImageUrl2(url))
+    throw new ImageError("uploadAddress", "The upload returned an unsupported image address");
+  return url;
+}
+function normalizeImageUrl(input) {
+  const value = input.trim();
+  if (value === "") return null;
+  const candidate = /^[a-z][a-z0-9+.-]*:/i.test(value) || value.startsWith("/") ? value : `https://${value}`;
+  return isSafeImageUrl2(candidate) ? candidate : null;
+}
+
+// src/blocks/BlockChildren.tsx
+import { useContext as useContext3 } from "react";
+
+// src/renderer/DocumentRenderer.tsx
+import { createContext as createContext2 } from "react";
+
+// src/renderer/BlockRenderer.tsx
+import { memo, useSyncExternalStore as useSyncExternalStore7 } from "react";
+
+// src/blocks/UnknownBlockView.tsx
+import { jsx as jsx3, jsxs } from "react/jsx-runtime";
+function UnknownBlockView({ block: block2, children }) {
+  const t = useT();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "block block-unknown",
+      "data-inkbrick-block": "unknown",
+      role: "note",
+      contentEditable: false,
+      "data-block-id": block2.id,
+      "data-unknown-flavour": block2.flavour,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "block-unknown__message", "data-inkbrick-part": "message", children: [
+          t("block.unknown.title"),
+          " ",
+          /* @__PURE__ */ jsx3("code", { children: block2.flavour }),
+          ". ",
+          t("block.unknown.hint"),
+          " ",
+          /* @__PURE__ */ jsx3("code", { children: "components" }),
+          "."
+        ] }),
+        children
+      ]
+    }
+  );
+}
+
+// src/blocks/PageBlock.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+function PageBlock({ block: block2 }) {
+  return /* @__PURE__ */ jsx4("div", { className: "page", "data-inkbrick-block": "page", "data-block-id": block2.id, children: /* @__PURE__ */ jsx4(BlockChildren, { id: block2.id }) });
+}
+
+// src/blocks/NoteBlock.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+function NoteBlock({ block: block2 }) {
+  return /* @__PURE__ */ jsx5("section", { className: "page-content", "data-inkbrick-block": "note", "data-block-id": block2.id, children: /* @__PURE__ */ jsx5(BlockChildren, { id: block2.id }) });
+}
+
+// src/blocks/ParagraphBlock.tsx
+import { getBlockAlign } from "@inkbrick/document";
+
+// src/blocks/Editable.tsx
+import { useLayoutEffect as useLayoutEffect2, useRef, useSyncExternalStore as useSyncExternalStore5 } from "react";
+
+// src/editing/renderCode.ts
+var TOKEN_TYPE = /^[a-z][a-z0-9-]{0,31}$/;
+function normalizeTokens(tokens, length) {
+  const valid = tokens.filter(
+    (token) => Number.isInteger(token.from) && Number.isInteger(token.to) && token.from >= 0 && token.to <= length && token.from < token.to && TOKEN_TYPE.test(token.type)
+  ).sort((a, b) => a.from - b.from || b.to - a.to);
+  const result = [];
+  let end = 0;
+  for (const token of valid) {
+    if (token.from >= end) {
+      result.push(token);
+      end = token.to;
+    }
+  }
+  return result;
+}
+function renderCode(root, text, tokens) {
+  const doc = globalThis.document;
+  const fragment = doc.createDocumentFragment();
+  let position = 0;
+  for (const token of normalizeTokens(tokens, text.length)) {
+    if (token.from > position)
+      fragment.appendChild(doc.createTextNode(text.slice(position, token.from)));
+    const span = doc.createElement("span");
+    span.setAttribute("data-inkbrick-token", token.type);
+    span.textContent = text.slice(token.from, token.to);
+    fragment.appendChild(span);
+    position = token.to;
+  }
+  if (position < text.length) fragment.appendChild(doc.createTextNode(text.slice(position)));
+  if (text === "" || text.endsWith("\n")) fragment.appendChild(doc.createElement("br"));
+  root.replaceChildren(fragment);
+}
+
+// src/editing/renderInline.ts
+import {
+  FORMULA_CHAR,
+  isColorName,
+  isSafeUrl as isSafeUrl2,
+  safeCssColor
+} from "@inkbrick/document";
+function wrap(node, tag) {
+  const element = globalThis.document.createElement(tag);
+  element.appendChild(node);
+  return element;
+}
+function renderFormulaAtom(latex, options) {
+  const doc = globalThis.document;
+  const host = doc.createElement("span");
+  host.setAttribute("data-inkbrick-formula", "");
+  host.setAttribute("data-inkbrick-part", "formula-inline");
+  host.setAttribute("data-latex", latex);
+  host.setAttribute("contenteditable", "false");
+  host.textContent = FORMULA_CHAR;
+  const view = doc.createElement("span");
+  view.setAttribute("part", "math");
+  try {
+    const shadow = host.attachShadow({ mode: "open" });
+    ensureMathStyles(shadow);
+    shadow.appendChild(view);
+  } catch {
+    host.setAttribute("data-state", "fallback");
+    return host;
+  }
+  mountFormula(view, latex, {
+    display: false,
+    renderer: options.formulaRenderer ?? null,
+    onSettled: (state) => host.setAttribute("data-state", state)
+  });
+  host.setAttribute("data-state", view.getAttribute("data-state") ?? "loading");
+  return host;
+}
+function renderNode(insert, attributes, options) {
+  let node;
+  if (typeof attributes?.formula === "string") {
+    const fragment = globalThis.document.createDocumentFragment();
+    for (let i = 0; i < insert.length; i++)
+      fragment.appendChild(renderFormulaAtom(attributes.formula, options));
+    node = fragment;
+  } else {
+    node = globalThis.document.createTextNode(insert);
+  }
+  if (!attributes) return node;
+  if (attributes.code) node = wrap(node, "code");
+  if (attributes.bold) node = wrap(node, "strong");
+  if (attributes.italic) node = wrap(node, "em");
+  if (attributes.underline) node = wrap(node, "u");
+  if (attributes.strike) node = wrap(node, "s");
+  if (typeof attributes.link === "string" && isSafeUrl2(attributes.link)) {
+    const anchor = wrap(node, "a");
+    anchor.href = attributes.link.trim();
+    anchor.rel = "noopener noreferrer";
+    anchor.target = "_blank";
+    node = anchor;
+  }
+  const color = attributes.color;
+  const background = attributes.backgroundColor;
+  const safeColor = isColorName(color) ? null : safeCssColor(color);
+  const safeBackground = isColorName(background) ? null : safeCssColor(background);
+  if (isColorName(color) || isColorName(background) || safeColor || safeBackground) {
+    const span = wrap(node, "span");
+    if (isColorName(color)) span.setAttribute("data-inkbrick-color", color);
+    else if (safeColor) span.style.color = safeColor;
+    if (isColorName(background)) span.setAttribute("data-inkbrick-bg", background);
+    else if (safeBackground) span.style.backgroundColor = safeBackground;
+    node = span;
+  }
+  return node;
+}
+function renderInline(root, nodes, options = {}) {
+  const fragment = globalThis.document.createDocumentFragment();
+  for (const { insert, attributes } of nodes) {
+    if (insert.length > 0) fragment.appendChild(renderNode(insert, attributes, options));
+  }
+  const text = nodes.map((node) => node.insert).join("");
+  if (text === "" || text.endsWith("\n")) {
+    fragment.appendChild(globalThis.document.createElement("br"));
+  }
+  root.replaceChildren(fragment);
+}
+
+// src/blocks/Editable.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+function Editable({ block: block2, placeholder }) {
+  const ref = useRef(null);
+  const view = useEditorView();
+  const t = useT();
+  const readOnly = useReadOnly();
+  const { slashItems, highlighter, formulaRenderer } = useEditorUI();
+  const focused = useSyncExternalStore5(
+    view.caret.subscribe,
+    () => view.caret.has(block2.id),
+    () => false
+  );
+  useLayoutEffect2(() => view.register(block2.id, ref.current), [view, block2.id]);
+  const isCode = block2.flavour === "block:code";
+  const language = typeof block2.props.language === "string" ? block2.props.language : "plain";
+  useLayoutEffect2(() => {
+    const plain = block2.content.every((node) => !node.attributes);
+    if (isCode && highlighter && plain) {
+      const text = block2.content.map((node) => node.insert).join("");
+      let tokens = [];
+      try {
+        tokens = highlighter(text, language);
+      } catch (error) {
+        console.error("[@inkbrick/react] The code highlighter failed:", error);
+      }
+      renderCode(ref.current, text, tokens);
+    } else {
+      renderInline(ref.current, block2.content, { formulaRenderer });
+    }
+  }, [block2.content, isCode, language, highlighter, formulaRenderer]);
+  const isEmpty = block2.content.every((node) => node.insert.length === 0);
+  const hinted = !readOnly && slashItems.length > 0 && block2.flavour !== "block:code";
+  return /* @__PURE__ */ jsx6(
+    "div",
+    {
+      ref,
+      className: "editable",
+      "data-inkbrick-part": "content",
+      "data-id": block2.id,
+      "data-empty": isEmpty,
+      "data-focused": focused || void 0,
+      "data-hint": hinted ? t("editor.hint") : void 0,
+      "data-placeholder": placeholder
+    }
+  );
+}
+
+// src/blocks/ParagraphBlock.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+function ParagraphBlock({ block: block2, selected }) {
+  const align = getBlockAlign(block2) ?? "left";
+  return /* @__PURE__ */ jsx7(
+    "div",
+    {
+      className: "block block-paragraph",
+      "data-inkbrick-block": "paragraph",
+      "data-block-id": block2.id,
+      "data-selected": selected || void 0,
+      "data-align": align,
+      children: /* @__PURE__ */ jsx7(Editable, { block: block2 })
+    }
+  );
+}
+
+// src/blocks/HeadingBlock.tsx
+import { getBlockAlign as getBlockAlign2 } from "@inkbrick/document";
+import { jsx as jsx8 } from "react/jsx-runtime";
+function HeadingBlock({ block: block2, selected }) {
+  const level = typeof block2.props.level === "number" ? block2.props.level : 1;
+  const align = getBlockAlign2(block2) ?? "left";
+  return /* @__PURE__ */ jsx8(
+    "div",
+    {
+      className: `block block-heading level-${level}`,
+      "data-inkbrick-block": "heading",
+      "data-level": level,
+      "data-block-id": block2.id,
+      "data-selected": selected || void 0,
+      "data-align": align,
+      children: /* @__PURE__ */ jsx8(Editable, { block: block2 })
+    }
+  );
+}
+
+// src/blocks/ListBlock.tsx
+import { getBlockAlign as getBlockAlign3 } from "@inkbrick/document";
+import { jsx as jsx9, jsxs as jsxs2 } from "react/jsx-runtime";
+function useOrderedNumber(block2) {
+  const { store } = useEditor();
+  const parent = useBlock(block2.parentId ?? "");
+  if (!parent) return 1;
+  let number = 1;
+  for (let i = parent.children.indexOf(block2.id) - 1; i >= 0; i--) {
+    const sibling = store.getBlock(parent.children[i]);
+    if (sibling?.flavour !== "block:list" || sibling.props.type !== "ordered") break;
+    number++;
+  }
+  return number;
+}
+function ListBlock({ block: block2, selected, readOnly }) {
+  const editor = useEditor();
+  const t = useT();
+  const children = useChildren(block2.id);
+  const orderedNumber = useOrderedNumber(block2);
+  const type = typeof block2.props.type === "string" ? block2.props.type : "bullet";
+  return /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      className: "block-list-item",
+      "data-inkbrick-block": "list",
+      "data-align": getBlockAlign3(block2) ?? "left",
+      "data-block-id": block2.id,
+      "data-list-type": type,
+      "data-checked": type === "todo" ? block2.props.checked === true : void 0,
+      "data-selected": selected || void 0,
+      children: [
+        /* @__PURE__ */ jsxs2("div", { className: "block block-list", "data-inkbrick-part": "row", "data-list-type": type, children: [
+          type === "todo" ? /* @__PURE__ */ jsx9(
+            "input",
+            {
+              className: "list-marker list-checkbox",
+              "data-inkbrick-part": "checkbox",
+              type: "checkbox",
+              "aria-label": t("block.list.done"),
+              contentEditable: false,
+              disabled: readOnly,
+              checked: block2.props.checked === true,
+              onChange: (event) => editor.dispatch({
+                type: "setBlockProps",
+                payload: { blockId: block2.id, props: { checked: event.target.checked } }
+              })
+            }
+          ) : /* @__PURE__ */ jsx9(
+            "span",
+            {
+              className: "list-marker",
+              "data-inkbrick-part": "marker",
+              contentEditable: false,
+              "aria-hidden": "true",
+              children: type === "ordered" ? `${orderedNumber}.` : "\u2022"
+            }
+          ),
+          /* @__PURE__ */ jsx9(Editable, { block: block2 })
+        ] }),
+        children.length > 0 && /* @__PURE__ */ jsx9("div", { className: "block-nested-children", "data-inkbrick-part": "children", children: /* @__PURE__ */ jsx9(BlockChildren, { id: block2.id }) })
+      ]
+    }
+  );
+}
+
+// src/blocks/QuoteBlock.tsx
+import { getBlockAlign as getBlockAlign4 } from "@inkbrick/document";
+import { jsx as jsx10 } from "react/jsx-runtime";
+function QuoteBlock({ block: block2, selected }) {
+  return /* @__PURE__ */ jsx10(
+    "blockquote",
+    {
+      className: "block block-quote",
+      "data-inkbrick-block": "quote",
+      "data-align": getBlockAlign4(block2) ?? "left",
+      "data-block-id": block2.id,
+      "data-selected": selected || void 0,
+      children: /* @__PURE__ */ jsx10(Editable, { block: block2 })
+    }
+  );
+}
+
+// src/blocks/CodeBlock.tsx
+import { useEffect, useRef as useRef2, useState } from "react";
+import { jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
+var CODE_LANGUAGES = [
+  "plain",
+  "typescript",
+  "javascript",
+  "json",
+  "html",
+  "css",
+  "python",
+  "bash",
+  "sql",
+  "go",
+  "rust",
+  "java",
+  "c",
+  "cpp",
+  "markdown",
+  "yaml"
+];
+function CodeBlock({ block: block2, editor, selected, readOnly }) {
+  const t = useT();
+  const language = typeof block2.props.language === "string" ? block2.props.language : "plain";
+  const languages = CODE_LANGUAGES.includes(language) ? CODE_LANGUAGES : [...CODE_LANGUAGES, language];
+  const [copied, setCopied] = useState(false);
+  const timer = useRef2(void 0);
+  useEffect(() => () => clearTimeout(timer.current), []);
+  const copy = () => {
+    const text = block2.content.map((node) => node.insert).join("");
+    void navigator.clipboard?.writeText(text).then(() => {
+      setCopied(true);
+      clearTimeout(timer.current);
+      timer.current = setTimeout(() => setCopied(false), 1500);
+    });
+  };
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      className: "block block-code",
+      "data-inkbrick-block": "code",
+      "data-block-id": block2.id,
+      "data-language": language,
+      "data-selected": selected || void 0,
+      children: [
+        /* @__PURE__ */ jsxs3("div", { className: "code-toolbar", "data-inkbrick-part": "toolbar", contentEditable: false, children: [
+          /* @__PURE__ */ jsx11(
+            "select",
+            {
+              className: "code-language",
+              "data-inkbrick-part": "language",
+              "aria-label": t("block.code.language"),
+              disabled: readOnly,
+              value: language,
+              onChange: (event) => editor.dispatch({
+                type: "setBlockProps",
+                payload: { blockId: block2.id, props: { language: event.target.value } }
+              }),
+              children: languages.map((name) => /* @__PURE__ */ jsx11("option", { value: name, children: name }, name))
+            }
+          ),
+          /* @__PURE__ */ jsx11(
+            "button",
+            {
+              type: "button",
+              className: "code-copy",
+              "data-inkbrick-part": "copy",
+              "data-state": copied ? "copied" : void 0,
+              "aria-label": copied ? t("block.code.copied") : t("block.code.copy"),
+              title: copied ? t("block.code.copied") : t("block.code.copy"),
+              onClick: copy,
+              children: /* @__PURE__ */ jsx11(Icon, { name: copied ? "check" : "copy" })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx11(Editable, { block: block2 })
+      ]
+    }
+  );
+}
+
+// src/blocks/DividerBlock.tsx
+import { jsx as jsx12 } from "react/jsx-runtime";
+function DividerBlock({ block: block2, selected }) {
+  return /* @__PURE__ */ jsx12(
+    "div",
+    {
+      className: "block block-divider",
+      "data-inkbrick-block": "divider",
+      "data-block-id": block2.id,
+      "data-selected": selected || void 0,
+      contentEditable: false,
+      children: /* @__PURE__ */ jsx12("hr", { "data-inkbrick-part": "rule" })
+    }
+  );
+}
+
+// src/blocks/CalloutBlock.tsx
+import { CALLOUT_TONES, getBlockAlign as getBlockAlign5 } from "@inkbrick/document";
+import { jsx as jsx13, jsxs as jsxs4 } from "react/jsx-runtime";
+var ICONS = {
+  info: "info",
+  warning: "warning",
+  success: "success",
+  danger: "danger"
+};
+var isTone = (value) => CALLOUT_TONES.includes(value);
+function CalloutBlock({ block: block2, editor, selected, readOnly }) {
+  const t = useT();
+  const tone = isTone(block2.props.tone) ? block2.props.tone : "info";
+  const icon = typeof block2.props.icon === "string" && block2.props.icon !== "" ? block2.props.icon : /* @__PURE__ */ jsx13(Icon, { name: ICONS[tone] });
+  const nextTone = CALLOUT_TONES[(CALLOUT_TONES.indexOf(tone) + 1) % CALLOUT_TONES.length];
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: "block block-callout",
+      "data-inkbrick-block": "callout",
+      "data-align": getBlockAlign5(block2) ?? "left",
+      "data-tone": tone,
+      "data-block-id": block2.id,
+      "data-selected": selected || void 0,
+      children: [
+        /* @__PURE__ */ jsx13(
+          "button",
+          {
+            type: "button",
+            className: "callout-icon",
+            "data-inkbrick-part": "icon",
+            contentEditable: false,
+            disabled: readOnly,
+            "aria-label": t("block.callout.label", { tone: t(`block.callout.tone.${tone}`) }),
+            title: t("block.callout.change"),
+            onClick: () => editor.dispatch({
+              type: "setBlockProps",
+              payload: { blockId: block2.id, props: { tone: nextTone } }
+            }),
+            children: icon
+          }
+        ),
+        /* @__PURE__ */ jsx13(Editable, { block: block2 })
+      ]
+    }
+  );
+}
+
+// src/blocks/ImageBlock.tsx
+import { useEffect as useEffect2, useRef as useRef3, useState as useState2, useSyncExternalStore as useSyncExternalStore6 } from "react";
+import { isSafeImageUrl as isSafeImageUrl3 } from "@inkbrick/document";
+
+// src/images/insertImages.ts
+import { flushSync as flushSync2 } from "react-dom";
+import { createId } from "@inkbrick/document";
+function topLevelBlockId(editor, blockId) {
+  let current = editor.store.getBlock(blockId);
+  while (current?.parentId) {
+    const parent = editor.store.getBlock(current.parentId);
+    if (!parent || parent.flavour === "block:note" || !parent.parentId) break;
+    current = parent;
+  }
+  return current?.id ?? blockId;
+}
+var altFromName = (file) => file.name.replace(/\.[^.]+$/, "").slice(0, 200);
+function report(options, error, file) {
+  if (options.onError) options.onError(error, file);
+  else console.error("[@inkbrick/react] Could not add the image:", error);
+}
+async function fillImageBlock(editor, view, options, blockId, file, mergeKey) {
+  view.uploads.start(blockId);
+  try {
+    const src = await uploadImage(file, options);
+    flushSync2(() => {
+      editor.dispatch({
+        type: "setBlockProps",
+        payload: { blockId, props: { src, alt: altFromName(file) }, mergeKey }
+      });
+    });
+    view.uploads.finish(blockId);
+    return true;
+  } catch (error) {
+    view.uploads.finish(blockId, toImageErrorInfo(error));
+    report(options, error, file);
+    return false;
+  }
+}
+function insertImageFiles(editor, view, options, files, afterId) {
+  const images = files.filter((file) => isAcceptedImage(file, options));
+  if (images.length === 0 || editor.readOnly) return false;
+  let anchor = topLevelBlockId(editor, afterId);
+  let caret;
+  const mergeKey = `images:${createId()}`;
+  const created = [];
+  flushSync2(() => {
+    editor.batch(
+      () => {
+        for (const file of images) {
+          const target = editor.store.getBlock(anchor);
+          const alt = altFromName(file);
+          const emptyParagraph = target?.flavour === "block:paragraph" && target.content.length === 0 && target.children.length === 0;
+          if (emptyParagraph) {
+            caret = editor.dispatch({
+              type: "convertBlock",
+              payload: { blockId: anchor, flavour: "block:image", props: { alt } }
+            });
+            created.push({ id: anchor, file });
+          } else {
+            const inserted = editor.dispatch({
+              type: "insertBlock",
+              payload: { flavour: "block:image", afterId: anchor, props: { alt } }
+            });
+            if (!inserted) continue;
+            created.push({ id: inserted.blockId, file });
+            anchor = inserted.blockId;
+            if (!editor.document.getNextSibling(anchor)) {
+              caret = editor.dispatch({
+                type: "insertBlock",
+                payload: { flavour: "block:paragraph", afterId: anchor }
+              });
+            } else {
+              caret = { blockId: editor.document.getNextSibling(anchor).id, offset: 0 };
+            }
+          }
+        }
+      },
+      { mergeKey }
+    );
+  });
+  if (caret) view.placeCaret(caret.blockId, caret.offset);
+  for (const { id, file } of created) {
+    void fillImageBlock(editor, view, options, id, file, mergeKey).then((ok) => {
+      if (!ok && (editor.store.getBlock(id)?.props.src ?? "") === "") {
+        flushSync2(() => {
+          editor.execute("delete-block", { id });
+        });
+      }
+    });
+  }
+  return true;
+}
+
+// src/blocks/ImageBlock.tsx
+import { jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
+var WIDTHS = [25, 50, 75, 100];
+var ALIGNS = [
+  { value: "left", label: "image.align.left", icon: "align-left" },
+  { value: "center", label: "image.align.center", icon: "align-center" },
+  { value: "right", label: "image.align.right", icon: "align-right" }
+];
+var setProps = (editor, blockId, props) => editor.dispatch({ type: "setBlockProps", payload: { blockId, props } });
+function CommitInput({
+  value,
+  label,
+  placeholder,
+  className,
+  part,
+  onCommit
+}) {
+  const [draft, setDraft] = useState2(value);
+  const saved = useRef3(value);
+  const cancelled = useRef3(false);
+  useEffect2(() => {
+    saved.current = value;
+    setDraft(value);
+  }, [value]);
+  const commit = () => {
+    if (cancelled.current) {
+      cancelled.current = false;
+      return;
+    }
+    if (draft !== saved.current) {
+      saved.current = draft;
+      onCommit(draft);
+    }
+  };
+  return /* @__PURE__ */ jsx14(
+    "input",
+    {
+      className,
+      "data-inkbrick-part": part,
+      type: "text",
+      "aria-label": label,
+      placeholder,
+      value: draft,
+      onChange: (event) => setDraft(event.target.value),
+      onBlur: commit,
+      onKeyDown: (event) => {
+        if (event.key === "Enter") {
+          event.preventDefault();
+          commit();
+          event.target.blur();
+        } else if (event.key === "Escape") {
+          cancelled.current = true;
+          setDraft(saved.current);
+          event.target.blur();
+        }
+      }
+    }
+  );
+}
+function ImagePicker({ blockId, editor }) {
+  const view = useEditorView();
+  const t = useT();
+  const { images } = useEditorUI();
+  const [url, setUrl] = useState2("");
+  const [linkError, setLinkError] = useState2(null);
+  const uploadError = useSyncExternalStore6(
+    view.uploads.subscribe,
+    () => view.uploads.errorDetailsOf(blockId),
+    () => void 0
+  );
+  const error = linkError ? t(linkError) : uploadError ? formatImageError(uploadError, t) : null;
+  const file = useRef3(null);
+  const embed = () => {
+    const normalized = normalizeImageUrl(url);
+    if (!normalized) {
+      setLinkError("image.error.invalidLink");
+      return;
+    }
+    if (editor.dispatch({
+      type: "setBlockProps",
+      payload: { blockId, props: { src: normalized } }
+    }) === void 0) {
+      setLinkError("image.error.unsupportedAddress");
+    }
+  };
+  const upload = async (selected) => {
+    if (!selected) return;
+    setLinkError(null);
+    await fillImageBlock(editor, view, images, blockId, selected);
+  };
+  return /* @__PURE__ */ jsxs5("div", { className: "image-picker", "data-inkbrick-part": "picker", "data-testid": "image-picker", children: [
+    /* @__PURE__ */ jsxs5("div", { className: "image-picker__row", "data-inkbrick-part": "picker-row", children: [
+      /* @__PURE__ */ jsx14(
+        "input",
+        {
+          className: "image-picker__input",
+          "data-inkbrick-part": "picker-input",
+          type: "text",
+          "aria-label": t("image.url.label"),
+          "aria-invalid": linkError !== null,
+          placeholder: t("image.url.placeholder"),
+          value: url,
+          onChange: (event) => {
+            setUrl(event.target.value);
+            setLinkError(null);
+            view.uploads.clearError(blockId);
+          },
+          onKeyDown: (event) => {
+            if (event.key === "Enter") {
+              event.preventDefault();
+              embed();
+            }
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx14(
+        "button",
+        {
+          type: "button",
+          className: "image-picker__button",
+          "data-inkbrick-part": "picker-button",
+          onClick: embed,
+          children: t("image.embed")
+        }
+      ),
+      /* @__PURE__ */ jsx14(
+        "button",
+        {
+          type: "button",
+          className: "image-picker__button",
+          onClick: () => file.current?.click(),
+          children: t("image.upload")
+        }
+      ),
+      /* @__PURE__ */ jsx14(
+        "input",
+        {
+          ref: file,
+          type: "file",
+          hidden: true,
+          "data-testid": "image-file",
+          accept: (images.acceptedTypes ?? DEFAULT_IMAGE_TYPES).join(","),
+          onChange: (event) => {
+            void upload(event.target.files?.[0]);
+            event.target.value = "";
+          }
+        }
+      )
+    ] }),
+    error && /* @__PURE__ */ jsx14("div", { className: "image-picker__error", "data-inkbrick-part": "picker-error", role: "alert", children: error })
+  ] });
+}
+function ImageBlock({ block: block2, editor, selected, readOnly }) {
+  const view = useEditorView();
+  const t = useT();
+  const uploading = useSyncExternalStore6(
+    view.uploads.subscribe,
+    () => view.uploads.has(block2.id),
+    () => false
+  );
+  const { src, alt, caption } = block2.props;
+  const width = typeof block2.props.width === "number" ? block2.props.width : 100;
+  const align = typeof block2.props.align === "string" ? block2.props.align : "center";
+  const address = typeof src === "string" ? src : "";
+  const [failed, setFailed] = useState2(false);
+  useEffect2(() => setFailed(false), [address]);
+  let content;
+  if (uploading) {
+    content = /* @__PURE__ */ jsx14("div", { className: "image-status", "data-inkbrick-part": "status", "data-state": "loading", role: "status", children: t("image.status.uploading") });
+  } else if (address === "") {
+    content = readOnly ? /* @__PURE__ */ jsx14("div", { className: "image-status", "data-inkbrick-part": "status", "data-state": "empty", children: t("image.status.none") }) : /* @__PURE__ */ jsx14(ImagePicker, { blockId: block2.id, editor });
+  } else if (!isSafeImageUrl3(address)) {
+    content = /* @__PURE__ */ jsx14(
+      "div",
+      {
+        className: "image-status image-status--error",
+        "data-inkbrick-part": "status",
+        "data-state": "error",
+        children: t("image.status.unsupported")
+      }
+    );
+  } else if (failed) {
+    content = /* @__PURE__ */ jsxs5(
+      "div",
+      {
+        className: "image-status image-status--error",
+        "data-inkbrick-part": "status",
+        "data-state": "error",
+        role: "alert",
+        children: [
+          t("image.status.failed"),
+          !readOnly && /* @__PURE__ */ jsx14(
+            "button",
+            {
+              type: "button",
+              className: "image-picker__button",
+              "data-inkbrick-part": "picker-button",
+              onClick: () => setProps(editor, block2.id, { src: "" }),
+              children: t("image.status.retry")
+            }
+          )
+        ]
+      }
+    );
+  } else {
+    content = /* @__PURE__ */ jsxs5(
+      "figure",
+      {
+        className: "image-figure",
+        "data-inkbrick-part": "figure",
+        "data-align": align,
+        style: { width: `${width}%` },
+        children: [
+          /* @__PURE__ */ jsx14(
+            "img",
+            {
+              src: address,
+              alt: alt ?? "",
+              loading: "lazy",
+              decoding: "async",
+              draggable: false,
+              "data-inkbrick-part": "image",
+              referrerPolicy: "no-referrer",
+              onError: () => setFailed(true)
+            }
+          ),
+          !readOnly && /* @__PURE__ */ jsxs5(
+            "div",
+            {
+              className: "image-tools",
+              "data-inkbrick-part": "tools",
+              role: "toolbar",
+              "aria-label": t("image.options"),
+              children: [
+                ALIGNS.map(({ value, label, icon }) => /* @__PURE__ */ jsx14(
+                  "button",
+                  {
+                    type: "button",
+                    className: "image-tools__button",
+                    "data-inkbrick-part": "tool",
+                    "data-pressed": align === value || void 0,
+                    "aria-label": t(label),
+                    "aria-pressed": align === value,
+                    title: t(label),
+                    onClick: () => setProps(editor, block2.id, { align: value }),
+                    children: /* @__PURE__ */ jsx14(Icon, { name: icon })
+                  },
+                  value
+                )),
+                /* @__PURE__ */ jsxs5(
+                  "select",
+                  {
+                    className: "image-tools__select",
+                    "data-inkbrick-part": "width",
+                    "aria-label": t("image.width"),
+                    value: WIDTHS.includes(width) ? width : "",
+                    onChange: (event) => setProps(editor, block2.id, { width: Number(event.target.value) }),
+                    children: [
+                      !WIDTHS.includes(width) && /* @__PURE__ */ jsxs5("option", { value: "", children: [
+                        width,
+                        "%"
+                      ] }),
+                      WIDTHS.map((w) => /* @__PURE__ */ jsxs5("option", { value: w, children: [
+                        w,
+                        "%"
+                      ] }, w))
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx14(
+                  CommitInput,
+                  {
+                    className: "image-tools__alt",
+                    part: "alt",
+                    label: t("image.alt"),
+                    placeholder: t("image.alt"),
+                    value: alt ?? "",
+                    onCommit: (value) => setProps(editor, block2.id, { alt: value })
+                  }
+                ),
+                /* @__PURE__ */ jsx14(
+                  "button",
+                  {
+                    type: "button",
+                    className: "image-tools__button",
+                    "data-inkbrick-part": "tool",
+                    "aria-label": t("image.replace"),
+                    title: t("image.replace"),
+                    onClick: () => setProps(editor, block2.id, { src: "" }),
+                    children: /* @__PURE__ */ jsx14(Icon, { name: "replace" })
+                  }
+                )
+              ]
+            }
+          ),
+          readOnly ? caption ? /* @__PURE__ */ jsx14("figcaption", { className: "image-caption", "data-inkbrick-part": "caption", children: caption }) : null : /* @__PURE__ */ jsx14(
+            CommitInput,
+            {
+              className: "image-caption image-caption--input",
+              part: "caption",
+              label: t("image.caption.label"),
+              placeholder: t("image.caption.placeholder"),
+              value: caption ?? "",
+              onCommit: (value) => setProps(editor, block2.id, { caption: value })
+            }
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx14(
+    "div",
+    {
+      className: "block block-image",
+      "data-inkbrick-block": "image",
+      "data-block-id": block2.id,
+      "data-selected": selected || void 0,
+      contentEditable: false,
+      children: content
+    }
+  );
+}
+
+// src/blocks/FormulaBlock.tsx
+import { useCallback as useCallback3, useEffect as useEffect5, useRef as useRef5, useState as useState5 } from "react";
+import { MAX_FORMULA_LENGTH } from "@inkbrick/document";
+
+// src/formula/LazyFormulaPalette.tsx
+import { useEffect as useEffect3, useState as useState3 } from "react";
+import { jsx as jsx15 } from "react/jsx-runtime";
+var loaded;
+var loading;
+function preloadFormulaPalette() {
+  return loading ??= import("./FormulaPalette-WFRPRHS5.js").then(
+    (module) => loaded = module.FormulaPalette
+  );
+}
+function LazyFormulaPalette(props) {
+  const [Palette, setPalette] = useState3(() => loaded);
+  useEffect3(() => {
+    if (Palette) return;
+    let active = true;
+    void preloadFormulaPalette().then((component) => {
+      if (active) setPalette(() => component);
+    });
+    return () => {
+      active = false;
+    };
+  }, [Palette]);
+  return Palette ? /* @__PURE__ */ jsx15(Palette, { ...props }) : null;
+}
+
+// src/math/FormulaView.tsx
+import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
+import { Fragment, jsx as jsx16, jsxs as jsxs6 } from "react/jsx-runtime";
+function FormulaView({
+  latex,
+  display = false,
+  showError = false,
+  onSettled
+}) {
+  const { formulaRenderer } = useEditorUI();
+  const ref = useRef4(null);
+  const [error, setError] = useState4(null);
+  const Tag = display ? "div" : "span";
+  useEffect4(() => {
+    const target = ref.current;
+    if (!target) return;
+    ensureMathStyles(globalThis.document);
+    setError(null);
+    return mountFormula(target, latex, {
+      display,
+      renderer: formulaRenderer,
+      onSettled: (state, message) => {
+        setError(state === "error" ? message ?? "" : null);
+        onSettled?.(state, message);
+      }
+    });
+  }, [latex, display, formulaRenderer, onSettled]);
+  return /* @__PURE__ */ jsxs6(Fragment, { children: [
+    /* @__PURE__ */ jsx16(
+      Tag,
+      {
+        ref: (node) => {
+          ref.current = node;
+        },
+        "data-inkbrick-part": "formula-render",
+        "data-display": display || void 0
+      }
+    ),
+    showError && error !== null && /* @__PURE__ */ jsx16("span", { "data-inkbrick-part": "formula-error", role: "alert", children: error })
+  ] });
+}
+
+// src/blocks/FormulaBlock.tsx
+import { jsx as jsx17, jsxs as jsxs7 } from "react/jsx-runtime";
+function FormulaBlock({ block: block2, editor, selected, readOnly }) {
+  const t = useT();
+  const latex = typeof block2.props.latex === "string" ? block2.props.latex : "";
+  const [editing, setEditing] = useState5(latex === "" && !readOnly);
+  const [draft, setDraft] = useState5(latex);
+  const [error, setError] = useState5(null);
+  const field = useRef5(null);
+  const container = useRef5(null);
+  const insertSnippet = useSnippetInsert(field, draft, setDraft);
+  const cancelled = useRef5(false);
+  const born = useRef5(Date.now());
+  useEffect5(() => {
+    if (!editing) setDraft(latex);
+  }, [latex, editing]);
+  useEffect5(() => {
+    if (!editing) return;
+    cancelled.current = false;
+    born.current = Date.now();
+    field.current?.focus();
+    const timer = setTimeout(() => {
+      if (Date.now() - born.current < 300) field.current?.focus();
+    }, 0);
+    return () => clearTimeout(timer);
+  }, [editing]);
+  useEffect5(() => {
+    if (readOnly) setEditing(false);
+  }, [readOnly]);
+  const settle = useCallback3((state, message) => {
+    setError(state === "error" ? message ?? "" : null);
+  }, []);
+  const commit = () => {
+    if (cancelled.current) {
+      cancelled.current = false;
+      return;
+    }
+    if (latex === "" && draft === "" && Date.now() - born.current < 300) {
+      setTimeout(() => field.current?.focus(), 0);
+      return;
+    }
+    if (draft !== latex) {
+      editor.dispatch({
+        type: "setBlockProps",
+        payload: { blockId: block2.id, props: { latex: draft } }
+      });
+    }
+    setEditing(false);
+  };
+  const cancel = () => {
+    cancelled.current = true;
+    setDraft(latex);
+    setEditing(false);
+  };
+  return /* @__PURE__ */ jsx17(
+    "div",
+    {
+      className: "block block-formula",
+      "data-inkbrick-block": "formula",
+      "data-block-id": block2.id,
+      "data-selected": selected || void 0,
+      contentEditable: false,
+      children: editing ? /* @__PURE__ */ jsxs7(
+        "div",
+        {
+          ref: container,
+          className: "formula-editor",
+          "data-inkbrick-part": "formula-editor",
+          onBlur: (event) => {
+            if (event.relatedTarget instanceof Node && container.current?.contains(event.relatedTarget))
+              return;
+            commit();
+          },
+          children: [
+            /* @__PURE__ */ jsx17(
+              "textarea",
+              {
+                ref: field,
+                className: "formula-source",
+                "data-inkbrick-part": "formula-source",
+                "aria-label": t("formula.source"),
+                "aria-invalid": error !== null || void 0,
+                placeholder: t("formula.placeholder"),
+                spellCheck: false,
+                rows: Math.min(8, Math.max(2, draft.split("\n").length)),
+                maxLength: MAX_FORMULA_LENGTH,
+                value: draft,
+                onChange: (event) => setDraft(event.target.value),
+                onKeyDown: (event) => {
+                  if (event.key === "Escape") {
+                    event.preventDefault();
+                    cancel();
+                    event.target.blur();
+                  } else if (event.key === "Enter" && (event.ctrlKey || event.metaKey)) {
+                    event.preventDefault();
+                    event.target.blur();
+                  }
+                }
+              }
+            ),
+            /* @__PURE__ */ jsx17("div", { className: "formula-preview", "data-inkbrick-part": "formula-preview", children: /* @__PURE__ */ jsx17(FormulaView, { latex: draft, display: true, showError: true, onSettled: settle }) }),
+            /* @__PURE__ */ jsx17(LazyFormulaPalette, { onInsert: insertSnippet }),
+            /* @__PURE__ */ jsx17("div", { className: "formula-hint", "data-inkbrick-part": "formula-hint", children: t("formula.hint") })
+          ]
+        }
+      ) : latex === "" ? /* @__PURE__ */ jsx17(
+        "button",
+        {
+          type: "button",
+          className: "formula-empty",
+          "data-inkbrick-part": "formula-empty",
+          disabled: readOnly,
+          onClick: () => setEditing(true),
+          children: t("formula.empty")
+        }
+      ) : /* @__PURE__ */ jsx17(
+        "div",
+        {
+          className: "formula-display",
+          "data-inkbrick-part": "formula-display",
+          role: readOnly ? void 0 : "button",
+          tabIndex: readOnly ? void 0 : 0,
+          "aria-label": readOnly ? void 0 : t("formula.edit"),
+          title: readOnly ? void 0 : t("formula.edit"),
+          onClick: () => !readOnly && setEditing(true),
+          onKeyDown: (event) => {
+            if (!readOnly && (event.key === "Enter" || event.key === " ")) {
+              event.preventDefault();
+              setEditing(true);
+            }
+          },
+          children: /* @__PURE__ */ jsx17(FormulaView, { latex, display: true, showError: true })
+        }
+      )
+    }
+  );
+}
+
+// src/registry/defaultBlockComponents.ts
+var defaultBlockComponents = Object.freeze({
+  "block:page": PageBlock,
+  "block:note": NoteBlock,
+  "block:paragraph": ParagraphBlock,
+  "block:heading": HeadingBlock,
+  "block:list": ListBlock,
+  "block:quote": QuoteBlock,
+  "block:code": CodeBlock,
+  "block:divider": DividerBlock,
+  "block:callout": CalloutBlock,
+  "block:image": ImageBlock,
+  "block:formula": FormulaBlock
+});
+
+// src/registry/resolveBlockComponent.ts
+function lookup(registry, flavour) {
+  return Object.hasOwn(registry, flavour) ? registry[flavour] : void 0;
+}
+function resolveBlockComponent(flavour, custom) {
+  return lookup(custom, flavour) ?? lookup(defaultBlockComponents, flavour);
+}
+
+// src/renderer/BlockRenderer.tsx
+import { jsx as jsx18 } from "react/jsx-runtime";
+var warned = /* @__PURE__ */ new Set();
+var BlockRenderer = memo(function BlockRenderer2({ id }) {
+  const editor = useEditor();
+  const view = useEditorView();
+  const readOnly = useReadOnly();
+  const { components, slots } = useEditorUI();
+  const selected = useSyncExternalStore7(
+    view.selection.subscribe,
+    () => view.selection.isSelected(id),
+    () => false
+  );
+  const block2 = useBlock(id);
+  if (!block2) {
+    return null;
+  }
+  const Component = resolveBlockComponent(block2.flavour, components);
+  if (Component) {
+    return /* @__PURE__ */ jsx18(
+      Component,
+      {
+        block: block2,
+        editor,
+        selected,
+        readOnly,
+        controller: editor.controllers.get(block2.flavour)
+      }
+    );
+  }
+  if (!warned.has(block2.flavour)) {
+    warned.add(block2.flavour);
+    console.warn(`[@inkbrick/react] No component registered for block "${block2.flavour}"`);
+  }
+  const Fallback = slots.UnknownBlock ?? UnknownBlockView;
+  return /* @__PURE__ */ jsx18(Fallback, { block: block2, editor, selected, readOnly, children: /* @__PURE__ */ jsx18(BlockChildren, { id: block2.id }) });
+});
+
+// src/renderer/DocumentRenderer.tsx
+import { Fragment as Fragment2, jsx as jsx19 } from "react/jsx-runtime";
+function FullChildList({ ids }) {
+  return /* @__PURE__ */ jsx19(Fragment2, { children: ids.map((id) => /* @__PURE__ */ jsx19(BlockRenderer, { id }, id)) });
+}
+var fullRenderer = { ChildList: FullChildList };
+var DocumentRendererContext = createContext2(fullRenderer);
+
+// src/blocks/BlockChildren.tsx
+import { jsx as jsx20 } from "react/jsx-runtime";
+function BlockChildren({ id }) {
+  const children = useChildren(id);
+  const { ChildList } = useContext3(DocumentRendererContext);
+  return /* @__PURE__ */ jsx20(ChildList, { parentId: id, ids: children });
+}
+
+// src/renderer/DocumentView.tsx
+import { useEffect as useEffect16, useLayoutEffect as useLayoutEffect8, useRef as useRef12 } from "react";
+
+// src/block-handle/BlockHandleHost.tsx
+import { useEffect as useEffect7, useRef as useRef7, useSyncExternalStore as useSyncExternalStore9 } from "react";
+import { createPortal } from "react-dom";
+
+// src/block-handle/actions.tsx
+import { flushSync as flushSync3 } from "react-dom";
+
+// src/slash/syncSlashMenu.ts
+function caretPosition(view, blockId) {
+  const selection = globalThis.getSelection();
+  const range = selection && selection.rangeCount > 0 ? selection.getRangeAt(0) : null;
+  const rect = range?.getClientRects()[0];
+  if (rect && (rect.width > 0 || rect.height > 0)) return { x: rect.left, y: rect.bottom };
+  const element = view.getElement(blockId);
+  if (!element) return null;
+  const box = element.getBoundingClientRect();
+  return { x: box.left, y: box.bottom };
+}
+function syncSlashMenu(editor, view, items) {
+  const state = view.slash.getState();
+  if (!state.open || !state.blockId) return;
+  const root = view.getRoot();
+  const selection = root ? readDocSelection(root) : null;
+  const block2 = editor.store.getBlock(state.blockId);
+  const text = block2 ? editor.engine.inline.toPlainText(block2.content) : "";
+  if (!selection || !selection.collapsed || selection.from.blockId !== state.blockId || selection.from.offset <= state.slashOffset || text[state.slashOffset] !== "/") {
+    view.slash.close();
+    return;
+  }
+  const query = text.slice(state.slashOffset + 1, selection.from.offset);
+  const visible = visibleSlashItems(editor, items, state.blockId, query);
+  if (visible.length === 0 && /\s$/.test(query)) {
+    view.slash.close();
+    return;
+  }
+  view.slash.update({
+    query,
+    activeIndex: query !== state.query ? 0 : Math.min(state.activeIndex, Math.max(visible.length - 1, 0)),
+    position: caretPosition(view, state.blockId)
+  });
+}
+
+// src/block-handle/actions.tsx
+import { jsx as jsx21 } from "react/jsx-runtime";
+var isCaret = (value) => typeof value === "object" && value !== null && "blockId" in value && "offset" in value;
+function performBlockAction(view, action) {
+  let result;
+  flushSync3(() => {
+    result = action();
+  });
+  view.blocks.closeMenu();
+  if (isCaret(result) && view.getElement(result.blockId)) {
+    view.placeCaret(result.blockId, result.offset);
+  } else {
+    view.getRoot()?.focus({ preventScroll: true });
+  }
+}
+function buildBlockActions(editor, view, blockId, slashItems, t) {
+  const previous = editor.document.getPreviousSibling(blockId);
+  const next = editor.document.getNextSibling(blockId);
+  const perform = (fn) => () => performBlockAction(view, fn);
+  const moveUp = previous && { blockId, targetId: previous.id, position: "before" };
+  const moveDown = next && { blockId, targetId: next.id, position: "after" };
+  const block2 = editor.store.getBlock(blockId);
+  const controller = block2 && editor.controllers.get(block2.flavour);
+  const own = (controller?.menuItems ?? []).map((item) => {
+    const context = editor.controllers.contextOf(block2);
+    return {
+      id: item.id,
+      title: item.title,
+      icon: iconByName(item.icon),
+      danger: item.danger,
+      disabled: item.isDisabled ? item.isDisabled(context) : context.readOnly,
+      run: perform(() => item.run(context))
+    };
+  });
+  const actions = [
+    ...own,
+    {
+      id: "duplicate",
+      title: t("menu.duplicate"),
+      icon: /* @__PURE__ */ jsx21(Icon, { name: "copy" }),
+      disabled: !editor.can("duplicateBlock", { blockId }),
+      run: perform(() => editor.dispatch({ type: "duplicateBlock", payload: { blockId } }))
+    },
+    {
+      id: "move-up",
+      title: t("menu.moveUp"),
+      icon: /* @__PURE__ */ jsx21(Icon, { name: "arrow-up" }),
+      disabled: !moveUp || !editor.can("moveBlock", moveUp),
+      run: perform(() => moveUp && editor.dispatch({ type: "moveBlock", payload: moveUp }))
+    },
+    {
+      id: "move-down",
+      title: t("menu.moveDown"),
+      icon: /* @__PURE__ */ jsx21(Icon, { name: "arrow-down" }),
+      disabled: !moveDown || !editor.can("moveBlock", moveDown),
+      run: perform(() => moveDown && editor.dispatch({ type: "moveBlock", payload: moveDown }))
+    },
+    {
+      id: "delete",
+      title: t("menu.delete"),
+      icon: /* @__PURE__ */ jsx21(Icon, { name: "trash" }),
+      danger: true,
+      run: perform(() => editor.execute("delete-block", { id: blockId }))
+    }
+  ];
+  const turnInto = availableSlashItems(editor, slashItems, blockId).filter(
+    (item) => editor.can("convertBlock", { blockId, flavour: item.flavour, props: item.props })
+  ).map((item) => ({
+    id: item.id,
+    title: item.title,
+    icon: item.icon,
+    run: perform(
+      () => editor.dispatch({
+        type: "convertBlock",
+        payload: { blockId, flavour: item.flavour, props: item.props }
+      })
+    )
+  }));
+  return { actions, turnInto };
+}
+function addBlockBelow(editor, view, blockId, slashItems) {
+  const block2 = editor.store.getBlock(blockId);
+  const parent = block2?.parentId ? editor.store.getBlock(block2.parentId) : void 0;
+  if (!block2 || !parent) return;
+  const nested = parent.flavour !== "block:note";
+  const payload = {
+    flavour: nested ? block2.flavour : "block:paragraph",
+    afterId: blockId,
+    props: nested ? block2.props : void 0,
+    content: [{ insert: "/" }]
+  };
+  let caret;
+  flushSync3(() => {
+    caret = editor.dispatch({ type: "insertBlock", payload });
+  });
+  view.blocks.setHover(null);
+  if (!caret) return;
+  view.placeCaret(caret.blockId, 1);
+  view.slash.open(caret.blockId, 0);
+  syncSlashMenu(editor, view, slashItems);
+}
+
+// src/block-handle/DefaultBlockHandle.tsx
+import { jsx as jsx22, jsxs as jsxs8 } from "react/jsx-runtime";
+var HANDLE_WIDTH = 52;
+function DefaultBlockHandle({
+  blockId,
+  position,
+  canAdd,
+  dragging,
+  menuOpen,
+  onAdd,
+  onOpenMenu,
+  gripProps
+}) {
+  const t = useT();
+  const left = position.x - HANDLE_WIDTH;
+  return /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      className: "inkbrick-block-handle",
+      "data-inkbrick-ui": "block-handle",
+      "data-testid": "block-handle",
+      "data-block": blockId,
+      "data-inkbrick-block-ui": true,
+      "data-compact": left < 2 || void 0,
+      style: {
+        left: Math.max(2, left),
+        top: position.y,
+        pointerEvents: dragging ? "none" : void 0
+      },
+      onMouseDown: (event) => event.preventDefault(),
+      children: [
+        /* @__PURE__ */ jsx22(
+          "button",
+          {
+            type: "button",
+            className: "inkbrick-block-handle__button",
+            "data-inkbrick-part": "button",
+            "aria-label": t("handle.add"),
+            title: t("handle.add"),
+            "data-action": "add",
+            disabled: !canAdd,
+            onClick: onAdd,
+            children: /* @__PURE__ */ jsx22(Icon, { name: "plus" })
+          }
+        ),
+        /* @__PURE__ */ jsx22(
+          "button",
+          {
+            type: "button",
+            className: "inkbrick-block-handle__button inkbrick-block-handle__grip",
+            "data-inkbrick-part": "grip",
+            "data-active": menuOpen || void 0,
+            "aria-label": t("handle.grip"),
+            title: t("handle.grip"),
+            "aria-haspopup": "menu",
+            "aria-expanded": menuOpen,
+            "data-action": "grip",
+            ...gripProps,
+            onKeyDown: (event) => {
+              if (event.key === "Enter" || event.key === " ") {
+                event.preventDefault();
+                onOpenMenu();
+              }
+            },
+            children: /* @__PURE__ */ jsx22(Icon, { name: "grip" })
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/block-handle/DefaultBlockMenu.tsx
+import { useEffect as useEffect6, useLayoutEffect as useLayoutEffect3, useRef as useRef6, useState as useState6 } from "react";
+import { Fragment as Fragment3, jsx as jsx23, jsxs as jsxs9 } from "react/jsx-runtime";
+function DefaultBlockMenu({ position, actions, turnInto, onClose }) {
+  const t = useT();
+  const ref = useRef6(null);
+  const [flip, setFlip] = useState6(false);
+  const entries = [...actions, ...turnInto].filter((entry) => !entry.disabled);
+  useEffect6(() => {
+    ref.current?.querySelector('[role="menuitem"]:not([aria-disabled="true"])')?.focus();
+  }, []);
+  useLayoutEffect3(() => {
+    const menu = ref.current;
+    if (menu)
+      setFlip(
+        position.y + menu.offsetHeight > window.innerHeight && position.y - menu.offsetHeight > 0
+      );
+  }, [position.y]);
+  const move = (delta) => {
+    const items = [
+      ...ref.current?.querySelectorAll(
+        '[role="menuitem"]:not([aria-disabled="true"])'
+      ) ?? []
+    ];
+    const index = items.indexOf(document.activeElement);
+    items[(index + delta + items.length) % items.length]?.focus();
+  };
+  const renderItem = (action) => /* @__PURE__ */ jsxs9(
+    "div",
+    {
+      role: "menuitem",
+      tabIndex: action.disabled ? -1 : 0,
+      "aria-disabled": action.disabled || void 0,
+      "data-action": action.id,
+      "data-inkbrick-part": "item",
+      "data-disabled": action.disabled || void 0,
+      "data-danger": action.danger || void 0,
+      className: `inkbrick-block-menu__item${action.danger ? " inkbrick-block-menu__item--danger" : ""}`,
+      onClick: () => !action.disabled && action.run(),
+      onKeyDown: (event) => {
+        if (event.key === "Enter" || event.key === " ") {
+          event.preventDefault();
+          if (!action.disabled) action.run();
+        }
+      },
+      children: [
+        action.icon !== void 0 && /* @__PURE__ */ jsx23("span", { className: "inkbrick-block-menu__icon", "data-inkbrick-part": "icon", children: action.icon }),
+        action.title
+      ]
+    },
+    action.id
+  );
+  return /* @__PURE__ */ jsxs9(
+    "div",
+    {
+      ref,
+      className: "inkbrick-block-menu",
+      "data-inkbrick-ui": "block-menu",
+      role: "menu",
+      "aria-label": t("menu.label"),
+      "data-testid": "block-menu",
+      "data-inkbrick-block-ui": true,
+      style: {
+        left: Math.max(
+          8,
+          Math.min(position.x, window.innerWidth - (ref.current?.offsetWidth ?? 232) - 8)
+        ),
+        top: flip ? Math.max(8, position.y - (ref.current?.offsetHeight ?? 0) - 32) : position.y
+      },
+      onKeyDown: (event) => {
+        if (event.key === "ArrowDown") {
+          event.preventDefault();
+          move(1);
+        } else if (event.key === "ArrowUp") {
+          event.preventDefault();
+          move(-1);
+        } else if (event.key === "Escape") {
+          event.preventDefault();
+          onClose();
+        }
+      },
+      children: [
+        actions.map(renderItem),
+        turnInto.length > 0 && /* @__PURE__ */ jsxs9(Fragment3, { children: [
+          /* @__PURE__ */ jsx23("div", { className: "inkbrick-block-menu__label", "data-inkbrick-part": "label", role: "separator", children: t("menu.turnInto") }),
+          turnInto.map(renderItem)
+        ] }),
+        entries.length === 0 && /* @__PURE__ */ jsx23("div", { className: "inkbrick-block-menu__label", "data-inkbrick-part": "label", children: t("menu.empty") })
+      ]
+    }
+  );
+}
+
+// src/block-handle/gripGesture.ts
+var DRAG_THRESHOLD = 5;
+var LONG_PRESS_MS = 350;
+var TOUCH_SLOP = 10;
+function startGripGesture(drag, blockId, event, { onTap }) {
+  const touch = event.pointerType === "touch" || event.pointerType === "pen";
+  const pointerId = event.pointerId;
+  const startX = event.clientX;
+  const startY = event.clientY;
+  let dragging = false;
+  let aborted = false;
+  let timer;
+  const begin = () => {
+    if (dragging || aborted) return;
+    dragging = true;
+    drag.start(blockId);
+    if (touch) navigator.vibrate?.(10);
+  };
+  const finish = () => {
+    clearTimeout(timer);
+    document.removeEventListener("pointermove", onMove);
+    document.removeEventListener("pointerup", onUp);
+    document.removeEventListener("pointercancel", onCancel);
+    document.removeEventListener("keydown", onKey);
+  };
+  const onMove = (move) => {
+    if (move.pointerId !== pointerId) return;
+    const distance = Math.hypot(move.clientX - startX, move.clientY - startY);
+    if (!dragging) {
+      if (touch) {
+        if (distance > TOUCH_SLOP) {
+          aborted = true;
+          finish();
+        }
+        return;
+      }
+      if (distance > DRAG_THRESHOLD) begin();
+    }
+    if (dragging) {
+      move.preventDefault();
+      drag.update(move.clientX, move.clientY);
+    }
+  };
+  const onUp = (up) => {
+    if (up.pointerId !== pointerId) return;
+    finish();
+    if (dragging) drag.drop();
+    else if (!aborted) onTap();
+  };
+  const onCancel = (cancel) => {
+    if (cancel.pointerId !== pointerId) return;
+    abort();
+  };
+  const onKey = (key) => {
+    if (key.key === "Escape") abort();
+  };
+  const abort = () => {
+    aborted = true;
+    finish();
+    if (dragging) drag.cancel();
+  };
+  if (touch) timer = setTimeout(begin, LONG_PRESS_MS);
+  document.addEventListener("pointermove", onMove, { passive: false });
+  document.addEventListener("pointerup", onUp);
+  document.addEventListener("pointercancel", onCancel);
+  document.addEventListener("keydown", onKey);
+  return abort;
+}
+
+// src/block-handle/useBlockDrag.ts
+import { useSyncExternalStore as useSyncExternalStore8 } from "react";
+
+// src/block-handle/blockDrag.ts
+import { flushSync as flushSync4 } from "react-dom";
+
+// src/block-handle/geometry.ts
+var GUTTER = 72;
+function hasHandle(editor, blockId) {
+  const block2 = editor.store.getBlock(blockId);
+  const parent = block2?.parentId ? editor.store.getBlock(block2.parentId) : void 0;
+  return !!parent?.parentId;
+}
+function blockElement(view, blockId) {
+  return view.getRoot()?.querySelector(`[data-block-id="${CSS.escape(blockId)}"]`) ?? null;
+}
+function blockAtPoint(editor, view, x, y) {
+  const root = view.getRoot();
+  const hit = root ? document.elementFromPoint(x, y) : null;
+  if (!root || !hit || !root.contains(hit)) return null;
+  let node = hit.closest("[data-block-id]");
+  while (node && root.contains(node)) {
+    const id = node.getAttribute("data-block-id");
+    if (hasHandle(editor, id)) return id;
+    node = node.parentElement?.closest("[data-block-id]") ?? null;
+  }
+  return null;
+}
+function probePoint(view, x, y) {
+  const root = view.getRoot();
+  if (!root) return null;
+  const rect = root.getBoundingClientRect();
+  if (x < rect.left - GUTTER || x > rect.right || y < rect.top || y > rect.bottom) return null;
+  return { x: Math.min(Math.max(x, rect.left + 12), rect.right - 12), y };
+}
+function rowRect(view, blockId) {
+  return (view.getElement(blockId) ?? blockElement(view, blockId))?.getBoundingClientRect() ?? null;
+}
+
+// src/block-handle/blockDrag.ts
+var EDGE = 56;
+var cache2 = /* @__PURE__ */ new WeakMap();
+function getBlockDrag(editor, view) {
+  let api = cache2.get(view);
+  if (!api) {
+    api = createBlockDrag(editor, view);
+    cache2.set(view, api);
+  }
+  return api;
+}
+function createBlockDrag(editor, view) {
+  const controller = view.blocks;
+  const markBody = (on) => {
+    if (typeof document === "undefined") return;
+    document.body.classList.toggle("inkbrick-dragging", on);
+    if (on) document.body.setAttribute("data-inkbrick-dragging", "");
+    else document.body.removeAttribute("data-inkbrick-dragging");
+  };
+  const canMove = (blockId, targetId, position) => blockId !== targetId && editor.can("moveBlock", { blockId, targetId, position });
+  const blockRects = (blockId) => {
+    const wrapper = blockElement(view, blockId);
+    const row = rowRect(view, blockId);
+    return wrapper && row ? { row, box: wrapper.getBoundingClientRect() } : null;
+  };
+  const api = {
+    blockAtPoint(x, y) {
+      const probe = probePoint(view, x, y);
+      return probe ? blockAtPoint(editor, view, probe.x, probe.y) : null;
+    },
+    blockRects,
+    canMove,
+    dropTargetAt(blockId, x, y) {
+      const targetId = api.blockAtPoint(x, y);
+      const rects = targetId ? blockRects(targetId) : null;
+      if (!targetId || !rects) return null;
+      const { row, box } = rects;
+      const position = y < row.top + row.height / 2 ? "before" : "after";
+      if (!canMove(blockId, targetId, position)) return null;
+      return {
+        targetId,
+        position,
+        // «После» — после всего поддерева цели (вместе с вложенными блоками).
+        indicator: {
+          left: box.left,
+          width: box.width,
+          top: position === "before" ? row.top - 1 : box.bottom + 1
+        }
+      };
+    },
+    start(blockId) {
+      controller.startDrag(blockId);
+      markBody(true);
+    },
+    setTarget(target) {
+      const drag = controller.getState().drag;
+      if (!drag) return;
+      if (!target || !canMove(drag.blockId, target.targetId, target.position)) {
+        controller.updateDrag({ targetId: null, position: null, indicator: null });
+        return;
+      }
+      controller.updateDrag({
+        targetId: target.targetId,
+        position: target.position,
+        indicator: target.indicator
+      });
+    },
+    update(x, y) {
+      const drag = controller.getState().drag;
+      if (!drag) return null;
+      api.autoScroll(y);
+      const target = api.dropTargetAt(drag.blockId, x, y);
+      api.setTarget(target);
+      return target;
+    },
+    drop() {
+      const drag = controller.getState().drag;
+      controller.endDrag();
+      markBody(false);
+      if (!drag?.targetId || !drag.position) return false;
+      return api.move(drag.blockId, drag.targetId, drag.position);
+    },
+    cancel() {
+      controller.endDrag();
+      markBody(false);
+    },
+    move(blockId, targetId, position) {
+      if (!canMove(blockId, targetId, position)) return false;
+      const payload = { blockId, targetId, position };
+      flushSync4(() => {
+        editor.dispatch({ type: "moveBlock", payload });
+      });
+      controller.setHover(null);
+      return true;
+    },
+    autoScroll(clientY) {
+      if (typeof window === "undefined") return;
+      if (clientY < EDGE) window.scrollBy(0, -14);
+      else if (clientY > window.innerHeight - EDGE) window.scrollBy(0, 14);
+    },
+    getState: () => controller.getState().drag,
+    subscribe: (listener) => {
+      let last = controller.getState().drag;
+      return controller.subscribe(() => {
+        const next = controller.getState().drag;
+        if (next !== last) {
+          last = next;
+          listener();
+        }
+      });
+    }
+  };
+  return api;
+}
+
+// src/block-handle/useBlockDrag.ts
+function useBlockDrag() {
+  return getBlockDrag(useEditor(), useEditorView());
+}
+function useBlockDragState() {
+  const drag = useBlockDrag();
+  return useSyncExternalStore8(drag.subscribe, drag.getState, drag.getState);
+}
+
+// src/block-handle/BlockHandleHost.tsx
+import { Fragment as Fragment4, jsx as jsx24, jsxs as jsxs10 } from "react/jsx-runtime";
+var GRIP_STYLE = Object.freeze({ touchAction: "none" });
+function BlockHandleHost() {
+  const editor = useEditor();
+  const view = useEditorView();
+  const drag = useBlockDrag();
+  const { slots, slashItems, t } = useEditorUI();
+  const readOnly = useReadOnly();
+  const state = useSyncExternalStore9(
+    view.blocks.subscribe,
+    view.blocks.getState,
+    view.blocks.getState
+  );
+  const cleanup = useRef7(null);
+  useEffect7(() => () => cleanup.current?.(), []);
+  if (slots.BlockHandle === null || readOnly || typeof document === "undefined") return null;
+  const { hover, menu } = state;
+  const dragging = state.drag;
+  const openMenuFor = (blockId) => {
+    const anchor = view.blocks.getState().hover ?? hover;
+    if (anchor) view.blocks.openMenu({ blockId, x: anchor.x, y: anchor.y + 30 });
+  };
+  const gripPropsFor = (blockId) => ({
+    onPointerDown: (event) => {
+      if (event.button !== 0) return;
+      event.preventDefault();
+      cleanup.current?.();
+      const anchor = hover;
+      const cancel = startGripGesture(drag, blockId, event.nativeEvent, {
+        onTap: () => {
+          cleanup.current = null;
+          if (anchor) view.blocks.openMenu({ blockId, x: anchor.x, y: anchor.y + 30 });
+        }
+      });
+      cleanup.current = cancel;
+    },
+    onContextMenu: (event) => event.preventDefault(),
+    style: GRIP_STYLE,
+    "data-inkbrick-grip": ""
+  });
+  const Handle = slots.BlockHandle ?? DefaultBlockHandle;
+  const Menu = slots.BlockMenu ?? DefaultBlockMenu;
+  const activeId = dragging?.blockId ?? hover?.blockId;
+  const menuBlock = menu ? editor.store.getBlock(menu.blockId) : void 0;
+  const menuContent = menu && menuBlock ? buildBlockActions(editor, view, menu.blockId, slashItems, t) : null;
+  return createPortal(
+    /* @__PURE__ */ jsxs10(Fragment4, { children: [
+      hover && activeId && /* @__PURE__ */ jsx24(
+        Handle,
+        {
+          blockId: activeId,
+          position: { x: hover.x, y: hover.y },
+          canAdd: editor.can("insertBlock", { flavour: "block:paragraph", afterId: activeId }),
+          dragging: !!dragging,
+          menuOpen: !!menu,
+          onAdd: () => addBlockBelow(editor, view, activeId, slashItems),
+          onOpenMenu: () => openMenuFor(activeId),
+          gripProps: gripPropsFor(activeId)
+        }
+      ),
+      menu && menuBlock && menuContent && /* @__PURE__ */ jsx24(
+        Menu,
+        {
+          block: menuBlock,
+          position: { x: menu.x, y: menu.y },
+          actions: menuContent.actions,
+          turnInto: menuContent.turnInto,
+          onClose: () => {
+            view.blocks.closeMenu();
+            view.getRoot()?.focus({ preventScroll: true });
+          }
+        }
+      )
+    ] }),
+    document.body
+  );
+}
+
+// src/block-handle/DropIndicatorHost.tsx
+import { useEffect as useEffect8 } from "react";
+import { createPortal as createPortal2 } from "react-dom";
+import { jsx as jsx25 } from "react/jsx-runtime";
+function DefaultDropIndicator({ indicator, position }) {
+  return /* @__PURE__ */ jsx25(
+    "div",
+    {
+      className: "inkbrick-drop-indicator",
+      "data-inkbrick-ui": "drop-indicator",
+      "data-testid": "drop-indicator",
+      "data-position": position,
+      style: { left: indicator.left, top: indicator.top, width: indicator.width }
+    }
+  );
+}
+function DropIndicatorHost() {
+  const view = useEditorView();
+  const { slots } = useEditorUI();
+  const readOnly = useReadOnly();
+  const drag = useBlockDragState();
+  const draggedId = drag?.blockId;
+  useEffect8(() => {
+    if (!draggedId) return;
+    const element = blockElement(view, draggedId);
+    element?.setAttribute("data-inkbrick-dragging", "true");
+    return () => element?.removeAttribute("data-inkbrick-dragging");
+  }, [draggedId, view]);
+  if (readOnly || slots.DropIndicator === null || typeof document === "undefined") return null;
+  if (!drag?.indicator || !drag.targetId || !drag.position) return null;
+  const Indicator = slots.DropIndicator ?? DefaultDropIndicator;
+  return createPortal2(
+    /* @__PURE__ */ jsx25(
+      Indicator,
+      {
+        blockId: drag.blockId,
+        targetId: drag.targetId,
+        position: drag.position,
+        indicator: drag.indicator
+      }
+    ),
+    document.body
+  );
+}
+
+// src/clipboard/useClipboard.ts
+import { useEffect as useEffect9 } from "react";
+import { normalizeLinkUrl as normalizeLinkUrl2 } from "@inkbrick/document";
+import {
+  FRAGMENT_MIME,
+  fragmentToHtml,
+  fragmentToPlainText,
+  sanitizeFragment as sanitizeFragment2
+} from "@inkbrick/engine";
+
+// src/editing/inputActions.ts
+import { flushSync as flushSync5 } from "react-dom";
+function createInputActions(editor, view, root, slashItems) {
+  const exec = (intent) => editor.dispatch(intent);
+  const run = (action) => {
+    let caret;
+    flushSync5(() => {
+      caret = action();
+    });
+    if (caret) view.placeCaret(caret.blockId, caret.offset);
+    syncSlash();
+  };
+  const syncSlash = () => syncSlashMenu(editor, view, slashItems);
+  const blockText = (blockId) => {
+    const block2 = editor.store.getBlock(blockId);
+    return block2 ? editor.engine.inline.toPlainText(block2.content) : "";
+  };
+  const isSingleBlock = (selection) => selection.from.blockId === selection.to.blockId;
+  const deleteSelection = (selection) => isSingleBlock(selection) ? exec({
+    type: "deleteText",
+    payload: {
+      blockId: selection.from.blockId,
+      from: selection.from.offset,
+      to: selection.to.offset
+    }
+  }) : exec({
+    type: "deleteRange",
+    payload: { from: selection.from, to: selection.to }
+  });
+  const insertAt = (blockId, offset, text) => exec({
+    type: "replaceText",
+    payload: { blockId, from: offset, to: offset, text }
+  });
+  const replaceSelection = (selection, text) => {
+    if (selection.collapsed) {
+      return insertAt(selection.from.blockId, selection.from.offset, text);
+    }
+    return editor.batch(() => {
+      const caret = deleteSelection(selection);
+      return caret ? insertAt(caret.blockId, caret.offset, text) : void 0;
+    });
+  };
+  const toggleFormat = (format) => {
+    const selection = readDocSelection(root);
+    if (selection) toggleFormatInSelection(editor, view, selection, format);
+  };
+  const undo = () => run(() => editor.undo()?.caret);
+  const redo = () => run(() => editor.redo()?.caret);
+  return {
+    exec,
+    run,
+    syncSlash,
+    blockText,
+    deleteSelection,
+    insertAt,
+    replaceSelection,
+    toggleFormat,
+    undo,
+    redo
+  };
+}
+
+// src/clipboard/useClipboard.ts
+var URL_ONLY = /^(https?:\/\/|mailto:)\S+$/i;
+function isForeignControl(_target) {
+  const active = document.activeElement;
+  return active instanceof Element && active.closest("input, textarea, select, [data-inkbrick-ignore-input]") !== null;
+}
+function parseJson(text) {
+  try {
+    return JSON.parse(text);
+  } catch {
+    return null;
+  }
+}
+function useClipboard(ref, readOnly) {
+  const editor = useEditor();
+  const view = useEditorView();
+  const { images, slashItems } = useEditorUI();
+  useEffect9(() => {
+    const root = ref.current;
+    if (!root) return;
+    let plainNext = false;
+    let plainTimer;
+    const { exec, run, deleteSelection, insertAt } = createInputActions(
+      editor,
+      view,
+      root,
+      slashItems
+    );
+    const writeSelection = (event, cut) => {
+      if (isForeignControl(event.target)) return;
+      const selection = readDocSelection(root);
+      if (!selection || selection.collapsed || !event.clipboardData) return;
+      const fragment = editor.copyFragment(selection.from, selection.to);
+      if (fragment.blocks.length === 0) return;
+      const json = JSON.stringify(fragment);
+      event.clipboardData.setData("text/plain", fragmentToPlainText(fragment));
+      event.clipboardData.setData("text/html", fragmentToHtml(fragment, encodeURIComponent(json)));
+      event.clipboardData.setData(FRAGMENT_MIME, json);
+      event.preventDefault();
+      if (cut && !readOnly) run(() => editor.batch(() => deleteSelection(selection)));
+    };
+    const pastePlain = (text, selection) => {
+      const trimmed = text.trim();
+      if (!selection.collapsed && selection.from.blockId === selection.to.blockId && URL_ONLY.test(trimmed) && normalizeLinkUrl2(trimmed) && editor.store.getBlock(selection.from.blockId)?.flavour !== "block:code" && setLinkInSelection(editor, view, selection, trimmed)) {
+        return;
+      }
+      const lines = text.replace(/\r\n?/g, "\n").split("\n");
+      run(
+        () => editor.batch(() => {
+          let caret = selection.collapsed ? { blockId: selection.from.blockId, offset: selection.from.offset } : deleteSelection(selection);
+          if (!caret) return void 0;
+          const flavour = editor.store.getBlock(caret.blockId)?.flavour ?? "";
+          if (editor.schema.getBlockSchema(flavour)?.enter?.mode === "newline") {
+            return insertAt(caret.blockId, caret.offset, lines.join("\n"));
+          }
+          caret = insertAt(caret.blockId, caret.offset, lines[0]);
+          for (const line of lines.slice(1)) {
+            if (!caret) return void 0;
+            const next = exec({
+              type: "splitBlock",
+              payload: { blockId: caret.blockId, offset: caret.offset }
+            });
+            if (!next) return caret;
+            caret = insertAt(next.blockId, next.offset, line);
+          }
+          return caret;
+        })
+      );
+    };
+    const pasteFragment = (fragment, selection) => {
+      if (!editor.can("pasteFragment", { at: selection.from, fragment })) return false;
+      run(
+        () => editor.batch(() => {
+          const caret = selection.collapsed ? { blockId: selection.from.blockId, offset: selection.from.offset } : deleteSelection(selection);
+          return caret ? exec({ type: "pasteFragment", payload: { at: caret, fragment } }) : void 0;
+        })
+      );
+      return true;
+    };
+    const onPaste = (event) => {
+      if (isForeignControl(event.target)) return;
+      event.preventDefault();
+      const data = event.clipboardData;
+      const selection = readDocSelection(root);
+      if (readOnly || !data || !selection) return;
+      const text = data.getData("text/plain");
+      const files = [...data.files].filter((file) => isAcceptedImage(file, images));
+      if (files.length > 0 && text.trim() === "") {
+        plainNext = false;
+        insertImageFiles(editor, view, images, files, selection.to.blockId);
+        return;
+      }
+      const plainOnly = plainNext;
+      plainNext = false;
+      const inCode = editor.store.getBlock(selection.from.blockId)?.flavour === "block:code";
+      if (!plainOnly && !inCode) {
+        const json = data.getData(FRAGMENT_MIME);
+        const html = data.getData("text/html");
+        const fragment = (json ? sanitizeFragment2(parseJson(json)) : null) ?? (html ? embeddedFragment(html) ?? htmlToFragment(html) : null);
+        if (fragment && pasteFragment(fragment, selection)) return;
+      }
+      if (text) pastePlain(text, selection);
+    };
+    const onKeyDown = (event) => {
+      if (readOnly && event.key === "Backspace" && !isForeignControl(event.target)) {
+        event.preventDefault();
+        return;
+      }
+      if (readOnly && (event.ctrlKey || event.metaKey) && !event.shiftKey && event.key.toLowerCase() === "a") {
+        const selection = globalThis.getSelection();
+        event.preventDefault();
+        selection?.removeAllRanges();
+        const range = document.createRange();
+        range.selectNodeContents(root);
+        selection?.addRange(range);
+        return;
+      }
+      if ((event.ctrlKey || event.metaKey) && event.shiftKey && event.key.toLowerCase() === "v") {
+        plainNext = true;
+        clearTimeout(plainTimer);
+        plainTimer = setTimeout(() => {
+          plainNext = false;
+        }, 1e3);
+      }
+    };
+    const hasFiles = (event) => !!event.dataTransfer && [...event.dataTransfer.types].includes("Files");
+    const onDragOver = (event) => {
+      if (hasFiles(event)) event.preventDefault();
+    };
+    const onDrop = (event) => {
+      if (!hasFiles(event)) return;
+      event.preventDefault();
+      const files = [...event.dataTransfer?.files ?? []].filter(
+        (file) => isAcceptedImage(file, images)
+      );
+      if (readOnly || files.length === 0) return;
+      const probe = probePoint(view, event.clientX, event.clientY);
+      const target = (probe ? blockAtPoint(editor, view, probe.x, probe.y) : null) ?? readDocSelection(root)?.to.blockId;
+      if (target) insertImageFiles(editor, view, images, files, target);
+    };
+    const onCopy = (event) => writeSelection(event, false);
+    const onCut = (event) => writeSelection(event, true);
+    root.addEventListener("copy", onCopy);
+    root.addEventListener("cut", onCut);
+    root.addEventListener("paste", onPaste);
+    root.addEventListener("keydown", onKeyDown);
+    root.addEventListener("dragover", onDragOver);
+    root.addEventListener("drop", onDrop);
+    return () => {
+      clearTimeout(plainTimer);
+      root.removeEventListener("copy", onCopy);
+      root.removeEventListener("cut", onCut);
+      root.removeEventListener("paste", onPaste);
+      root.removeEventListener("keydown", onKeyDown);
+      root.removeEventListener("dragover", onDragOver);
+      root.removeEventListener("drop", onDrop);
+    };
+  }, [editor, view, ref, readOnly, images, slashItems]);
+}
+
+// src/block-handle/useBlockHandles.ts
+import { useEffect as useEffect10 } from "react";
+function useBlockHandles(ref, enabled) {
+  const editor = useEditor();
+  const view = useEditorView();
+  useEffect10(() => {
+    const root = ref.current;
+    if (!root || !enabled) return;
+    const showAt = (event) => {
+      const probe = probePoint(view, event.clientX, event.clientY);
+      if (!probe) {
+        view.blocks.setHover(null);
+        return;
+      }
+      const blockId = blockAtPoint(editor, view, probe.x, probe.y);
+      if (!blockId) return;
+      const wrapper = blockElement(view, blockId);
+      const row = rowRect(view, blockId);
+      if (wrapper && row) {
+        view.blocks.setHover({
+          blockId,
+          x: Math.round(wrapper.getBoundingClientRect().left),
+          y: Math.round(row.top)
+        });
+      }
+    };
+    const onUiTarget = (event) => event.target instanceof Element && !!event.target.closest("[data-inkbrick-block-ui]");
+    const onMove = (event) => {
+      const { menu, drag } = view.blocks.getState();
+      if (event.pointerType === "touch") return;
+      if (drag || menu || view.pointerDown) return;
+      if (onUiTarget(event)) return;
+      showAt(event);
+    };
+    const onPointerUp = (event) => {
+      if (event.pointerType === "mouse" || onUiTarget(event)) return;
+      const { menu, drag } = view.blocks.getState();
+      if (!drag && !menu) showAt(event);
+    };
+    const onPointerDown = (event) => {
+      if (onUiTarget(event)) return;
+      view.blocks.closeMenu();
+    };
+    const hide = (event) => {
+      if (onUiTarget(event)) return;
+      if (view.blocks.getState().drag) return;
+      view.blocks.setHover(null);
+      view.blocks.closeMenu();
+    };
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") view.blocks.closeMenu();
+      if (view.blocks.getState().hover && !event.metaKey && !event.ctrlKey)
+        view.blocks.setHover(null);
+    };
+    const onLeave = (event) => {
+      if (event.pointerType === "touch") return;
+      if (!event.relatedTarget) view.blocks.setHover(null);
+    };
+    const unsubscribe = editor.store.subscribe(() => {
+      const { hover, menu } = view.blocks.getState();
+      if (hover && !hasHandle(editor, hover.blockId)) view.blocks.setHover(null);
+      if (menu && !hasHandle(editor, menu.blockId)) view.blocks.closeMenu();
+    });
+    document.addEventListener("pointermove", onMove);
+    document.addEventListener("pointerdown", onPointerDown);
+    document.addEventListener("pointerup", onPointerUp);
+    document.addEventListener("pointerout", onLeave);
+    document.addEventListener("keydown", onKeyDown);
+    window.addEventListener("scroll", hide, true);
+    return () => {
+      unsubscribe();
+      document.removeEventListener("pointermove", onMove);
+      document.removeEventListener("pointerdown", onPointerDown);
+      document.removeEventListener("pointerup", onPointerUp);
+      document.removeEventListener("pointerout", onLeave);
+      document.removeEventListener("keydown", onKeyDown);
+      window.removeEventListener("scroll", hide, true);
+      view.blocks.setHover(null);
+      view.blocks.closeMenu();
+    };
+  }, [editor, view, ref, enabled]);
+}
+
+// src/editing/useEditorInput.ts
+import { useEffect as useEffect11 } from "react";
+
+// src/editing/beforeInput.ts
+var FORMAT_BY_INPUT_TYPE = {
+  formatBold: "bold",
+  formatItalic: "italic",
+  formatUnderline: "underline",
+  formatStrikeThrough: "strike"
+};
+function matchShortcut(prefix) {
+  if (/^#{1,6}$/.test(prefix)) {
+    return { flavour: "block:heading", props: { level: prefix.length } };
+  }
+  if (prefix === ">") return { flavour: "block:quote", props: {} };
+  if (prefix === "```") return { flavour: "block:code", props: {} };
+  if (prefix === "---") return { flavour: "block:divider", props: {} };
+  if (prefix === "$$") return { flavour: "block:formula", props: {} };
+  if (/^[-*+]$/.test(prefix)) return { flavour: "block:list", props: { type: "bullet" } };
+  if (/^\d+\.$/.test(prefix)) return { flavour: "block:list", props: { type: "ordered" } };
+  if (prefix === "[]") return { flavour: "block:list", props: { type: "todo", checked: false } };
+  return null;
+}
+function applyBeforeInput(event, root, editor, view, slashItems, actions) {
+  const {
+    exec,
+    run,
+    syncSlash,
+    blockText,
+    deleteSelection,
+    replaceSelection,
+    toggleFormat,
+    undo,
+    redo
+  } = actions;
+  const selection = readDocSelection(root);
+  if (!selection) return;
+  const { from, collapsed } = selection;
+  const type = event.inputType;
+  const block2 = editor.store.getBlock(from.blockId);
+  const text = blockText(from.blockId);
+  switch (type) {
+    case "insertText":
+    case "insertReplacementText": {
+      const data = event.data ?? event.dataTransfer?.getData("text/plain") ?? "";
+      if (!data) return;
+      if (data === "$" && collapsed && block2 && block2.flavour !== "block:code") {
+        const formula = matchInlineFormula(text.slice(0, from.offset));
+        if (formula && editor.can("insertFormula", {
+          blockId: from.blockId,
+          from: formula.from,
+          to: from.offset,
+          latex: formula.latex
+        })) {
+          run(
+            () => exec({
+              type: "insertFormula",
+              payload: {
+                blockId: from.blockId,
+                from: formula.from,
+                to: from.offset,
+                latex: formula.latex
+              }
+            })
+          );
+          return;
+        }
+      }
+      if (data === " " && collapsed && block2?.flavour === "block:paragraph") {
+        const shortcut = matchShortcut(text.slice(0, from.offset));
+        if (shortcut) {
+          run(
+            () => editor.batch(() => {
+              exec({
+                type: "deleteText",
+                payload: { blockId: from.blockId, from: 0, to: from.offset }
+              });
+              return exec({
+                type: "convertBlock",
+                payload: { blockId: from.blockId, ...shortcut, offset: 0 }
+              });
+            })
+          );
+          return;
+        }
+      }
+      const opensSlash = data === "/" && collapsed && !!block2 && block2.flavour !== "block:code" && editor.schema.getBlockSchema(block2.flavour)?.inline !== false && (from.offset === 0 || /\s/.test(text[from.offset - 1])) && availableSlashItems(editor, slashItems, from.blockId).length > 0;
+      run(() => replaceSelection(selection, data));
+      if (opensSlash) {
+        view.slash.open(from.blockId, from.offset);
+        syncSlash();
+      }
+      return;
+    }
+    case "insertParagraph":
+      run(
+        () => editor.batch(() => {
+          const caret = collapsed ? { blockId: from.blockId, offset: from.offset } : deleteSelection(selection);
+          return caret ? exec({
+            type: "splitBlock",
+            payload: { blockId: caret.blockId, offset: caret.offset }
+          }) : void 0;
+        })
+      );
+      return;
+    case "insertLineBreak":
+      run(() => replaceSelection(selection, "\n"));
+      return;
+    case "deleteContentBackward":
+      run(
+        () => collapsed ? exec({
+          type: "deleteBackward",
+          payload: { blockId: from.blockId, offset: from.offset }
+        }) : deleteSelection(selection)
+      );
+      return;
+    case "deleteContentForward":
+      run(() => {
+        if (!collapsed) return deleteSelection(selection);
+        if (from.offset < text.length) {
+          return exec({
+            type: "deleteText",
+            payload: { blockId: from.blockId, from: from.offset, to: from.offset + 1 }
+          });
+        }
+        return deleteForwardAtEnd(editor, from.blockId);
+      });
+      return;
+    case "deleteWordBackward":
+      run(() => {
+        if (!collapsed) return deleteSelection(selection);
+        const start = text.slice(0, from.offset).replace(/(\S+\s*|\s+)$/, "").length;
+        return start < from.offset ? exec({
+          type: "deleteText",
+          payload: { blockId: from.blockId, from: start, to: from.offset }
+        }) : exec({
+          type: "deleteBackward",
+          payload: { blockId: from.blockId, offset: from.offset }
+        });
+      });
+      return;
+    case "deleteWordForward":
+      run(() => {
+        if (!collapsed) return deleteSelection(selection);
+        const rest = text.slice(from.offset);
+        const length = rest.length - rest.replace(/^(\s*[^\s]+|\s+)/, "").length;
+        return length > 0 ? exec({
+          type: "deleteText",
+          payload: { blockId: from.blockId, from: from.offset, to: from.offset + length }
+        }) : void 0;
+      });
+      return;
+    case "deleteSoftLineBackward":
+    case "deleteHardLineBackward":
+      run(() => {
+        if (!collapsed) return deleteSelection(selection);
+        return from.offset > 0 ? exec({
+          type: "deleteText",
+          payload: { blockId: from.blockId, from: 0, to: from.offset }
+        }) : void 0;
+      });
+      return;
+    case "deleteSoftLineForward":
+    case "deleteHardLineForward":
+      run(() => {
+        if (!collapsed) return deleteSelection(selection);
+        return from.offset < text.length ? exec({
+          type: "deleteText",
+          payload: { blockId: from.blockId, from: from.offset, to: text.length }
+        }) : void 0;
+      });
+      return;
+    case "deleteByCut":
+    case "deleteByDrag":
+    case "deleteContent":
+      if (!collapsed) run(() => deleteSelection(selection));
+      return;
+    case "historyUndo":
+      undo();
+      return;
+    case "historyRedo":
+      redo();
+      return;
+    case "formatBold":
+    case "formatItalic":
+    case "formatUnderline":
+    case "formatStrikeThrough":
+      toggleFormat(FORMAT_BY_INPUT_TYPE[type]);
+      return;
+    default:
+      return;
+  }
+}
+
+// src/editing/useEditorInput.ts
+var NAVIGATION_KEYS = /* @__PURE__ */ new Set([
+  "ArrowLeft",
+  "ArrowRight",
+  "ArrowUp",
+  "ArrowDown",
+  "Home",
+  "End",
+  "PageUp",
+  "PageDown"
+]);
+function diffText(before, after) {
+  let start = 0;
+  while (start < before.length && start < after.length && before[start] === after[start]) start++;
+  let endBefore = before.length;
+  let endAfter = after.length;
+  while (endBefore > start && endAfter > start && before[endBefore - 1] === after[endAfter - 1]) {
+    endBefore--;
+    endAfter--;
+  }
+  return { from: start, to: endBefore, text: after.slice(start, endAfter) };
+}
+function isForeignControl2(target) {
+  return target instanceof Element && target.closest("input, textarea, select, button, [data-inkbrick-ignore-input]") !== null;
+}
+function useEditorInput(ref, enabled = true) {
+  const editor = useEditor();
+  const view = useEditorView();
+  const { slashItems, keymap } = useEditorUI();
+  useEffect11(() => {
+    const root = ref.current;
+    if (!root || !enabled) return;
+    let composing = false;
+    const actions = createInputActions(editor, view, root, slashItems);
+    const { exec, run, syncSlash, blockText, replaceSelection, toggleFormat, undo, redo } = actions;
+    const onBeforeInput = (event) => {
+      if (isForeignControl2(event.target)) return;
+      if (composing || event.isComposing) return;
+      event.preventDefault();
+      applyBeforeInput(event, root, editor, view, slashItems, actions);
+    };
+    const onKeyDown = (event) => {
+      if (isForeignControl2(event.target)) return;
+      const handled = handleKeyDown(keymap, {
+        editor,
+        view,
+        root,
+        event,
+        slashItems,
+        selection: () => readDocSelection(root),
+        exec,
+        run,
+        replaceSelection,
+        undo,
+        redo,
+        toggleFormat
+      });
+      if (!handled && NAVIGATION_KEYS.has(event.key)) editor.sealHistory();
+    };
+    const editableAtCaret = () => {
+      const node = document.getSelection()?.anchorNode ?? null;
+      const element = node instanceof Element ? node : node?.parentElement;
+      const editable = element?.closest(".editable[data-id]");
+      return editable && root.contains(editable) ? editable : null;
+    };
+    let compositionBlock = null;
+    const onCompositionStart = () => {
+      composing = true;
+      compositionBlock = editableAtCaret();
+      compositionBlock?.setAttribute("data-composing", "");
+    };
+    const onCompositionEnd = () => {
+      composing = false;
+      const started = compositionBlock?.isConnected ? compositionBlock : null;
+      const element = started ?? editableAtCaret();
+      const blockId = element?.dataset.id;
+      compositionBlock?.removeAttribute("data-composing");
+      compositionBlock = null;
+      if (!element || !blockId) return;
+      const { from, to, text } = diffText(blockText(blockId), element.textContent ?? "");
+      if (from === to && text === "") return;
+      run(() => exec({ type: "replaceText", payload: { blockId, from, to, text } }));
+    };
+    const prevent = (event) => event.preventDefault();
+    const sealHistory = () => editor.sealHistory();
+    const closeSlash = () => view.slash.close();
+    const onPointerDown = () => {
+      view.pointerDown = true;
+      view.toolbar.closeLink();
+      view.toolbar.hide();
+    };
+    const onPointerUp = () => {
+      if (!view.pointerDown) return;
+      view.pointerDown = false;
+      setTimeout(() => syncToolbar(editor, view), 0);
+    };
+    const onClick = (event) => {
+      const formula = event.target instanceof Element ? event.target.closest("[data-inkbrick-formula]") : null;
+      if (formula && root.contains(formula)) {
+        event.preventDefault();
+        openFormulaAt(view, formula);
+        return;
+      }
+      if (!(event.ctrlKey || event.metaKey) || !(event.target instanceof Element)) return;
+      const anchor = event.target.closest("a[href]");
+      if (anchor && root.contains(anchor)) {
+        event.preventDefault();
+        window.open(anchor.href, "_blank", "noopener,noreferrer");
+      }
+    };
+    const onSelectionChange = () => {
+      if (view.slash.getState().open) syncSlash();
+      syncToolbar(editor, view);
+    };
+    const syncIfOpen = () => {
+      if (view.slash.getState().open) syncSlash();
+      if (view.toolbar.getState().visible) syncToolbar(editor, view);
+    };
+    root.addEventListener("beforeinput", onBeforeInput);
+    root.addEventListener("keydown", onKeyDown);
+    root.addEventListener("compositionstart", onCompositionStart);
+    root.addEventListener("compositionend", onCompositionEnd);
+    root.addEventListener("drop", prevent);
+    root.addEventListener("pointerdown", sealHistory);
+    root.addEventListener("focusout", sealHistory);
+    root.addEventListener("pointerdown", closeSlash);
+    root.addEventListener("focusout", closeSlash);
+    root.addEventListener("pointerdown", onPointerDown);
+    root.addEventListener("click", onClick);
+    document.addEventListener("pointerup", onPointerUp);
+    document.addEventListener("pointercancel", onPointerUp);
+    document.addEventListener("selectionchange", onSelectionChange);
+    window.addEventListener("scroll", syncIfOpen, true);
+    return () => {
+      root.removeEventListener("beforeinput", onBeforeInput);
+      root.removeEventListener("keydown", onKeyDown);
+      root.removeEventListener("compositionstart", onCompositionStart);
+      root.removeEventListener("compositionend", onCompositionEnd);
+      root.removeEventListener("drop", prevent);
+      root.removeEventListener("pointerdown", sealHistory);
+      root.removeEventListener("focusout", sealHistory);
+      root.removeEventListener("pointerdown", closeSlash);
+      root.removeEventListener("focusout", closeSlash);
+      root.removeEventListener("pointerdown", onPointerDown);
+      root.removeEventListener("click", onClick);
+      document.removeEventListener("pointerup", onPointerUp);
+      document.removeEventListener("pointercancel", onPointerUp);
+      document.removeEventListener("selectionchange", onSelectionChange);
+      window.removeEventListener("scroll", syncIfOpen, true);
+      compositionBlock?.removeAttribute("data-composing");
+      view.slash.close();
+      view.toolbar.hide();
+    };
+  }, [editor, view, ref, slashItems, keymap, enabled]);
+}
+
+// src/editing/useSelectionState.ts
+import { useEffect as useEffect12 } from "react";
+function useSelectionState(ref) {
+  const editor = useEditor();
+  const view = useEditorView();
+  useEffect12(() => {
+    const root = ref.current;
+    if (!root) return;
+    const update = () => {
+      const selection = readDocSelection(root);
+      view.selection.set(
+        selection && !selection.collapsed ? editor.blocksBetween(selection.from, selection.to) : []
+      );
+      const caret = selection?.collapsed ? selection.from.blockId : null;
+      view.caret.set(caret);
+      editor.controllers.setFocusedBlock(caret);
+      view.viewport.setEdges(
+        !selection ? [] : selection.collapsed ? [selection.from.blockId] : [selection.from.blockId, selection.to.blockId]
+      );
+    };
+    document.addEventListener("selectionchange", update);
+    update();
+    return () => {
+      document.removeEventListener("selectionchange", update);
+      view.selection.set([]);
+      view.caret.set(null);
+      view.viewport.setEdges([]);
+      editor.controllers.setFocusedBlock(null);
+    };
+  }, [editor, view, ref]);
+}
+
+// src/formula/FormulaPopover.tsx
+import {
+  useCallback as useCallback4,
+  useEffect as useEffect13,
+  useLayoutEffect as useLayoutEffect4,
+  useRef as useRef8,
+  useState as useState7,
+  useSyncExternalStore as useSyncExternalStore10
+} from "react";
+import { createPortal as createPortal3 } from "react-dom";
+import { MAX_FORMULA_LENGTH as MAX_FORMULA_LENGTH2 } from "@inkbrick/document";
+import { jsx as jsx26, jsxs as jsxs11 } from "react/jsx-runtime";
+var WIDTH = 340;
+function close(view, state) {
+  view.formula.close();
+  view.placeSelection(
+    { blockId: state.blockId, offset: state.mode === "edit" ? state.to : state.from },
+    { blockId: state.blockId, offset: state.to }
+  );
+}
+function Body({ state }) {
+  const editor = useEditor();
+  const view = useEditorView();
+  const t = useT();
+  const [draft, setDraft] = useState7(state.latex);
+  const [error, setError] = useState7(false);
+  const ref = useRef8(null);
+  const field = useRef8(null);
+  const [top, setTop] = useState7(null);
+  const insertSnippet = useSnippetInsert(field, draft, setDraft);
+  const settle = useCallback4((result) => setError(result === "error"), []);
+  const width = Math.min(WIDTH, window.innerWidth - 16);
+  useEffect13(() => {
+    field.current?.focus();
+    field.current?.select();
+  }, []);
+  useLayoutEffect4(() => {
+    const height = ref.current?.offsetHeight ?? 0;
+    const below = state.position.y + 8;
+    setTop(
+      below + height > window.innerHeight && state.position.top - height - 8 > 0 ? state.position.top - height - 8 : below
+    );
+  }, [state.position.y, state.position.top, draft]);
+  useEffect13(() => {
+    const onPointerDown = (event) => {
+      if (event.target instanceof Node && ref.current?.contains(event.target)) return;
+      close(view, state);
+    };
+    document.addEventListener("pointerdown", onPointerDown, true);
+    return () => document.removeEventListener("pointerdown", onPointerDown, true);
+  }, [view, state]);
+  const apply = () => {
+    if (applyInlineFormula(editor, view, state, draft)) view.formula.close();
+  };
+  const remove = () => {
+    if (applyInlineFormula(editor, view, state, "")) view.formula.close();
+  };
+  return /* @__PURE__ */ jsxs11(
+    "div",
+    {
+      ref,
+      className: "formula-popover",
+      "data-inkbrick-ui": "formula-popover",
+      "data-testid": "formula-popover",
+      role: "dialog",
+      "aria-label": t("formula.inline.title"),
+      style: {
+        left: Math.max(8, Math.min(state.position.x - width / 2, window.innerWidth - width - 8)),
+        top: top ?? state.position.y + 8,
+        width
+      },
+      onMouseDown: (event) => {
+        if (!(event.target instanceof HTMLTextAreaElement)) event.preventDefault();
+      },
+      children: [
+        /* @__PURE__ */ jsx26(
+          "textarea",
+          {
+            ref: field,
+            className: "formula-popover__source",
+            "data-inkbrick-part": "formula-source",
+            "aria-label": t("formula.source"),
+            "aria-invalid": error || void 0,
+            placeholder: t("formula.placeholder"),
+            spellCheck: false,
+            rows: 2,
+            maxLength: MAX_FORMULA_LENGTH2,
+            value: draft,
+            onChange: (event) => setDraft(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === "Escape") {
+                event.preventDefault();
+                close(view, state);
+              } else if (event.key === "Enter" && !event.shiftKey) {
+                event.preventDefault();
+                apply();
+              }
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx26("div", { className: "formula-popover__preview", "data-inkbrick-part": "formula-preview", children: /* @__PURE__ */ jsx26(FormulaView, { latex: draft, showError: true, onSettled: settle }) }),
+        /* @__PURE__ */ jsx26(LazyFormulaPalette, { onInsert: insertSnippet }),
+        /* @__PURE__ */ jsxs11("div", { className: "formula-popover__actions", "data-inkbrick-part": "formula-actions", children: [
+          state.mode === "edit" && /* @__PURE__ */ jsx26(
+            "button",
+            {
+              type: "button",
+              "data-inkbrick-part": "button",
+              "data-danger": "",
+              "data-action": "remove",
+              "aria-label": t("formula.remove"),
+              title: t("formula.remove"),
+              onClick: remove,
+              children: /* @__PURE__ */ jsx26(Icon, { name: "trash" })
+            }
+          ),
+          /* @__PURE__ */ jsx26("span", { className: "formula-popover__spacer" }),
+          /* @__PURE__ */ jsx26(
+            "button",
+            {
+              type: "button",
+              "data-inkbrick-part": "button",
+              "data-action": "cancel",
+              onClick: () => close(view, state),
+              children: t("formula.cancel")
+            }
+          ),
+          /* @__PURE__ */ jsx26(
+            "button",
+            {
+              type: "button",
+              "data-inkbrick-part": "button",
+              "data-primary": "",
+              "data-action": "apply",
+              disabled: state.mode === "insert" && draft.trim() === "",
+              onClick: apply,
+              children: t("formula.apply")
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function FormulaPopover() {
+  const view = useEditorView();
+  const readOnly = useReadOnly();
+  const state = useSyncExternalStore10(
+    view.formula.subscribe,
+    view.formula.getState,
+    view.formula.getState
+  );
+  if (!state.open || readOnly || typeof document === "undefined") return null;
+  return createPortal3(
+    /* @__PURE__ */ jsx26(Body, { state }, `${state.mode}:${state.blockId}:${state.from}:${state.to}`),
+    document.body
+  );
+}
+
+// src/slash/SlashMenuHost.tsx
+import { createPortal as createPortal4 } from "react-dom";
+import { useSyncExternalStore as useSyncExternalStore11 } from "react";
+
+// src/slash/DefaultSlashMenu.tsx
+import { useId, useLayoutEffect as useLayoutEffect5, useRef as useRef9, useState as useState8 } from "react";
+import { jsx as jsx27, jsxs as jsxs12 } from "react/jsx-runtime";
+var ESTIMATED_LINE = 28;
+function DefaultSlashMenu({
+  items,
+  activeIndex,
+  position,
+  onSelect,
+  onHover
+}) {
+  const t = useT();
+  const view = useEditorView();
+  const ref = useRef9(null);
+  const [flip, setFlip] = useState8(false);
+  const menuId = useId();
+  const optionId = (index) => `${menuId}-option-${index}`;
+  useLayoutEffect5(() => {
+    const menu = ref.current;
+    if (!menu) return;
+    setFlip(
+      position.y + menu.offsetHeight > window.innerHeight && position.y - menu.offsetHeight - ESTIMATED_LINE > 0
+    );
+  }, [position.x, position.y, items.length]);
+  useLayoutEffect5(() => {
+    ref.current?.querySelector('[aria-selected="true"]')?.scrollIntoView?.({ block: "nearest" });
+  }, [activeIndex, items]);
+  useLayoutEffect5(() => {
+    const root = view.getRoot();
+    if (!root) return;
+    root.setAttribute("aria-controls", menuId);
+    if (items.length > 0) root.setAttribute("aria-activedescendant", optionId(activeIndex));
+    else root.removeAttribute("aria-activedescendant");
+    return () => {
+      root.removeAttribute("aria-controls");
+      root.removeAttribute("aria-activedescendant");
+    };
+  }, [view, menuId, activeIndex, items.length]);
+  return /* @__PURE__ */ jsxs12(
+    "div",
+    {
+      ref,
+      id: menuId,
+      className: "inkbrick-slash-menu",
+      "data-inkbrick-ui": "slash-menu",
+      tabIndex: 0,
+      role: "listbox",
+      "aria-label": t("slash.label"),
+      "data-testid": "slash-menu",
+      style: {
+        left: Math.max(
+          8,
+          Math.min(position.x, window.innerWidth - (ref.current?.offsetWidth ?? 320) - 8)
+        ),
+        top: flip ? position.y - (ref.current?.offsetHeight ?? 0) - ESTIMATED_LINE : position.y + 4
+      },
+      onMouseDown: (event) => event.preventDefault(),
+      children: [
+        items.length === 0 && /* @__PURE__ */ jsx27("div", { className: "inkbrick-slash-menu__description", "data-inkbrick-part": "empty", children: t("slash.empty") }),
+        items.map((item, index) => /* @__PURE__ */ jsxs12(
+          "div",
+          {
+            id: optionId(index),
+            role: "option",
+            "aria-selected": index === activeIndex,
+            "data-slash-item": item.id,
+            "data-inkbrick-part": "item",
+            "data-active": index === activeIndex || void 0,
+            className: `inkbrick-slash-menu__item${index === activeIndex ? " inkbrick-slash-menu__item--selected" : ""}`,
+            onMouseEnter: () => onHover(index),
+            onClick: () => onSelect(item),
+            children: [
+              item.icon !== void 0 && /* @__PURE__ */ jsx27("span", { className: "inkbrick-slash-menu__icon", "data-inkbrick-part": "icon", children: item.icon }),
+              /* @__PURE__ */ jsxs12("div", { className: "inkbrick-slash-menu__body", "data-inkbrick-part": "body", children: [
+                /* @__PURE__ */ jsx27("div", { className: "inkbrick-slash-menu__header", "data-inkbrick-part": "title", children: item.title }),
+                item.description && /* @__PURE__ */ jsx27("div", { className: "inkbrick-slash-menu__description", "data-inkbrick-part": "description", children: item.description })
+              ] })
+            ]
+          },
+          item.id
+        ))
+      ]
+    }
+  );
+}
+
+// src/slash/SlashMenuHost.tsx
+import { jsx as jsx28 } from "react/jsx-runtime";
+function SlashMenuHost() {
+  const editor = useEditor();
+  const view = useEditorView();
+  const { slots, slashItems } = useEditorUI();
+  const readOnly = useReadOnly();
+  const state = useSyncExternalStore11(
+    view.slash.subscribe,
+    view.slash.getState,
+    view.slash.getState
+  );
+  if (readOnly || !state.open || !state.blockId || !state.position || typeof document === "undefined") {
+    return null;
+  }
+  const items = visibleSlashItems(editor, slashItems, state.blockId, state.query);
+  const Menu = slots.SlashMenu ?? DefaultSlashMenu;
+  return createPortal4(
+    /* @__PURE__ */ jsx28(
+      Menu,
+      {
+        items,
+        query: state.query,
+        activeIndex: Math.min(state.activeIndex, Math.max(items.length - 1, 0)),
+        position: state.position,
+        onSelect: (item) => applySlashItem(editor, view, item),
+        onHover: (index) => view.slash.update({ activeIndex: index }),
+        onClose: () => view.slash.close()
+      }
+    ),
+    document.body
+  );
+}
+
+// src/toolbar/ToolbarHost.tsx
+import { createPortal as createPortal5 } from "react-dom";
+import { useSyncExternalStore as useSyncExternalStore12 } from "react";
+
+// src/toolbar/DefaultToolbar.tsx
+import { useEffect as useEffect14, useLayoutEffect as useLayoutEffect6, useRef as useRef10, useState as useState9 } from "react";
+import { ALIGNMENTS, COLOR_NAMES, isColorName as isColorName2 } from "@inkbrick/document";
+import { Fragment as Fragment5, jsx as jsx29, jsxs as jsxs13 } from "react/jsx-runtime";
+var BUTTONS = [
+  { format: "bold", icon: "bold" },
+  { format: "italic", icon: "italic" },
+  { format: "underline", icon: "underline" },
+  { format: "strike", icon: "strike" },
+  { format: "code", icon: "code" }
+];
+var ALIGN_ICONS = {
+  left: "align-left",
+  center: "align-center",
+  right: "align-right",
+  justify: "align-justify"
+};
+var PANELS = [
+  { panel: "color", icon: "baseline" },
+  { panel: "highlight", icon: "highlighter" }
+];
+function DefaultToolbar({
+  formats,
+  position,
+  linkOpen,
+  panel,
+  onToggle,
+  onOpenLink,
+  onApplyLink,
+  onCancelLink,
+  onTogglePanel,
+  onApplyColor,
+  onAlign,
+  onInsertFormula
+}) {
+  const t = useT();
+  const input = useRef10(null);
+  const ref = useRef10(null);
+  const [value, setValue] = useState9("");
+  const [invalid, setInvalid] = useState9(false);
+  const [below, setBelow] = useState9(false);
+  const [width, setWidth] = useState9(0);
+  useEffect14(() => {
+    if (!linkOpen) return;
+    setValue(formats.link ?? "");
+    setInvalid(false);
+    input.current?.focus();
+    input.current?.select();
+  }, [linkOpen]);
+  useLayoutEffect6(() => {
+    const coarse = window.matchMedia?.("(pointer: coarse)").matches ?? false;
+    setBelow(coarse || position.y - (ref.current?.offsetHeight ?? 40) - 12 < 0);
+    setWidth(ref.current?.offsetWidth ?? 0);
+  }, [position.x, position.y, linkOpen, panel]);
+  const left = Math.max(8, Math.min(position.x - width / 2, window.innerWidth - width - 8));
+  const submit = (event) => {
+    event.preventDefault();
+    if (!onApplyLink(value)) setInvalid(true);
+  };
+  const colorKind = panel === "highlight" ? "backgroundColor" : "color";
+  const currentColor = panel === "highlight" ? formats.backgroundColor : formats.color;
+  return /* @__PURE__ */ jsx29(
+    "div",
+    {
+      ref,
+      className: "inkbrick-toolbar",
+      role: "toolbar",
+      "aria-label": t("toolbar.label"),
+      "data-inkbrick-ui": "toolbar",
+      "data-placement": below ? "below" : "above",
+      "data-testid": "toolbar",
+      style: {
+        left,
+        top: position.y,
+        transform: below ? "translateY(28px)" : "translateY(calc(-100% - 8px))"
+      },
+      onMouseDown: (event) => {
+        if (event.target !== input.current) event.preventDefault();
+      },
+      children: linkOpen ? /* @__PURE__ */ jsxs13("form", { className: "inkbrick-toolbar__link", "data-inkbrick-part": "link-form", onSubmit: submit, children: [
+        /* @__PURE__ */ jsx29(
+          "input",
+          {
+            ref: input,
+            "data-inkbrick-part": "input",
+            "data-invalid": invalid || void 0,
+            type: "text",
+            "aria-label": t("toolbar.link.url"),
+            "aria-invalid": invalid,
+            placeholder: t("toolbar.link.placeholder"),
+            value,
+            onChange: (event) => {
+              setValue(event.target.value);
+              setInvalid(false);
+            },
+            onKeyDown: (event) => {
+              if (event.key === "Escape") {
+                event.preventDefault();
+                onCancelLink();
+              }
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx29(
+          "button",
+          {
+            type: "submit",
+            className: "inkbrick-toolbar__button",
+            "data-inkbrick-part": "button",
+            "aria-label": t("toolbar.link.apply"),
+            title: t("toolbar.link.apply"),
+            children: /* @__PURE__ */ jsx29(Icon, { name: "check" })
+          }
+        ),
+        formats.link && /* @__PURE__ */ jsx29(
+          "button",
+          {
+            type: "button",
+            className: "inkbrick-toolbar__button",
+            "data-inkbrick-part": "button",
+            "aria-label": t("toolbar.link.remove"),
+            title: t("toolbar.link.remove"),
+            onClick: () => onApplyLink(null),
+            children: /* @__PURE__ */ jsx29(Icon, { name: "unlink" })
+          }
+        )
+      ] }) : /* @__PURE__ */ jsxs13(Fragment5, { children: [
+        BUTTONS.map(({ format, icon }) => /* @__PURE__ */ jsx29(
+          "button",
+          {
+            type: "button",
+            className: "inkbrick-toolbar__button",
+            "data-inkbrick-part": "button",
+            "data-format": format,
+            "data-pressed": formats[format] || void 0,
+            "aria-label": t(`toolbar.${format}.label`),
+            "aria-pressed": formats[format],
+            title: t(`toolbar.${format}.title`),
+            onClick: () => onToggle(format),
+            children: /* @__PURE__ */ jsx29(Icon, { name: icon })
+          },
+          format
+        )),
+        /* @__PURE__ */ jsx29(
+          "span",
+          {
+            className: "inkbrick-toolbar__separator",
+            "data-inkbrick-part": "separator",
+            role: "separator"
+          }
+        ),
+        /* @__PURE__ */ jsx29(
+          "button",
+          {
+            type: "button",
+            className: "inkbrick-toolbar__button",
+            "data-inkbrick-part": "button",
+            "data-format": "link",
+            "data-pressed": formats.link !== void 0 || void 0,
+            "aria-label": t("toolbar.link.label"),
+            "aria-pressed": formats.link !== void 0,
+            title: t("toolbar.link.title"),
+            onClick: onOpenLink,
+            children: /* @__PURE__ */ jsx29(Icon, { name: "link" })
+          }
+        ),
+        /* @__PURE__ */ jsx29(
+          "button",
+          {
+            type: "button",
+            className: "inkbrick-toolbar__button",
+            "data-inkbrick-part": "button",
+            "data-format": "formula",
+            "aria-label": t("toolbar.formula.label"),
+            title: t("toolbar.formula.title"),
+            onClick: onInsertFormula,
+            children: /* @__PURE__ */ jsx29(Icon, { name: "sigma" })
+          }
+        ),
+        /* @__PURE__ */ jsx29(
+          "span",
+          {
+            className: "inkbrick-toolbar__separator",
+            "data-inkbrick-part": "separator",
+            role: "separator"
+          }
+        ),
+        PANELS.map(({ panel: name, icon }) => {
+          const current = name === "color" ? formats.color : formats.backgroundColor;
+          return /* @__PURE__ */ jsxs13(
+            "button",
+            {
+              type: "button",
+              className: "inkbrick-toolbar__button",
+              "data-inkbrick-part": "button",
+              "data-format": name,
+              "data-pressed": panel === name || void 0,
+              "data-current-color": isColorName2(current) ? current : void 0,
+              "aria-label": t(`toolbar.${name}.label`),
+              "aria-haspopup": "true",
+              "aria-expanded": panel === name,
+              title: t(`toolbar.${name}.title`),
+              onClick: () => onTogglePanel(name),
+              children: [
+                /* @__PURE__ */ jsx29(Icon, { name: icon }),
+                /* @__PURE__ */ jsx29("span", { className: "inkbrick-toolbar__indicator", "data-inkbrick-part": "indicator" })
+              ]
+            },
+            name
+          );
+        }),
+        /* @__PURE__ */ jsx29(
+          "span",
+          {
+            className: "inkbrick-toolbar__separator",
+            "data-inkbrick-part": "separator",
+            role: "separator"
+          }
+        ),
+        ALIGNMENTS.map((align) => /* @__PURE__ */ jsx29(
+          "button",
+          {
+            type: "button",
+            className: "inkbrick-toolbar__button",
+            "data-inkbrick-part": "button",
+            "data-format": `align-${align}`,
+            "data-pressed": formats.align === align || void 0,
+            "aria-label": t(`toolbar.align.${align}.label`),
+            "aria-pressed": formats.align === align,
+            title: t(`toolbar.align.${align}.title`),
+            onClick: () => onAlign(align),
+            children: /* @__PURE__ */ jsx29(Icon, { name: ALIGN_ICONS[align] })
+          },
+          align
+        )),
+        panel && /* @__PURE__ */ jsxs13(
+          "div",
+          {
+            className: "inkbrick-toolbar__panel",
+            "data-inkbrick-part": "panel",
+            "data-kind": panel,
+            role: "group",
+            "aria-label": t(`toolbar.${panel}.label`),
+            children: [
+              /* @__PURE__ */ jsx29(
+                "button",
+                {
+                  type: "button",
+                  "data-inkbrick-part": "swatch",
+                  "data-color": "",
+                  "data-pressed": currentColor === void 0 || void 0,
+                  "aria-label": t(
+                    panel === "color" ? "toolbar.color.default" : "toolbar.highlight.none"
+                  ),
+                  title: t(panel === "color" ? "toolbar.color.default" : "toolbar.highlight.none"),
+                  onClick: () => onApplyColor(colorKind, null),
+                  children: /* @__PURE__ */ jsx29(Icon, { name: "x" })
+                }
+              ),
+              COLOR_NAMES.map((name) => /* @__PURE__ */ jsx29(
+                "button",
+                {
+                  type: "button",
+                  "data-inkbrick-part": "swatch",
+                  "data-color": name,
+                  "data-pressed": currentColor === name || void 0,
+                  "aria-label": t(`color.${name}`),
+                  title: t(`color.${name}`),
+                  onClick: () => onApplyColor(colorKind, name),
+                  children: panel === "color" ? "A" : null
+                },
+                name
+              ))
+            ]
+          }
+        )
+      ] })
+    }
+  );
+}
+
+// src/toolbar/ToolbarHost.tsx
+import { jsx as jsx30 } from "react/jsx-runtime";
+function ToolbarHost() {
+  const editor = useEditor();
+  const view = useEditorView();
+  const { slots } = useEditorUI();
+  const readOnly = useReadOnly();
+  const state = useSyncExternalStore12(
+    view.toolbar.subscribe,
+    view.toolbar.getState,
+    view.toolbar.getState
+  );
+  if (slots.Toolbar === null || readOnly) return null;
+  if (!state.visible || !state.position || !state.formats || !state.range || typeof document === "undefined") {
+    return null;
+  }
+  const Toolbar = slots.Toolbar ?? DefaultToolbar;
+  const range = state.range;
+  return createPortal5(
+    /* @__PURE__ */ jsx30(
+      Toolbar,
+      {
+        formats: state.formats,
+        position: state.position,
+        linkOpen: state.linkOpen,
+        panel: state.panel,
+        onToggle: (format) => {
+          toggleFormatInSelection(editor, view, range, format);
+          syncToolbar(editor, view);
+        },
+        onOpenLink: () => view.toolbar.openLink(),
+        onApplyLink: (url) => {
+          if (!setLinkInSelection(editor, view, range, url)) return false;
+          view.toolbar.closeLink();
+          syncToolbar(editor, view);
+          return true;
+        },
+        onTogglePanel: (panel) => view.toolbar.togglePanel(panel),
+        onApplyColor: (kind, value) => {
+          setColorInSelection(editor, view, range, kind, value);
+          view.toolbar.closePanel();
+          syncToolbar(editor, view);
+        },
+        onAlign: (align) => {
+          setAlignInSelection(editor, view, range, align);
+          syncToolbar(editor, view);
+        },
+        onInsertFormula: () => {
+          view.placeSelection(range.from, range.to);
+          openInlineFormula(editor, view);
+        },
+        onCancelLink: () => {
+          view.toolbar.closeLink();
+          view.placeSelection(range.from, range.to);
+          syncToolbar(editor, view);
+        }
+      }
+    ),
+    document.body
+  );
+}
+
+// src/renderer/virtual/estimate.ts
+var CHARS_PER_LINE = 80;
+function textLength(block2) {
+  let length = 0;
+  for (const node of block2.content) length += node.insert.length;
+  return length;
+}
+var estimateBlockHeight = (block2) => {
+  const lines = Math.max(1, Math.ceil(textLength(block2) / CHARS_PER_LINE));
+  switch (block2.flavour) {
+    case "block:heading":
+      return 20 + 34 * lines;
+    case "block:code": {
+      let breaks = 0;
+      for (const node of block2.content)
+        for (const char of node.insert) if (char === "\n") breaks += 1;
+      return 40 + 21 * (breaks + 1);
+    }
+    case "block:image":
+      return 260;
+    case "block:divider":
+      return 25;
+    case "block:formula":
+      return 64;
+    case "block:callout":
+      return 24 + 26 * lines;
+    default:
+      return 8 + 26 * lines;
+  }
+};
+function estimateSubtree(getBlock, id, estimate) {
+  let total = 0;
+  const queue = [id];
+  for (let i = 0; i < queue.length; i++) {
+    const block2 = getBlock(queue[i]);
+    if (!block2) continue;
+    total += estimate(block2);
+    for (const child of block2.children) queue.push(child);
+  }
+  return total;
+}
+
+// src/renderer/virtual/VirtualChildList.tsx
+import {
+  useEffect as useEffect15,
+  useLayoutEffect as useLayoutEffect7,
+  useMemo as useMemo3,
+  useReducer,
+  useRef as useRef11,
+  useState as useState10,
+  useSyncExternalStore as useSyncExternalStore13
+} from "react";
+import { Fragment as Fragment6, jsx as jsx31, jsxs as jsxs14 } from "react/jsx-runtime";
+var SPACER = "data-inkbrick-spacer";
+function upperBound(offsets, value) {
+  let lo = 0;
+  let hi = offsets.length;
+  while (lo < hi) {
+    const mid = lo + hi >>> 1;
+    if (offsets[mid] <= value) lo = mid + 1;
+    else hi = mid;
+  }
+  return lo;
+}
+function scrollParents(element) {
+  const result = [];
+  for (let node = element.parentElement; node && node !== document.body && node !== document.documentElement; node = node.parentElement) {
+    if (/(auto|scroll|hidden|clip)/.test(getComputedStyle(node).overflowY)) result.push(node);
+  }
+  return result;
+}
+function visibleRange(marker, parents) {
+  let top = 0;
+  let bottom = window.innerHeight;
+  for (const parent of parents) {
+    const rect = parent.getBoundingClientRect();
+    top = Math.max(top, rect.top);
+    bottom = Math.min(bottom, rect.bottom);
+  }
+  const origin = marker.getBoundingClientRect().top;
+  return { top: top - origin, bottom: Math.max(top, bottom) - origin };
+}
+function indexOfItem(editor, parentId, ids, id) {
+  let block2 = editor.store.getBlock(id);
+  while (block2 && block2.parentId !== parentId) {
+    block2 = block2.parentId ? editor.store.getBlock(block2.parentId) : void 0;
+  }
+  return block2 ? ids.indexOf(block2.id) : -1;
+}
+function Spacer({ height }) {
+  return /* @__PURE__ */ jsx31(
+    "div",
+    {
+      className: "inkbrick-spacer",
+      "data-inkbrick-spacer": "",
+      "aria-hidden": "true",
+      contentEditable: false,
+      style: { height }
+    }
+  );
+}
+function VirtualChildList({
+  parentId,
+  ids,
+  options
+}) {
+  const editor = useEditor();
+  const view = useEditorView();
+  const windowed = ids.length >= options.threshold;
+  const marker = useRef11(null);
+  const parents = useRef11([]);
+  const [heights] = useState10(() => /* @__PURE__ */ new Map());
+  const [estimates] = useState10(() => /* @__PURE__ */ new Map());
+  const [measured, remeasure] = useReducer((n) => n + 1, 0);
+  const [range, setRange] = useState10(() => ({
+    top: 0,
+    bottom: typeof window === "undefined" ? 1e3 : window.innerHeight
+  }));
+  const pins = useSyncExternalStore13(
+    view.viewport.subscribe,
+    view.viewport.getVersion,
+    view.viewport.getVersion
+  );
+  const dragId = useSyncExternalStore13(
+    view.blocks.subscribe,
+    () => view.blocks.getState().drag?.blockId ?? null,
+    () => null
+  );
+  const dropId = useSyncExternalStore13(
+    view.blocks.subscribe,
+    () => view.blocks.getState().drag?.targetId ?? null,
+    () => null
+  );
+  useEffect15(() => windowed ? view.viewport.attach() : void 0, [view, windowed]);
+  const offsets = useMemo3(() => {
+    if (!windowed) return null;
+    const result = new Float64Array(ids.length + 1);
+    const getBlock = (id) => editor.store.getBlock(id);
+    for (let i = 0; i < ids.length; i++) {
+      const id = ids[i];
+      let height = heights.get(id) ?? estimates.get(id);
+      if (height === void 0) {
+        height = estimateSubtree(getBlock, id, options.estimateHeight);
+        estimates.set(id, height);
+      }
+      result[i + 1] = result[i] + height;
+    }
+    return result;
+  }, [ids, windowed, measured, heights, estimates, editor, options.estimateHeight]);
+  const rendered = useMemo3(() => {
+    if (!offsets) return null;
+    const last = ids.length - 1;
+    const from = Math.max(0, upperBound(offsets, range.top - options.overscan) - 1);
+    const to = Math.min(
+      last,
+      upperBound(offsets, range.bottom + options.overscan) - 1,
+      from + options.maxRendered - 1
+    );
+    const pinned = /* @__PURE__ */ new Set([0, last]);
+    for (const id of [...view.viewport.getPinned(), dragId, dropId]) {
+      if (id) pinned.add(indexOfItem(editor, parentId, ids, id));
+    }
+    pinned.delete(-1);
+    const result = [];
+    for (const i of [...pinned].sort((a, b) => a - b)) if (i < from) result.push(i);
+    for (let i = from; i <= to; i++) result.push(i);
+    for (const i of [...pinned].sort((a, b) => a - b)) if (i > to) result.push(i);
+    return result;
+  }, [offsets, ids, range, options, view, editor, parentId, dragId, dropId, pins]);
+  const observer = useRef11(null);
+  const observed = useRef11(/* @__PURE__ */ new Map());
+  useLayoutEffect7(() => {
+    if (!windowed || !rendered || !marker.current) return;
+    const seen = /* @__PURE__ */ new Set();
+    const expected = new Set(rendered.map((i) => ids[i]));
+    let changed = false;
+    let previous = null;
+    let remaining = rendered.length;
+    const settle = (height) => {
+      if (!previous) return;
+      if (height > 0 && Math.abs((heights.get(previous.id) ?? -1) - height) > 0.5) {
+        heights.set(previous.id, height);
+        changed = true;
+      }
+      previous = null;
+    };
+    for (let element = marker.current.nextElementSibling; element && remaining > 0; element = element.nextElementSibling) {
+      const rect = element.getBoundingClientRect();
+      if (previous) settle(rect.top - previous.top);
+      if (element.hasAttribute(SPACER)) continue;
+      remaining -= 1;
+      const id = element.getAttribute("data-block-id");
+      if (id && expected.has(id)) {
+        previous = { id, top: rect.top, height: rect.height };
+        seen.add(element);
+      }
+    }
+    if (previous) settle(previous.height);
+    if (typeof ResizeObserver !== "undefined") {
+      const sizes = observed.current;
+      observer.current ??= new ResizeObserver((entries) => {
+        let resized = false;
+        for (const entry of entries) {
+          const size = entry.contentRect.height;
+          const known = sizes.get(entry.target);
+          if (known !== void 0 && Math.abs(known - size) > 0.5) resized = true;
+          sizes.set(entry.target, size);
+        }
+        if (resized) remeasure();
+      });
+      for (const element of [...sizes.keys()]) {
+        if (!seen.has(element)) {
+          observer.current.unobserve(element);
+          sizes.delete(element);
+        }
+      }
+      for (const element of seen) {
+        if (!sizes.has(element)) observer.current.observe(element);
+      }
+    }
+    const next2 = visibleRange(marker.current, parents.current);
+    const step = options.overscan / 4;
+    setRange(
+      (current) => Math.abs(current.top - next2.top) < step && Math.abs(current.bottom - next2.bottom) < step ? current : next2
+    );
+    if (changed) remeasure();
+  });
+  useEffect15(() => () => observer.current?.disconnect(), []);
+  useEffect15(() => {
+    if (!windowed || !marker.current) return;
+    parents.current = scrollParents(marker.current);
+    let frame = 0;
+    const step = options.overscan / 4;
+    const onScroll = () => {
+      if (frame) return;
+      frame = requestAnimationFrame(() => {
+        frame = 0;
+        if (!marker.current) return;
+        const next2 = visibleRange(marker.current, parents.current);
+        setRange(
+          (current) => Math.abs(current.top - next2.top) < step && Math.abs(current.bottom - next2.bottom) < step ? current : next2
+        );
+      });
+    };
+    window.addEventListener("scroll", onScroll, { capture: true, passive: true });
+    window.addEventListener("resize", onScroll);
+    return () => {
+      cancelAnimationFrame(frame);
+      window.removeEventListener("scroll", onScroll, { capture: true });
+      window.removeEventListener("resize", onScroll);
+    };
+  }, [windowed, options.overscan]);
+  if (!rendered || !offsets) {
+    return /* @__PURE__ */ jsxs14(Fragment6, { children: [
+      null,
+      ids.map((id) => /* @__PURE__ */ jsx31(BlockRenderer, { id }, id))
+    ] });
+  }
+  const items = [];
+  let next = 0;
+  for (const i of rendered) {
+    if (i > next) items.push(/* @__PURE__ */ jsx31(Spacer, { height: offsets[i] - offsets[next] }, `gap:${next}`));
+    items.push(/* @__PURE__ */ jsx31(BlockRenderer, { id: ids[i] }, ids[i]));
+    next = i + 1;
+  }
+  return /* @__PURE__ */ jsxs14(Fragment6, { children: [
+    /* @__PURE__ */ jsx31(
+      "div",
+      {
+        ref: marker,
+        className: "inkbrick-spacer",
+        "data-inkbrick-spacer": "start",
+        "aria-hidden": "true",
+        contentEditable: false
+      }
+    ),
+    items
+  ] });
+}
+
+// src/renderer/virtual/virtualRenderer.tsx
+import { jsx as jsx32 } from "react/jsx-runtime";
+function virtualRenderer(options = {}) {
+  const resolved = {
+    threshold: Math.max(1, options.threshold ?? 100),
+    overscan: Math.max(0, options.overscan ?? 1200),
+    maxRendered: Math.max(1, options.maxRendered ?? 400),
+    estimateHeight: options.estimateHeight ?? estimateBlockHeight
+  };
+  function VirtualChildren(props) {
+    return /* @__PURE__ */ jsx32(VirtualChildList, { ...props, options: resolved });
+  }
+  return { ChildList: VirtualChildren };
+}
+var defaultVirtualRenderer = virtualRenderer();
+
+// src/renderer/DocumentView.tsx
+import { Fragment as Fragment7, jsx as jsx33, jsxs as jsxs15 } from "react/jsx-runtime";
+function resolveRenderer(renderer) {
+  if (renderer === "virtual") return defaultVirtualRenderer;
+  if (!renderer || renderer === "full") return fullRenderer;
+  return renderer;
+}
+function DocumentView({ label, renderer } = {}) {
+  const editor = useEditor();
+  const view = useEditorView();
+  const ref = useRef12(null);
+  const { slots } = useEditorUI();
+  const readOnly = useReadOnly();
+  const t = useT();
+  useEditorInput(ref, !readOnly);
+  useSelectionState(ref);
+  useClipboard(ref, readOnly);
+  useBlockHandles(ref, slots.BlockHandle !== null && !readOnly);
+  useLayoutEffect8(() => view.setRoot(ref.current), [view]);
+  useEffect16(() => {
+    if (!readOnly) void preloadFormulaPalette();
+  }, [readOnly]);
+  return /* @__PURE__ */ jsxs15(Fragment7, { children: [
+    /* @__PURE__ */ jsx33(
+      "div",
+      {
+        ref,
+        className: "inkbrick-editor",
+        "data-inkbrick-root": "",
+        contentEditable: !readOnly,
+        suppressContentEditableWarning: true,
+        spellCheck: false,
+        role: "textbox",
+        "aria-multiline": "true",
+        "aria-label": label ?? t("editor.label"),
+        tabIndex: readOnly ? 0 : void 0,
+        "aria-readonly": readOnly || void 0,
+        "data-readonly": readOnly || void 0,
+        children: /* @__PURE__ */ jsx33(DocumentRendererContext.Provider, { value: resolveRenderer(renderer), children: /* @__PURE__ */ jsx33(BlockRenderer, { id: editor.document.rootId }) })
+      }
+    ),
+    /* @__PURE__ */ jsx33(SlashMenuHost, {}),
+    /* @__PURE__ */ jsx33(ToolbarHost, {}),
+    /* @__PURE__ */ jsx33(FormulaPopover, {}),
+    /* @__PURE__ */ jsx33(BlockHandleHost, {}),
+    /* @__PURE__ */ jsx33(DropIndicatorHost, {})
+  ] });
+}
+export {
+  BlockChildren,
+  BlockRenderer,
+  CODE_LANGUAGES,
+  CalloutBlock,
+  CodeBlock,
+  DefaultBlockHandle,
+  DefaultBlockMenu,
+  DefaultDropIndicator,
+  DefaultSlashMenu,
+  DefaultToolbar,
+  DividerBlock,
+  DocumentView,
+  Editable,
+  EditorContext,
+  EditorProvider,
+  EditorView,
+  EditorViewContext,
+  FormulaView,
+  HIGHLIGHT_LIMIT,
+  HeadingBlock,
+  Icon,
+  ImageBlock,
+  ListBlock,
+  NoteBlock,
+  PageBlock,
+  ParagraphBlock,
+  QuoteBlock,
+  UnknownBlockView,
+  createTranslator,
+  defaultBlockComponents,
+  defaultKeymap,
+  defaultSlashItems,
+  defineBlock,
+  definePresentation,
+  embeddedFragment,
+  en,
+  ensureMathStyles,
+  estimateBlockHeight,
+  filterSlashItems,
+  fullRenderer,
+  getLocales,
+  highlightCode,
+  htmlToFragment,
+  matchesShortcut,
+  mountFormula,
+  normalizeImageUrl,
+  normalizeLanguage,
+  registerLocale,
+  resolveBlockComponent,
+  resolveKeymap,
+  resolveMessages,
+  ru,
+  temmlRenderer,
+  unbind,
+  uploadImage,
+  useBlock,
+  useBlockController,
+  useBlockDrag,
+  useBlockDragState,
+  useChildren,
+  useDocument,
+  useEditor,
+  useEditorUI,
+  useEditorView,
+  useHistory,
+  useLocale,
+  useReadOnly,
+  useT,
+  virtualRenderer
+};
+//# sourceMappingURL=index.js.map