@dxos/react-ui-editor 0.3.9-main.632a97f → 0.3.9-main.71124bf

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 (147) hide show
  1. package/dist/lib/browser/index.mjs +962 -608
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/types/src/automerge/automerge-plugin/PatchSemaphore.d.ts +2 -2
  5. package/dist/types/src/automerge/automerge-plugin/PatchSemaphore.d.ts.map +1 -1
  6. package/dist/types/src/automerge/automerge-plugin/codeMirrorToAm.d.ts +2 -2
  7. package/dist/types/src/automerge/automerge-plugin/codeMirrorToAm.d.ts.map +1 -1
  8. package/dist/types/src/automerge/automerge-plugin/handle.d.ts +9 -0
  9. package/dist/types/src/automerge/automerge-plugin/handle.d.ts.map +1 -0
  10. package/dist/types/src/automerge/automerge-plugin/index.d.ts +2 -2
  11. package/dist/types/src/automerge/automerge-plugin/index.d.ts.map +1 -1
  12. package/dist/types/src/automerge/automerge-plugin/plugin.d.ts +6 -5
  13. package/dist/types/src/automerge/automerge-plugin/plugin.d.ts.map +1 -1
  14. package/dist/types/src/automerge/automerge.stories.d.ts +2 -1
  15. package/dist/types/src/automerge/automerge.stories.d.ts.map +1 -1
  16. package/dist/types/src/components/TextEditor/TextEditor.d.ts +24 -20
  17. package/dist/types/src/components/TextEditor/TextEditor.d.ts.map +1 -1
  18. package/dist/types/src/components/TextEditor/TextEditor.stories.d.ts +8 -10
  19. package/dist/types/src/components/TextEditor/TextEditor.stories.d.ts.map +1 -1
  20. package/dist/types/{stories/html/code-mirror.stories.d.ts → src/components/TextEditor/codemirror.stories.d.ts} +2 -2
  21. package/dist/types/src/components/TextEditor/codemirror.stories.d.ts.map +1 -0
  22. package/dist/types/src/components/TextEditor/extensions/basic/bundle.d.ts +8 -0
  23. package/dist/types/src/components/TextEditor/extensions/basic/bundle.d.ts.map +1 -0
  24. package/dist/types/src/components/TextEditor/extensions/basic/index.d.ts +3 -0
  25. package/dist/types/src/components/TextEditor/extensions/basic/index.d.ts.map +1 -0
  26. package/dist/types/src/components/TextEditor/extensions/basic/theme.d.ts +10 -0
  27. package/dist/types/src/components/TextEditor/extensions/basic/theme.d.ts.map +1 -0
  28. package/dist/types/src/components/TextEditor/extensions/change.d.ts +7 -0
  29. package/dist/types/src/components/TextEditor/extensions/change.d.ts.map +1 -0
  30. package/dist/types/src/components/TextEditor/extensions/hyperlink/hyperlinkDecoration.d.ts +11 -0
  31. package/dist/types/src/components/TextEditor/extensions/hyperlink/hyperlinkDecoration.d.ts.map +1 -0
  32. package/dist/types/src/components/TextEditor/extensions/hyperlink/hyperlinkTooltip.d.ts +8 -0
  33. package/dist/types/src/components/TextEditor/extensions/hyperlink/hyperlinkTooltip.d.ts.map +1 -0
  34. package/dist/types/src/components/TextEditor/extensions/hyperlink/hyperlinkWidget.d.ts +10 -0
  35. package/dist/types/src/components/TextEditor/extensions/hyperlink/hyperlinkWidget.d.ts.map +1 -0
  36. package/dist/types/src/components/TextEditor/extensions/hyperlink/index.d.ts +4 -0
  37. package/dist/types/src/components/TextEditor/extensions/hyperlink/index.d.ts.map +1 -0
  38. package/dist/types/src/components/TextEditor/extensions/index.d.ts +5 -0
  39. package/dist/types/src/components/TextEditor/extensions/index.d.ts.map +1 -0
  40. package/dist/types/src/components/TextEditor/extensions/markdown/bundle.d.ts +8 -0
  41. package/dist/types/src/components/TextEditor/extensions/markdown/bundle.d.ts.map +1 -0
  42. package/dist/types/src/components/TextEditor/extensions/markdown/index.d.ts +3 -0
  43. package/dist/types/src/components/TextEditor/extensions/markdown/index.d.ts.map +1 -0
  44. package/dist/types/src/components/{Markdown/markdownTags.d.ts → TextEditor/extensions/markdown/tags.d.ts} +1 -1
  45. package/dist/types/src/components/TextEditor/extensions/markdown/tags.d.ts.map +1 -0
  46. package/dist/types/src/components/TextEditor/extensions/markdown/theme.d.ts +21 -0
  47. package/dist/types/src/components/TextEditor/extensions/markdown/theme.d.ts.map +1 -0
  48. package/dist/types/src/components/TextEditor/index.d.ts +1 -2
  49. package/dist/types/src/components/TextEditor/index.d.ts.map +1 -1
  50. package/dist/types/src/components/TextEditor/yjs.stories.d.ts +11 -0
  51. package/dist/types/src/components/TextEditor/yjs.stories.d.ts.map +1 -0
  52. package/dist/types/src/components/index.d.ts +0 -3
  53. package/dist/types/src/components/index.d.ts.map +1 -1
  54. package/dist/types/src/hooks/index.d.ts +4 -0
  55. package/dist/types/src/hooks/index.d.ts.map +1 -0
  56. package/dist/types/src/hooks/useCollaboration.d.ts +9 -0
  57. package/dist/types/src/hooks/useCollaboration.d.ts.map +1 -0
  58. package/dist/types/src/{model.d.ts → hooks/useTextModel.d.ts} +3 -15
  59. package/dist/types/src/hooks/useTextModel.d.ts.map +1 -0
  60. package/dist/types/src/hooks/yjs/cursors.d.ts.map +1 -0
  61. package/dist/types/src/hooks/yjs/index.d.ts.map +1 -0
  62. package/dist/types/src/hooks/yjs/space-provider.d.ts.map +1 -0
  63. package/dist/types/src/index.d.ts +2 -2
  64. package/dist/types/src/index.d.ts.map +1 -1
  65. package/dist/types/src/styles/tokens.d.ts +4 -0
  66. package/dist/types/src/styles/tokens.d.ts.map +1 -1
  67. package/dist/types/src/testing/replicator.d.ts +1 -1
  68. package/dist/types/src/testing/replicator.d.ts.map +1 -1
  69. package/package.json +32 -26
  70. package/src/automerge/automerge-plugin/PatchSemaphore.ts +5 -5
  71. package/src/automerge/automerge-plugin/codeMirrorToAm.ts +10 -7
  72. package/src/automerge/automerge-plugin/handle.ts +14 -0
  73. package/src/automerge/automerge-plugin/index.ts +2 -2
  74. package/src/automerge/automerge-plugin/plugin.ts +39 -10
  75. package/src/automerge/automerge.stories.tsx +32 -47
  76. package/src/components/TextEditor/TextEditor.stories.tsx +56 -8
  77. package/src/components/TextEditor/TextEditor.tsx +113 -55
  78. package/src/components/TextEditor/codemirror.stories.ts +114 -0
  79. package/src/components/TextEditor/extensions/basic/bundle.ts +26 -0
  80. package/src/components/TextEditor/extensions/basic/index.ts +6 -0
  81. package/src/components/TextEditor/extensions/basic/theme.ts +49 -0
  82. package/src/components/TextEditor/extensions/change.ts +22 -0
  83. package/src/components/TextEditor/extensions/hyperlink/hyperlinkDecoration.ts +99 -0
  84. package/src/components/TextEditor/extensions/hyperlink/hyperlinkTooltip.tsx +61 -0
  85. package/src/components/TextEditor/extensions/hyperlink/hyperlinkWidget.tsx +119 -0
  86. package/src/components/TextEditor/extensions/hyperlink/index.ts +7 -0
  87. package/src/components/TextEditor/extensions/index.ts +8 -0
  88. package/src/components/TextEditor/extensions/markdown/bundle.ts +99 -0
  89. package/src/components/TextEditor/extensions/markdown/index.ts +6 -0
  90. package/src/components/{Markdown/markdownTheme.ts → TextEditor/extensions/markdown/theme.ts} +42 -27
  91. package/src/components/TextEditor/index.ts +1 -2
  92. package/src/components/TextEditor/yjs.stories.tsx +55 -0
  93. package/src/components/index.ts +0 -3
  94. package/src/hooks/index.ts +7 -0
  95. package/src/hooks/useCollaboration.ts +45 -0
  96. package/src/{model.ts → hooks/useTextModel.ts} +42 -17
  97. package/src/index.ts +3 -3
  98. package/src/styles/tokens.ts +6 -0
  99. package/src/testing/replicator.ts +1 -2
  100. package/dist/types/src/automerge/demo.d.ts +0 -25
  101. package/dist/types/src/automerge/demo.d.ts.map +0 -1
  102. package/dist/types/src/components/Editor/Editor.d.ts +0 -15
  103. package/dist/types/src/components/Editor/Editor.d.ts.map +0 -1
  104. package/dist/types/src/components/Editor/Editor.stories.d.ts +0 -28
  105. package/dist/types/src/components/Editor/Editor.stories.d.ts.map +0 -1
  106. package/dist/types/src/components/Editor/index.d.ts +0 -2
  107. package/dist/types/src/components/Editor/index.d.ts.map +0 -1
  108. package/dist/types/src/components/Markdown/Markdown.d.ts +0 -19
  109. package/dist/types/src/components/Markdown/Markdown.d.ts.map +0 -1
  110. package/dist/types/src/components/Markdown/Markdown.stories.d.ts +0 -19
  111. package/dist/types/src/components/Markdown/Markdown.stories.d.ts.map +0 -1
  112. package/dist/types/src/components/Markdown/index.d.ts +0 -2
  113. package/dist/types/src/components/Markdown/index.d.ts.map +0 -1
  114. package/dist/types/src/components/Markdown/markdownTags.d.ts.map +0 -1
  115. package/dist/types/src/components/Markdown/markdownTheme.d.ts +0 -107
  116. package/dist/types/src/components/Markdown/markdownTheme.d.ts.map +0 -1
  117. package/dist/types/src/components/RichText/RichText.d.ts +0 -20
  118. package/dist/types/src/components/RichText/RichText.d.ts.map +0 -1
  119. package/dist/types/src/components/RichText/RichText.stories.d.ts +0 -26
  120. package/dist/types/src/components/RichText/RichText.stories.d.ts.map +0 -1
  121. package/dist/types/src/components/RichText/index.d.ts +0 -2
  122. package/dist/types/src/components/RichText/index.d.ts.map +0 -1
  123. package/dist/types/src/components/TextEditor/theme.d.ts +0 -8
  124. package/dist/types/src/components/TextEditor/theme.d.ts.map +0 -1
  125. package/dist/types/src/model.d.ts.map +0 -1
  126. package/dist/types/src/yjs/cursors.d.ts.map +0 -1
  127. package/dist/types/src/yjs/index.d.ts.map +0 -1
  128. package/dist/types/src/yjs/space-provider.d.ts.map +0 -1
  129. package/dist/types/stories/html/code-mirror.stories.d.ts.map +0 -1
  130. package/src/automerge/demo.ts +0 -106
  131. package/src/components/Editor/Editor.stories.tsx +0 -80
  132. package/src/components/Editor/Editor.tsx +0 -33
  133. package/src/components/Editor/index.ts +0 -5
  134. package/src/components/Markdown/Markdown.stories.tsx +0 -57
  135. package/src/components/Markdown/Markdown.tsx +0 -210
  136. package/src/components/Markdown/index.ts +0 -5
  137. package/src/components/RichText/RichText.stories.tsx +0 -68
  138. package/src/components/RichText/RichText.tsx +0 -181
  139. package/src/components/RichText/index.ts +0 -5
  140. package/src/components/TextEditor/theme.ts +0 -29
  141. /package/dist/types/src/{yjs → hooks/yjs}/cursors.d.ts +0 -0
  142. /package/dist/types/src/{yjs → hooks/yjs}/index.d.ts +0 -0
  143. /package/dist/types/src/{yjs → hooks/yjs}/space-provider.d.ts +0 -0
  144. /package/src/components/{Markdown/markdownTags.ts → TextEditor/extensions/markdown/tags.ts} +0 -0
  145. /package/src/{yjs → hooks/yjs}/cursors.ts +0 -0
  146. /package/src/{yjs → hooks/yjs}/index.ts +0 -0
  147. /package/src/{yjs → hooks/yjs}/space-provider.ts +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"file":"Editor.d.ts","sourceRoot":"","sources":["../../../../../src/components/Editor/Editor.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAI1D,OAAO,EAAE,KAAK,WAAW,EAAgB,KAAK,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACvF,OAAO,EAAkB,KAAK,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAGrE,MAAM,MAAM,WAAW,GAAG,mBAAmB,GAAG;IAC9C,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB,CAAC;AAEF;;;;GAIG;AAGH,eAAO,MAAM,MAAM;;6EASlB,CAAC"}
@@ -1,28 +0,0 @@
1
- import '@dxosTheme';
2
- import React from 'react';
3
- declare const _default: {
4
- component: React.MemoExoticComponent<React.ForwardRefExoticComponent<import("../..").UseTextModelOptions & {
5
- slots?: import("../..").EditorSlots | undefined;
6
- } & React.RefAttributes<import("..").MarkdownEditorRef | import("@tiptap/react").Editor>>>;
7
- };
8
- export default _default;
9
- export declare const Markdown: {
10
- render: (args: {
11
- id: number;
12
- }) => JSX.Element;
13
- decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R, any>[];
14
- };
15
- export declare const Rich: {
16
- render: (args: {
17
- id: number;
18
- }) => JSX.Element;
19
- args: {
20
- slots: {
21
- editor: {
22
- className: string;
23
- };
24
- };
25
- };
26
- decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R, any>[];
27
- };
28
- //# sourceMappingURL=Editor.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Editor.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Editor/Editor.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAEpB,OAAO,KAAmB,MAAM,OAAO,CAAC;;;;;;AAWxC,wBAEE;AAoCF,eAAO,MAAM,QAAQ;mBACJ;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE;;CAE9B,CAAC;AAWF,eAAO,MAAM,IAAI;mBACA;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE;;;;;;;;;CAS9B,CAAC"}
@@ -1,2 +0,0 @@
1
- export * from './Editor';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Editor/index.ts"],"names":[],"mappings":"AAIA,cAAc,UAAU,CAAC"}
@@ -1,19 +0,0 @@
1
- import { EditorState, type Text } from '@codemirror/state';
2
- import { EditorView } from '@codemirror/view';
3
- import React from 'react';
4
- import { type EditorModel, type EditorSlots } from '../../model';
5
- export declare const EditorModes: readonly ["default", "vim"];
6
- export type EditorMode = (typeof EditorModes)[number];
7
- export type MarkdownEditorProps = {
8
- model?: EditorModel;
9
- slots?: EditorSlots;
10
- editorMode?: EditorMode;
11
- onChange?: (content: string | Text) => void;
12
- };
13
- export type MarkdownEditorRef = {
14
- editor: HTMLDivElement | null;
15
- state?: EditorState;
16
- view?: EditorView;
17
- };
18
- export declare const MarkdownEditor: React.ForwardRefExoticComponent<MarkdownEditorProps & React.RefAttributes<MarkdownEditorRef>>;
19
- //# sourceMappingURL=Markdown.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/Markdown.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAE,WAAW,EAAc,KAAK,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEvE,OAAO,EAUL,UAAU,EACX,MAAM,kBAAkB,CAAC;AAG1B,OAAO,KAQN,MAAM,OAAO,CAAC;AAUf,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAEjE,eAAO,MAAM,WAAW,6BAA8B,CAAC;AACvD,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEtD,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC7C,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,cAAc,GAAG,IAAI,CAAC;IAC9B,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,cAAc,+FA4I1B,CAAC"}
@@ -1,19 +0,0 @@
1
- import '@dxosTheme';
2
- import React from 'react';
3
- declare const _default: {
4
- component: React.ForwardRefExoticComponent<import("./Markdown").MarkdownEditorProps & React.RefAttributes<import("./Markdown").MarkdownEditorRef>>;
5
- };
6
- export default _default;
7
- export declare const Default: {
8
- args: {
9
- model: {
10
- id: string;
11
- content: string;
12
- };
13
- };
14
- };
15
- export declare const WithYjs: {
16
- render: () => JSX.Element;
17
- decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R, any>[];
18
- };
19
- //# sourceMappingURL=Markdown.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Markdown.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/Markdown.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAEpB,OAAO,KAAmB,MAAM,OAAO,CAAC;;;;AAUxC,wBAEE;AAEF,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC;AAIF,eAAO,MAAM,OAAO;;;CAyBnB,CAAC"}
@@ -1,2 +0,0 @@
1
- export * from './Markdown';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/index.ts"],"names":[],"mappings":"AAIA,cAAc,YAAY,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"markdownTags.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/markdownTags.ts"],"names":[],"mappings":"AAIA,OAAO,EAAa,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEtD,eAAO,MAAM,YAAY;;;;;;;;;;;;CAYxB,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,cAgBnC,CAAC"}
@@ -1,107 +0,0 @@
1
- import { HighlightStyle } from '@codemirror/language';
2
- export declare const chalky = "#e5c07b";
3
- export declare const coral = "#e06c75";
4
- export declare const cyan = "#56b6c2";
5
- export declare const invalid = "#ffffff";
6
- export declare const ivory = "#abb2bf";
7
- export declare const stone = "#7d8799";
8
- export declare const malibu = "#61afef";
9
- export declare const sage = "#98c379";
10
- export declare const whiskey = "#d19a66";
11
- export declare const violet = "#c678dd";
12
- export declare const highlightBackground = "#2c313a";
13
- export declare const tooltipBackground = "#353a42";
14
- export declare const cursor = "#ffffff";
15
- export declare const markdownTheme: {
16
- '.dark & .cm-tooltip': {
17
- border: string;
18
- backgroundColor: string;
19
- };
20
- '.dark & .cm-tooltip .cm-tooltip-arrow:before': {
21
- borderTopColor: string;
22
- borderBottomColor: string;
23
- };
24
- '.dark & .cm-tooltip .cm-tooltip-arrow:after': {
25
- borderTopColor: string;
26
- borderBottomColor: string;
27
- };
28
- '.dark & .cm-tooltip-autocomplete': {
29
- '& > ul > li[aria-selected]': {
30
- backgroundColor: string;
31
- color: string;
32
- };
33
- };
34
- '&.cm-focused': {
35
- outline: string;
36
- };
37
- '& .cm-line': {
38
- paddingInline: number;
39
- minBlockSize: string;
40
- };
41
- '& .cm-line *': {
42
- lineHeight: number;
43
- };
44
- '&.cm-focused .cm-selectionBackground, & .cm-selectionBackground': {
45
- background: any;
46
- };
47
- '.dark & .cm-selectionBackground, .dark &.cm-focused .cm-selectionBackground': {
48
- background: any;
49
- };
50
- '& .cm-selectionMatch': {
51
- background: string;
52
- };
53
- '.dark & .cm-selectionMatch': {
54
- background: string;
55
- };
56
- '& .cm-content': {
57
- caretColor: string;
58
- };
59
- '.dark & .cm-content': {
60
- caretColor: string;
61
- };
62
- '& .cm-cursor': {
63
- borderLeftColor: string;
64
- };
65
- '.dark & .cm-cursor': {
66
- borderLeftColor: string;
67
- };
68
- '.cm-placeholder': {
69
- fontFamily: any;
70
- };
71
- '& .cm-scroller': {
72
- fontFamily: any;
73
- overflow: string;
74
- };
75
- '& .cm-activeLine': {
76
- backgroundColor: string;
77
- };
78
- '.dark & .cm-activeLine': {
79
- backgroundColor: string;
80
- };
81
- '& .cm-ySelectionInfo': {
82
- fontFamily: any;
83
- padding: string;
84
- marginBlockStart: string;
85
- };
86
- '& .cm-ySelection, & .cm-selectionMatch': {
87
- paddingBlockStart: string;
88
- paddingBlockEnd: string;
89
- };
90
- '& .cm-ySelection, & .cm-yLineSelection': {
91
- mixBlendMode: string;
92
- };
93
- '.dark & .cm-ySelection, .dark & .cm-yLineSelection': {
94
- mixBlendMode: string;
95
- };
96
- '& .cm-ySelectionCaret': {
97
- display: string;
98
- insetBlockStart: string;
99
- blockSize: string;
100
- verticalAlign: string;
101
- };
102
- '& .cm-yLineSelection': {
103
- margin: string;
104
- };
105
- };
106
- export declare const markdownDarkHighlighting: HighlightStyle;
107
- //# sourceMappingURL=markdownTheme.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"markdownTheme.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/markdownTheme.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAUtD,eAAO,MAAM,MAAM,YAAY,CAAC;AAChC,eAAO,MAAM,KAAK,YAAY,CAAC;AAC/B,eAAO,MAAM,IAAI,YAAY,CAAC;AAC9B,eAAO,MAAM,OAAO,YAAY,CAAC;AACjC,eAAO,MAAM,KAAK,YAAY,CAAC;AAC/B,eAAO,MAAM,KAAK,YAAY,CAAC;AAC/B,eAAO,MAAM,MAAM,YAAY,CAAC;AAChC,eAAO,MAAM,IAAI,YAAY,CAAC;AAC9B,eAAO,MAAM,OAAO,YAAY,CAAC;AACjC,eAAO,MAAM,MAAM,YAAY,CAAC;AAEhC,eAAO,MAAM,mBAAmB,YAAY,CAAC;AAE7C,eAAO,MAAM,iBAAiB,YAAY,CAAC;AAE3C,eAAO,MAAM,MAAM,YAAY,CAAC;AAIhC,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwIzB,CAAC;AAEF,eAAO,MAAM,wBAAwB,gBA6EpC,CAAC"}
@@ -1,20 +0,0 @@
1
- import { type Editor } from '@tiptap/react';
2
- import React from 'react';
3
- import { type EditorModel, type EditorSlots } from '../../model';
4
- export type TipTapEditor = Editor;
5
- type UseEditorOptions = {
6
- model?: EditorModel;
7
- placeholder?: string;
8
- slots?: Pick<EditorSlots, 'editor'>;
9
- };
10
- export type RichTextEditorProps = UseEditorOptions & {
11
- slots?: EditorSlots;
12
- };
13
- /**
14
- * @deprecated
15
- */
16
- export declare const RichTextEditor: React.ForwardRefExoticComponent<UseEditorOptions & {
17
- slots?: EditorSlots | undefined;
18
- } & React.RefAttributes<Editor | null>>;
19
- export {};
20
- //# sourceMappingURL=RichText.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RichText.d.ts","sourceRoot":"","sources":["../../../../../src/components/RichText/RichText.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,MAAM,EAAgD,MAAM,eAAe,CAAC;AAE1F,OAAO,KAAmD,MAAM,OAAO,CAAC;AAKxE,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAkBjE,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC;AAElC,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;CACrC,CAAC;AA2HF,MAAM,MAAM,mBAAmB,GAAG,gBAAgB,GAAG;IACnD,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB,CAAC;AAEF;;GAEG;AAEH,eAAO,MAAM,cAAc;;uCASzB,CAAC"}
@@ -1,26 +0,0 @@
1
- import '@dxosTheme';
2
- import React from 'react';
3
- import { type RichTextEditorProps } from './RichText';
4
- declare const _default: {
5
- component: React.ForwardRefExoticComponent<{
6
- model?: import("../..").EditorModel | undefined;
7
- placeholder?: string | undefined;
8
- slots?: Pick<import("../..").EditorSlots, "editor"> | undefined;
9
- } & {
10
- slots?: import("../..").EditorSlots | undefined;
11
- } & React.RefAttributes<import("@tiptap/react").Editor | null>>;
12
- };
13
- export default _default;
14
- export declare const Default: {
15
- args: {
16
- model: {
17
- id: string;
18
- content: string;
19
- };
20
- };
21
- };
22
- export declare const WithYjs: {
23
- render: (args: Omit<RichTextEditorProps, 'model'>) => JSX.Element;
24
- decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R, any>[];
25
- };
26
- //# sourceMappingURL=RichText.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RichText.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/RichText/RichText.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAEpB,OAAO,KAAmB,MAAM,OAAO,CAAC;AAQxC,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,YAAY,CAAC;;;;;;;;;;AAGtE,wBAEE;AAEF,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC;AAGF,eAAO,MAAM,OAAO;mBACH,KAAK,mBAAmB,EAAE,OAAO,CAAC;;CAmClD,CAAC"}
@@ -1,2 +0,0 @@
1
- export * from './RichText';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/RichText/index.ts"],"names":[],"mappings":"AAIA,cAAc,YAAY,CAAC"}
@@ -1,8 +0,0 @@
1
- import { type StyleSpec } from 'style-mod';
2
- /**
3
- * https://codemirror.net/examples/styling
4
- */
5
- export declare const defaultStyles: {
6
- [selector: string]: StyleSpec;
7
- };
8
- //# sourceMappingURL=theme.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../../src/components/TextEditor/theme.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AAM3C;;GAEG;AAEH,eAAO,MAAM,aAAa,EAAE;IAC1B,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;CAY/B,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"model.d.ts","sourceRoot":"","sources":["../../../src/model.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,KAAK,cAAc,EAAW,MAAM,OAAO,CAAC;AACrD,OAAO,KAAK,KAAK,iBAAiB,MAAM,uBAAuB,CAAC;AAEhE,OAAO,EAAE,KAAK,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAI5D,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;IAC1C,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,UAAU,CAAC,EAAE,OAAO,CAAC;QACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,aAAa,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;KACxD,CAAC;CACH,CAAC;AAEF,KAAK,SAAS,GAAG,iBAAiB,CAAC,SAAS,CAAC;AAC7C,KAAK,QAAQ,GAAG;IAAE,SAAS,EAAE,SAAS,CAAA;CAAE,CAAC;AAGzC,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,GAAG,KAAK,GAAG,YAAY,CAAC;IACvC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,IAAI,CAAC,EAAE;QACL,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAIF,eAAO,MAAM,YAAY,8BAA+B,mBAAmB,KAAG,WAAW,GAAG,SAwB3F,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"cursors.d.ts","sourceRoot":"","sources":["../../../../src/yjs/cursors.ts"],"names":[],"mappings":"AAoBA,eAAO,MAAM,WAAW;;;CAAsD,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/yjs/index.ts"],"names":[],"mappings":"AAIA,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"space-provider.d.ts","sourceRoot":"","sources":["../../../../src/yjs/space-provider.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,KAAK,iBAAiB,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,KAAK,CAAC;AAG/B,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAGrD,KAAK,SAAS,GAAG,iBAAiB,CAAC,SAAS,CAAC;AAO7C;;GAEG;AACH,qBAAa,sBAAuB,SAAQ,UAAU,CAAC,GAAG,CAAC;IACzD,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAQ;IAC/B,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAY;IACvC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAS;IACnC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAS;gBAEtB,EAAE,KAAK,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE;QAAE,KAAK,EAAE,KAAK,CAAC;QAAC,GAAG,EAAE,GAAG,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,SAAS,CAAA;KAAE;IA+BlH,IAAI,SAAS,IAAI,SAAS,CAEzB;IAED,OAAO,CAAC,sBAAsB;IAY9B,OAAO,CAAC,mBAAmB;IAS3B,OAAO,CAAC,YAAY;IAoCpB,OAAO,CAAC,mBAAmB;CAG5B"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"code-mirror.stories.d.ts","sourceRoot":"","sources":["../../../../stories/html/code-mirror.stories.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAKhD,OAAO,EAAE,MAAM,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;;;;AAS5D,wBAEE;AAoEF,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,106 +0,0 @@
1
- //
2
- // Copyright 2023 DXOS.org
3
- //
4
-
5
- import { Event } from '@dxos/async';
6
- import {
7
- type Doc,
8
- next as automerge,
9
- type ChangeOptions,
10
- type ChangeFn,
11
- type Heads,
12
- type SyncState,
13
- } from '@dxos/automerge/automerge';
14
-
15
- export class Peer {
16
- changeEvent = new Event();
17
-
18
- storage = new Map<string, Uint8Array>();
19
- stats = {
20
- messagesSent: 0,
21
- messagesReceived: 0,
22
- bytesSent: 0,
23
- bytesReceived: 0,
24
- snapshotBytes: 0,
25
- incrementalBytes: 0,
26
- };
27
-
28
- doc!: Doc<{ text: string }>;
29
-
30
- change(options: string | ChangeOptions<any> | ChangeFn<any>, callback?: ChangeFn<any>) {
31
- this.doc = automerge.change(this.doc, options, callback);
32
- this._handleChange();
33
- }
34
-
35
- changeAt(scope: Heads, options: string | ChangeOptions<any> | ChangeFn<any>, callback?: ChangeFn<any>) {
36
- const { newDoc, newHeads } = automerge.changeAt(this.doc, scope, options, callback);
37
- this.doc = newDoc;
38
- this._handleChange();
39
- return newHeads;
40
- }
41
-
42
- replicate(): { readable: ReadableStream<Uint8Array>; writable: WritableStream<Uint8Array> } {
43
- let syncState: SyncState = automerge.initSyncState();
44
-
45
- let unsub: (() => void) | undefined;
46
- const readable = new ReadableStream({
47
- start: (controller) => {
48
- unsub = this.changeEvent.on(() => {
49
- const [newState, msg] = automerge.generateSyncMessage(this.doc, syncState);
50
- syncState = newState;
51
-
52
- if (msg) {
53
- this.stats.messagesSent++;
54
- this.stats.bytesSent += msg.byteLength;
55
- controller.enqueue(msg);
56
- }
57
- });
58
- },
59
- pull: (controller) => {
60
- const [newState, msg] = automerge.generateSyncMessage(this.doc, syncState);
61
- syncState = newState;
62
-
63
- if (msg) {
64
- this.stats.messagesSent++;
65
- this.stats.bytesSent += msg.byteLength;
66
- controller.enqueue(msg);
67
- }
68
- },
69
- cancel: () => {
70
- unsub?.();
71
- },
72
- });
73
-
74
- const writable = new WritableStream({
75
- write: (chunk) => {
76
- this.stats.messagesReceived++;
77
- this.stats.bytesReceived += chunk.byteLength;
78
-
79
- const [newDoc, newState] = automerge.receiveSyncMessage(this.doc, syncState, chunk);
80
- this.doc = newDoc;
81
- syncState = newState;
82
-
83
- this._handleChange();
84
- },
85
- });
86
-
87
- return { readable, writable };
88
- }
89
-
90
- private _handleChange() {
91
- // TODO(dmaretskyi): Save since + debounce.
92
-
93
- if (this.stats.incrementalBytes > 1024 && this.stats.incrementalBytes > this.stats.snapshotBytes) {
94
- const snapshot = automerge.save(this.doc);
95
- this.stats.snapshotBytes = snapshot.byteLength;
96
- this.stats.incrementalBytes = 0;
97
- console.log('snapshot save', snapshot.byteLength);
98
- } else {
99
- const chunk = automerge.saveIncremental(this.doc);
100
- this.stats.incrementalBytes += chunk.length;
101
- console.log('incremental save', chunk.length);
102
- }
103
-
104
- this.changeEvent.emit();
105
- }
106
- }
@@ -1,80 +0,0 @@
1
- //
2
- // Copyright 2023 DXOS.org
3
- //
4
-
5
- import '@dxosTheme';
6
-
7
- import React, { useState } from 'react';
8
-
9
- import { type PublicKey } from '@dxos/react-client';
10
- import { TextObject, TextKind, useQuery, useSpace } from '@dxos/react-client/echo';
11
- import { useIdentity } from '@dxos/react-client/halo';
12
- import { ClientDecorator, setupPeersInSpace, textGenerator, useDataGenerator } from '@dxos/react-client/testing';
13
- import { useId } from '@dxos/react-ui';
14
-
15
- import { Editor, type EditorProps } from './Editor';
16
- import { EditorDocument, types as schema } from '../../testing';
17
-
18
- export default {
19
- component: Editor,
20
- };
21
-
22
- const Story = ({ spaceKey, ...params }: Pick<EditorProps, 'slots'> & { spaceKey: PublicKey }) => {
23
- const [generate, setGenerate] = useState(false);
24
- const generateId = useId('generate');
25
-
26
- const identity = useIdentity();
27
- const space = useSpace(spaceKey);
28
- const [document] = useQuery(space, EditorDocument.filter());
29
-
30
- useDataGenerator({
31
- generator: generate ? textGenerator : undefined,
32
- options: { text: document?.content.content },
33
- });
34
-
35
- return (
36
- <main className='flex-1 min-w-0 p-4'>
37
- <div id={generateId} className='flex'>
38
- <input type='checkbox' onChange={(event) => setGenerate(event.target.checked)} />
39
- Generate Data
40
- </div>
41
- {document?.content.toString().length}
42
- <Editor identity={identity} space={space} text={document?.content} {...params} />
43
- </main>
44
- );
45
- };
46
-
47
- const { spaceKey: markdownSpaceKey, clients: markdownClients } = await setupPeersInSpace({
48
- count: 2,
49
- schema,
50
- onCreateSpace: async (space) => {
51
- const document = new EditorDocument({ content: new TextObject('Hello, Storybook!') });
52
- await space?.db.add(document);
53
- },
54
- });
55
-
56
- export const Markdown = {
57
- render: (args: { id: number }) => <Story {...args} spaceKey={markdownSpaceKey} />,
58
- decorators: [ClientDecorator({ clients: markdownClients })],
59
- };
60
-
61
- const { spaceKey: richSpaceKey, clients: richClients } = await setupPeersInSpace({
62
- count: 2,
63
- schema,
64
- onCreateSpace: async (space) => {
65
- const document = new EditorDocument({ content: new TextObject('Hello, Storybook!', TextKind.RICH) });
66
- await space?.db.add(document);
67
- },
68
- });
69
-
70
- export const Rich = {
71
- render: (args: { id: number }) => <Story {...args} spaceKey={richSpaceKey} />,
72
- args: {
73
- slots: {
74
- editor: {
75
- className: 'z-0 rounded bg-white text-neutral-900 w-full p-4 dark:bg-neutral-850 dark:text-white min-bs-[12em]',
76
- },
77
- },
78
- },
79
- decorators: [ClientDecorator({ clients: richClients })],
80
- };
@@ -1,33 +0,0 @@
1
- //
2
- // Copyright 2023 DXOS.org
3
- //
4
-
5
- import React, { forwardRef, memo, type Ref } from 'react';
6
-
7
- import { YXmlFragment } from '@dxos/text-model';
8
-
9
- import { type EditorSlots, useTextModel, type UseTextModelOptions } from '../../model';
10
- import { MarkdownEditor, type MarkdownEditorRef } from '../Markdown';
11
- import { RichTextEditor, type TipTapEditor } from '../RichText';
12
-
13
- export type EditorProps = UseTextModelOptions & {
14
- slots?: EditorSlots;
15
- };
16
-
17
- /**
18
- * Memoized editor which depends on DXOS platform.
19
- *
20
- * Determines which editor to render based on the kind of text.
21
- */
22
- // NOTE: Without `memo`, if parent component uses `observer` the editor re-renders excessively.
23
- // TODO(wittjosiah): Factor out?
24
- export const Editor = memo(
25
- forwardRef<TipTapEditor | MarkdownEditorRef, EditorProps>(({ slots, ...params }, forwardedRef) => {
26
- const model = useTextModel(params);
27
- if (model?.content instanceof YXmlFragment) {
28
- return <RichTextEditor ref={forwardedRef as Ref<TipTapEditor>} model={model} slots={slots} />;
29
- } else {
30
- return <MarkdownEditor ref={forwardedRef as Ref<MarkdownEditorRef>} model={model} slots={slots} />;
31
- }
32
- }),
33
- );
@@ -1,5 +0,0 @@
1
- //
2
- // Copyright 2023 DXOS.org
3
- //
4
-
5
- export * from './Editor';
@@ -1,57 +0,0 @@
1
- //
2
- // Copyright 2023 DXOS.org
3
- //
4
-
5
- import '@dxosTheme';
6
-
7
- import React, { useState } from 'react';
8
-
9
- import { PublicKey } from '@dxos/react-client';
10
- import { TextKind } from '@dxos/react-client/echo';
11
- import { ClientDecorator, textGenerator, useDataGenerator } from '@dxos/react-client/testing';
12
- import { useId } from '@dxos/react-ui';
13
-
14
- import { MarkdownEditor } from './Markdown';
15
- import { Replicator, useYjsModel } from '../../testing';
16
-
17
- export default {
18
- component: MarkdownEditor,
19
- };
20
-
21
- export const Default = {
22
- args: {
23
- model: {
24
- id: 'editor',
25
- content: 'Hello, Storybook!',
26
- },
27
- },
28
- };
29
-
30
- const replicator = new Replicator(TextKind.PLAIN);
31
-
32
- export const WithYjs = {
33
- render: () => {
34
- const [generate, setGenerate] = useState(false);
35
- const generateId = useId('generate');
36
-
37
- const [id] = useState(PublicKey.random().toHex());
38
- const model = useYjsModel({ id, replicator });
39
-
40
- useDataGenerator({
41
- generator: generate ? textGenerator : undefined,
42
- options: { text: typeof model?.content !== 'string' ? model?.content : undefined },
43
- });
44
-
45
- return (
46
- <main className='flex-1 min-w-0 p-4'>
47
- <div id={generateId} className='flex'>
48
- <input type='checkbox' onChange={(event) => setGenerate(event.target.checked)} />
49
- Generate Data
50
- </div>
51
- <MarkdownEditor model={model} />
52
- </main>
53
- );
54
- },
55
- // TODO(wittjosiah): Decorator for doing this without clients being initialized?
56
- decorators: [ClientDecorator({ count: 2 })],
57
- };