@dxos/react-ui-editor 0.10.0 → 0.11.0

package/dist/lib/browser/index.mjs

@@ -1,1676 +0,0 @@
-// src/components/Editor/Editor.tsx
-import { Atom as Atom2 } from "@effect-atom/atom-react";
-import { createContext } from "@radix-ui/react-context";
-import React4, { forwardRef as forwardRef2, useCallback as useCallback4, useImperativeHandle as useImperativeHandle2, useMemo as useMemo5, useState as useState4 } from "react";
-import { invariant as invariant3 } from "@dxos/invariant";
-import { mx as mx2 } from "@dxos/ui-theme";
-import { isNonNullable as isNonNullable2 } from "@dxos/util";
-
-// src/components/EditorMenuProvider/menu.ts
-import { insertAtCursor } from "@dxos/ui-editor";
-var getMenuItem = (groups, id) => {
-  return groups.flatMap((group) => group.items).find((item) => item.id === id);
-};
-var getNextMenuItem = (groups, id) => {
-  const items = groups.flatMap((group) => group.items);
-  const index = items.findIndex((item) => item.id === id);
-  return index < items.length - 1 ? items[index + 1] : items[index];
-};
-var getPreviousMenuItem = (groups, id) => {
-  const items = groups.flatMap((group) => group.items);
-  const index = items.findIndex((item) => item.id === id);
-  return index > 0 ? items[index - 1] : items[index];
-};
-var createMenuGroup = ({ id = "menu", label, filter, items }) => ({
-  id,
-  label,
-  items: items.filter((item) => !filter || item.toLowerCase().includes(filter.toLowerCase())).map((item, i) => ({
-    id: `${id}-${i}`,
-    label: item,
-    onSelect: ({ view, head }) => insertAtCursor(view, head, item)
-  }))
-});
-var filterMenuGroups = (groups, filter) => {
-  return groups.map((group) => ({
-    ...group,
-    items: group.items.filter(filter)
-  }));
-};
-
-// src/components/EditorMenuProvider/menu-presets.ts
-import { insertAtLineStart } from "@dxos/ui-editor";
-
-// src/components/EditorMenuProvider/popover.ts
-import { Prec, RangeSetBuilder, StateEffect, StateField } from "@codemirror/state";
-import { Decoration, EditorView, ViewPlugin, keymap } from "@codemirror/view";
-import { modalStateField, placeholder } from "@dxos/ui-editor";
-import { isNonNullable, isTruthy } from "@dxos/util";
-var DELIMITERS = [
-  " ",
-  ":"
-];
-var popover = (options = {}) => {
-  return [
-    Prec.highest(popoverKeymap(options)),
-    popoverStateField,
-    popoverTriggerListener(options),
-    options.activateOnTyping && popoverAutoActivate(options),
-    popoverAnchorDecoration(options),
-    modalStateField,
-    options.trigger && placeholder({
-      // TODO(burdon): Translations.
-      content: `Press '${Array.isArray(options.trigger) ? options.trigger[0] : options.trigger}' for commands`,
-      focusOnly: true,
-      ...options.placeholder
-    })
-  ].filter(isTruthy);
-};
-var popoverTriggerListener = (options) => EditorView.updateListener.of(({ view, docChanged }) => {
-  const { range: activeRange, trigger } = view.state.field(popoverStateField) ?? {};
-  if (!activeRange) {
-    return;
-  }
-  const text = view.state.doc.sliceString(activeRange.from, activeRange.to);
-  const selection = view.state.selection.main;
-  const shouldClose = (
-    // Trigger deleted.
-    (trigger ? trigger !== text[0] : false) || // Whitespace in text.
-    /\s/.test(trigger ? text.slice(1) : text) || // Cursor moved before the range.
-    selection.head < activeRange.from || // Cursor moved after the range (+1 to handle selection changing before doc).
-    selection.head > activeRange.to + 1
-  );
-  const nextRange = shouldClose ? null : docChanged ? {
-    from: activeRange.from,
-    to: selection.head
-  } : activeRange;
-  if (nextRange !== activeRange) {
-    view.dispatch({
-      effects: popoverRangeEffect.of(nextRange ? {
-        range: nextRange,
-        trigger
-      } : null)
-    });
-  }
-  if (shouldClose) {
-    options.onClose?.({
-      view
-    });
-  }
-});
-var popoverAutoActivate = (options) => EditorView.updateListener.of(({ view, docChanged, transactions }) => {
-  if (!docChanged || !transactions.some((tr) => tr.isUserEvent("input")) || view.state.field(popoverStateField)) {
-    return;
-  }
-  const selection = view.state.selection.main;
-  if (!selection.empty) {
-    return;
-  }
-  const line = view.state.doc.lineAt(selection.head);
-  const before = line.text.slice(0, selection.head - line.from);
-  const idx = getLastIndexOf(before, options.delimiters ?? DELIMITERS);
-  const token = before.slice(idx + 1);
-  if (token.length === 0) {
-    return;
-  }
-  view.dispatch({
-    effects: popoverRangeEffect.of({
-      range: {
-        from: line.from + idx + 1,
-        to: selection.head
-      }
-    })
-  });
-});
-var popoverKeymap = (options) => {
-  const triggers = Array.isArray(options.trigger) ? options.trigger : [
-    options.trigger
-  ];
-  return keymap.of([
-    // Prefix triggers.
-    ...triggers.filter(isNonNullable).map((trigger) => ({
-      key: trigger,
-      run: (view) => {
-        const selection = view.state.selection.main;
-        const line = view.state.doc.lineAt(selection.head);
-        if (line.text.trim() === "" || selection.head === line.from || selection.head > line.from && line.text[selection.head - line.from - 1] === " ") {
-          view.dispatch({
-            changes: {
-              from: selection.head,
-              insert: trigger
-            },
-            selection: {
-              anchor: selection.head + 1,
-              head: selection.head + 1
-            },
-            effects: popoverRangeEffect.of({
-              trigger,
-              range: {
-                from: selection.head,
-                to: selection.head + 1
-              }
-            })
-          });
-          return true;
-        }
-        return false;
-      }
-    })),
-    //
-    // Custom trigger.
-    //
-    options.triggerKey && {
-      key: options.triggerKey,
-      run: (view) => {
-        const selection = view.state.selection.main;
-        const line = view.state.doc.lineAt(selection.head);
-        let str = line.text.slice(0, selection.head - line.from);
-        const idx = getLastIndexOf(str, options.delimiters ?? DELIMITERS);
-        if (idx !== -1) {
-          str = str.slice(idx + 1);
-        }
-        const from = line.from + idx;
-        view.dispatch({
-          effects: popoverRangeEffect.of({
-            range: {
-              from: from + 1,
-              to: selection.head
-            }
-          }),
-          changes: selection.head === view.state.doc.length ? {
-            from: from + 1,
-            to: selection.head,
-            insert: " "
-          } : void 0
-        });
-        return true;
-      }
-    },
-    //
-    // Nav keys.
-    //
-    {
-      key: "ArrowUp",
-      run: (view) => {
-        const range = view.state.field(popoverStateField)?.range;
-        if (range) {
-          options.onArrowUp?.({
-            view
-          });
-          return true;
-        }
-        return false;
-      }
-    },
-    {
-      key: "ArrowDown",
-      run: (view) => {
-        const range = view.state.field(popoverStateField)?.range;
-        if (range) {
-          options.onArrowDown?.({
-            view
-          });
-          return true;
-        }
-        return false;
-      }
-    },
-    {
-      key: "Enter",
-      run: (view) => {
-        const range = view.state.field(popoverStateField)?.range;
-        if (range) {
-          return options.onEnter?.({
-            view
-          }) ?? false;
-        }
-        return false;
-      }
-    }
-  ].filter(isTruthy));
-};
-var popoverAnchorDecoration = (options) => {
-  return ViewPlugin.fromClass(class {
-    view;
-    _decorations = Decoration.none;
-    constructor(view) {
-      this.view = view;
-    }
-    // TODO(wittjosiah): The decorations are repainted on every update, this occasionally causes menu to flicker.
-    update({ view, transactions }) {
-      const builder = new RangeSetBuilder();
-      const { range, trigger } = view.state.field(popoverStateField) ?? {};
-      if (range) {
-        const selection = view.state.selection.main;
-        const showWidget = selection.head >= range.from && selection.head <= range.to;
-        if (showWidget) {
-          builder.add(range.from, range.to + 1, Decoration.mark({
-            tagName: "dx-anchor",
-            class: "cm-popover-trigger",
-            attributes: {
-              "data-visible-focus": "false",
-              "data-auto-trigger": "true",
-              "data-trigger": trigger ?? options.triggerKey ?? ""
-            }
-          }));
-        }
-        const rangeChanged = transactions.some((tr) => tr.effects.some((effect) => effect.is(popoverRangeEffect)));
-        if (rangeChanged) {
-          const content = view.state.sliceDoc(range.from + (trigger ? trigger.length : 0), range.to);
-          options.onTextChange?.({
-            view,
-            pos: selection.head,
-            text: content,
-            trigger
-          });
-        }
-      }
-      this._decorations = builder.finish();
-    }
-  }, {
-    decorations: (v) => v._decorations
-  });
-};
-var popoverRangeEffect = StateEffect.define();
-var popoverStateField = StateField.define({
-  create: () => null,
-  update: (value, tr) => {
-    let newValue = value;
-    for (const effect of tr.effects) {
-      if (effect.is(popoverRangeEffect)) {
-        newValue = effect.value;
-      }
-    }
-    return newValue;
-  }
-});
-var getLastIndexOf = (str, delimiters) => Math.max(...delimiters.map((delim) => str.lastIndexOf(delim)));
-
-// src/components/EditorMenuProvider/menu-presets.ts
-var openLinkQuery = (view, insert) => {
-  requestAnimationFrame(() => {
-    const { head } = view.state.selection.main;
-    const to = head + insert.length;
-    view.dispatch({
-      changes: {
-        from: head,
-        insert
-      },
-      selection: {
-        anchor: to,
-        head: to
-      },
-      // The popover trigger is the single "@"; a second "@" lives in the query range and switches to block mode.
-      effects: popoverRangeEffect.of({
-        trigger: "@",
-        range: {
-          from: head,
-          to
-        }
-      })
-    });
-  });
-};
-var formattingCommands = {
-  id: "markdown",
-  label: "Markdown",
-  items: [
-    {
-      id: "heading-1",
-      label: "Heading 1",
-      icon: "ph--text-h-one--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "# ")
-    },
-    {
-      id: "heading-2",
-      label: "Heading 2",
-      icon: "ph--text-h-two--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "## ")
-    },
-    {
-      id: "heading-3",
-      label: "Heading 3",
-      icon: "ph--text-h-three--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "### ")
-    },
-    {
-      id: "heading-4",
-      label: "Heading 4",
-      icon: "ph--text-h-four--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "#### ")
-    },
-    {
-      id: "heading-5",
-      label: "Heading 5",
-      icon: "ph--text-h-five--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "##### ")
-    },
-    {
-      id: "heading-6",
-      label: "Heading 6",
-      icon: "ph--text-h-six--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "###### ")
-    },
-    {
-      id: "bullet-list",
-      label: "Bullet List",
-      icon: "ph--list-bullets--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "- ")
-    },
-    {
-      id: "numbered-list",
-      label: "Numbered List",
-      icon: "ph--list-numbers--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "1. ")
-    },
-    {
-      id: "task-list",
-      label: "Task List",
-      icon: "ph--list-checks--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "- [ ] ")
-    },
-    {
-      id: "quote",
-      label: "Quote",
-      icon: "ph--quotes--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "> ")
-    },
-    {
-      id: "code-block",
-      label: "Code Block",
-      icon: "ph--code-block--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "```\n\n```")
-    },
-    {
-      id: "table",
-      label: "Table",
-      icon: "ph--table--regular",
-      onSelect: ({ view, head }) => insertAtLineStart(view, head, "| | | |\n|---|---|---|\n| | | |")
-    }
-  ]
-};
-var linkSlashCommands = {
-  id: "link",
-  label: "Link",
-  items: [
-    {
-      id: "inline-link",
-      label: "Inline link",
-      icon: "ph--link--regular",
-      onSelect: ({ view }) => openLinkQuery(view, "@")
-    },
-    {
-      id: "inline-object",
-      label: "Inline object",
-      icon: "ph--lego--regular",
-      onSelect: ({ view }) => openLinkQuery(view, "@@")
-    }
-  ]
-};
-
-// src/components/EditorMenuProvider/EditorMenuProvider.tsx
-import { useControllableState } from "@radix-ui/react-use-controllable-state";
-import React, { Fragment, useCallback, useEffect, useRef, useState } from "react";
-import { addEventListener } from "@dxos/async";
-import { invariant } from "@dxos/invariant";
-import { DX_ANCHOR_ACTIVATE, Icon, Popover, ScrollArea, toLocalizedString, useDynamicRef, useThemeContext, useTranslation } from "@dxos/react-ui";
-var __dxlog_file = "/__w/dxos/dxos/packages/ui/react-ui-editor/src/components/EditorMenuProvider/EditorMenuProvider.tsx";
-var EditorMenuProvider = ({ children, getView, groups, currentItem, open: openProp, defaultOpen, numItems = 8, onOpenChange, onActivate, onSelect, onCancel }) => {
-  const { tx } = useThemeContext();
-  const triggerRef = useRef(null);
-  const getViewRef = useDynamicRef(getView);
-  const [open, setOpen] = useControllableState({
-    prop: openProp,
-    defaultProp: defaultOpen,
-    onChange: (open2) => {
-      const view = getViewRef.current?.();
-      invariant(view, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file, L: 23, S: void 0, A: ["view", ""] });
-      onOpenChange?.({
-        view,
-        open: open2
-      });
-    }
-  });
-  const [root, setRoot] = useState(null);
-  useEffect(() => {
-    if (!root) {
-      return;
-    }
-    return addEventListener(root, DX_ANCHOR_ACTIVATE, (event) => {
-      const { trigger, dxn } = event;
-      if (!dxn) {
-        triggerRef.current = trigger;
-        if (onActivate) {
-          const view = getViewRef.current?.();
-          if (view) {
-            onActivate({
-              view,
-              trigger: trigger.getAttribute("data-trigger") ?? void 0
-            });
-          }
-        } else {
-          requestAnimationFrame(() => setOpen(true));
-        }
-      }
-    }, {
-      capture: true,
-      passive: false
-    });
-  }, [
-    root,
-    onActivate
-  ]);
-  const handleSelect = useCallback((item) => {
-    const view = getViewRef.current?.();
-    invariant(view, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file, L: 62, S: void 0, A: ["view", ""] });
-    onSelect?.({
-      view,
-      item
-    });
-  }, [
-    getViewRef,
-    onSelect
-  ]);
-  const menuGroups = groups?.filter((group) => group.items.length > 0) ?? [];
-  return /* @__PURE__ */ React.createElement(Popover.Root, {
-    modal: false,
-    open,
-    onOpenChange: setOpen
-  }, /* @__PURE__ */ React.createElement(Popover.VirtualTrigger, {
-    virtualRef: triggerRef
-  }), /* @__PURE__ */ React.createElement(Popover.Portal, null, /* @__PURE__ */ React.createElement(Popover.Content, {
-    align: "start",
-    classNames: [
-      "flex flex-col",
-      !menuGroups.length && "hidden"
-    ],
-    style: {
-      maxBlockSize: 36 * numItems + 10
-    },
-    // NOTE: We keep the focus in the editor, but Radix routes escape key.
-    onEscapeKeyDown: () => {
-      const currentView = getViewRef.current?.();
-      if (currentView) {
-        onCancel?.({
-          view: currentView
-        });
-      }
-    },
-    onOpenAutoFocus: (event) => event.preventDefault()
-  }, /* @__PURE__ */ React.createElement(Popover.Viewport, {
-    asChild: true,
-    classNames: "dx-container"
-  }, /* @__PURE__ */ React.createElement(ScrollArea.Root, {
-    thin: true
-  }, /* @__PURE__ */ React.createElement(ScrollArea.Viewport, null, /* @__PURE__ */ React.createElement(Menu, {
-    groups: menuGroups,
-    currentItem,
-    onSelect: handleSelect
-  })))), /* @__PURE__ */ React.createElement(Popover.Arrow, null))), /* @__PURE__ */ React.createElement("div", {
-    className: "contents",
-    ref: setRoot
-  }, children));
-};
-var Menu = ({ groups, currentItem, onSelect }) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ React.createElement("ul", null, groups.map((group, index) => /* @__PURE__ */ React.createElement(Fragment, {
-    key: group.id
-  }, /* @__PURE__ */ React.createElement(MenuGroup, {
-    group,
-    currentItem,
-    onSelect
-  }), index < groups.length - 1 && /* @__PURE__ */ React.createElement("div", {
-    className: tx("menu.separator", {})
-  }))));
-};
-var MenuGroup = ({ group, currentItem, onSelect }) => {
-  const { tx } = useThemeContext();
-  const { t } = useTranslation();
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, group.label && /* @__PURE__ */ React.createElement("div", {
-    className: tx("menu.groupLabel", {})
-  }, /* @__PURE__ */ React.createElement("span", null, toLocalizedString(group.label, t))), group.items.map((item) => /* @__PURE__ */ React.createElement(MenuItem, {
-    key: item.id,
-    item,
-    current: currentItem === item.id,
-    onSelect
-  })));
-};
-var MenuItem = ({ item, current, onSelect }) => {
-  const { tx } = useThemeContext();
-  const { t } = useTranslation();
-  const listRef = useRef(null);
-  useEffect(() => {
-    if (current && listRef.current) {
-      listRef.current.scrollIntoView({
-        behavior: "smooth",
-        block: "nearest"
-      });
-    }
-  }, [
-    current
-  ]);
-  const handleSelect = useCallback(() => onSelect?.(item), [
-    item,
-    onSelect
-  ]);
-  return /* @__PURE__ */ React.createElement("li", {
-    ref: listRef,
-    className: tx("menu.item", {}, [
-      current && "bg-hover-surface"
-    ]),
-    onClick: handleSelect
-  }, item.icon && /* @__PURE__ */ React.createElement(Icon, {
-    icon: item.icon
-  }), /* @__PURE__ */ React.createElement("span", {
-    className: "grow truncate"
-  }, toLocalizedString(item.label, t)));
-};
-
-// src/components/EditorMenuProvider/useEditorMenu.ts
-import { useCallback as useCallback2, useMemo, useRef as useRef2, useState as useState2 } from "react";
-import { invariant as invariant2 } from "@dxos/invariant";
-import { modalStateEffect } from "@dxos/ui-editor";
-var __dxlog_file2 = "/__w/dxos/dxos/packages/ui/react-ui-editor/src/components/EditorMenuProvider/useEditorMenu.ts";
-var useEditorMenu = ({ trigger, triggerKey, placeholder: placeholder2, activateOnTyping, filter = true, getMenu }) => {
-  const groupsRef = useRef2([]);
-  const currentRef = useRef2(null);
-  const [currentItem, setCurrentItem] = useState2();
-  const [open, setOpen] = useState2(false);
-  const [_, refresh] = useState2({});
-  const getMenuOptions = useCallback2(async ({ text, trigger: trigger2, ...props }) => {
-    const groups = await getMenu?.({
-      text,
-      trigger: trigger2,
-      ...props
-    }) ?? [];
-    return filter && trigger2 !== "@" ? filterMenuGroups(groups, (item) => text ? item.label.toLowerCase().startsWith(text.toLowerCase()) : true) : groups;
-  }, [
-    getMenu,
-    filter
-  ]);
-  const handleOpenChange = useCallback2(async ({ view, open: open2 }) => {
-    invariant2(view, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file2, L: 40, S: void 0, A: ["view", ""] });
-    setOpen(open2);
-    if (!open2) {
-      setCurrentItem(void 0);
-      view.dispatch({
-        effects: [
-          popoverRangeEffect.of(null)
-        ]
-      });
-    }
-    requestAnimationFrame(() => {
-      view.dispatch({
-        effects: [
-          modalStateEffect.of(open2)
-        ]
-      });
-    });
-  }, [
-    getMenuOptions
-  ]);
-  const handleActivate = useCallback2(async ({ view, trigger: trigger2 }) => {
-    const item = getMenuItem(groupsRef.current, currentItem);
-    if (item) {
-      currentRef.current = item;
-    }
-    if (!open) {
-      handleOpenChange({
-        view,
-        open: true,
-        trigger: trigger2
-      });
-    }
-  }, [
-    open,
-    handleOpenChange
-  ]);
-  const handleSelect = useCallback2(({ view, item }) => {
-    const { range } = view.state.field(popoverStateField) ?? {};
-    if (range) {
-      view.dispatch({
-        changes: {
-          from: range.from,
-          to: range.to,
-          insert: ""
-        }
-      });
-    }
-    void item.onSelect?.({
-      view,
-      head: view.state.selection.main.head
-    });
-    view.focus();
-  }, []);
-  const handleCancel = useCallback2(({ view }) => {
-    const { range, trigger: trigger2 } = view.state.field(popoverStateField) ?? {};
-    if (range && trigger2) {
-      view.dispatch({
-        changes: {
-          ...range,
-          insert: ""
-        }
-      });
-    }
-  }, []);
-  const serializedTrigger = Array.isArray(trigger) ? trigger.join(",") : trigger;
-  const extension = useMemo(() => {
-    return popover({
-      trigger,
-      triggerKey,
-      placeholder: placeholder2,
-      activateOnTyping,
-      onClose: ({ view }) => handleOpenChange({
-        view,
-        open: false
-      }),
-      onEnter: ({ view }) => {
-        if (currentRef.current) {
-          handleSelect({
-            view,
-            item: currentRef.current
-          });
-          return true;
-        }
-        return false;
-      },
-      onArrowUp: () => {
-        setCurrentItem((currentItem2) => {
-          const previous = getPreviousMenuItem(groupsRef.current, currentItem2);
-          currentRef.current = previous;
-          return previous.id;
-        });
-      },
-      onArrowDown: () => {
-        setCurrentItem((currentItem2) => {
-          const next = getNextMenuItem(groupsRef.current, currentItem2);
-          currentRef.current = next;
-          return next.id;
-        });
-      },
-      onTextChange: async ({ view, pos, text, trigger: trigger2 }) => {
-        groupsRef.current = await getMenuOptions({
-          state: view.state,
-          pos,
-          text,
-          trigger: trigger2
-        }) ?? [];
-        const firstItem = groupsRef.current.filter((group) => group.items.length > 0)[0]?.items[0];
-        if (firstItem) {
-          setCurrentItem(firstItem.id);
-          currentRef.current = firstItem;
-        } else {
-          setCurrentItem(void 0);
-          currentRef.current = null;
-        }
-        refresh({});
-      }
-    });
-  }, [
-    handleOpenChange,
-    getMenuOptions,
-    serializedTrigger,
-    placeholder2,
-    activateOnTyping
-  ]);
-  return {
-    groupsRef,
-    extension,
-    currentItem,
-    open,
-    onOpenChange: handleOpenChange,
-    onActivate: handleActivate,
-    onSelect: handleSelect,
-    onCancel: handleCancel
-  };
-};
-
-// src/components/EditorToolbar/EditorToolbar.tsx
-import { Atom } from "@effect-atom/atom-react";
-import React2, { memo, useMemo as useMemo2 } from "react";
-import { ElevationProvider } from "@dxos/react-ui";
-import { Menu as Menu2, MenuBuilder, useMenuActions } from "@dxos/react-ui-menu";
-
-// src/components/EditorToolbar/blocks.ts
-import { addBlockquote, addCodeblock, insertTable, removeBlockquote, removeCodeblock } from "@dxos/ui-editor";
-import { translationKey } from "#translations";
-var blockTypes = {
-  blockquote: "ph--quotes--regular",
-  codeblock: "ph--code-block--regular",
-  table: "ph--table--regular"
-};
-var addBlocks = (state, getView) => (builder) => {
-  const value = state?.blockQuote ? "blockquote" : state.blockType ?? "";
-  builder.group("block", {
-    label: [
-      "block.label",
-      {
-        ns: translationKey
-      }
-    ],
-    iconOnly: true,
-    variant: "toggleGroup",
-    selectCardinality: "single",
-    value
-  }, (group) => {
-    for (const [type, icon] of Object.entries(blockTypes)) {
-      const checked = type === value;
-      group.action(type, {
-        label: [
-          `block.${type}.label`,
-          {
-            ns: translationKey
-          }
-        ],
-        checked,
-        ...type === "table" && {
-          disabled: !!state.blankLine
-        },
-        icon
-      }, () => {
-        const view = getView();
-        if (!view) {
-          return;
-        }
-        switch (type) {
-          case "blockquote":
-            checked ? removeBlockquote(view) : addBlockquote(view);
-            break;
-          case "codeblock":
-            checked ? removeCodeblock(view) : addCodeblock(view);
-            break;
-          case "table":
-            insertTable(view);
-            break;
-        }
-      });
-    }
-  });
-};
-
-// src/components/EditorToolbar/formatting.ts
-import { Inline, addLink, removeLink, setStyle } from "@dxos/ui-editor";
-import { translationKey as translationKey2 } from "#translations";
-var formats = {
-  strong: "ph--text-b--regular",
-  emphasis: "ph--text-italic--regular",
-  strikethrough: "ph--text-strikethrough--regular",
-  code: "ph--code--regular",
-  link: "ph--link--regular"
-};
-var addFormatting = (state, getView) => (builder) => {
-  const formatting = state;
-  builder.group("formatting", {
-    label: [
-      "formatting.label",
-      {
-        ns: translationKey2
-      }
-    ],
-    iconOnly: true,
-    variant: "toggleGroup",
-    selectCardinality: "multiple",
-    value: Object.keys(formats).filter((key) => !!formatting[key])
-  }, (group) => {
-    for (const [type, icon] of Object.entries(formats)) {
-      const checked = !!formatting[type];
-      group.action(type, {
-        label: [
-          `formatting.${type}.label`,
-          {
-            ns: translationKey2
-          }
-        ],
-        checked,
-        icon
-      }, () => {
-        const view = getView();
-        if (!view) {
-          return;
-        }
-        if (type === "link") {
-          checked ? removeLink(view) : addLink()(view);
-          return;
-        }
-        setStyle(type === "strong" ? Inline.Strong : type === "emphasis" ? Inline.Emphasis : type === "strikethrough" ? Inline.Strikethrough : Inline.Code, !checked)(view);
-      });
-    }
-  });
-};
-
-// src/components/EditorToolbar/headings.ts
-import { setHeading } from "@dxos/ui-editor";
-import { translationKey as translationKey3 } from "#translations";
-var headingIcons = {
-  0: "ph--paragraph--regular",
-  1: "ph--text-h-one--regular",
-  2: "ph--text-h-two--regular",
-  3: "ph--text-h-three--regular",
-  4: "ph--text-h-four--regular",
-  5: "ph--text-h-five--regular",
-  6: "ph--text-h-six--regular"
-};
-var computeHeadingValue = (state) => {
-  const blockType = state ? state.blockType : "paragraph";
-  const heading = blockType && /heading(\d)/.exec(blockType);
-  return heading ? heading[1] : blockType === "paragraph" || !blockType ? "0" : "";
-};
-var addHeadings = (state, getView) => (builder) => {
-  const headingValue = computeHeadingValue(state);
-  builder.group("heading", {
-    label: [
-      "heading.label",
-      {
-        ns: translationKey3
-      }
-    ],
-    icon: "ph--text-h--regular",
-    iconOnly: true,
-    variant: "dropdownMenu",
-    applyActive: true,
-    selectCardinality: "single",
-    // TODO(wittjosiah): Remove? Not sure this does anything.
-    value: headingValue
-  }, (group) => {
-    for (const [levelStr, icon] of Object.entries(headingIcons)) {
-      const level = parseInt(levelStr);
-      group.action(`heading--${levelStr}`, {
-        label: [
-          "heading-level.label",
-          {
-            count: level,
-            ns: translationKey3
-          }
-        ],
-        icon,
-        checked: levelStr === headingValue
-      }, () => setHeading(level)(getView()));
-    }
-  });
-};
-
-// src/components/EditorToolbar/image.ts
-import { translationKey as translationKey4 } from "#translations";
-var addImageUpload = (onImageUpload) => (builder) => {
-  builder.action("image", {
-    label: [
-      "image.label",
-      {
-        ns: translationKey4
-      }
-    ],
-    testId: "editor.toolbar.image",
-    icon: "ph--image-square--regular"
-  }, onImageUpload);
-};
-
-// src/components/EditorToolbar/lists.ts
-import { List, addList, removeList } from "@dxos/ui-editor";
-import { translationKey as translationKey5 } from "#translations";
-var listStyles = {
-  bullet: "ph--list-bullets--regular",
-  ordered: "ph--list-numbers--regular",
-  task: "ph--list-checks--regular"
-};
-var addLists = (state, getView) => (builder) => {
-  const value = state.listStyle ?? "";
-  builder.group("list", {
-    label: [
-      "list.label",
-      {
-        ns: translationKey5
-      }
-    ],
-    iconOnly: true,
-    variant: "toggleGroup",
-    selectCardinality: "single",
-    value
-  }, (group) => {
-    for (const [listStyle, icon] of Object.entries(listStyles)) {
-      const checked = value === listStyle;
-      group.action(`list-${listStyle}`, {
-        label: [
-          `list.${listStyle}.label`,
-          {
-            ns: translationKey5
-          }
-        ],
-        checked,
-        icon
-      }, () => {
-        const view = getView();
-        if (!view) {
-          return;
-        }
-        const listType = listStyle === "ordered" ? List.Ordered : listStyle === "bullet" ? List.Bullet : List.Task;
-        if (checked) {
-          removeList(listType)(view);
-        } else {
-          addList(listType)(view);
-        }
-      });
-    }
-  });
-};
-
-// src/components/EditorToolbar/search.ts
-import { openSearchPanel } from "@codemirror/search";
-import { translationKey as translationKey6 } from "#translations";
-var addSearch = (getView) => (builder) => {
-  builder.action("search", {
-    label: [
-      "search.label",
-      {
-        ns: translationKey6
-      }
-    ],
-    testId: "editor.toolbar.search",
-    icon: "ph--magnifying-glass--regular"
-  }, () => openSearchPanel(getView()));
-};
-
-// src/components/EditorToolbar/view-mode.ts
-import { translationKey as translationKey7 } from "#translations";
-var viewModes = {
-  preview: "ph--eye--regular",
-  source: "ph--pencil-simple--regular",
-  readonly: "ph--pencil-slash--regular"
-};
-var addViewMode = (state, onViewModeChange) => (builder) => {
-  const value = state.viewMode ?? "source";
-  builder.group("viewMode", {
-    label: [
-      "view-mode.label",
-      {
-        ns: translationKey7
-      }
-    ],
-    icon: "ph--eye--regular",
-    iconOnly: true,
-    variant: "dropdownMenu",
-    applyActive: true,
-    selectCardinality: "single",
-    value
-  }, (group) => {
-    for (const [viewMode, icon] of Object.entries(viewModes)) {
-      const checked = viewMode === value;
-      group.action(`view-mode--${viewMode}`, {
-        label: [
-          `view-mode.${viewMode}.label`,
-          {
-            ns: translationKey7
-          }
-        ],
-        checked,
-        icon
-      }, () => onViewModeChange(viewMode));
-    }
-  });
-};
-
-// src/components/EditorToolbar/EditorToolbar.tsx
-var SECTION_ROLE = "org.dxos.role.section";
-var EditorToolbar = /* @__PURE__ */ memo(({ classNames, role, attendableId, onAction, ...props }) => {
-  const menuActions = useMarkdownMenuActions(props);
-  return /* @__PURE__ */ React2.createElement(ElevationProvider, {
-    elevation: role === SECTION_ROLE ? "positioned" : "base"
-  }, /* @__PURE__ */ React2.createElement(Menu2.Root, {
-    ...menuActions,
-    attendableId,
-    onAction
-  }, /* @__PURE__ */ React2.createElement(Menu2.Toolbar, {
-    classNames
-  })));
-});
-var useMarkdownMenuActions = ({ state, getView, customActions, ...features }) => {
-  const menuCreator = useMemo2(() => createMarkdownActions({
-    state,
-    getView,
-    customActions,
-    ...features
-  }), [
-    state,
-    getView,
-    customActions,
-    features?.showHeadings,
-    features?.showFormatting,
-    features?.showLists,
-    features?.showBlocks,
-    features?.showSearch,
-    features?.onImageUpload,
-    features?.onViewModeChange
-  ]);
-  return useMenuActions(menuCreator);
-};
-var createMarkdownActions = ({ state, getView, customActions, ...features }) => {
-  return Atom.make((get) => {
-    const stateSnapshot = get(state);
-    return MenuBuilder.make().subgraph(features?.showHeadings !== false && addHeadings(stateSnapshot, getView)).subgraph(features?.showFormatting !== false && addFormatting(stateSnapshot, getView)).subgraph(features?.showLists !== false && addLists(stateSnapshot, getView)).subgraph(features?.showBlocks !== false && addBlocks(stateSnapshot, getView)).subgraph(features?.onImageUpload && addImageUpload(features.onImageUpload)).separator("gap").subgraph(customActions && get(customActions)).subgraph(features?.showSearch !== false && addSearch(getView)).subgraph(features?.onViewModeChange && addViewMode(stateSnapshot, features.onViewModeChange)).build();
-  });
-};
-
-// src/components/Editor/EditorView.tsx
-import { Transaction } from "@codemirror/state";
-import { EditorView as NaturalEditorView } from "@codemirror/view";
-import React3, { forwardRef, useEffect as useEffect3, useImperativeHandle, useRef as useRef4 } from "react";
-import { initialSync } from "@dxos/ui-editor";
-import { mx } from "@dxos/ui-theme";
-
-// src/hooks/useBasicMarkdownExtensions.ts
-import { useMemo as useMemo3 } from "react";
-import { useThemeContext as useThemeContext2 } from "@dxos/react-ui";
-import { createBasicExtensions, createMarkdownExtensions, createThemeExtensions, decorateMarkdown } from "@dxos/ui-editor";
-var useBasicMarkdownExtensions = ({ placeholder: placeholder2, decorate = true, readonly = false, extensions } = {}) => {
-  const { themeMode } = useThemeContext2();
-  return useMemo3(() => [
-    createBasicExtensions({
-      placeholder: placeholder2,
-      readOnly: readonly
-    }),
-    createThemeExtensions({
-      syntaxHighlighting: true,
-      themeMode
-    }),
-    createMarkdownExtensions(),
-    ...decorate ? [
-      decorateMarkdown()
-    ] : [],
-    ...extensions ?? []
-  ], [
-    placeholder2,
-    themeMode,
-    decorate,
-    readonly,
-    extensions
-  ]);
-};
-
-// src/hooks/useTextEditor.ts
-import { EditorState } from "@codemirror/state";
-import { EditorView as EditorView2 } from "@codemirror/view";
-import { useCallback as useCallback3, useEffect as useEffect2, useMemo as useMemo4, useRef as useRef3, useState as useState3 } from "react";
-import { log } from "@dxos/log";
-import { createEditorStateTransaction, debugDispatcher, documentId, modalStateField as modalStateField2 } from "@dxos/ui-editor";
-import { getProviderValue, isTruthy as isTruthy2 } from "@dxos/util";
-var __dxlog_file3 = "/__w/dxos/dxos/packages/ui/react-ui-editor/src/hooks/useTextEditor.ts";
-var instanceCount = 0;
-var useTextEditor = (props = {}, deps = []) => {
-  const { id, doc, initialValue, extensions, autoFocus, scrollTo, selection, selectionEnd, debug } = useMemo4(() => getProviderValue(props), deps ?? []);
-  const [instanceId] = useState3(() => `text-editor-${++instanceCount}`);
-  const [view, setView] = useState3(null);
-  const parentRef = useRef3(null);
-  useEffect2(() => {
-    let view2 = null;
-    if (parentRef.current) {
-      log("create", {
-        id,
-        instanceId,
-        doc: initialValue?.length ?? 0
-      }, { "~LogMeta": "~LogMeta", F: __dxlog_file3, L: 22, S: void 0 });
-      let initialSelection;
-      if (selection?.anchor && initialValue?.length) {
-        if (selection.anchor <= initialValue.length && (selection?.head ?? 0) <= initialValue.length) {
-          initialSelection = selection;
-        }
-      } else if (selectionEnd && selection === void 0) {
-        const index = initialValue?.indexOf("\n");
-        const anchor = !index || index === -1 ? 0 : index;
-        initialSelection = {
-          anchor
-        };
-      }
-      const state = EditorState.create({
-        doc: doc ?? initialValue,
-        // selection: initialSelection,
-        extensions: [
-          id && documentId.of(id),
-          extensions,
-          // NOTE: This doesn't catch errors in keymap functions.
-          EditorView2.exceptionSink.of((err) => {
-            log.catch(err, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file3, L: 48, S: void 0 });
-          })
-        ].filter(isTruthy2)
-      });
-      view2 = new EditorView2({
-        parent: parentRef.current,
-        state,
-        scrollTo: scrollTo ? EditorView2.scrollIntoView(scrollTo, {
-          yMargin: 96
-        }) : void 0,
-        dispatchTransactions: debug ? debugDispatcher : void 0
-      });
-      if (selectionEnd && !initialSelection) {
-        const { to } = view2.state.doc.lineAt(0);
-        if (to) {
-          view2.dispatch({
-            selection: {
-              anchor: to
-            }
-          });
-        }
-      }
-      setView(view2);
-    }
-    return () => {
-      log("destroy", {
-        id
-      }, { "~LogMeta": "~LogMeta", F: __dxlog_file3, L: 75, S: void 0 });
-      view2?.destroy();
-    };
-  }, deps);
-  useEffect2(() => {
-    if (view) {
-      if (scrollTo || selection) {
-        if (selection && selection.anchor > view.state.doc.length) {
-          log.warn("invalid selection", {
-            length: view.state.doc.length,
-            scrollTo,
-            selection
-          }, { "~LogMeta": "~LogMeta", F: __dxlog_file3, L: 85, S: void 0 });
-          return;
-        }
-        view.dispatch(createEditorStateTransaction({
-          scrollTo,
-          selection
-        }));
-      }
-    }
-  }, [
-    view,
-    scrollTo,
-    selection
-  ]);
-  useEffect2(() => {
-    if (view && autoFocus) {
-      view.focus();
-    }
-  }, [
-    autoFocus,
-    view
-  ]);
-  const handleKeyDown = useCallback3((event) => {
-    const { key, target, currentTarget } = event;
-    switch (key) {
-      case "Escape": {
-        const modal = view?.state.field(modalStateField2, false);
-        if (modal) {
-          return;
-        }
-        const element = view?.contentDOM.closest('[tabindex="0"]');
-        element?.focus();
-        break;
-      }
-      case "Enter": {
-        event.preventDefault();
-        if (target === currentTarget) {
-          view?.focus();
-        }
-        break;
-      }
-    }
-  }, [
-    view
-  ]);
-  return {
-    parentRef,
-    view,
-    focusAttributes: {
-      tabIndex: 0,
-      onKeyDown: handleKeyDown
-    }
-  };
-};
-
-// src/components/Editor/controller.ts
-var withHiddenView = (controller) => {
-  Object.defineProperty(controller, "view", {
-    enumerable: false
-  });
-  return controller;
-};
-var noopController = withHiddenView({
-  get view() {
-    return null;
-  },
-  getText: () => "",
-  setText: () => {
-  },
-  focus: () => {
-  }
-});
-var createEditorController = (view) => {
-  return withHiddenView({
-    get view() {
-      return view;
-    },
-    getText: () => {
-      return view?.state.doc.toString() ?? "";
-    },
-    setText: (text, focus) => {
-      view?.dispatch({
-        changes: {
-          from: 0,
-          to: view?.state.doc.length ?? 0,
-          insert: text
-        },
-        selection: {
-          anchor: text.length,
-          head: text.length
-        }
-      });
-      if (focus) {
-        view?.focus();
-      }
-    },
-    focus: () => view?.focus()
-  });
-};
-
-// src/components/Editor/EditorView.tsx
-var EditorView3 = /* @__PURE__ */ forwardRef(({ classNames, id, extensions, selectionEnd, focusable = true, value, onChange, ...props }, forwardedRef) => {
-  const onChangeRef = useRef4(onChange);
-  onChangeRef.current = onChange;
-  const { parentRef, focusAttributes, view } = useTextEditor(() => ({
-    id,
-    initialValue: value,
-    selectionEnd,
-    extensions: [
-      extensions ?? [],
-      NaturalEditorView.updateListener.of(({ view: view2, docChanged, transactions }) => {
-        const isInitialSync = transactions.some((tr) => tr.annotation(Transaction.userEvent) === initialSync.value);
-        if (!isInitialSync && docChanged) {
-          onChangeRef.current?.(view2.state.doc.toString());
-        }
-      })
-    ],
-    ...props
-  }), [
-    id,
-    extensions,
-    selectionEnd
-  ]);
-  useImperativeHandle(forwardedRef, () => {
-    return createEditorController(view);
-  }, [
-    id,
-    view
-  ]);
-  useEffect3(() => {
-    if (!view) {
-      return;
-    }
-    const next = value ?? "";
-    if (view.state.doc.toString() === next) {
-      return;
-    }
-    requestAnimationFrame(() => {
-      if (view.state.doc.toString() === next) {
-        return;
-      }
-      view.dispatch({
-        annotations: initialSync,
-        changes: [
-          {
-            from: 0,
-            to: view.state.doc.length,
-            insert: next
-          }
-        ],
-        selection: selectionEnd ? {
-          anchor: next.length
-        } : void 0
-      });
-      if (selectionEnd) {
-        view.focus();
-      }
-    });
-  }, [
-    view,
-    value,
-    selectionEnd
-  ]);
-  return /* @__PURE__ */ React3.createElement("div", {
-    className: mx("w-full outline-hidden focus:border-accent-bg focus-within:border-focus-ring-subtle", classNames),
-    ...focusable ? focusAttributes : {},
-    ref: parentRef
-  });
-});
-
-// src/components/Editor/Editor.tsx
-var __dxlog_file4 = "/__w/dxos/dxos/packages/ui/react-ui-editor/src/components/Editor/Editor.tsx";
-var [EditorContextProvider, useEditorContext] = createContext("Editor");
-var EditorRoot = /* @__PURE__ */ forwardRef2(({ children, extensions: extensionsProp, viewMode, numItems, ...props }, forwardedRef) => {
-  const state = useMemo5(() => Atom2.make({
-    viewMode
-  }), [
-    viewMode
-  ]);
-  const { groupsRef, extension, ...menuProps } = useEditorMenu(props);
-  const extensions = useMemo5(() => [
-    extension,
-    extensionsProp
-  ].filter(isNonNullable2).flat(), [
-    extension,
-    extensionsProp
-  ]);
-  const [controller, setController] = useState4(noopController);
-  useImperativeHandle2(forwardedRef, () => controller, [
-    controller
-  ]);
-  const getView = useCallback4(() => controller?.view ?? null, [
-    controller
-  ]);
-  return /* @__PURE__ */ React4.createElement(EditorContextProvider, {
-    controller,
-    setController,
-    extensions,
-    state
-  }, /* @__PURE__ */ React4.createElement(EditorMenuProvider, {
-    getView,
-    groups: groupsRef.current,
-    numItems,
-    ...menuProps
-  }, children));
-});
-EditorRoot.displayName = "Editor.Root";
-var EDITOR_CONTENT_NAME = "Editor.Content";
-var EditorContent = ({ classNames, children }) => {
-  return /* @__PURE__ */ React4.createElement("div", {
-    className: mx2("grid grid-rows-[min-content_1fr] h-full overflow-hidden", classNames)
-  }, children);
-};
-EditorContent.displayName = EDITOR_CONTENT_NAME;
-var EDITOR_VIEW_NAME = "Editor.View";
-var EditorView4 = ({ extensions: providedExtensions, ...props }) => {
-  const { extensions: additionalExtensions = [], setController } = useEditorContext(EDITOR_VIEW_NAME);
-  const extensions = useMemo5(() => [
-    additionalExtensions,
-    providedExtensions
-  ].filter(isNonNullable2).flat(), [
-    providedExtensions,
-    additionalExtensions
-  ]);
-  return /* @__PURE__ */ React4.createElement(EditorView3, {
-    ...props,
-    extensions,
-    ref: setController
-  });
-};
-EditorView4.displayName = EDITOR_VIEW_NAME;
-var EDITOR_TOOLBAR_NAME = "Editor.Toolbar";
-var EditorToolbar2 = (props) => {
-  const { controller, state } = useEditorContext(EDITOR_TOOLBAR_NAME);
-  const getView = useCallback4(() => {
-    invariant3(controller?.view, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file4, L: 102, S: void 0, A: ["controller?.view", ""] });
-    return controller?.view;
-  }, [
-    controller
-  ]);
-  return /* @__PURE__ */ React4.createElement(EditorToolbar, {
-    ...props,
-    getView,
-    state
-  });
-};
-EditorToolbar2.displayName = EDITOR_TOOLBAR_NAME;
-var Editor = {
-  Root: EditorRoot,
-  Toolbar: EditorToolbar2,
-  Content: EditorContent,
-  View: EditorView4
-};
-
-// src/components/EditorPreviewProvider/EditorPreviewProvider.tsx
-import { createContext as createContext2 } from "@radix-ui/react-context";
-import React5, { useCallback as useCallback5, useEffect as useEffect4, useRef as useRef5, useState as useState5 } from "react";
-import { addEventListener as addEventListener2 } from "@dxos/async";
-import { DX_ANCHOR_ACTIVATE as DX_ANCHOR_ACTIVATE2, Popover as Popover2 } from "@dxos/react-ui";
-var [EditorPreviewContextProvider, useEditorPreview] = createContext2("PreviewPopover", {});
-var EditorPreviewProvider = ({ children, onLookup }) => {
-  const triggerRef = useRef5(null);
-  const [value, setValue] = useState5({});
-  const [open, setOpen] = useState5(false);
-  const handleActivate = useCallback5((event) => {
-    const { dxn, label, trigger } = event;
-    setValue((value2) => ({
-      ...value2,
-      link: {
-        label,
-        dxn
-      },
-      pending: true
-    }));
-    triggerRef.current = trigger;
-    queueMicrotask(() => setOpen(true));
-    void onLookup?.({
-      label,
-      dxn
-    }).then((target) => setValue((value2) => ({
-      ...value2,
-      target: target ?? void 0,
-      pending: false
-    })));
-  }, [
-    onLookup
-  ]);
-  const [root, setRoot] = useState5(null);
-  useEffect4(() => {
-    if (!root || !handleActivate) {
-      return;
-    }
-    return addEventListener2(root, DX_ANCHOR_ACTIVATE2, handleActivate, {
-      capture: true,
-      passive: false
-    });
-  }, [
-    root,
-    handleActivate
-  ]);
-  return /* @__PURE__ */ React5.createElement(EditorPreviewContextProvider, {
-    pending: value.pending,
-    link: value.link,
-    target: value.target
-  }, /* @__PURE__ */ React5.createElement(Popover2.Root, {
-    open,
-    onOpenChange: setOpen
-  }, /* @__PURE__ */ React5.createElement(Popover2.VirtualTrigger, {
-    virtualRef: triggerRef
-  }), /* @__PURE__ */ React5.createElement("div", {
-    className: "contents",
-    ref: setRoot
-  }, children)));
-};
-
-// src/extensions/assistant-extension.tsx
-import { forEachDiagnostic, linter, setDiagnostics } from "@codemirror/lint";
-import { ChangeSet } from "@codemirror/state";
-import { EditorView as EditorView5 } from "@codemirror/view";
-import { log as log2 } from "@dxos/log";
-import { safeParseJson, trim } from "@dxos/util";
-var __dxlog_file5 = "/__w/dxos/dxos/packages/ui/react-ui-editor/src/extensions/assistant-extension.tsx";
-var DEFAULT_INSTRUCTIONS = trim`
-  Proofread the input text below.
-  Identify typos and grammatical errors. 
-  Return ONLY a valid JSON array of objects with fields: "original" (string), "replacement" (string), "context" (string, 3-5 words around match).
-  --
-`;
-var underline = (color) => {
-  const svg = trim`
-    <svg xmlns="http://www.w3.org/2000/svg" width="6" height="3">
-      <path d="m0 3 l2 -2 l1 0 l2 2 l1 0" stroke="${color}" fill="none" stroke-width="1"/>
-    </svg>
-  `;
-  return `url('data:image/svg+xml;base64,${btoa(svg)}') !important`;
-};
-var assistant = (options) => {
-  const styles = getComputedStyle(document.documentElement);
-  const style = {
-    info: styles.getPropertyValue("--color-green-500").trim(),
-    warning: styles.getPropertyValue("--color-orange-500").trim(),
-    error: styles.getPropertyValue("--color-rose-500").trim()
-  };
-  return [
-    assistantLinter(options),
-    EditorView5.baseTheme({
-      ".cm-lintRange-info": {
-        backgroundImage: underline(style.info)
-      },
-      ".cm-lintRange-warning": {
-        backgroundImage: underline(style.warning)
-      },
-      ".cm-lintRange-error": {
-        backgroundImage: underline(style.error)
-      },
-      ".cm-panels-bottom": {
-        borderTop: "1px solid var(--color-separator) !important"
-      },
-      ".cm-panel-lint .cm-panel": {
-        outline: "none !important"
-      },
-      /** @apply dx-button */
-      ".cm-panel button": {
-        color: "var(--color-base-fg) !important"
-      },
-      ".cm-panel.cm-panel-lint ul": {
-        color: "var(--color-base-fg) !important",
-        backgroundColor: "var(--color-base-surface) !important",
-        marginRight: "2rem !important"
-      },
-      ".cm-panel.cm-panel-lint ul [aria-selected]": {
-        color: "var(--color-base-fg) !important",
-        backgroundColor: "var(--color-base-surface) !important"
-      },
-      ".cm-panel.cm-panel-lint ul li": {
-        display: "grid",
-        gridTemplateColumns: "1fr auto",
-        alignItems: "center"
-      },
-      ".cm-panel.cm-panel-lint ul li .cm-diagnosticText": {
-        paddingRight: "8px !important"
-      },
-      ".cm-panel.cm-panel-lint ul li button.cm-diagnosticAction": {
-        margin: "none !important"
-      },
-      ".cm-diagnostic": {
-        padding: "0px 8px !important",
-        whiteSpace: "pre-wrap !important"
-      },
-      ".cm-diagnostic-info": {
-        border: "none !important"
-      }
-    })
-  ];
-};
-var isSuggestion = (value) => typeof value === "object" && value !== null && typeof value.original === "string" && typeof value.replacement === "string" && typeof value.context === "string";
-var findSuggestionIndex = (content, suggestion) => {
-  const firstIdx = content.indexOf(suggestion.original);
-  if (firstIdx === -1) {
-    return -1;
-  }
-  const secondIdx = content.indexOf(suggestion.original, firstIdx + 1);
-  if (secondIdx === -1) {
-    return firstIdx;
-  }
-  const contextIdx = content.indexOf(suggestion.context);
-  if (contextIdx !== -1) {
-    const contextEnd = contextIdx + suggestion.context.length;
-    if (secondIdx >= contextIdx && secondIdx <= contextEnd) {
-      return secondIdx;
-    }
-  }
-  return firstIdx;
-};
-var replaceTextAndDropLintAtRange = (view, from, to, insert) => {
-  const kept = [];
-  forEachDiagnostic(view.state, (diagnostic, diagnosticFrom, diagnosticTo) => {
-    if (diagnosticFrom < to && diagnosticTo > from) {
-      return;
-    }
-    kept.push({
-      ...diagnostic,
-      from: diagnosticFrom,
-      to: diagnosticTo
-    });
-  });
-  const changeSet = ChangeSet.of({
-    from,
-    to,
-    insert
-  }, view.state.doc.length);
-  const next = kept.map((d) => ({
-    ...d,
-    from: changeSet.mapPos(d.from, 1),
-    to: changeSet.mapPos(d.to, -1)
-  }));
-  view.dispatch({
-    changes: {
-      from,
-      to,
-      insert
-    },
-    ...setDiagnostics(view.state, next)
-  });
-};
-var assistantLinter = ({ generate, instructions = DEFAULT_INSTRUCTIONS, autoPanel = true, delay = 2e3 }) => linter(async (view) => {
-  try {
-    const content = view.state.doc.toString();
-    const result = await generate({
-      instructions,
-      content
-    });
-    const [match] = result.match(/\[.*\]/s) ?? [];
-    const parsed = match ? safeParseJson(match, []) : [];
-    const suggestions = Array.isArray(parsed) ? parsed.filter(isSuggestion) : [];
-    if (suggestions && suggestions.length > 0) {
-      const diagnostics = [];
-      for (const suggestion of suggestions) {
-        const idx = findSuggestionIndex(content, suggestion);
-        if (idx !== -1) {
-          diagnostics.push({
-            from: idx,
-            to: idx + suggestion.original.length,
-            severity: "info",
-            message: `Suggestion: ${suggestion.replacement}`,
-            actions: [
-              {
-                name: "Apply",
-                apply: (view2, from, to) => {
-                  replaceTextAndDropLintAtRange(view2, from, to, suggestion.replacement);
-                }
-              }
-            ]
-          });
-        }
-      }
-      return diagnostics;
-    }
-  } catch (err) {
-    log2.catch(err, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file5, L: 169, S: void 0 });
-  }
-  return [];
-}, {
-  delay,
-  autoPanel
-});
-export {
-  Editor,
-  EditorMenuProvider,
-  EditorPreviewProvider,
-  assistant,
-  createEditorController,
-  createMenuGroup,
-  filterMenuGroups,
-  formattingCommands,
-  getMenuItem,
-  getNextMenuItem,
-  getPreviousMenuItem,
-  linkSlashCommands,
-  popover,
-  popoverRangeEffect,
-  popoverStateField,
-  useBasicMarkdownExtensions,
-  useEditorContext,
-  useEditorMenu,
-  useEditorPreview,
-  useTextEditor
-};
-//# sourceMappingURL=index.mjs.map