@dxos/react-ui-editor 0.3.11-next.0fb359e → 0.3.11-next.e28df4f

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 (201) hide show
  1. package/dist/lib/browser/index.mjs +1854 -1391
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/types/src/components/TextEditor/MarkdownEditor.stories.d.ts +16 -14
  5. package/dist/types/src/components/TextEditor/MarkdownEditor.stories.d.ts.map +1 -1
  6. package/dist/types/src/components/TextEditor/TextEditor.d.ts +20 -17
  7. package/dist/types/src/components/TextEditor/TextEditor.d.ts.map +1 -1
  8. package/dist/types/src/components/TextEditor/TextEditor.stories.d.ts +6 -6
  9. package/dist/types/src/components/TextEditor/TextEditor.stories.d.ts.map +1 -1
  10. package/dist/types/src/components/TextEditor/automerge.stories.d.ts.map +1 -1
  11. package/dist/types/src/components/TextEditor/comments.stories.d.ts +26 -0
  12. package/dist/types/src/components/TextEditor/comments.stories.d.ts.map +1 -0
  13. package/dist/types/src/components/TextEditor/hooks.stories.d.ts +23 -0
  14. package/dist/types/src/components/TextEditor/hooks.stories.d.ts.map +1 -0
  15. package/dist/types/src/components/Toolbar/Toolbar.d.ts +25 -0
  16. package/dist/types/src/components/Toolbar/Toolbar.d.ts.map +1 -0
  17. package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts +23 -0
  18. package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts.map +1 -0
  19. package/dist/types/src/components/Toolbar/index.d.ts +2 -0
  20. package/dist/types/src/components/Toolbar/index.d.ts.map +1 -0
  21. package/dist/types/src/components/index.d.ts +1 -0
  22. package/dist/types/src/components/index.d.ts.map +1 -1
  23. package/dist/types/src/extensions/autocomplete.d.ts.map +1 -1
  24. package/dist/types/src/extensions/automerge/automerge.d.ts.map +1 -1
  25. package/dist/types/src/extensions/automerge/automerge.spec.d.ts +2 -0
  26. package/dist/types/src/extensions/automerge/automerge.spec.d.ts.map +1 -0
  27. package/dist/types/src/extensions/automerge/automerge.test.d.ts +2 -0
  28. package/dist/types/src/extensions/automerge/automerge.test.d.ts.map +1 -0
  29. package/dist/types/src/extensions/automerge/cursor.d.ts +1 -1
  30. package/dist/types/src/extensions/automerge/cursor.d.ts.map +1 -1
  31. package/dist/types/src/extensions/automerge/defs.d.ts +9 -11
  32. package/dist/types/src/extensions/automerge/defs.d.ts.map +1 -1
  33. package/dist/types/src/extensions/automerge/semaphore.d.ts +8 -12
  34. package/dist/types/src/extensions/automerge/semaphore.d.ts.map +1 -1
  35. package/dist/types/src/extensions/automerge/update-automerge.d.ts +2 -2
  36. package/dist/types/src/extensions/automerge/update-automerge.d.ts.map +1 -1
  37. package/dist/types/src/extensions/awareness.d.ts +2 -2
  38. package/dist/types/src/extensions/awareness.d.ts.map +1 -1
  39. package/dist/types/src/extensions/basic.d.ts +4 -5
  40. package/dist/types/src/extensions/basic.d.ts.map +1 -1
  41. package/dist/types/src/extensions/comments.d.ts +37 -20
  42. package/dist/types/src/extensions/comments.d.ts.map +1 -1
  43. package/dist/types/src/{util → extensions}/cursor.d.ts +10 -2
  44. package/dist/types/src/extensions/cursor.d.ts.map +1 -0
  45. package/dist/types/src/extensions/index.d.ts +2 -8
  46. package/dist/types/src/extensions/index.d.ts.map +1 -1
  47. package/dist/types/src/extensions/markdown/bundle.d.ts +3 -6
  48. package/dist/types/src/extensions/markdown/bundle.d.ts.map +1 -1
  49. package/dist/types/src/extensions/markdown/code.d.ts.map +1 -0
  50. package/dist/types/src/extensions/markdown/formatting.d.ts +13 -0
  51. package/dist/types/src/extensions/markdown/formatting.d.ts.map +1 -0
  52. package/dist/types/src/extensions/markdown/heading.d.ts +6 -0
  53. package/dist/types/src/extensions/markdown/heading.d.ts.map +1 -0
  54. package/dist/types/src/extensions/markdown/highlight.d.ts.map +1 -1
  55. package/dist/types/src/extensions/markdown/hr.d.ts.map +1 -0
  56. package/dist/types/src/extensions/markdown/image.d.ts.map +1 -0
  57. package/dist/types/src/extensions/markdown/index.d.ts +8 -0
  58. package/dist/types/src/extensions/markdown/index.d.ts.map +1 -1
  59. package/dist/types/src/extensions/markdown/link.d.ts.map +1 -0
  60. package/dist/types/src/extensions/markdown/table.d.ts.map +1 -0
  61. package/dist/types/src/extensions/markdown/tasklist.d.ts.map +1 -0
  62. package/dist/types/src/extensions/mention.d.ts.map +1 -1
  63. package/dist/types/src/extensions/outliner.d.ts +4 -0
  64. package/dist/types/src/extensions/outliner.d.ts.map +1 -0
  65. package/dist/types/src/hooks/awareness-provider.d.ts +7 -4
  66. package/dist/types/src/hooks/awareness-provider.d.ts.map +1 -1
  67. package/dist/types/src/hooks/defs.d.ts +25 -0
  68. package/dist/types/src/hooks/defs.d.ts.map +1 -0
  69. package/dist/types/src/hooks/index.d.ts +4 -2
  70. package/dist/types/src/hooks/index.d.ts.map +1 -1
  71. package/dist/types/src/hooks/useActionHandler.d.ts +4 -0
  72. package/dist/types/src/hooks/useActionHandler.d.ts.map +1 -0
  73. package/dist/types/src/hooks/useEditorView.d.ts +17 -0
  74. package/dist/types/src/hooks/useEditorView.d.ts.map +1 -0
  75. package/dist/types/src/hooks/useTextEditor.d.ts +39 -0
  76. package/dist/types/src/hooks/useTextEditor.d.ts.map +1 -0
  77. package/dist/types/src/hooks/useTextModel.d.ts +2 -32
  78. package/dist/types/src/hooks/useTextModel.d.ts.map +1 -1
  79. package/dist/types/src/index.d.ts +3 -0
  80. package/dist/types/src/index.d.ts.map +1 -1
  81. package/dist/types/src/styles/markdown.d.ts +2 -2
  82. package/dist/types/src/styles/markdown.d.ts.map +1 -1
  83. package/dist/types/src/styles/tokens.d.ts +1 -0
  84. package/dist/types/src/styles/tokens.d.ts.map +1 -1
  85. package/dist/types/src/themes/default.d.ts.map +1 -1
  86. package/dist/types/src/util.d.ts +7 -0
  87. package/dist/types/src/util.d.ts.map +1 -0
  88. package/package.json +48 -37
  89. package/src/components/TextEditor/MarkdownEditor.stories.tsx +84 -91
  90. package/src/components/TextEditor/TextEditor.stories.tsx +12 -46
  91. package/src/components/TextEditor/TextEditor.tsx +136 -95
  92. package/src/components/TextEditor/automerge.stories.tsx +1 -2
  93. package/src/components/TextEditor/comments.stories.tsx +357 -0
  94. package/src/components/TextEditor/hooks.stories.tsx +106 -0
  95. package/src/components/Toolbar/Toolbar.stories.tsx +90 -0
  96. package/src/components/Toolbar/Toolbar.tsx +166 -0
  97. package/src/components/Toolbar/index.ts +5 -0
  98. package/src/components/index.ts +1 -0
  99. package/src/extensions/autocomplete.ts +23 -19
  100. package/src/extensions/automerge/automerge.spec.tsx +76 -0
  101. package/src/extensions/automerge/automerge.test.ts +13 -0
  102. package/src/extensions/automerge/automerge.ts +55 -46
  103. package/src/extensions/automerge/cursor.ts +5 -4
  104. package/src/extensions/automerge/defs.ts +13 -34
  105. package/src/extensions/automerge/semaphore.ts +33 -32
  106. package/src/extensions/automerge/update-automerge.ts +14 -8
  107. package/src/extensions/automerge/update-codemirror.ts +5 -5
  108. package/src/extensions/awareness.ts +43 -49
  109. package/src/extensions/basic.ts +17 -10
  110. package/src/extensions/comments.ts +323 -268
  111. package/src/extensions/cursor.ts +50 -0
  112. package/src/extensions/index.ts +2 -8
  113. package/src/extensions/markdown/bundle.ts +23 -28
  114. package/src/extensions/markdown/code.ts +150 -0
  115. package/src/extensions/markdown/formatting.ts +188 -0
  116. package/src/extensions/markdown/heading.ts +59 -0
  117. package/src/extensions/markdown/highlight.ts +11 -26
  118. package/src/extensions/markdown/hr.ts +71 -0
  119. package/src/extensions/markdown/image.ts +87 -0
  120. package/src/extensions/markdown/index.ts +8 -0
  121. package/src/extensions/{link.ts → markdown/link.ts} +87 -86
  122. package/src/extensions/{table.ts → markdown/table.ts} +10 -4
  123. package/src/extensions/markdown/tasklist.ts +110 -0
  124. package/src/extensions/mention.ts +9 -2
  125. package/src/extensions/outliner.ts +12 -0
  126. package/src/hooks/awareness-provider.ts +24 -20
  127. package/src/hooks/defs.ts +42 -0
  128. package/src/hooks/index.ts +5 -2
  129. package/src/hooks/useActionHandler.ts +62 -0
  130. package/src/hooks/useEditorView.ts +29 -0
  131. package/src/hooks/useTextEditor.ts +153 -0
  132. package/src/hooks/useTextModel.ts +50 -59
  133. package/src/index.ts +3 -0
  134. package/src/styles/markdown.ts +9 -12
  135. package/src/styles/tokens.ts +3 -0
  136. package/src/themes/default.ts +53 -80
  137. package/src/util.ts +41 -0
  138. package/dist/types/src/components/TextEditor/codemirror.stories.d.ts +0 -12
  139. package/dist/types/src/components/TextEditor/codemirror.stories.d.ts.map +0 -1
  140. package/dist/types/src/components/TextEditor/yjs.stories.d.ts +0 -12
  141. package/dist/types/src/components/TextEditor/yjs.stories.d.ts.map +0 -1
  142. package/dist/types/src/extensions/code.d.ts.map +0 -1
  143. package/dist/types/src/extensions/hr.d.ts.map +0 -1
  144. package/dist/types/src/extensions/image.d.ts.map +0 -1
  145. package/dist/types/src/extensions/link.d.ts.map +0 -1
  146. package/dist/types/src/extensions/mermaid.d.ts +0 -3
  147. package/dist/types/src/extensions/mermaid.d.ts.map +0 -1
  148. package/dist/types/src/extensions/table.d.ts.map +0 -1
  149. package/dist/types/src/extensions/tasklist.d.ts.map +0 -1
  150. package/dist/types/src/extensions/yjs/cursor.d.ts +0 -4
  151. package/dist/types/src/extensions/yjs/cursor.d.ts.map +0 -1
  152. package/dist/types/src/extensions/yjs/index.d.ts +0 -2
  153. package/dist/types/src/extensions/yjs/index.d.ts.map +0 -1
  154. package/dist/types/src/extensions/yjs/yjs.d.ts +0 -4
  155. package/dist/types/src/extensions/yjs/yjs.d.ts.map +0 -1
  156. package/dist/types/src/extensions/yjs/yjs.test.d.ts +0 -2
  157. package/dist/types/src/extensions/yjs/yjs.test.d.ts.map +0 -1
  158. package/dist/types/src/hooks/automerge.d.ts +0 -3
  159. package/dist/types/src/hooks/automerge.d.ts.map +0 -1
  160. package/dist/types/src/hooks/yjs.d.ts +0 -27
  161. package/dist/types/src/hooks/yjs.d.ts.map +0 -1
  162. package/dist/types/src/testing/index.d.ts +0 -3
  163. package/dist/types/src/testing/index.d.ts.map +0 -1
  164. package/dist/types/src/testing/proto/gen/schema.d.ts +0 -15
  165. package/dist/types/src/testing/proto/gen/schema.d.ts.map +0 -1
  166. package/dist/types/src/testing/proto/index.d.ts +0 -2
  167. package/dist/types/src/testing/proto/index.d.ts.map +0 -1
  168. package/dist/types/src/testing/replicator.d.ts +0 -45
  169. package/dist/types/src/testing/replicator.d.ts.map +0 -1
  170. package/dist/types/src/util/cursor.d.ts.map +0 -1
  171. package/dist/types/src/util/index.d.ts +0 -3
  172. package/dist/types/src/util/index.d.ts.map +0 -1
  173. package/dist/types/src/util/util.d.ts +0 -5
  174. package/dist/types/src/util/util.d.ts.map +0 -1
  175. package/src/components/TextEditor/codemirror.stories.ts +0 -115
  176. package/src/components/TextEditor/yjs.stories.tsx +0 -56
  177. package/src/extensions/code.ts +0 -99
  178. package/src/extensions/hr.ts +0 -74
  179. package/src/extensions/image.ts +0 -69
  180. package/src/extensions/mermaid.ts +0 -11
  181. package/src/extensions/tasklist.ts +0 -121
  182. package/src/extensions/yjs/cursor.ts +0 -21
  183. package/src/extensions/yjs/index.ts +0 -5
  184. package/src/extensions/yjs/yjs.test.ts +0 -35
  185. package/src/extensions/yjs/yjs.ts +0 -16
  186. package/src/hooks/automerge.ts +0 -52
  187. package/src/hooks/yjs.ts +0 -178
  188. package/src/testing/index.ts +0 -6
  189. package/src/testing/proto/gen/schema.ts +0 -49
  190. package/src/testing/proto/index.ts +0 -5
  191. package/src/testing/proto/schema.proto +0 -15
  192. package/src/testing/replicator.ts +0 -184
  193. package/src/util/cursor.ts +0 -29
  194. package/src/util/index.ts +0 -6
  195. package/src/util/util.ts +0 -18
  196. /package/dist/types/src/extensions/{code.d.ts → markdown/code.d.ts} +0 -0
  197. /package/dist/types/src/extensions/{hr.d.ts → markdown/hr.d.ts} +0 -0
  198. /package/dist/types/src/extensions/{image.d.ts → markdown/image.d.ts} +0 -0
  199. /package/dist/types/src/extensions/{link.d.ts → markdown/link.d.ts} +0 -0
  200. /package/dist/types/src/extensions/{table.d.ts → markdown/table.d.ts} +0 -0
  201. /package/dist/types/src/extensions/{tasklist.d.ts → markdown/tasklist.d.ts} +0 -0
@@ -6,8 +6,8 @@ import get from 'lodash.get';
6
6
 
7
7
  import { type ThemeStyles, tokens } from '../styles';
8
8
 
9
- // TODO(burdon): Can we erase All of the default CM styles?
10
- // TODO(burdon): Theme styles seem to be added multiple times?
9
+ // TODO(burdon): Can we use @apply and import css file?
10
+ // https://tailwindcss.com/docs/reusing-styles#extracting-classes-with-apply?
11
11
 
12
12
  /**
13
13
  * Minimal styles.
@@ -49,12 +49,14 @@ export const defaultTheme: ThemeStyles = {
49
49
  '&.cm-focused': {
50
50
  outline: 'none',
51
51
  },
52
- '& .cm-scroller': {
53
- overflow: 'visible',
52
+
53
+ '.cm-scroller': {
54
+ // overflow: 'visible',
54
55
  fontFamily: get(tokens, 'fontFamily.mono', []).join(','),
56
+ lineHeight: 1.4,
55
57
  },
56
58
 
57
- '& .cm-content': {
59
+ '.cm-content': {
58
60
  padding: 0,
59
61
  // NOTE: Base font size (otherwise defined by HTML tag, which might be different for storybook).
60
62
  fontSize: '16px',
@@ -77,18 +79,18 @@ export const defaultTheme: ThemeStyles = {
77
79
  '&dark .cm-cursor, &dark .cm-dropCursor': {
78
80
  borderLeft: '2px solid white',
79
81
  },
80
- '& .cm-placeholder': {
82
+ '.cm-placeholder': {
81
83
  fontWeight: 100,
82
84
  },
83
85
 
84
86
  //
85
87
  // line
86
88
  //
87
- '& .cm-line': {
89
+ '.cm-line': {
88
90
  paddingInline: 0,
89
91
  },
90
- '& .cm-activeLine': {
91
- background: 'inherit',
92
+ '.cm-activeLine': {
93
+ background: 'transparent',
92
94
  },
93
95
 
94
96
  //
@@ -119,40 +121,10 @@ export const defaultTheme: ThemeStyles = {
119
121
  backgroundColor: get(tokens, 'extend.colors.yellow.700'),
120
122
  },
121
123
 
122
- //
123
- // collaboration
124
- // TODO(burdon): Review classnames (YJS dependent?) Note: e2e tests depend on this class.
125
- //
126
-
127
- '&light .cm-ySelection, &light .cm-yLineSelection': {
128
- mixBlendMode: 'multiply',
129
- },
130
- '&dark .cm-ySelection, &dark .cm-yLineSelection': {
131
- mixBlendMode: 'screen',
132
- },
133
-
134
- '& .cm-ySelectionInfo': {
135
- padding: '2px 4px',
136
- marginBlockStart: '-4px',
137
- },
138
- '& .cm-ySelection, & .cm-selectionMatch': {
139
- paddingBlockStart: '.15em',
140
- paddingBlockEnd: '.15em',
141
- },
142
- '& .cm-ySelectionCaret': {
143
- display: 'inline-block',
144
- insetBlockStart: '.1em',
145
- blockSize: '1.4em',
146
- verticalAlign: 'top',
147
- },
148
- '& .cm-yLineSelection': {
149
- margin: 0,
150
- },
151
-
152
124
  //
153
125
  // link
154
126
  //
155
- '& .cm-link': {
127
+ '.cm-link': {
156
128
  color: get(tokens, 'extend.colors.primary.500'),
157
129
  textDecorationLine: 'underline',
158
130
  textDecorationThickness: '1px',
@@ -164,75 +136,74 @@ export const defaultTheme: ThemeStyles = {
164
136
  //
165
137
  // tooltip
166
138
  //
167
- '& .cm-tooltip': {
139
+ '.cm-tooltip': {
168
140
  border: 'none',
169
141
  },
170
- '& .cm-tooltip-below': {},
142
+ '.cm-tooltip-below': {},
171
143
 
172
144
  //
173
145
  // autocomplete
174
146
  //
175
- '& .cm-tooltip-autocomplete': {
147
+ '.cm-tooltip-autocomplete': {
176
148
  marginTop: '4px',
177
149
  marginLeft: '-3px',
178
150
  },
179
- '& .cm-tooltip-autocomplete ul li': {},
180
- '& .cm-tooltip-autocomplete ul li[aria-selected]': {},
181
- '& .cm-completionIcon': {
151
+ '.cm-tooltip-autocomplete ul li': {},
152
+ '.cm-tooltip-autocomplete ul li[aria-selected]': {},
153
+ '.cm-completionIcon': {
182
154
  display: 'none',
183
155
  },
184
- '& .cm-completionLabel': {
156
+ '.cm-completionLabel': {
185
157
  fontFamily: get(tokens, 'fontFamily.body', []).join(','),
186
158
  },
187
- '& .cm-completionMatchedText': {
159
+ '.cm-completionMatchedText': {
188
160
  textDecoration: 'none',
189
161
  },
190
162
 
191
- //
192
- // widgets
193
- //
194
- '& .cm-widgetBuffer': {
195
- display: 'none',
196
- height: 0,
197
- },
198
-
199
163
  //
200
164
  // table
201
165
  //
202
- '& .cm-table *': {
166
+ '.cm-table *': {
203
167
  fontFamily: `${get(tokens, 'fontFamily.mono', []).join(',')} !important`,
204
168
  textDecoration: 'none !important',
205
169
  },
206
- '& .cm-table-head': {
170
+ '.cm-table-head': {
207
171
  padding: '2px 16px 2px 0px',
208
172
  borderBottom: `1px solid ${get(tokens, 'extend.colors.neutral.500')}`,
209
173
  fontWeight: 100,
210
174
  textAlign: 'left',
211
175
  color: get(tokens, 'extend.colors.neutral.500'),
212
176
  },
213
- '& .cm-table-cell': {
177
+ '.cm-table-cell': {
214
178
  padding: '2px 16px 2px 0px',
215
179
  },
216
180
 
217
181
  //
218
182
  // image
219
183
  //
220
- '& .cm-image': {
221
- margin: '0.5rem 0',
184
+ '.cm-image': {
185
+ display: 'block',
186
+ height: '0',
187
+ },
188
+ '.cm-image.cm-loaded-image': {
189
+ height: 'auto',
190
+ borderTop: '0.5rem solid transparent',
191
+ borderBottom: '0.5rem solid transparent',
222
192
  },
223
193
 
224
194
  //
225
195
  // font size
226
- // TODO(thure): This appears to be the best or only way to set selection caret heights, but it's far more verbose than it needs to be.
196
+ // TODO(thure): This appears to be the best or only way to set selection caret heights,
197
+ // but it's far more verbose than it needs to be.
227
198
  //
228
- ...Object.keys(get(tokens, 'extend.fontSize', {})).reduce((acc: Record<string, any>, fontSize) => {
229
- const height = get(tokens, ['extend', 'fontSize', fontSize, 1, 'lineHeight']);
230
-
231
- acc[`& .text-${fontSize} + .cm-ySelectionCaret`] = { height };
232
- acc[`& .text-${fontSize} + .cm-ySelection + .cm-ySelectionCaret`] = { height };
233
- acc[`& .text-${fontSize} + .cm-widgetBuffer + .cm-ySelectionCaret`] = { height };
234
- return acc;
235
- }, {}),
199
+ // ...Object.keys(get(tokens, 'extend.fontSize', {})).reduce((acc: Record<string, any>, fontSize) => {
200
+ // const height = get(tokens, ['extend', 'fontSize', fontSize, 1, 'lineHeight']);
201
+ //
202
+ // acc[`& .text-${fontSize} + .cm-ySelectionCaret`] = { height };
203
+ // acc[`& .text-${fontSize} + .cm-ySelection + .cm-ySelectionCaret`] = { height };
204
+ // acc[`& .text-${fontSize} + .cm-widgetBuffer + .cm-ySelectionCaret`] = { height };
205
+ // return acc;
206
+ // }, {}),
236
207
 
237
208
  /**
238
209
  * Panels
@@ -250,14 +221,14 @@ export const defaultTheme: ThemeStyles = {
250
221
  * </div>
251
222
  * </div
252
223
  */
253
- '& .cm-panels': {
224
+ '.cm-panels': {
254
225
  border: `1px solid ${get(tokens, 'extend.colors.neutral.200')}`,
255
226
  },
256
- '& .cm-panel': {
227
+ '.cm-panel': {
257
228
  background: get(tokens, 'extend.colors.neutral.50'),
258
229
  fontFamily: get(tokens, 'fontFamily.body', []).join(','),
259
230
  },
260
- '& .cm-button': {
231
+ '.cm-button': {
261
232
  margin: '4px',
262
233
  fontFamily: get(tokens, 'fontFamily.body', []).join(','),
263
234
  background: get(tokens, 'extend.colors.neutral.100'),
@@ -271,32 +242,34 @@ export const defaultTheme: ThemeStyles = {
271
242
  backgroundImage: 'none',
272
243
  },
273
244
  },
274
- '& .cm-panel input[type=checkbox]': {
245
+ '.cm-panel input[type=checkbox]': {
275
246
  marginRight: '0.4rem !important',
276
247
  },
277
248
  };
278
249
 
279
250
  export const textTheme: ThemeStyles = {
280
- '& .cm-scroller': {
251
+ '.cm-scroller': {
281
252
  fontFamily: get(tokens, 'fontFamily.body', []).join(','),
282
253
  },
283
- '& .cm-placeholder': {
254
+ '.cm-placeholder': {
284
255
  fontFamily: get(tokens, 'fontFamily.body', []).join(','),
285
256
  },
286
257
  };
287
258
 
288
259
  export const markdownTheme: ThemeStyles = {
289
- // NOTE: Must leave base font family as is (i.e., monospace) due to fenced code blocks.
290
- '& .cm-placeholder': {
260
+ '.cm-scroller': {
261
+ fontFamily: get(tokens, 'fontFamily.body', []).join(','),
262
+ },
263
+ '.cm-placeholder': {
291
264
  fontFamily: get(tokens, 'fontFamily.body', []).join(','),
292
265
  },
293
266
  };
294
267
 
295
268
  export const codeTheme: ThemeStyles = {
296
- '& .cm-scroller': {
269
+ '.cm-scroller': {
297
270
  fontFamily: get(tokens, 'fontFamily.mono', []).join(','),
298
271
  },
299
- '& .cm-placeholder': {
272
+ '.cm-placeholder': {
300
273
  fontFamily: get(tokens, 'fontFamily.mono', []).join(','),
301
274
  },
302
275
  };
package/src/util.ts ADDED
@@ -0,0 +1,41 @@
1
+ //
2
+ // Copyright 2024 DXOS.org
3
+ //
4
+
5
+ import type { Transaction } from '@codemirror/state';
6
+
7
+ import { log } from '@dxos/log';
8
+
9
+ /**
10
+ * CodeMirror callbacks swallow errors so wrap handlers.
11
+ */
12
+ // TODO(burdon): EditorView.exceptionSink should catch errors.
13
+ export const callbackWrapper = <T extends Function>(fn: T): T =>
14
+ ((...args: any[]) => {
15
+ try {
16
+ return fn(...args);
17
+ } catch (err) {
18
+ log.catch(err);
19
+ }
20
+ }) as unknown as T;
21
+
22
+ export const logChanges = (trs: readonly Transaction[]) => {
23
+ const changes = trs
24
+ .flatMap((tr) => {
25
+ if (tr.changes.empty) {
26
+ return undefined;
27
+ }
28
+
29
+ const changes: any[] = [];
30
+ tr.changes.iterChanges((fromA, toA, fromB, toB, inserted) =>
31
+ changes.push(JSON.stringify({ fromA, toA, fromB, toB, inserted: inserted.toString() })),
32
+ );
33
+
34
+ return changes;
35
+ })
36
+ .filter(Boolean);
37
+
38
+ if (changes.length) {
39
+ console.log('changes', changes);
40
+ }
41
+ };
@@ -1,12 +0,0 @@
1
- import { type StoryObj } from '@storybook/html';
2
- import { Client, type PublicKey } from '@dxos/react-client';
3
- declare const _default: {
4
- title: string;
5
- };
6
- export default _default;
7
- export declare const Default: StoryObj<{
8
- id: number;
9
- client: Client;
10
- spaceKey: PublicKey;
11
- }>;
12
- //# sourceMappingURL=codemirror.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"codemirror.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/TextEditor/codemirror.stories.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAMhD,OAAO,EAAE,MAAM,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;;;;AAU5D,wBAEE;AAqEF,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAC;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,CAoBjF,CAAC"}
@@ -1,12 +0,0 @@
1
- import '@dxosTheme';
2
- import React from 'react';
3
- declare const _default: {
4
- title: string;
5
- component: React.ForwardRefExoticComponent<import("./TextEditor").TextEditorProps & React.RefAttributes<import("./TextEditor").TextEditorRef>>;
6
- decorators: import("@storybook/react").Decorator[];
7
- };
8
- export default _default;
9
- export declare const Default: {
10
- render: () => JSX.Element;
11
- };
12
- //# sourceMappingURL=yjs.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"yjs.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/TextEditor/yjs.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAEpB,OAAO,KAAmB,MAAM,OAAO,CAAC;;;;;;AAWxC,wBAIE;AA+BF,eAAO,MAAM,OAAO;;CAGnB,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"code.d.ts","sourceRoot":"","sources":["../../../../src/extensions/code.ts"],"names":[],"mappings":"AAuDA,eAAO,MAAM,IAAI,+CA2ChB,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"hr.d.ts","sourceRoot":"","sources":["../../../../src/extensions/hr.ts"],"names":[],"mappings":"AAmDA,eAAO,MAAM,EAAE,+CAsBd,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../../src/extensions/image.ts"],"names":[],"mappings":"AAKA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,mBAAmB,CAAC;AAG3B,MAAM,MAAM,YAAY,GAAG,EAAE,CAAC;AAE9B,eAAO,MAAM,KAAK,aAAa,YAAY,KAAQ,SAMlD,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../../src/extensions/link.ts"],"names":[],"mappings":"AAMA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,mBAAmB,CAAC;AAW3B,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,IAAI,aAAa,WAAW,KAAQ,SAyDhD,CAAC"}
@@ -1,3 +0,0 @@
1
- import { type Extension } from '@codemirror/state';
2
- export declare const mermaid: () => Extension;
3
- //# sourceMappingURL=mermaid.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"mermaid.d.ts","sourceRoot":"","sources":["../../../../src/extensions/mermaid.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAInD,eAAO,MAAM,OAAO,QAAO,SAE1B,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../../src/extensions/table.ts"],"names":[],"mappings":"AAKA,OAAO,EAAoB,KAAK,QAAQ,EAAmB,UAAU,EAAoB,MAAM,mBAAmB,CAAC;AASnH,MAAM,MAAM,YAAY,GAAG,EAAE,CAAC;AAE9B;;;GAGG;AACH,eAAO,MAAM,KAAK,aAAa,YAAY,8BAM1C,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"tasklist.d.ts","sourceRoot":"","sources":["../../../../src/extensions/tasklist.ts"],"names":[],"mappings":"AA+DA,MAAM,MAAM,eAAe,GAAG,EAAE,CAAC;AAEjC,eAAO,MAAM,QAAQ,aAAa,eAAe,4CAuDhD,CAAC"}
@@ -1,4 +0,0 @@
1
- import * as Y from 'yjs';
2
- import { type CursorConverter } from '../../util';
3
- export declare const cursorConverter: (text: Y.Text) => CursorConverter;
4
- //# sourceMappingURL=cursor.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"cursor.d.ts","sourceRoot":"","sources":["../../../../../src/extensions/yjs/cursor.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,CAAC,MAAM,KAAK,CAAC;AAIzB,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,YAAY,CAAC;AAElD,eAAO,MAAM,eAAe,SAAU,MAAM,KAAG,eAU7C,CAAC"}
@@ -1,2 +0,0 @@
1
- export * from './yjs';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/extensions/yjs/index.ts"],"names":[],"mappings":"AAIA,cAAc,OAAO,CAAC"}
@@ -1,4 +0,0 @@
1
- import type * as YP from 'y-protocols/awareness';
2
- import type { YText } from '@dxos/text-model';
3
- export declare const yjs: (content: YText, awareness?: YP.Awareness) => import("@codemirror/state").Extension[];
4
- //# sourceMappingURL=yjs.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"yjs.d.ts","sourceRoot":"","sources":["../../../../../src/extensions/yjs/yjs.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAEjD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAK9C,eAAO,MAAM,GAAG,YAAa,KAAK,cAAc,GAAG,SAAS,4CAG3D,CAAC"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=yjs.test.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"yjs.test.d.ts","sourceRoot":"","sources":["../../../../../src/extensions/yjs/yjs.test.ts"],"names":[],"mappings":""}
@@ -1,3 +0,0 @@
1
- import { type EditorModel, type UseTextModelProps } from './useTextModel';
2
- export declare const createAutomergeModel: ({ space, identity, text }: UseTextModelProps) => EditorModel;
3
- //# sourceMappingURL=automerge.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"automerge.d.ts","sourceRoot":"","sources":["../../../../src/hooks/automerge.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,KAAK,WAAW,EAAc,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAItF,eAAO,MAAM,oBAAoB,8BAA+B,iBAAiB,KAAG,WAqCnF,CAAC"}
@@ -1,27 +0,0 @@
1
- import { Observable } from 'lib0/observable';
2
- import * as YP from 'y-protocols/awareness';
3
- import { type Doc } from 'yjs';
4
- import { type Space } from '@dxos/react-client/echo';
5
- import { type EditorModel, type UseTextModelProps } from './useTextModel';
6
- export declare const createYjsModel: ({ identity, space, text }: UseTextModelProps) => EditorModel;
7
- /**
8
- * Yjs awareness provider on top of a DXOS space.
9
- */
10
- export declare class YAwarenessProvider extends Observable<any> {
11
- private readonly _space;
12
- private readonly _awareness;
13
- private readonly _clientId;
14
- private readonly _channel;
15
- constructor({ space, doc, channel, awareness, }: {
16
- space: Space;
17
- doc: Doc;
18
- channel: string;
19
- awareness?: YP.Awareness;
20
- });
21
- get awareness(): YP.Awareness;
22
- private _handleAwarenessUpdate;
23
- private _handleSpaceMessage;
24
- private _readMessage;
25
- private _handleBeforeUnload;
26
- }
27
- //# sourceMappingURL=yjs.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"yjs.d.ts","sourceRoot":"","sources":["../../../../src/hooks/yjs.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAE5C,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,KAAK,CAAC;AAI/B,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAKrD,OAAO,EAAE,KAAK,WAAW,EAA0B,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGlG,eAAO,MAAM,cAAc,8BAA+B,iBAAiB,KAAG,WAyC7E,CAAC;AAOF;;GAEG;AACH,qBAAa,kBAAmB,SAAQ,UAAU,CAAC,GAAG,CAAC;IACrD,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAQ;IAC/B,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAe;IAC1C,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAS;IACnC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAS;gBAEtB,EACV,KAAK,EACL,GAAG,EACH,OAAO,EACP,SAAS,GACV,EAAE;QACD,KAAK,EAAE,KAAK,CAAC;QACb,GAAG,EAAE,GAAG,CAAC;QACT,OAAO,EAAE,MAAM,CAAC;QAChB,SAAS,CAAC,EAAE,EAAE,CAAC,SAAS,CAAC;KAC1B;IA4BD,IAAI,SAAS,IAAI,EAAE,CAAC,SAAS,CAE5B;IAED,OAAO,CAAC,sBAAsB;IAS9B,OAAO,CAAC,mBAAmB;IAS3B,OAAO,CAAC,YAAY;IAoCpB,OAAO,CAAC,mBAAmB;CAG5B"}
@@ -1,3 +0,0 @@
1
- export * from './proto';
2
- export * from './replicator';
3
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/testing/index.ts"],"names":[],"mappings":"AAIA,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC"}
@@ -1,15 +0,0 @@
1
- /**
2
- * @generated @dxos/echo-typegen src/testing/proto/schema.proto
3
- **/
4
- import * as dxos_echo_schema from "@dxos/echo-schema";
5
- export declare const types: dxos_echo_schema.TypeCollection;
6
- export type EditorDocumentProps = {
7
- content: dxos_echo_schema.Text;
8
- };
9
- export declare class EditorDocument extends dxos_echo_schema.TypedObject<EditorDocumentProps> {
10
- static readonly schema: dxos_echo_schema.Schema;
11
- static filter(filter?: Partial<EditorDocumentProps> | dxos_echo_schema.OperatorFilter<EditorDocument>): dxos_echo_schema.Filter<EditorDocument>;
12
- constructor(initValues?: Partial<EditorDocumentProps>, opts?: dxos_echo_schema.TypedObjectOptions);
13
- content: dxos_echo_schema.Text;
14
- }
15
- //# sourceMappingURL=schema.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../../../../src/testing/proto/gen/schema.ts"],"names":[],"mappings":"AAAA;;IAEI;AAEJ,OAAO,KAAK,gBAAgB,MAAM,mBAAmB,CAAC;AAEtD,eAAO,MAAM,KAAK,iCAAwC,CAAC;AAE3D,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE,gBAAgB,CAAC,IAAI,CAAC;CAChC,CAAC;AAEF,qBAAa,cAAe,SAAQ,gBAAgB,CAAC,WAAW,CAAC,mBAAmB,CAAC;IACnF,gBAAwB,MAAM,EAAE,gBAAgB,CAAC,MAAM,CAAC;IAExD,MAAM,CAAC,MAAM,CACX,MAAM,CAAC,EACH,OAAO,CAAC,mBAAmB,CAAC,GAC5B,gBAAgB,CAAC,cAAc,CAAC,cAAc,CAAC,GAClD,gBAAgB,CAAC,MAAM,CAAC,cAAc,CAAC;gBAQxC,UAAU,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,EACzC,IAAI,CAAC,EAAE,gBAAgB,CAAC,kBAAkB;IAIpC,OAAO,EAAE,gBAAgB,CAAC,IAAI,CAAC;CACxC"}
@@ -1,2 +0,0 @@
1
- export * from './gen/schema';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/testing/proto/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC"}
@@ -1,45 +0,0 @@
1
- import { Observable } from 'lib0/observable';
2
- import * as YP from 'y-protocols/awareness';
3
- import { Doc } from 'yjs';
4
- import { Event } from '@dxos/async';
5
- import { TextKind } from '@dxos/protocols/proto/dxos/echo/model/text';
6
- import { type EditorModel } from '../hooks';
7
- type Awareness = YP.Awareness;
8
- /**
9
- * Yjs awareness provider in-memory.
10
- */
11
- export declare class AwarenessProvider extends Observable<any> {
12
- private readonly _remoteUpdate;
13
- private readonly _awareness;
14
- private readonly _doc;
15
- constructor({ update, doc, awareness }: {
16
- update: Event<Uint8Array>;
17
- doc: Doc;
18
- awareness?: Awareness;
19
- });
20
- get awareness(): Awareness;
21
- private _handleDocUpdate;
22
- private _handleAwarenessUpdate;
23
- private _handleRemoteUpdate;
24
- private _readMessage;
25
- private _handleBeforeUnload;
26
- }
27
- /**
28
- * This mocks the replication across the swarm.
29
- */
30
- export declare class Replicator {
31
- private readonly _kind;
32
- private readonly _update;
33
- private _peers;
34
- constructor(_kind: TextKind);
35
- setPeers(peers: EditorModel[]): void;
36
- createPeer: (id: string, doc?: Doc) => EditorModel;
37
- }
38
- export type UseYjsModelOptions = {
39
- replicator: Replicator;
40
- id: string;
41
- doc?: Doc;
42
- };
43
- export declare const useYjsModel: ({ replicator, id, doc }: UseYjsModelOptions) => EditorModel;
44
- export {};
45
- //# sourceMappingURL=replicator.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"replicator.d.ts","sourceRoot":"","sources":["../../../../src/testing/replicator.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,OAAO,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAE5C,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,OAAO,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAC;AAEtE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAG5C,KAAK,SAAS,GAAG,EAAE,CAAC,SAAS,CAAC;AAM9B;;GAEG;AACH,qBAAa,iBAAkB,SAAQ,UAAU,CAAC,GAAG,CAAC;IACpD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAoB;IAClD,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAY;IACvC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAM;gBAEf,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE;QAAE,MAAM,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;QAAC,GAAG,EAAE,GAAG,CAAC;QAAC,SAAS,CAAC,EAAE,SAAS,CAAA;KAAE;IA4BtG,IAAI,SAAS,IAAI,SAAS,CAEzB;IAED,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,sBAAsB;IAS9B,OAAO,CAAC,mBAAmB;IAS3B,OAAO,CAAC,YAAY;IA0CpB,OAAO,CAAC,mBAAmB;CAG5B;AAED;;GAEG;AACH,qBAAa,UAAU;IAIT,OAAO,CAAC,QAAQ,CAAC,KAAK;IAHlC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA2B;IACnD,OAAO,CAAC,MAAM,CAAqB;gBAEN,KAAK,EAAE,QAAQ;IAE5C,QAAQ,CAAC,KAAK,EAAE,WAAW,EAAE;IAI7B,UAAU,OAAQ,MAAM,QAAO,GAAG,KAAe,WAAW,CAoB1D;CACH;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,UAAU,EAAE,UAAU,CAAC;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,CAAC,EAAE,GAAG,CAAC;CACX,CAAC;AAEF,eAAO,MAAM,WAAW,4BAA6B,kBAAkB,KAAG,WAEzE,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"cursor.d.ts","sourceRoot":"","sources":["../../../../src/util/cursor.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C;;;;;;;;;GASG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,SAAS,GAAG,MAAM,CAAC;IAC/D,UAAU,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;CACpC;AAOD,eAAO,MAAM,eAAe,yCAE1B,CAAC"}
@@ -1,3 +0,0 @@
1
- export * from './cursor';
2
- export * from './util';
3
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/util/index.ts"],"names":[],"mappings":"AAIA,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC"}
@@ -1,5 +0,0 @@
1
- /**
2
- * CodeMirror callbacks swallow errors so wrap handlers.
3
- */
4
- export declare const callbackWrapper: <T extends Function>(fn: T) => T;
5
- //# sourceMappingURL=util.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../../src/util/util.ts"],"names":[],"mappings":"AAMA;;GAEG;AAEH,eAAO,MAAM,eAAe,kCAOR,CAAC"}