@dxos/react-ui-editor 0.6.12-main.f9d0246 → 0.6.12-staging.e11e696

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (104) hide show
  1. package/dist/lib/browser/chunk-AZWYO7TE.mjs +148 -0
  2. package/dist/lib/browser/chunk-AZWYO7TE.mjs.map +7 -0
  3. package/dist/lib/browser/index.mjs +150 -268
  4. package/dist/lib/browser/index.mjs.map +4 -4
  5. package/dist/lib/browser/meta.json +1 -1
  6. package/dist/lib/browser/state/index.mjs +17 -0
  7. package/dist/lib/browser/state/index.mjs.map +7 -0
  8. package/dist/lib/node/chunk-5RSKGJRI.cjs +169 -0
  9. package/dist/lib/node/chunk-5RSKGJRI.cjs.map +7 -0
  10. package/dist/lib/node/index.cjs +5480 -0
  11. package/dist/lib/node/index.cjs.map +7 -0
  12. package/dist/lib/node/meta.json +1 -0
  13. package/dist/lib/node/state/index.cjs +39 -0
  14. package/dist/lib/node/state/index.cjs.map +7 -0
  15. package/dist/lib/node-esm/chunk-RCIWLRIY.mjs +150 -0
  16. package/dist/lib/node-esm/chunk-RCIWLRIY.mjs.map +7 -0
  17. package/dist/lib/node-esm/index.mjs +5472 -0
  18. package/dist/lib/node-esm/index.mjs.map +7 -0
  19. package/dist/lib/node-esm/meta.json +1 -0
  20. package/dist/lib/node-esm/state/index.mjs +18 -0
  21. package/dist/lib/node-esm/state/index.mjs.map +7 -0
  22. package/dist/types/src/TextEditor.stories.d.ts +3 -0
  23. package/dist/types/src/TextEditor.stories.d.ts.map +1 -1
  24. package/dist/types/src/extensions/autocomplete.d.ts +2 -1
  25. package/dist/types/src/extensions/autocomplete.d.ts.map +1 -1
  26. package/dist/types/src/extensions/automerge/cursor.d.ts +1 -1
  27. package/dist/types/src/extensions/automerge/cursor.d.ts.map +1 -1
  28. package/dist/types/src/extensions/awareness/awareness.d.ts +2 -2
  29. package/dist/types/src/extensions/awareness/awareness.d.ts.map +1 -1
  30. package/dist/types/src/extensions/command/state.d.ts +2 -2
  31. package/dist/types/src/extensions/command/state.d.ts.map +1 -1
  32. package/dist/types/src/extensions/comments.d.ts +1 -1
  33. package/dist/types/src/extensions/comments.d.ts.map +1 -1
  34. package/dist/types/src/extensions/debug.d.ts +2 -2
  35. package/dist/types/src/extensions/debug.d.ts.map +1 -1
  36. package/dist/types/src/extensions/folding.d.ts.map +1 -1
  37. package/dist/types/src/extensions/index.d.ts +0 -4
  38. package/dist/types/src/extensions/index.d.ts.map +1 -1
  39. package/dist/types/src/extensions/markdown/decorate.d.ts.map +1 -1
  40. package/dist/types/src/extensions/markdown/highlight.d.ts.map +1 -1
  41. package/dist/types/src/extensions/markdown/link.d.ts +1 -1
  42. package/dist/types/src/extensions/markdown/link.d.ts.map +1 -1
  43. package/dist/types/src/extensions/markdown/styles.d.ts.map +1 -1
  44. package/dist/types/src/extensions/modes.d.ts +3 -3
  45. package/dist/types/src/extensions/modes.d.ts.map +1 -1
  46. package/dist/types/src/extensions/util/overlap.d.ts +1 -1
  47. package/dist/types/src/extensions/util/overlap.d.ts.map +1 -1
  48. package/dist/types/src/extensions/util/react.d.ts +1 -1
  49. package/dist/types/src/extensions/util/react.d.ts.map +1 -1
  50. package/dist/types/src/hooks/useTextEditor.d.ts +1 -1
  51. package/dist/types/src/hooks/useTextEditor.d.ts.map +1 -1
  52. package/dist/types/src/index.d.ts +1 -0
  53. package/dist/types/src/index.d.ts.map +1 -1
  54. package/dist/types/src/{extensions → state}/cursor.d.ts +2 -2
  55. package/dist/types/src/state/cursor.d.ts.map +1 -0
  56. package/dist/types/src/state/doc.d.ts +5 -0
  57. package/dist/types/src/state/doc.d.ts.map +1 -0
  58. package/dist/types/src/state/index.d.ts +6 -0
  59. package/dist/types/src/state/index.d.ts.map +1 -0
  60. package/dist/types/src/state/state.d.ts.map +1 -0
  61. package/dist/types/src/state/types.d.ts.map +1 -0
  62. package/dist/types/src/state/util.d.ts +3 -0
  63. package/dist/types/src/state/util.d.ts.map +1 -0
  64. package/dist/types/src/styles/markdown.d.ts +1 -2
  65. package/dist/types/src/styles/markdown.d.ts.map +1 -1
  66. package/dist/types/src/styles/theme.d.ts.map +1 -1
  67. package/package.json +45 -33
  68. package/src/TextEditor.stories.tsx +9 -5
  69. package/src/extensions/annotations.ts +1 -1
  70. package/src/extensions/autocomplete.ts +9 -8
  71. package/src/extensions/automerge/automerge.stories.tsx +1 -1
  72. package/src/extensions/automerge/automerge.ts +1 -1
  73. package/src/extensions/automerge/cursor.ts +1 -1
  74. package/src/extensions/awareness/awareness.ts +3 -5
  75. package/src/extensions/command/state.ts +3 -4
  76. package/src/extensions/comments.ts +37 -43
  77. package/src/extensions/debug.ts +2 -2
  78. package/src/extensions/folding.tsx +4 -2
  79. package/src/extensions/index.ts +0 -4
  80. package/src/extensions/markdown/decorate.ts +49 -6
  81. package/src/extensions/markdown/highlight.ts +0 -5
  82. package/src/extensions/markdown/link.ts +3 -2
  83. package/src/extensions/markdown/styles.ts +10 -0
  84. package/src/extensions/modes.ts +6 -5
  85. package/src/extensions/util/overlap.ts +1 -1
  86. package/src/extensions/util/react.tsx +5 -1
  87. package/src/hooks/useTextEditor.ts +3 -2
  88. package/src/index.ts +1 -0
  89. package/src/{extensions → state}/cursor.ts +3 -6
  90. package/src/state/doc.ts +10 -0
  91. package/src/state/index.ts +11 -0
  92. package/src/{extensions → state}/state.ts +1 -0
  93. package/src/state/util.ts +13 -0
  94. package/src/styles/markdown.ts +1 -3
  95. package/src/styles/theme.ts +1 -0
  96. package/dist/types/src/extensions/cursor.d.ts.map +0 -1
  97. package/dist/types/src/extensions/doc.d.ts +0 -6
  98. package/dist/types/src/extensions/doc.d.ts.map +0 -1
  99. package/dist/types/src/extensions/state.d.ts.map +0 -1
  100. package/dist/types/src/extensions/types.d.ts.map +0 -1
  101. package/src/extensions/doc.ts +0 -17
  102. /package/dist/types/src/{extensions → state}/state.d.ts +0 -0
  103. /package/dist/types/src/{extensions → state}/types.d.ts +0 -0
  104. /package/src/{extensions → state}/types.ts +0 -0
@@ -1,3 +1,12 @@
1
+ import {
2
+ Cursor,
3
+ createEditorStateTransaction,
4
+ documentId,
5
+ localStorageStateStoreAdapter,
6
+ singleValueFacet,
7
+ state
8
+ } from "./chunk-AZWYO7TE.mjs";
9
+
1
10
  // packages/ui/react-ui-editor/src/translations.ts
2
11
  var translationKey = "react-ui-editor";
3
12
  var translations_default = [
@@ -34,7 +43,7 @@ var translations_default = [
34
43
  ];
35
44
 
36
45
  // packages/ui/react-ui-editor/src/index.ts
37
- import { keymap as keymap11 } from "@codemirror/view";
46
+ import { keymap as keymap10 } from "@codemirror/view";
38
47
  import { tags as tags2 } from "@lezer/highlight";
39
48
  import { TextKind } from "@dxos/protocols/proto/dxos/echo/model/text";
40
49
 
@@ -50,47 +59,6 @@ import { getSize as getSize2 } from "@dxos/react-ui-theme";
50
59
  import { StateField } from "@codemirror/state";
51
60
  import { Decoration, EditorView } from "@codemirror/view";
52
61
  import { isNotFalsy } from "@dxos/util";
53
-
54
- // packages/ui/react-ui-editor/src/extensions/cursor.ts
55
- import { Facet } from "@codemirror/state";
56
- var defaultCursorConverter = {
57
- toCursor: (position) => position.toString(),
58
- fromCursor: (cursor) => parseInt(cursor)
59
- };
60
- var Cursor = class _Cursor {
61
- static {
62
- this.converter = Facet.define({
63
- combine: (providers) => {
64
- return providers[0] ?? defaultCursorConverter;
65
- }
66
- });
67
- }
68
- static {
69
- this.getCursorFromRange = (state2, range) => {
70
- const cursorConverter2 = state2.facet(_Cursor.converter);
71
- const from = cursorConverter2.toCursor(range.from);
72
- const to = cursorConverter2.toCursor(range.to, -1);
73
- return [
74
- from,
75
- to
76
- ].join(":");
77
- };
78
- }
79
- static {
80
- this.getRangeFromCursor = (state2, cursor) => {
81
- const cursorConverter2 = state2.facet(_Cursor.converter);
82
- const parts = cursor.split(":");
83
- const from = cursorConverter2.fromCursor(parts[0]);
84
- const to = cursorConverter2.fromCursor(parts[1]);
85
- return from !== void 0 && to !== void 0 ? {
86
- from,
87
- to
88
- } : void 0;
89
- };
90
- }
91
- };
92
-
93
- // packages/ui/react-ui-editor/src/extensions/annotations.ts
94
62
  var annotationMark = Decoration.mark({
95
63
  class: "cm-annotation"
96
64
  });
@@ -153,7 +121,7 @@ import { autocompletion, completionKeymap } from "@codemirror/autocomplete";
153
121
  import { markdownLanguage } from "@codemirror/lang-markdown";
154
122
  import { keymap } from "@codemirror/view";
155
123
  var autocomplete = ({ activateOnTyping, override, onSearch } = {}) => {
156
- const extentions = [
124
+ const extensions = [
157
125
  // https://codemirror.net/docs/ref/#view.keymap
158
126
  // https://discuss.codemirror.net/t/how-can-i-replace-the-default-autocompletion-keymap-v6/3322
159
127
  // TODO(burdon): Set custom keymap.
@@ -170,7 +138,7 @@ var autocomplete = ({ activateOnTyping, override, onSearch } = {}) => {
170
138
  })
171
139
  ];
172
140
  if (onSearch) {
173
- extentions.push(
141
+ extensions.push(
174
142
  // TODO(burdon): Optional decoration via addToOptions
175
143
  markdownLanguage.data.of({
176
144
  autocomplete: (context) => {
@@ -186,7 +154,7 @@ var autocomplete = ({ activateOnTyping, override, onSearch } = {}) => {
186
154
  })
187
155
  );
188
156
  }
189
- return extentions;
157
+ return extensions;
190
158
  };
191
159
 
192
160
  // packages/ui/react-ui-editor/src/extensions/automerge/automerge.ts
@@ -484,7 +452,7 @@ var automerge = (accessor) => {
484
452
  };
485
453
 
486
454
  // packages/ui/react-ui-editor/src/extensions/awareness/awareness.ts
487
- import { Annotation as Annotation2, Facet as Facet2, RangeSet } from "@codemirror/state";
455
+ import { Annotation as Annotation2, RangeSet } from "@codemirror/state";
488
456
  import { Decoration as Decoration2, EditorView as EditorView3, ViewPlugin as ViewPlugin2, WidgetType } from "@codemirror/view";
489
457
  import { Event } from "@dxos/async";
490
458
  import { Context } from "@dxos/context";
@@ -499,9 +467,7 @@ var dummyProvider = {
499
467
  update: () => {
500
468
  }
501
469
  };
502
- var awarenessProvider = Facet2.define({
503
- combine: (providers) => providers[0] ?? dummyProvider
504
- });
470
+ var awarenessProvider = singleValueFacet(dummyProvider);
505
471
  var RemoteSelectionChangedAnnotation = Annotation2.define();
506
472
  var awareness = (provider = dummyProvider) => {
507
473
  return [
@@ -516,7 +482,7 @@ var RemoteSelectionsDecorator = class {
516
482
  constructor(view) {
517
483
  this._ctx = new Context(void 0, {
518
484
  F: __dxlog_file2,
519
- L: 82
485
+ L: 80
520
486
  });
521
487
  this.decorations = RangeSet.of([]);
522
488
  this._cursorConverter = view.state.facet(Cursor.converter);
@@ -1144,11 +1110,9 @@ import { RangeSetBuilder } from "@codemirror/state";
1144
1110
  import { Decoration as Decoration3, EditorView as EditorView5, ViewPlugin as ViewPlugin3, WidgetType as WidgetType2 } from "@codemirror/view";
1145
1111
 
1146
1112
  // packages/ui/react-ui-editor/src/extensions/command/state.ts
1147
- import { Facet as Facet3, StateEffect as StateEffect2, StateField as StateField3 } from "@codemirror/state";
1113
+ import { StateEffect as StateEffect2, StateField as StateField3 } from "@codemirror/state";
1148
1114
  import { showTooltip } from "@codemirror/view";
1149
- var commandConfig = Facet3.define({
1150
- combine: (providers) => providers[0]
1151
- });
1115
+ var commandConfig = singleValueFacet();
1152
1116
  var commandState = StateField3.define({
1153
1117
  create: () => ({}),
1154
1118
  update: (state2, tr) => {
@@ -1355,7 +1319,7 @@ var command = (options) => {
1355
1319
 
1356
1320
  // packages/ui/react-ui-editor/src/extensions/comments.ts
1357
1321
  import { invertedEffects } from "@codemirror/commands";
1358
- import { Facet as Facet4, StateEffect as StateEffect3, StateField as StateField4 } from "@codemirror/state";
1322
+ import { StateEffect as StateEffect3, StateField as StateField4 } from "@codemirror/state";
1359
1323
  import { hoverTooltip, keymap as keymap4, Decoration as Decoration4, EditorView as EditorView7, ViewPlugin as ViewPlugin4 } from "@codemirror/view";
1360
1324
  import sortBy from "lodash.sortby";
1361
1325
  import { useEffect, useMemo, useState } from "react";
@@ -1452,9 +1416,6 @@ var logChanges = (trs) => {
1452
1416
 
1453
1417
  // packages/ui/react-ui-editor/src/extensions/comments.ts
1454
1418
  var __dxlog_file7 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/comments.ts";
1455
- var documentId = Facet4.define({
1456
- combine: (values) => values[0]
1457
- });
1458
1419
  var setComments = StateEffect3.define();
1459
1420
  var setSelection = StateEffect3.define();
1460
1421
  var setCommentState = StateEffect3.define();
@@ -1525,7 +1486,7 @@ var commentsDecorations = EditorView7.decorations.compute([
1525
1486
  if (!range) {
1526
1487
  log5.warn("Invalid range:", range, {
1527
1488
  F: __dxlog_file7,
1528
- L: 147,
1489
+ L: 143,
1529
1490
  S: void 0,
1530
1491
  C: (f, a) => f(...a)
1531
1492
  });
@@ -1687,15 +1648,13 @@ var createComment = (view) => {
1687
1648
  }
1688
1649
  return false;
1689
1650
  };
1690
- var optionsFacet = Facet4.define({
1691
- combine: (providers) => providers[0]
1692
- });
1651
+ var optionsFacet = singleValueFacet();
1693
1652
  var comments = (options = {}) => {
1694
1653
  const { key: shortcut = "meta-'" } = options;
1695
1654
  const handleSelect = debounce((state2) => options.onSelect?.(state2), 200);
1696
1655
  return [
1697
1656
  optionsFacet.of(options),
1698
- documentId.of(options.id),
1657
+ options.id ? documentId.of(options.id) : void 0,
1699
1658
  commentsState,
1700
1659
  commentsDecorations,
1701
1660
  handleCommentClick,
@@ -1703,17 +1662,17 @@ var comments = (options = {}) => {
1703
1662
  //
1704
1663
  // Keymap.
1705
1664
  //
1706
- options.onCreate ? keymap4.of([
1665
+ options.onCreate && keymap4.of([
1707
1666
  {
1708
1667
  key: shortcut,
1709
1668
  run: callbackWrapper(createComment)
1710
1669
  }
1711
- ]) : [],
1670
+ ]),
1712
1671
  //
1713
1672
  // Hover tooltip (for key shortcut hints, etc.)
1714
1673
  // TODO(burdon): Factor out to generic hints extension for current selection/line.
1715
1674
  //
1716
- options.onHover ? hoverTooltip((view, pos) => {
1675
+ options.onHover && hoverTooltip((view, pos) => {
1717
1676
  const selection = view.state.selection.main;
1718
1677
  if (selection && pos >= selection.from && pos <= selection.to) {
1719
1678
  return {
@@ -1738,7 +1697,7 @@ var comments = (options = {}) => {
1738
1697
  // TODO(burdon): Hide on change triggered immediately?
1739
1698
  // hideOnChange: true,
1740
1699
  hoverTime: 1e3
1741
- }) : [],
1700
+ }),
1742
1701
  //
1743
1702
  // Track deleted ranges and update ranges for decorations.
1744
1703
  //
@@ -1807,8 +1766,8 @@ var comments = (options = {}) => {
1807
1766
  });
1808
1767
  }
1809
1768
  }),
1810
- options.onUpdate ? trackPastedComments(options.onUpdate) : []
1811
- ];
1769
+ options.onUpdate && trackPastedComments(options.onUpdate)
1770
+ ].filter(nonNullable);
1812
1771
  };
1813
1772
  var scrollThreadIntoView = (view, id, center = true) => {
1814
1773
  const comment = view.state.field(commentsState).comments.find((range2) => range2.comment.id === id);
@@ -1935,25 +1894,6 @@ var debugNodeLogger = (log9 = console.log) => {
1935
1894
  });
1936
1895
  };
1937
1896
 
1938
- // packages/ui/react-ui-editor/src/extensions/doc.ts
1939
- import { Facet as Facet5 } from "@codemirror/state";
1940
- import { invariant as invariant3 } from "@dxos/invariant";
1941
- var __dxlog_file8 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/doc.ts";
1942
- var documentId2 = Facet5.define({
1943
- combine: (providers) => {
1944
- invariant3(providers.length <= 1, void 0, {
1945
- F: __dxlog_file8,
1946
- L: 14,
1947
- S: void 0,
1948
- A: [
1949
- "providers.length <= 1",
1950
- ""
1951
- ]
1952
- });
1953
- return providers[0];
1954
- }
1955
- });
1956
-
1957
1897
  // packages/ui/react-ui-editor/src/extensions/dnd.ts
1958
1898
  import { dropCursor, EditorView as EditorView8 } from "@codemirror/view";
1959
1899
  var styles4 = EditorView8.theme({
@@ -2016,11 +1956,9 @@ var headings = {
2016
1956
  6: "text-md"
2017
1957
  };
2018
1958
  var theme = {
2019
- mark: "opacity-50",
2020
1959
  code: "font-mono !no-underline text-neutral-700 dark:text-neutral-300",
2021
1960
  codeMark: "font-mono text-primary-500",
2022
- // TODO(burdon): Replace with widget.
2023
- blockquote: "pl-1 mr-1 border-is-4 border-orange-500 dark:border-orange-500 dark:text-neutral-500",
1961
+ mark: "opacity-50",
2024
1962
  heading: (level) => {
2025
1963
  return mx(headings[level], "dark:text-primary-400");
2026
1964
  }
@@ -2063,6 +2001,7 @@ var defaultTheme = {
2063
2001
  /**
2064
2002
  * Gutters
2065
2003
  * NOTE: Gutters should have the same top margin as the content.
2004
+ * NOTE: They can't be transparent since the content needs to scroll below.
2066
2005
  */
2067
2006
  ".cm-gutters": {
2068
2007
  background: "var(--surface-bg)",
@@ -2235,7 +2174,7 @@ var defaultTheme = {
2235
2174
  };
2236
2175
 
2237
2176
  // packages/ui/react-ui-editor/src/extensions/factories.ts
2238
- var __dxlog_file9 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/factories.ts";
2177
+ var __dxlog_file8 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/factories.ts";
2239
2178
  var preventNewline = EditorState.transactionFilter.of((tr) => tr.newDoc.lines > 1 ? [] : tr);
2240
2179
  var defaultBasicOptions = {
2241
2180
  allowMultipleSelections: true,
@@ -2260,7 +2199,7 @@ var createBasicExtensions = (_props) => {
2260
2199
  // NOTE: Doesn't catch errors in keymap functions.
2261
2200
  EditorView9.exceptionSink.of((err) => {
2262
2201
  log6.catch(err, void 0, {
2263
- F: __dxlog_file9,
2202
+ F: __dxlog_file8,
2264
2203
  L: 93,
2265
2204
  S: void 0,
2266
2205
  C: (f, a) => f(...a)
@@ -2357,9 +2296,10 @@ var folding = (_props = {}) => [
2357
2296
  }),
2358
2297
  foldGutter({
2359
2298
  markerDOM: (open) => {
2360
- return renderRoot(createElement("div", {
2299
+ const el = createElement("div", {
2361
2300
  className: "flex h-full items-center"
2362
- }), /* @__PURE__ */ React2.createElement(Icon, {
2301
+ });
2302
+ return renderRoot(el, /* @__PURE__ */ React2.createElement(Icon, {
2363
2303
  icon: "ph--caret-right--regular",
2364
2304
  classNames: [
2365
2305
  getSize(3),
@@ -3346,7 +3286,7 @@ var getFormatting = (state2) => {
3346
3286
  null
3347
3287
  ];
3348
3288
  let link = false;
3349
- let blockQuote = null;
3289
+ let blockQuote2 = null;
3350
3290
  let listStyle = null;
3351
3291
  const stack = [];
3352
3292
  let currentBlock = null;
@@ -3455,10 +3395,10 @@ var getFormatting = (state2) => {
3455
3395
  hasList = stack[i] === "TaskList" ? "task" : stack[i] === "BulletList" ? "bullet" : "ordered";
3456
3396
  }
3457
3397
  }
3458
- if (blockQuote === null) {
3459
- blockQuote = hasQuote;
3460
- } else if (!hasQuote && blockQuote) {
3461
- blockQuote = false;
3398
+ if (blockQuote2 === null) {
3399
+ blockQuote2 = hasQuote;
3400
+ } else if (!hasQuote && blockQuote2) {
3401
+ blockQuote2 = false;
3462
3402
  }
3463
3403
  if (listStyle === null) {
3464
3404
  listStyle = hasList;
@@ -3477,7 +3417,7 @@ var getFormatting = (state2) => {
3477
3417
  return {
3478
3418
  blankLine,
3479
3419
  blockType: blockType || null,
3480
- blockQuote: blockQuote ?? false,
3420
+ blockQuote: blockQuote2 ?? false,
3481
3421
  code: inline[3] ?? false,
3482
3422
  emphasis: inline[1] ?? false,
3483
3423
  strong: inline[0] ?? false,
@@ -3728,12 +3668,6 @@ var markdownHighlightStyle = (_options = {}) => {
3728
3668
  ],
3729
3669
  class: theme.code
3730
3670
  },
3731
- {
3732
- tag: [
3733
- markdownTags.QuoteMark
3734
- ],
3735
- class: theme.blockquote
3736
- },
3737
3671
  {
3738
3672
  tag: [
3739
3673
  markdownTags.TableCell
@@ -3815,7 +3749,7 @@ var convertTreeToJson = (state2) => {
3815
3749
  import { syntaxTree as syntaxTree7 } from "@codemirror/language";
3816
3750
  import { RangeSetBuilder as RangeSetBuilder3, StateEffect as StateEffect4 } from "@codemirror/state";
3817
3751
  import { EditorView as EditorView16, Decoration as Decoration7, WidgetType as WidgetType5, ViewPlugin as ViewPlugin6 } from "@codemirror/view";
3818
- import { invariant as invariant4 } from "@dxos/invariant";
3752
+ import { invariant as invariant3 } from "@dxos/invariant";
3819
3753
  import { mx as mx2 } from "@dxos/react-ui-theme";
3820
3754
 
3821
3755
  // packages/ui/react-ui-editor/src/extensions/markdown/changes.ts
@@ -4078,6 +4012,15 @@ var formattingStyles = EditorView14.theme({
4078
4012
  width: `${orderedListIndentationWidth}px`
4079
4013
  },
4080
4014
  /**
4015
+ * Blockquote.
4016
+ */
4017
+ "& .cm-blockquote": {
4018
+ background: "var(--dx-cmCodeblock)",
4019
+ borderLeft: "2px solid var(--dx-cmSeparator)",
4020
+ paddingLeft: "1rem",
4021
+ margin: "0"
4022
+ },
4023
+ /**
4081
4024
  * Code and codeblocks.
4082
4025
  */
4083
4026
  "& .cm-code": {
@@ -4237,7 +4180,7 @@ var TableWidget = class extends WidgetType4 {
4237
4180
  };
4238
4181
 
4239
4182
  // packages/ui/react-ui-editor/src/extensions/markdown/decorate.ts
4240
- var __dxlog_file10 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/markdown/decorate.ts";
4183
+ var __dxlog_file9 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/markdown/decorate.ts";
4241
4184
  var Unicode = {
4242
4185
  emDash: "\u2014",
4243
4186
  bullet: "\u2022",
@@ -4260,6 +4203,7 @@ var LinkButton = class extends WidgetType5 {
4260
4203
  eq(other) {
4261
4204
  return this.url === other.url;
4262
4205
  }
4206
+ // TODO(burdon): Create icon and link directly without react?
4263
4207
  toDOM(view) {
4264
4208
  const el = document.createElement("span");
4265
4209
  this.render(el, this.url);
@@ -4327,6 +4271,9 @@ var TextWidget = class extends WidgetType5 {
4327
4271
  }
4328
4272
  };
4329
4273
  var hide = Decoration7.replace({});
4274
+ var blockQuote = Decoration7.line({
4275
+ class: mx2("cm-blockquote")
4276
+ });
4330
4277
  var fencedCodeLine = Decoration7.line({
4331
4278
  class: mx2("cm-code cm-codeblock-line")
4332
4279
  });
@@ -4366,9 +4313,9 @@ var buildDecorations2 = (view, options, focus) => {
4366
4313
  const { state: state2 } = view;
4367
4314
  const headerLevels = [];
4368
4315
  const getHeaderLevels = (node, level) => {
4369
- invariant4(level > 0, void 0, {
4370
- F: __dxlog_file10,
4371
- L: 176,
4316
+ invariant3(level > 0, void 0, {
4317
+ F: __dxlog_file9,
4318
+ L: 178,
4372
4319
  S: void 0,
4373
4320
  A: [
4374
4321
  "level > 0",
@@ -4405,9 +4352,9 @@ var buildDecorations2 = (view, options, focus) => {
4405
4352
  listLevels.pop();
4406
4353
  };
4407
4354
  const getCurrentListLevel = () => {
4408
- invariant4(listLevels.length, void 0, {
4409
- F: __dxlog_file10,
4410
- L: 198,
4355
+ invariant3(listLevels.length, void 0, {
4356
+ F: __dxlog_file9,
4357
+ L: 200,
4411
4358
  S: void 0,
4412
4359
  A: [
4413
4360
  "listLevels.length",
@@ -4500,7 +4447,30 @@ var buildDecorations2 = (view, options, focus) => {
4500
4447
  atomicDeco.add(line.from, to, checked ? checkedTask : uncheckedTask);
4501
4448
  break;
4502
4449
  }
4450
+ //
4451
+ // Blockquote > QuoteMark > Paragraph
4452
+ //
4453
+ case "Blockquote": {
4454
+ const editing = editingRange(state2, node, focus);
4455
+ const quoteMark = node.node.getChild("QuoteMark");
4456
+ const paragraph = node.node.getChild("Paragraph");
4457
+ if (!editing && quoteMark && paragraph) {
4458
+ atomicDeco.add(quoteMark.from, paragraph.from, hide);
4459
+ }
4460
+ for (const block of view.viewportLineBlocks) {
4461
+ if (block.to < node.from) {
4462
+ continue;
4463
+ }
4464
+ if (block.from > node.to) {
4465
+ break;
4466
+ }
4467
+ deco.add(block.from, block.from, blockQuote);
4468
+ }
4469
+ break;
4470
+ }
4471
+ //
4503
4472
  // CommentBlock
4473
+ //
4504
4474
  case "CommentBlock": {
4505
4475
  const editing = editingRange(state2, node, focus);
4506
4476
  for (const block of view.viewportLineBlocks) {
@@ -4510,16 +4480,18 @@ var buildDecorations2 = (view, options, focus) => {
4510
4480
  if (block.from > node.to) {
4511
4481
  break;
4512
4482
  }
4513
- const first = block.from <= node.from;
4514
- const last = block.to >= node.to && /^(\s>)*-->$/.test(state2.doc.sliceString(block.from, block.to));
4515
- deco.add(block.from, block.from, first ? commentBlockLineFirst : last ? commentBlockLineLast : commentBlockLine);
4516
- if (!editing && (first || last)) {
4483
+ const isFirst = block.from <= node.from;
4484
+ const isLast = block.to >= node.to && /^(\s>)*-->$/.test(state2.doc.sliceString(block.from, block.to));
4485
+ deco.add(block.from, block.from, isFirst ? commentBlockLineFirst : isLast ? commentBlockLineLast : commentBlockLine);
4486
+ if (!editing && (isFirst || isLast)) {
4517
4487
  atomicDeco.add(block.from, block.to, hide);
4518
4488
  }
4519
4489
  }
4520
4490
  break;
4521
4491
  }
4492
+ //
4522
4493
  // FencedCode > CodeMark > [CodeInfo] > CodeText > CodeMark
4494
+ //
4523
4495
  case "FencedCode": {
4524
4496
  for (const block of view.viewportLineBlocks) {
4525
4497
  if (block.to < node.from) {
@@ -4538,7 +4510,9 @@ var buildDecorations2 = (view, options, focus) => {
4538
4510
  }
4539
4511
  return false;
4540
4512
  }
4513
+ //
4541
4514
  // Link > [LinkMark, URL]
4515
+ //
4542
4516
  case "Link": {
4543
4517
  const marks = node.node.getChildren("LinkMark");
4544
4518
  const urlNode = node.node.getChild("URL");
@@ -4565,7 +4539,9 @@ var buildDecorations2 = (view, options, focus) => {
4565
4539
  }
4566
4540
  break;
4567
4541
  }
4542
+ //
4568
4543
  // HR
4544
+ //
4569
4545
  case "HorizontalRule": {
4570
4546
  if (!editingRange(state2, node, focus)) {
4571
4547
  deco.add(node.from, node.to, horizontalRule);
@@ -4662,40 +4638,42 @@ var decorateMarkdown = (options = {}) => {
4662
4638
  import { syntaxTree as syntaxTree8 } from "@codemirror/language";
4663
4639
  import { hoverTooltip as hoverTooltip2 } from "@codemirror/view";
4664
4640
  import { tooltipContent } from "@dxos/react-ui-theme";
4665
- var linkTooltip = (render) => hoverTooltip2((view, pos, side) => {
4666
- const syntax = syntaxTree8(view.state).resolveInner(pos, side);
4667
- let link = null;
4668
- for (let i = 0, node = syntax; !link && node && i < 5; node = node.parent, i++) {
4669
- link = node.name === "Link" ? node : null;
4670
- }
4671
- const url = link && link.getChild("URL");
4672
- if (!url || !link) {
4673
- return null;
4674
- }
4675
- const urlText = view.state.sliceDoc(url.from, url.to);
4676
- return {
4677
- pos: link.from,
4678
- end: link.to,
4679
- above: true,
4680
- create: () => {
4681
- const el = document.createElement("div");
4682
- el.className = tooltipContent({}, "pli-2 plb-1");
4683
- render(el, urlText);
4684
- return {
4685
- dom: el,
4686
- offset: {
4687
- x: 0,
4688
- y: 4
4689
- }
4690
- };
4641
+ var linkTooltip = (render) => {
4642
+ return hoverTooltip2((view, pos, side) => {
4643
+ const syntax = syntaxTree8(view.state).resolveInner(pos, side);
4644
+ let link = null;
4645
+ for (let i = 0, node = syntax; !link && node && i < 5; node = node.parent, i++) {
4646
+ link = node.name === "Link" ? node : null;
4691
4647
  }
4692
- };
4693
- });
4648
+ const url = link && link.getChild("URL");
4649
+ if (!url || !link) {
4650
+ return null;
4651
+ }
4652
+ const urlText = view.state.sliceDoc(url.from, url.to);
4653
+ return {
4654
+ pos: link.from,
4655
+ end: link.to,
4656
+ above: true,
4657
+ create: () => {
4658
+ const el = document.createElement("div");
4659
+ el.className = tooltipContent({}, "pli-2 plb-1");
4660
+ render(el, urlText);
4661
+ return {
4662
+ dom: el,
4663
+ offset: {
4664
+ x: 0,
4665
+ y: 4
4666
+ }
4667
+ };
4668
+ }
4669
+ };
4670
+ });
4671
+ };
4694
4672
 
4695
4673
  // packages/ui/react-ui-editor/src/extensions/mention.ts
4696
4674
  import { autocompletion as autocompletion2 } from "@codemirror/autocomplete";
4697
4675
  import { log as log7 } from "@dxos/log";
4698
- var __dxlog_file11 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/mention.ts";
4676
+ var __dxlog_file10 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/mention.ts";
4699
4677
  var mention = ({ onSearch }) => {
4700
4678
  return autocompletion2({
4701
4679
  // TODO(burdon): Not working.
@@ -4710,7 +4688,7 @@ var mention = ({ onSearch }) => {
4710
4688
  log7.info("completion context", {
4711
4689
  context
4712
4690
  }, {
4713
- F: __dxlog_file11,
4691
+ F: __dxlog_file10,
4714
4692
  L: 26,
4715
4693
  S: void 0,
4716
4694
  C: (f, a) => f(...a)
@@ -4731,7 +4709,6 @@ var mention = ({ onSearch }) => {
4731
4709
  };
4732
4710
 
4733
4711
  // packages/ui/react-ui-editor/src/extensions/modes.ts
4734
- import { Facet as Facet6 } from "@codemirror/state";
4735
4712
  import { keymap as keymap8 } from "@codemirror/view";
4736
4713
  import { vim } from "@replit/codemirror-vim";
4737
4714
  import { vscodeKeymap } from "@replit/codemirror-vscode-keymap";
@@ -4746,9 +4723,7 @@ var EditorInputModes = [
4746
4723
  "vim",
4747
4724
  "vscode"
4748
4725
  ];
4749
- var editorInputMode = Facet6.define({
4750
- combine: (modes) => modes[0] ?? {}
4751
- });
4726
+ var editorInputMode = singleValueFacet({});
4752
4727
  var InputModeExtensions = {
4753
4728
  default: [],
4754
4729
  vscode: [
@@ -4779,101 +4754,8 @@ var InputModeExtensions = {
4779
4754
  ]
4780
4755
  };
4781
4756
 
4782
- // packages/ui/react-ui-editor/src/extensions/state.ts
4783
- import { Transaction as Transaction2 } from "@codemirror/state";
4784
- import { EditorView as EditorView17, keymap as keymap9 } from "@codemirror/view";
4785
- import { debounce as debounce2 } from "@dxos/async";
4786
- import { invariant as invariant5 } from "@dxos/invariant";
4787
- import { isNotFalsy as isNotFalsy3 } from "@dxos/util";
4788
- var __dxlog_file12 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/state.ts";
4789
- var stateRestoreAnnotation = "dxos.org/cm/state-restore";
4790
- var keyPrefix = "dxos.org/react-ui-editor/state";
4791
- var localStorageStateStoreAdapter = {
4792
- getState: (id) => {
4793
- invariant5(id, void 0, {
4794
- F: __dxlog_file12,
4795
- L: 34,
4796
- S: void 0,
4797
- A: [
4798
- "id",
4799
- ""
4800
- ]
4801
- });
4802
- const state2 = localStorage.getItem(`${keyPrefix}/${id}`);
4803
- return state2 ? JSON.parse(state2) : void 0;
4804
- },
4805
- setState: (id, state2) => {
4806
- invariant5(id, void 0, {
4807
- F: __dxlog_file12,
4808
- L: 40,
4809
- S: void 0,
4810
- A: [
4811
- "id",
4812
- ""
4813
- ]
4814
- });
4815
- localStorage.setItem(`${keyPrefix}/${id}`, JSON.stringify(state2));
4816
- }
4817
- };
4818
- var createEditorStateTransaction = ({ scrollTo, selection }) => {
4819
- return {
4820
- selection,
4821
- scrollIntoView: !scrollTo,
4822
- effects: scrollTo ? EditorView17.scrollIntoView(scrollTo, {
4823
- yMargin: 96
4824
- }) : void 0,
4825
- annotations: Transaction2.userEvent.of(stateRestoreAnnotation)
4826
- };
4827
- };
4828
- var state = ({ getState, setState } = {}) => {
4829
- const setStateDebounced = debounce2(setState, 1e3);
4830
- return [
4831
- // TODO(burdon): Track scrolling (currently only updates when cursor moves).
4832
- // EditorView.domEventHandlers({
4833
- // scroll: (event) => {
4834
- // setStateDebounced(id, {});
4835
- // },
4836
- // }),
4837
- EditorView17.updateListener.of(({ view, transactions }) => {
4838
- const id = view.state.facet(documentId2);
4839
- if (!id || transactions.some((tr) => tr.isUserEvent(stateRestoreAnnotation))) {
4840
- return;
4841
- }
4842
- if (setState) {
4843
- const { scrollTop } = view.scrollDOM;
4844
- const pos = view.posAtCoords({
4845
- x: 0,
4846
- y: scrollTop
4847
- });
4848
- if (pos !== null) {
4849
- const { anchor, head } = view.state.selection.main;
4850
- setStateDebounced(id, {
4851
- scrollTo: pos,
4852
- selection: {
4853
- anchor,
4854
- head
4855
- }
4856
- });
4857
- }
4858
- }
4859
- }),
4860
- getState && keymap9.of([
4861
- {
4862
- key: "ctrl-r",
4863
- run: (view) => {
4864
- const state2 = getState(view.state.facet(documentId2));
4865
- if (state2) {
4866
- view.dispatch(createEditorStateTransaction(state2));
4867
- }
4868
- return true;
4869
- }
4870
- }
4871
- ])
4872
- ].filter(isNotFalsy3);
4873
- };
4874
-
4875
4757
  // packages/ui/react-ui-editor/src/extensions/typewriter.ts
4876
- import { keymap as keymap10 } from "@codemirror/view";
4758
+ import { keymap as keymap9 } from "@codemirror/view";
4877
4759
  var defaultItems = [
4878
4760
  "hello world!",
4879
4761
  "this is a test.",
@@ -4883,7 +4765,7 @@ var typewriter = ({ delay = 75, items = defaultItems } = {}) => {
4883
4765
  let t;
4884
4766
  let idx = 0;
4885
4767
  return [
4886
- keymap10.of([
4768
+ keymap9.of([
4887
4769
  {
4888
4770
  // Reset.
4889
4771
  key: "alt-meta-'",
@@ -5314,20 +5196,20 @@ var Toolbar = {
5314
5196
  };
5315
5197
 
5316
5198
  // packages/ui/react-ui-editor/src/defaults.ts
5317
- import { EditorView as EditorView18 } from "@codemirror/view";
5199
+ import { EditorView as EditorView17 } from "@codemirror/view";
5318
5200
  import { mx as mx3 } from "@dxos/react-ui-theme";
5319
5201
  var margin = "!mt-[1rem]";
5320
5202
  var editorContent = mx3(margin, "!mli-auto w-full max-w-[min(50rem,100%-2rem)]");
5321
5203
  var editorFullWidth = mx3(margin);
5322
5204
  var editorWithToolbarLayout = "grid grid-cols-1 grid-rows-[min-content_1fr] data-[toolbar=disabled]:grid-rows-[1fr] justify-center content-start overflow-hidden";
5323
- var editorGutter = EditorView18.theme({
5205
+ var editorGutter = EditorView17.theme({
5324
5206
  // Match margin from content.
5325
5207
  ".cm-gutters": {
5326
5208
  marginTop: "16px",
5327
5209
  paddingRight: "1rem"
5328
5210
  }
5329
5211
  });
5330
- var editorMonospace = EditorView18.theme({
5212
+ var editorMonospace = EditorView17.theme({
5331
5213
  ".cm-content": {
5332
5214
  fontFamily: fontMono
5333
5215
  }
@@ -5340,12 +5222,12 @@ var useActionHandler = (view) => {
5340
5222
 
5341
5223
  // packages/ui/react-ui-editor/src/hooks/useTextEditor.ts
5342
5224
  import { EditorState as EditorState2 } from "@codemirror/state";
5343
- import { EditorView as EditorView19 } from "@codemirror/view";
5225
+ import { EditorView as EditorView18 } from "@codemirror/view";
5344
5226
  import { useFocusableGroup } from "@fluentui/react-tabster";
5345
5227
  import { useCallback, useEffect as useEffect3, useMemo as useMemo3, useRef as useRef2, useState as useState4 } from "react";
5346
5228
  import { log as log8 } from "@dxos/log";
5347
- import { getProviderValue, isNotFalsy as isNotFalsy4 } from "@dxos/util";
5348
- var __dxlog_file13 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/useTextEditor.ts";
5229
+ import { getProviderValue, isNotFalsy as isNotFalsy3 } from "@dxos/util";
5230
+ var __dxlog_file11 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/useTextEditor.ts";
5349
5231
  var instanceCount = 0;
5350
5232
  var useTextEditor = (props = {}, deps = []) => {
5351
5233
  const { id, initialValue, extensions, autoFocus, scrollTo, selection, moveToEndOfLine, debug } = useMemo3(() => getProviderValue(props), deps ?? []);
@@ -5361,8 +5243,8 @@ var useTextEditor = (props = {}, deps = []) => {
5361
5243
  instanceId,
5362
5244
  doc: initialValue?.length ?? 0
5363
5245
  }, {
5364
- F: __dxlog_file13,
5365
- L: 76,
5246
+ F: __dxlog_file11,
5247
+ L: 78,
5366
5248
  S: void 0,
5367
5249
  C: (f, a) => f(...a)
5368
5250
  });
@@ -5382,27 +5264,26 @@ var useTextEditor = (props = {}, deps = []) => {
5382
5264
  doc: initialValue,
5383
5265
  selection: initialSelection,
5384
5266
  extensions: [
5385
- id && documentId2.of(id),
5267
+ id && documentId.of(id),
5386
5268
  // NOTE: Doesn't catch errors in keymap functions.
5387
- EditorView19.exceptionSink.of((err) => {
5269
+ EditorView18.exceptionSink.of((err) => {
5388
5270
  log8.catch(err, void 0, {
5389
- F: __dxlog_file13,
5390
- L: 98,
5271
+ F: __dxlog_file11,
5272
+ L: 100,
5391
5273
  S: void 0,
5392
5274
  C: (f, a) => f(...a)
5393
5275
  });
5394
5276
  }),
5395
5277
  extensions,
5396
- EditorView19.updateListener.of(() => {
5278
+ EditorView18.updateListener.of(() => {
5397
5279
  setTimeout(() => {
5398
5280
  onUpdate.current?.();
5399
5281
  });
5400
5282
  })
5401
- ].filter(isNotFalsy4)
5283
+ ].filter(isNotFalsy3)
5402
5284
  });
5403
- view2 = new EditorView19({
5285
+ view2 = new EditorView18({
5404
5286
  parent: parentRef.current,
5405
- selection: initialSelection,
5406
5287
  state: state2,
5407
5288
  // NOTE: Uncomment to debug/monitor all transactions.
5408
5289
  // https://codemirror.net/docs/ref/#view.EditorView.dispatch
@@ -5427,8 +5308,8 @@ var useTextEditor = (props = {}, deps = []) => {
5427
5308
  log8("destroy", {
5428
5309
  id
5429
5310
  }, {
5430
- F: __dxlog_file13,
5431
- L: 134,
5311
+ F: __dxlog_file11,
5312
+ L: 135,
5432
5313
  S: void 0,
5433
5314
  C: (f, a) => f(...a)
5434
5315
  });
@@ -5526,7 +5407,7 @@ export {
5526
5407
  debugTree,
5527
5408
  decorateMarkdown,
5528
5409
  defaultOptions,
5529
- documentId2 as documentId,
5410
+ documentId,
5530
5411
  dropFile,
5531
5412
  editorContent,
5532
5413
  editorFullWidth,
@@ -5542,7 +5423,7 @@ export {
5542
5423
  image,
5543
5424
  imageUpload,
5544
5425
  insertTable,
5545
- keymap11 as keymap,
5426
+ keymap10 as keymap,
5546
5427
  linkTooltip,
5547
5428
  listener,
5548
5429
  localStorageStateStoreAdapter,
@@ -5565,6 +5446,7 @@ export {
5565
5446
  setHeading,
5566
5447
  setSelection,
5567
5448
  setStyle,
5449
+ singleValueFacet,
5568
5450
  state,
5569
5451
  table,
5570
5452
  tags2 as tags,