@dxos/react-ui-editor 0.6.9 → 0.6.10-main.e92b5eb

package/dist/lib/browser/index.mjs

@@ -2295,7 +2295,7 @@ var dropFile = (options = {}) => {
 
 // packages/ui/react-ui-editor/src/extensions/factories.ts
 import { closeBrackets, closeBracketsKeymap } from "@codemirror/autocomplete";
-import { defaultKeymap, history, historyKeymap, standardKeymap } from "@codemirror/commands";
+import { defaultKeymap, history, historyKeymap, indentWithTab, standardKeymap } from "@codemirror/commands";
 import { bracketMatching } from "@codemirror/language";
 import { searchKeymap } from "@codemirror/search";
 import { EditorState } from "@codemirror/state";
@@ -2340,7 +2340,9 @@ var createBasicExtensions = (_props) => {
     props.bracketMatching && bracketMatching(),
     props.closeBrackets && closeBrackets(),
     props.dropCursor && dropCursor2(),
-    props.drawSelection && drawSelection(),
+    props.drawSelection && drawSelection({
+      cursorBlinkRate: 1200
+    }),
     props.highlightActiveLine && highlightActiveLine(),
     props.history && history(),
     props.lineNumbers && lineNumbers(),
@@ -2355,9 +2357,11 @@ var createBasicExtensions = (_props) => {
     // https://codemirror.net/docs/ref/#view.KeyBinding
     keymap5.of([
       ...(props.keymap && keymaps[props.keymap]) ?? [],
-      // NOTE: Tab configured by markdown extension.
+      // NOTE: Tabs are also configured by markdown extension.
       // https://codemirror.net/docs/ref/#commands.indentWithTab
-      // ...(props.indentWithTab ? [indentWithTab] : []),
+      ...props.indentWithTab ? [
+        indentWithTab
+      ] : [],
       // https://codemirror.net/docs/ref/#autocomplete.closeBracketsKeymap
       ...props.closeBrackets ? closeBracketsKeymap : [],
       // https://codemirror.net/docs/ref/#commands.historyKeymap
@@ -2443,7 +2447,7 @@ var listener = ({ onFocus, onChange }) => {
 
 // packages/ui/react-ui-editor/src/extensions/markdown/formatting.ts
 import { snippet } from "@codemirror/autocomplete";
-import { indentWithTab } from "@codemirror/commands";
+import { indentWithTab as indentWithTab2 } from "@codemirror/commands";
 import { syntaxTree as syntaxTree2 } from "@codemirror/language";
 import { EditorSelection } from "@codemirror/state";
 import { EditorView as EditorView11, keymap as keymap6 } from "@codemirror/view";
@@ -3604,7 +3608,7 @@ var processAction = (view, action) => {
 
 // packages/ui/react-ui-editor/src/extensions/markdown/bundle.ts
 import { completionKeymap as completionKeymap2 } from "@codemirror/autocomplete";
-import { defaultKeymap as defaultKeymap2, indentWithTab as indentWithTab2 } from "@codemirror/commands";
+import { defaultKeymap as defaultKeymap2, indentWithTab as indentWithTab3 } from "@codemirror/commands";
 import { markdownLanguage as markdownLanguage3, markdown } from "@codemirror/lang-markdown";
 import { defaultHighlightStyle, syntaxHighlighting } from "@codemirror/language";
 import { languages } from "@codemirror/language-data";
@@ -3812,6 +3816,8 @@ var createMarkdownExtensions = ({ themeMode } = {}) => {
       base: markdownLanguage3,
       // Languages for syntax highlighting fenced code blocks.
       codeLanguages: languages,
+      // Don't complete HTML tags.
+      completeHTMLTags: false,
       // Parser extensions.
       extensions: [
         // GFM provided by default.
@@ -3825,7 +3831,7 @@ var createMarkdownExtensions = ({ themeMode } = {}) => {
     keymap7.of([
       // TODO(burdon): Indent by 4 if in task list.
       // https://codemirror.net/docs/ref/#commands.indentWithTab
-      indentWithTab2,
+      indentWithTab3,
       // https://codemirror.net/docs/ref/#commands.defaultKeymap
       ...defaultKeymap2,
       ...completionKeymap2,
@@ -4235,7 +4241,7 @@ var autoHideTags = /* @__PURE__ */ new Set([
   "SuperscriptMark"
 ]);
 var bulletListIndentationWidth = 24;
-var orderedListIndentationWidth = 32;
+var orderedListIndentationWidth = 36;
 var buildDecorations2 = (view, options, focus) => {
   const deco = new RangeSetBuilder3();
   const atomicDeco = new RangeSetBuilder3();
@@ -4336,31 +4342,36 @@ var buildDecorations2 = (view, options, focus) => {
         const list = getCurrentList();
         const width = list.type === "OrderedList" ? orderedListIndentationWidth : bulletListIndentationWidth;
         const offset = ((list.level ?? 0) + 1) * width;
-        const start = state2.doc.lineAt(node.from);
-        deco.add(start.from, start.from, Decoration7.line({
+        const line = state2.doc.lineAt(node.from);
+        if (node.from === line.to - 1) {
+          return false;
+        }
+        deco.add(line.from, line.from, Decoration7.line({
           class: "cm-list-item",
           attributes: {
-            // Subtract 0.25em to account for the space CM adds to Paragraph nodes following the ListItem.
-            // Note: This makes the cursor appear to be left of the margin.
-            style: `padding-left: ${offset}px; text-indent: calc(-${width}px - 0.25em);`
+            style: `padding-left: ${offset}px; text-indent: -${width}px;`
           }
         }));
-        const line = state2.doc.sliceString(start.from, node.to);
-        const whitespace = line.match(/^ */)?.[0].length ?? 0;
+        const text = state2.doc.sliceString(line.from, node.to);
+        const whitespace = text.match(/^ */)?.[0].length ?? 0;
         if (whitespace) {
-          atomicDeco.add(start.from, start.from + whitespace, hide);
+          atomicDeco.add(line.from, line.from + whitespace, hide);
         }
         break;
       }
       case "ListMark": {
-        const task = tree.resolve(node.to + 1, 1).name === "TaskMarker";
-        if (task) {
-          atomicDeco.add(node.from, node.to, hide);
+        const next = tree.resolve(node.to + 1, 1);
+        if (next?.name === "TaskMarker") {
+          atomicDeco.add(node.from, node.to + 1, hide);
           break;
         }
         const list = getCurrentList();
-        const label = list.type === "OrderedList" ? `${++list.number}.` : "-";
-        atomicDeco.add(node.from, node.to, Decoration7.replace({
+        const text = state2.doc.sliceString(node.from, node.to + 1);
+        if (list.type === "BulletList" && text[1] !== " ") {
+          return false;
+        }
+        const label = list.type === "OrderedList" ? `${++list.number}.` : "\u2022";
+        atomicDeco.add(node.from, node.to + 1, Decoration7.replace({
           widget: new TextWidget(label, list.type === "OrderedList" ? "cm-list-mark cm-list-mark-ordered" : "cm-list-mark cm-list-mark-bullet")
         }));
         break;
@@ -4368,10 +4379,7 @@ var buildDecorations2 = (view, options, focus) => {
       case "TaskMarker": {
         if (!editingRange(state2, node, focus)) {
           const checked = state2.doc.sliceString(node.from + 1, node.to - 1) === "x";
-          atomicDeco.add(node.from - 2, node.from - 1, Decoration7.mark({
-            class: "cm-task-checkbox"
-          }));
-          atomicDeco.add(node.from, node.to, checked ? checkedTask : uncheckedTask);
+          atomicDeco.add(node.from, node.to + 1, checked ? checkedTask : uncheckedTask);
         }
         break;
       }
@@ -4570,7 +4578,7 @@ var formattingStyles = EditorView14.baseTheme({
   },
   "& .cm-task": {
     display: "inline-block",
-    width: `calc(${bulletListIndentationWidth}px - 0.25em)`,
+    width: `${bulletListIndentationWidth}px`,
     color: getToken("extend.colors.blue.500")
   },
   "& .cm-task-checkbox": {
@@ -4582,6 +4590,7 @@ var formattingStyles = EditorView14.baseTheme({
   "& .cm-list-mark": {
     display: "inline-block",
     textAlign: "right",
+    paddingRight: "0.5em",
     fontVariant: "tabular-nums"
   },
   "& .cm-list-mark-bullet": {