@dxos/react-ui-editor 0.8.3-staging.0fa589b → 0.8.4-main.28f8d3d
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.
- package/dist/lib/browser/chunk-22UMM3QJ.mjs +22 -0
- package/dist/lib/browser/chunk-22UMM3QJ.mjs.map +7 -0
- package/dist/lib/browser/index.mjs +790 -700
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/browser/testing/index.mjs +1 -1
- package/dist/lib/browser/testing/index.mjs.map +2 -2
- package/dist/lib/browser/types/index.mjs +13 -0
- package/dist/lib/browser/types/index.mjs.map +7 -0
- package/dist/lib/node-esm/chunk-YXYQPV6R.mjs +24 -0
- package/dist/lib/node-esm/chunk-YXYQPV6R.mjs.map +7 -0
- package/dist/lib/node-esm/index.mjs +789 -700
- package/dist/lib/node-esm/index.mjs.map +4 -4
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/lib/node-esm/testing/index.mjs +1 -1
- package/dist/lib/node-esm/testing/index.mjs.map +2 -2
- package/dist/lib/node-esm/types/index.mjs +14 -0
- package/dist/lib/node-esm/types/index.mjs.map +7 -0
- package/dist/types/src/components/Editor/Editor.d.ts +19 -0
- package/dist/types/src/components/Editor/Editor.d.ts.map +1 -0
- package/dist/types/src/components/Editor/index.d.ts +2 -0
- package/dist/types/src/components/Editor/index.d.ts.map +1 -0
- package/dist/types/src/components/EditorToolbar/blocks.d.ts.map +1 -1
- package/dist/types/src/components/EditorToolbar/formatting.d.ts.map +1 -1
- package/dist/types/src/components/EditorToolbar/headings.d.ts.map +1 -1
- package/dist/types/src/components/EditorToolbar/lists.d.ts.map +1 -1
- package/dist/types/src/components/EditorToolbar/util.d.ts +4 -3
- package/dist/types/src/components/EditorToolbar/util.d.ts.map +1 -1
- package/dist/types/src/components/EditorToolbar/view-mode.d.ts +1 -1
- package/dist/types/src/components/EditorToolbar/view-mode.d.ts.map +1 -1
- package/dist/types/src/components/Popover/RefDropdownMenu.d.ts.map +1 -1
- package/dist/types/src/components/index.d.ts +1 -0
- package/dist/types/src/components/index.d.ts.map +1 -1
- package/dist/types/src/extensions/autocomplete.d.ts +1 -1
- package/dist/types/src/extensions/autocomplete.d.ts.map +1 -1
- package/dist/types/src/extensions/automerge/automerge.d.ts.map +1 -1
- package/dist/types/src/extensions/automerge/automerge.stories.d.ts +28 -28
- package/dist/types/src/extensions/automerge/automerge.stories.d.ts.map +1 -1
- package/dist/types/src/extensions/automerge/defs.d.ts +1 -1
- package/dist/types/src/extensions/automerge/defs.d.ts.map +1 -1
- package/dist/types/src/extensions/automerge/sync.d.ts.map +1 -1
- package/dist/types/src/extensions/automerge/update-automerge.d.ts.map +1 -1
- package/dist/types/src/extensions/blast.d.ts.map +1 -1
- package/dist/types/src/extensions/command/action.d.ts +1 -1
- package/dist/types/src/extensions/command/action.d.ts.map +1 -1
- package/dist/types/src/extensions/command/command-menu.d.ts +1 -1
- package/dist/types/src/extensions/command/command-menu.d.ts.map +1 -1
- package/dist/types/src/extensions/command/command.d.ts.map +1 -1
- package/dist/types/src/extensions/command/hint.d.ts.map +1 -1
- package/dist/types/src/extensions/command/index.d.ts +1 -1
- package/dist/types/src/extensions/command/index.d.ts.map +1 -1
- package/dist/types/src/extensions/command/state.d.ts +1 -1
- package/dist/types/src/extensions/command/state.d.ts.map +1 -1
- package/dist/types/src/extensions/command/typeahead.d.ts +7 -2
- package/dist/types/src/extensions/command/typeahead.d.ts.map +1 -1
- package/dist/types/src/extensions/command/useCommandMenu.d.ts +1 -1
- package/dist/types/src/extensions/command/useCommandMenu.d.ts.map +1 -1
- package/dist/types/src/extensions/comments.d.ts +1 -1
- package/dist/types/src/extensions/comments.d.ts.map +1 -1
- package/dist/types/src/extensions/dnd.d.ts.map +1 -1
- package/dist/types/src/extensions/factories.d.ts +19 -0
- package/dist/types/src/extensions/factories.d.ts.map +1 -1
- package/dist/types/src/extensions/markdown/action.d.ts.map +1 -1
- package/dist/types/src/extensions/markdown/changes.d.ts.map +1 -1
- package/dist/types/src/extensions/markdown/decorate.d.ts.map +1 -1
- package/dist/types/src/extensions/markdown/formatting.d.ts +1 -1
- package/dist/types/src/extensions/markdown/formatting.d.ts.map +1 -1
- package/dist/types/src/extensions/markdown/formatting.test.d.ts.map +1 -1
- package/dist/types/src/extensions/markdown/highlight.d.ts.map +1 -1
- package/dist/types/src/extensions/modes.d.ts +0 -7
- package/dist/types/src/extensions/modes.d.ts.map +1 -1
- package/dist/types/src/extensions/outliner/outliner.d.ts.map +1 -1
- package/dist/types/src/extensions/outliner/selection.d.ts.map +1 -1
- package/dist/types/src/extensions/outliner/tree.d.ts +1 -1
- package/dist/types/src/extensions/outliner/tree.d.ts.map +1 -1
- package/dist/types/src/hooks/useTextEditor.d.ts.map +1 -1
- package/dist/types/src/index.d.ts +1 -1
- package/dist/types/src/index.d.ts.map +1 -1
- package/dist/types/src/stories/Command.stories.d.ts.map +1 -1
- package/dist/types/src/stories/CommandMenu.stories.d.ts +1 -1
- package/dist/types/src/stories/CommandMenu.stories.d.ts.map +1 -1
- package/dist/types/src/stories/Comments.stories.d.ts.map +1 -1
- package/dist/types/src/stories/EditorToolbar.stories.d.ts +1 -1
- package/dist/types/src/stories/EditorToolbar.stories.d.ts.map +1 -1
- package/dist/types/src/stories/Experimental.stories.d.ts.map +1 -1
- package/dist/types/src/stories/Markdown.stories.d.ts.map +1 -1
- package/dist/types/src/stories/Outliner.stories.d.ts.map +1 -1
- package/dist/types/src/stories/Preview.stories.d.ts.map +1 -1
- package/dist/types/src/stories/TextEditor.stories.d.ts.map +1 -1
- package/dist/types/src/stories/components/EditorStory.d.ts +2 -2
- package/dist/types/src/stories/components/EditorStory.d.ts.map +1 -1
- package/dist/types/src/testing/util.d.ts +1 -0
- package/dist/types/src/testing/util.d.ts.map +1 -1
- package/dist/types/src/translations.d.ts +28 -29
- package/dist/types/src/translations.d.ts.map +1 -1
- package/dist/types/src/types/index.d.ts +2 -0
- package/dist/types/src/types/index.d.ts.map +1 -0
- package/dist/types/src/types/types.d.ts +21 -0
- package/dist/types/src/types/types.d.ts.map +1 -0
- package/dist/types/src/util/cursor.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +47 -41
- package/src/components/Editor/Editor.tsx +39 -0
- package/src/components/Editor/index.ts +5 -0
- package/src/components/EditorToolbar/EditorToolbar.tsx +1 -1
- package/src/components/EditorToolbar/blocks.ts +4 -3
- package/src/components/EditorToolbar/formatting.ts +3 -2
- package/src/components/EditorToolbar/headings.ts +2 -1
- package/src/components/EditorToolbar/lists.ts +3 -2
- package/src/components/EditorToolbar/util.ts +6 -5
- package/src/components/EditorToolbar/view-mode.ts +3 -2
- package/src/components/Popover/RefDropdownMenu.tsx +10 -4
- package/src/components/Popover/RefPopover.tsx +4 -4
- package/src/components/index.ts +1 -0
- package/src/extensions/autocomplete.ts +3 -3
- package/src/extensions/automerge/automerge.stories.tsx +8 -6
- package/src/extensions/automerge/automerge.ts +4 -3
- package/src/extensions/automerge/defs.ts +1 -1
- package/src/extensions/automerge/sync.ts +1 -1
- package/src/extensions/automerge/update-automerge.ts +1 -1
- package/src/extensions/awareness/awareness.ts +2 -2
- package/src/extensions/blast.ts +3 -16
- package/src/extensions/command/action.ts +1 -1
- package/src/extensions/command/command-menu.ts +4 -3
- package/src/extensions/command/command.ts +3 -3
- package/src/extensions/command/hint.ts +2 -1
- package/src/extensions/command/index.ts +1 -1
- package/src/extensions/command/placeholder.ts +1 -1
- package/src/extensions/command/state.ts +4 -3
- package/src/extensions/command/typeahead.ts +28 -15
- package/src/extensions/command/useCommandMenu.ts +2 -1
- package/src/extensions/comments.ts +7 -6
- package/src/extensions/dnd.ts +1 -1
- package/src/extensions/factories.ts +28 -8
- package/src/extensions/markdown/action.ts +2 -1
- package/src/extensions/markdown/bundle.ts +1 -1
- package/src/extensions/markdown/changes.ts +1 -1
- package/src/extensions/markdown/decorate.ts +7 -6
- package/src/extensions/markdown/formatting.test.ts +7 -7
- package/src/extensions/markdown/formatting.ts +16 -14
- package/src/extensions/markdown/highlight.ts +1 -1
- package/src/extensions/mention.ts +1 -1
- package/src/extensions/modes.ts +0 -9
- package/src/extensions/outliner/outliner.test.ts +3 -2
- package/src/extensions/outliner/outliner.ts +4 -3
- package/src/extensions/outliner/selection.ts +1 -1
- package/src/extensions/outliner/tree.test.ts +2 -1
- package/src/extensions/outliner/tree.ts +1 -1
- package/src/hooks/useTextEditor.ts +3 -3
- package/src/index.ts +1 -1
- package/src/stories/Command.stories.tsx +6 -5
- package/src/stories/CommandMenu.stories.tsx +7 -6
- package/src/stories/Comments.stories.tsx +3 -2
- package/src/stories/EditorToolbar.stories.tsx +6 -7
- package/src/stories/Experimental.stories.tsx +4 -3
- package/src/stories/Markdown.stories.tsx +3 -2
- package/src/stories/Outliner.stories.tsx +4 -3
- package/src/stories/Preview.stories.tsx +25 -26
- package/src/stories/TextEditor.stories.tsx +16 -15
- package/src/stories/components/EditorStory.tsx +5 -5
- package/src/styles/theme.ts +8 -8
- package/src/testing/util.ts +2 -0
- package/src/translations.ts +4 -2
- package/src/types/index.ts +5 -0
- package/src/types/types.ts +32 -0
- package/src/util/cursor.ts +2 -1
- package/dist/lib/node/index.cjs +0 -7754
- package/dist/lib/node/index.cjs.map +0 -7
- package/dist/lib/node/meta.json +0 -1
- package/dist/lib/node/testing/index.cjs +0 -29
- package/dist/lib/node/testing/index.cjs.map +0 -7
- package/dist/types/src/types.d.ts +0 -14
- package/dist/types/src/types.d.ts.map +0 -1
- package/src/types.ts +0 -23
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@dxos/react-ui-editor",
|
3
|
-
"version": "0.8.
|
3
|
+
"version": "0.8.4-main.28f8d3d",
|
4
4
|
"description": "Document editing experience within a DXOS shell.",
|
5
5
|
"homepage": "https://dxos.org",
|
6
6
|
"bugs": "https://github.com/dxos/dxos/issues",
|
@@ -10,11 +10,19 @@
|
|
10
10
|
"type": "module",
|
11
11
|
"exports": {
|
12
12
|
".": {
|
13
|
+
"source": "./src/index.ts",
|
13
14
|
"types": "./dist/types/src/index.d.ts",
|
14
15
|
"browser": "./dist/lib/browser/index.mjs",
|
15
16
|
"node": "./dist/lib/node-esm/index.mjs"
|
16
17
|
},
|
18
|
+
"./types": {
|
19
|
+
"source": "./src/types/index.ts",
|
20
|
+
"types": "./dist/types/src/types/index.d.ts",
|
21
|
+
"browser": "./dist/lib/browser/types/index.mjs",
|
22
|
+
"node": "./dist/lib/node-esm/types/index.mjs"
|
23
|
+
},
|
17
24
|
"./testing": {
|
25
|
+
"source": "./src/testing/index.ts",
|
18
26
|
"types": "./dist/types/src/testing/index.d.ts",
|
19
27
|
"browser": "./dist/lib/browser/testing/index.mjs",
|
20
28
|
"node": "./dist/lib/node-esm/testing/index.mjs"
|
@@ -29,7 +37,7 @@
|
|
29
37
|
"src"
|
30
38
|
],
|
31
39
|
"dependencies": {
|
32
|
-
"@automerge/automerge": "3.
|
40
|
+
"@automerge/automerge": "3.1.1",
|
33
41
|
"@codemirror/autocomplete": "^6.18.1",
|
34
42
|
"@codemirror/commands": "^6.6.2",
|
35
43
|
"@codemirror/lang-javascript": "^6.2.2",
|
@@ -59,29 +67,28 @@
|
|
59
67
|
"lodash.merge": "^4.6.2",
|
60
68
|
"lodash.sortby": "^4.7.0",
|
61
69
|
"style-mod": "^4.1.0",
|
62
|
-
"@dxos/app-graph": "0.8.
|
63
|
-
"@dxos/async": "0.8.
|
64
|
-
"@dxos/context": "0.8.
|
65
|
-
"@dxos/debug": "0.8.
|
66
|
-
"@dxos/display-name": "0.8.
|
67
|
-
"@dxos/
|
68
|
-
"@dxos/
|
69
|
-
"@dxos/
|
70
|
-
"@dxos/
|
71
|
-
"@dxos/
|
72
|
-
"@dxos/
|
73
|
-
"@dxos/react-
|
74
|
-
"@dxos/react-ui-
|
75
|
-
"@dxos/
|
76
|
-
"@dxos/util": "0.8.
|
70
|
+
"@dxos/app-graph": "0.8.4-main.28f8d3d",
|
71
|
+
"@dxos/async": "0.8.4-main.28f8d3d",
|
72
|
+
"@dxos/context": "0.8.4-main.28f8d3d",
|
73
|
+
"@dxos/debug": "0.8.4-main.28f8d3d",
|
74
|
+
"@dxos/display-name": "0.8.4-main.28f8d3d",
|
75
|
+
"@dxos/echo-schema": "0.8.4-main.28f8d3d",
|
76
|
+
"@dxos/invariant": "0.8.4-main.28f8d3d",
|
77
|
+
"@dxos/live-object": "0.8.4-main.28f8d3d",
|
78
|
+
"@dxos/lit-ui": "0.8.4-main.28f8d3d",
|
79
|
+
"@dxos/log": "0.8.4-main.28f8d3d",
|
80
|
+
"@dxos/react-hooks": "0.8.4-main.28f8d3d",
|
81
|
+
"@dxos/react-ui-menu": "0.8.4-main.28f8d3d",
|
82
|
+
"@dxos/react-ui-stack": "0.8.4-main.28f8d3d",
|
83
|
+
"@dxos/protocols": "0.8.4-main.28f8d3d",
|
84
|
+
"@dxos/util": "0.8.4-main.28f8d3d"
|
77
85
|
},
|
78
86
|
"devDependencies": {
|
79
|
-
"@automerge/automerge": "3.
|
80
|
-
"@automerge/automerge-repo": "2.0.
|
81
|
-
"@automerge/automerge-repo-network-broadcastchannel": "2.0.
|
82
|
-
"@effect-rx/rx-react": "
|
83
|
-
"@effect/platform": "0.
|
84
|
-
"@phosphor-icons/react": "^2.1.5",
|
87
|
+
"@automerge/automerge": "3.1.1",
|
88
|
+
"@automerge/automerge-repo": "2.3.0-alpha.0",
|
89
|
+
"@automerge/automerge-repo-network-broadcastchannel": "2.3.0-alpha.0",
|
90
|
+
"@effect-rx/rx-react": "0.38.0",
|
91
|
+
"@effect/platform": "0.90.2",
|
85
92
|
"@types/chai": "^4.2.15",
|
86
93
|
"@types/chai-dom": "^1.11.0",
|
87
94
|
"@types/lodash.defaultsdeep": "^4.6.6",
|
@@ -92,7 +99,7 @@
|
|
92
99
|
"@types/react-test-renderer": "^17.0.2",
|
93
100
|
"chai": "^4.4.1",
|
94
101
|
"chai-dom": "^1.11.0",
|
95
|
-
"effect": "3.
|
102
|
+
"effect": "3.17.7",
|
96
103
|
"happy-dom": "^13.3.1",
|
97
104
|
"jsdom": "^24.0.0",
|
98
105
|
"mocha": "^10.6.0",
|
@@ -102,29 +109,28 @@
|
|
102
109
|
"vite": "5.4.7",
|
103
110
|
"vite-plugin-top-level-await": "^1.4.1",
|
104
111
|
"vite-plugin-wasm": "^3.3.0",
|
105
|
-
"@dxos/config": "0.8.
|
106
|
-
"@dxos/echo": "0.8.
|
107
|
-
"@dxos/echo-signals": "0.8.
|
108
|
-
"@dxos/keyboard": "0.8.
|
109
|
-
"@dxos/random": "0.8.
|
110
|
-
"@dxos/react-client": "0.8.
|
111
|
-
"@dxos/react-ui": "0.8.
|
112
|
-
"@dxos/react-ui-
|
113
|
-
"@dxos/react-ui-
|
114
|
-
"@dxos/schema": "0.8.
|
115
|
-
"@dxos/react-ui-
|
116
|
-
"@dxos/storybook-utils": "0.8.
|
112
|
+
"@dxos/config": "0.8.4-main.28f8d3d",
|
113
|
+
"@dxos/echo": "0.8.4-main.28f8d3d",
|
114
|
+
"@dxos/echo-signals": "0.8.4-main.28f8d3d",
|
115
|
+
"@dxos/keyboard": "0.8.4-main.28f8d3d",
|
116
|
+
"@dxos/random": "0.8.4-main.28f8d3d",
|
117
|
+
"@dxos/react-client": "0.8.4-main.28f8d3d",
|
118
|
+
"@dxos/react-ui": "0.8.4-main.28f8d3d",
|
119
|
+
"@dxos/react-ui-attention": "0.8.4-main.28f8d3d",
|
120
|
+
"@dxos/react-ui-syntax-highlighter": "0.8.4-main.28f8d3d",
|
121
|
+
"@dxos/schema": "0.8.4-main.28f8d3d",
|
122
|
+
"@dxos/react-ui-theme": "0.8.4-main.28f8d3d",
|
123
|
+
"@dxos/storybook-utils": "0.8.4-main.28f8d3d"
|
117
124
|
},
|
118
125
|
"peerDependencies": {
|
119
126
|
"@effect-rx/rx-react": "^0.34.1",
|
120
|
-
"@effect/platform": "0.80.12",
|
121
|
-
"@phosphor-icons/react": "^2.1.5",
|
127
|
+
"@effect/platform": "^0.80.12",
|
122
128
|
"effect": "^3.13.3",
|
123
129
|
"react": "~18.2.0",
|
124
130
|
"react-dom": "~18.2.0",
|
125
|
-
"@dxos/react-
|
126
|
-
"@dxos/react-
|
127
|
-
"@dxos/react-ui-theme": "0.8.
|
131
|
+
"@dxos/react-ui": "0.8.4-main.28f8d3d",
|
132
|
+
"@dxos/react-client": "0.8.4-main.28f8d3d",
|
133
|
+
"@dxos/react-ui-theme": "0.8.4-main.28f8d3d"
|
128
134
|
},
|
129
135
|
"publishConfig": {
|
130
136
|
"access": "public"
|
@@ -0,0 +1,39 @@
|
|
1
|
+
//
|
2
|
+
// Copyright 2025 DXOS.org
|
3
|
+
//
|
4
|
+
|
5
|
+
import { type EditorView } from '@codemirror/view';
|
6
|
+
import React, { forwardRef, useImperativeHandle } from 'react';
|
7
|
+
|
8
|
+
import { type ThemedClassName, useThemeContext } from '@dxos/react-ui';
|
9
|
+
import { mx } from '@dxos/react-ui-theme';
|
10
|
+
import { type DataType } from '@dxos/schema';
|
11
|
+
|
12
|
+
import { type UseTextEditorProps, useTextEditor } from '../../hooks';
|
13
|
+
|
14
|
+
export type EditorProps = ThemedClassName<
|
15
|
+
{
|
16
|
+
id: string;
|
17
|
+
text: DataType.Text;
|
18
|
+
} & Omit<UseTextEditorProps, 'id'>
|
19
|
+
>;
|
20
|
+
|
21
|
+
/**
|
22
|
+
* Minimal text editor.
|
23
|
+
*/
|
24
|
+
export const Editor = forwardRef<EditorView | undefined, EditorProps>(
|
25
|
+
({ classNames, id, text, ...props }, forwardedRef) => {
|
26
|
+
const { themeMode } = useThemeContext();
|
27
|
+
const { parentRef, focusAttributes, view } = useTextEditor(
|
28
|
+
() => ({
|
29
|
+
id,
|
30
|
+
initialValue: text.content,
|
31
|
+
...props,
|
32
|
+
}),
|
33
|
+
[id, text, themeMode],
|
34
|
+
);
|
35
|
+
|
36
|
+
useImperativeHandle(forwardedRef, () => view, [view]);
|
37
|
+
return <div ref={parentRef} className={mx(classNames)} {...focusAttributes} />;
|
38
|
+
},
|
39
|
+
);
|
@@ -5,7 +5,7 @@
|
|
5
5
|
import { Rx } from '@effect-rx/rx-react';
|
6
6
|
import React, { memo, useMemo } from 'react';
|
7
7
|
|
8
|
-
import {
|
8
|
+
import { type NodeArg, rxFromSignal } from '@dxos/app-graph';
|
9
9
|
import { ElevationProvider } from '@dxos/react-ui';
|
10
10
|
import { MenuProvider, ToolbarMenu, createGapSeparator, useMenuActions } from '@dxos/react-ui-menu';
|
11
11
|
|
@@ -7,8 +7,9 @@ import { type EditorView } from '@codemirror/view';
|
|
7
7
|
import { type NodeArg } from '@dxos/app-graph';
|
8
8
|
import { type ToolbarMenuActionGroupProperties } from '@dxos/react-ui-menu';
|
9
9
|
|
10
|
-
import {
|
11
|
-
|
10
|
+
import { addBlockquote, addCodeblock, insertTable, removeBlockquote, removeCodeblock } from '../../extensions';
|
11
|
+
|
12
|
+
import { type EditorToolbarState, createEditorAction, createEditorActionGroup } from './util';
|
12
13
|
|
13
14
|
const createBlockGroupAction = (value: string) =>
|
14
15
|
createEditorActionGroup('block', {
|
@@ -49,7 +50,7 @@ const createBlockActions = (value: string, getView: () => EditorView, blankLine?
|
|
49
50
|
});
|
50
51
|
|
51
52
|
export const createBlocks = (state: EditorToolbarState, getView: () => EditorView) => {
|
52
|
-
const value = state?.blockQuote ? 'blockquote' : state.blockType ?? '';
|
53
|
+
const value = state?.blockQuote ? 'blockquote' : (state.blockType ?? '');
|
53
54
|
const blockGroupAction = createBlockGroupAction(value);
|
54
55
|
const blockActions = createBlockActions(value, getView, state.blankLine);
|
55
56
|
return {
|
@@ -7,8 +7,9 @@ import { type EditorView } from '@codemirror/view';
|
|
7
7
|
import { type NodeArg } from '@dxos/app-graph';
|
8
8
|
import { type ToolbarMenuActionGroupProperties } from '@dxos/react-ui-menu';
|
9
9
|
|
10
|
-
import {
|
11
|
-
|
10
|
+
import { type Formatting, Inline, addLink, removeLink, setStyle } from '../../extensions';
|
11
|
+
|
12
|
+
import { type EditorToolbarState, createEditorAction, createEditorActionGroup } from './util';
|
12
13
|
|
13
14
|
const formats = {
|
14
15
|
strong: 'ph--text-b--regular',
|
@@ -7,10 +7,11 @@ import { type EditorView } from '@codemirror/view';
|
|
7
7
|
import { type NodeArg } from '@dxos/app-graph';
|
8
8
|
import { type ToolbarMenuActionGroupProperties } from '@dxos/react-ui-menu';
|
9
9
|
|
10
|
-
import { createEditorAction, createEditorActionGroup, type EditorToolbarState } from './util';
|
11
10
|
import { setHeading } from '../../extensions';
|
12
11
|
import { translationKey } from '../../translations';
|
13
12
|
|
13
|
+
import { type EditorToolbarState, createEditorAction, createEditorActionGroup } from './util';
|
14
|
+
|
14
15
|
const createHeadingGroupAction = (value: string) =>
|
15
16
|
createEditorActionGroup(
|
16
17
|
'heading',
|
@@ -7,8 +7,9 @@ import { type EditorView } from '@codemirror/view';
|
|
7
7
|
import { type NodeArg } from '@dxos/app-graph';
|
8
8
|
import { type ToolbarMenuActionGroupProperties } from '@dxos/react-ui-menu';
|
9
9
|
|
10
|
-
import {
|
11
|
-
|
10
|
+
import { List, addList, removeList } from '../../extensions';
|
11
|
+
|
12
|
+
import { type EditorToolbarState, createEditorAction, createEditorActionGroup } from './util';
|
12
13
|
|
13
14
|
const listStyles = {
|
14
15
|
bullet: 'ph--list-bullets--regular',
|
@@ -7,20 +7,21 @@ import { type Rx } from '@effect-rx/rx-react';
|
|
7
7
|
import { useMemo } from 'react';
|
8
8
|
|
9
9
|
import { type Action } from '@dxos/app-graph';
|
10
|
-
import {
|
10
|
+
import { type Live, live } from '@dxos/live-object';
|
11
11
|
import { type ThemedClassName } from '@dxos/react-ui';
|
12
12
|
import {
|
13
|
-
type
|
13
|
+
type ActionGraphProps,
|
14
|
+
type MenuActionProperties,
|
14
15
|
type MenuItemGroup,
|
16
|
+
type MenuSeparator,
|
15
17
|
type ToolbarMenuActionGroupProperties,
|
16
18
|
createMenuAction,
|
17
19
|
createMenuItemGroup,
|
18
|
-
type ActionGraphProps,
|
19
|
-
type MenuActionProperties,
|
20
20
|
} from '@dxos/react-ui-menu';
|
21
21
|
|
22
|
-
import type { EditorAction,
|
22
|
+
import type { EditorAction, Formatting } from '../../extensions';
|
23
23
|
import { translationKey } from '../../translations';
|
24
|
+
import { type EditorViewMode } from '../../types';
|
24
25
|
|
25
26
|
export type EditorToolbarState = Formatting & Partial<{ viewMode: EditorViewMode }>;
|
26
27
|
|
@@ -5,9 +5,10 @@
|
|
5
5
|
import { type NodeArg } from '@dxos/app-graph';
|
6
6
|
import { type ToolbarMenuActionGroupProperties } from '@dxos/react-ui-menu';
|
7
7
|
|
8
|
-
import { createEditorAction, createEditorActionGroup, type EditorToolbarState } from './util';
|
9
|
-
import { type EditorViewMode } from '../../extensions';
|
10
8
|
import { translationKey } from '../../translations';
|
9
|
+
import { type EditorViewMode } from '../../types';
|
10
|
+
|
11
|
+
import { type EditorToolbarState, createEditorAction, createEditorActionGroup } from './util';
|
11
12
|
|
12
13
|
const createViewModeGroupAction = (value: string) =>
|
13
14
|
createEditorActionGroup(
|
@@ -3,7 +3,7 @@
|
|
3
3
|
//
|
4
4
|
|
5
5
|
import { createContext } from '@radix-ui/react-context';
|
6
|
-
import React, { type PropsWithChildren,
|
6
|
+
import React, { type PropsWithChildren, type RefObject, useCallback, useEffect, useRef, useState } from 'react';
|
7
7
|
|
8
8
|
import { addEventListener } from '@dxos/async';
|
9
9
|
import { type DxRefTag, type DxRefTagActivate } from '@dxos/lit-ui';
|
@@ -11,17 +11,23 @@ import { DropdownMenu } from '@dxos/react-ui';
|
|
11
11
|
|
12
12
|
import { type PreviewLinkRef, type PreviewLinkTarget, type PreviewLookup } from '../../extensions';
|
13
13
|
|
14
|
-
// TODO(burdon): Reconcile with RefPopover?
|
14
|
+
// TODO(burdon): Reconcile this file with RefPopover?
|
15
15
|
|
16
16
|
const customEventOptions = { capture: true, passive: false };
|
17
17
|
|
18
18
|
// Create a context for the dxn value.
|
19
|
-
type RefDropdownMenuValue = Partial<{
|
19
|
+
type RefDropdownMenuValue = Partial<{
|
20
|
+
link: PreviewLinkRef;
|
21
|
+
target: PreviewLinkTarget;
|
22
|
+
pending: boolean;
|
23
|
+
}>;
|
20
24
|
|
21
25
|
const REF_DROPDOWN_MENU = 'RefDropdownMenu';
|
22
26
|
const [RefDropdownMenuContextProvider, useRefDropdownMenu] = createContext<RefDropdownMenuValue>(REF_DROPDOWN_MENU, {});
|
23
27
|
|
24
|
-
type RefDropdownMenuProviderProps = PropsWithChildren<{
|
28
|
+
type RefDropdownMenuProviderProps = PropsWithChildren<{
|
29
|
+
onLookup?: PreviewLookup;
|
30
|
+
}>;
|
25
31
|
|
26
32
|
const RefDropdownMenuProvider = ({ children, onLookup }: RefDropdownMenuProviderProps) => {
|
27
33
|
const trigger = useRef<DxRefTag | null>(null);
|
@@ -5,12 +5,12 @@
|
|
5
5
|
import { createContext } from '@radix-ui/react-context';
|
6
6
|
import React, {
|
7
7
|
type PropsWithChildren,
|
8
|
-
useRef,
|
9
|
-
useState,
|
10
|
-
useEffect,
|
11
|
-
useCallback,
|
12
8
|
type RefObject,
|
13
9
|
forwardRef,
|
10
|
+
useCallback,
|
11
|
+
useEffect,
|
12
|
+
useRef,
|
13
|
+
useState,
|
14
14
|
} from 'react';
|
15
15
|
|
16
16
|
import { addEventListener } from '@dxos/async';
|
package/src/components/index.ts
CHANGED
@@ -3,12 +3,12 @@
|
|
3
3
|
//
|
4
4
|
|
5
5
|
import {
|
6
|
-
autocompletion,
|
7
|
-
completionKeymap,
|
8
|
-
type CompletionSource,
|
9
6
|
type Completion,
|
10
7
|
type CompletionContext,
|
11
8
|
type CompletionResult,
|
9
|
+
type CompletionSource,
|
10
|
+
autocompletion,
|
11
|
+
completionKeymap,
|
12
12
|
} from '@codemirror/autocomplete';
|
13
13
|
import { markdownLanguage } from '@codemirror/lang-markdown';
|
14
14
|
import { type Extension } from '@codemirror/state';
|
@@ -11,15 +11,15 @@ import { BroadcastChannelNetworkAdapter } from '@automerge/automerge-repo-networ
|
|
11
11
|
import React, { useEffect, useState } from 'react';
|
12
12
|
|
13
13
|
import { Obj, Ref, Type } from '@dxos/echo';
|
14
|
-
import { DocAccessor,
|
15
|
-
import {
|
16
|
-
import {
|
14
|
+
import { DocAccessor, Query, type Space, createDocAccessor, useQuery, useSpace } from '@dxos/react-client/echo';
|
15
|
+
import { type Identity, useIdentity } from '@dxos/react-client/halo';
|
16
|
+
import { type ClientRepeatedComponentProps, ClientRepeater } from '@dxos/react-client/testing';
|
17
17
|
import { useThemeContext } from '@dxos/react-ui';
|
18
18
|
import { withLayout, withTheme } from '@dxos/storybook-utils';
|
19
19
|
|
20
20
|
import { editorSlots } from '../../defaults';
|
21
21
|
import { useTextEditor } from '../../hooks';
|
22
|
-
import translations from '../../translations';
|
22
|
+
import { translations } from '../../translations';
|
23
23
|
import { createBasicExtensions, createDataExtensions, createThemeExtensions } from '../factories';
|
24
24
|
|
25
25
|
const initialContent = 'Hello world!';
|
@@ -41,7 +41,7 @@ const Editor = ({ source, autoFocus, space, identity }: EditorProps) => {
|
|
41
41
|
() => ({
|
42
42
|
initialValue: DocAccessor.getValue(source),
|
43
43
|
extensions: [
|
44
|
-
createBasicExtensions({ placeholder: 'Type here...' }),
|
44
|
+
createBasicExtensions({ placeholder: 'Type here...', search: true }),
|
45
45
|
createThemeExtensions({ themeMode, slots: editorSlots }),
|
46
46
|
createDataExtensions({ id: 'test', text: source, space, identity }),
|
47
47
|
],
|
@@ -93,7 +93,9 @@ export default {
|
|
93
93
|
component: Editor,
|
94
94
|
decorators: [withTheme, withLayout({ fullscreen: true })],
|
95
95
|
render: () => <Story />,
|
96
|
-
parameters: {
|
96
|
+
parameters: {
|
97
|
+
translations,
|
98
|
+
},
|
97
99
|
};
|
98
100
|
|
99
101
|
const EchoStory = ({ spaceKey }: ClientRepeatedComponentProps) => {
|
@@ -5,15 +5,16 @@
|
|
5
5
|
//
|
6
6
|
|
7
7
|
import { next as A } from '@automerge/automerge';
|
8
|
-
import {
|
8
|
+
import { type Extension, StateField } from '@codemirror/state';
|
9
9
|
import { EditorView, ViewPlugin } from '@codemirror/view';
|
10
10
|
|
11
11
|
import { type DocAccessor } from '@dxos/react-client/echo';
|
12
12
|
|
13
|
+
import { Cursor } from '../../util';
|
14
|
+
|
13
15
|
import { cursorConverter } from './cursor';
|
14
|
-
import {
|
16
|
+
import { type State, isReconcile, updateHeadsEffect } from './defs';
|
15
17
|
import { Syncer } from './sync';
|
16
|
-
import { Cursor } from '../../util';
|
17
18
|
|
18
19
|
export const automerge = (accessor: DocAccessor): Extension => {
|
19
20
|
const syncState = StateField.define<State>({
|
@@ -5,7 +5,7 @@
|
|
5
5
|
//
|
6
6
|
|
7
7
|
import { type Heads, type Prop } from '@automerge/automerge';
|
8
|
-
import { Annotation, StateEffect, type StateField, type
|
8
|
+
import { Annotation, type EditorState, StateEffect, type StateField, type Transaction } from '@codemirror/state';
|
9
9
|
|
10
10
|
export type State = {
|
11
11
|
path: Prop[];
|
@@ -10,7 +10,7 @@ import { type EditorView } from '@codemirror/view';
|
|
10
10
|
|
11
11
|
import { type IDocHandle } from '@dxos/react-client/echo';
|
12
12
|
|
13
|
-
import { getLastHeads, getPath, isReconcile, reconcileAnnotation,
|
13
|
+
import { type State, getLastHeads, getPath, isReconcile, reconcileAnnotation, updateHeads } from './defs';
|
14
14
|
import { updateAutomerge } from './update-automerge';
|
15
15
|
import { updateCodeMirror } from './update-codemirror';
|
16
16
|
|
@@ -5,7 +5,7 @@
|
|
5
5
|
//
|
6
6
|
|
7
7
|
import { next as A, type Heads } from '@automerge/automerge';
|
8
|
-
import { type EditorState, type StateField, type
|
8
|
+
import { type EditorState, type StateField, type Text, type Transaction } from '@codemirror/state';
|
9
9
|
|
10
10
|
import { type IDocHandle } from '@dxos/react-client/echo';
|
11
11
|
|
@@ -2,7 +2,7 @@
|
|
2
2
|
// Copyright 2024 DXOS.org
|
3
3
|
//
|
4
4
|
|
5
|
-
import { Annotation, type Extension,
|
5
|
+
import { Annotation, type Extension, type Range, RangeSet } from '@codemirror/state';
|
6
6
|
import {
|
7
7
|
Decoration,
|
8
8
|
type DecorationSet,
|
@@ -16,7 +16,7 @@ import {
|
|
16
16
|
import { Event } from '@dxos/async';
|
17
17
|
import { Context } from '@dxos/context';
|
18
18
|
|
19
|
-
import {
|
19
|
+
import { Cursor, type CursorConverter, singleValueFacet } from '../../util';
|
20
20
|
|
21
21
|
export interface AwarenessProvider {
|
22
22
|
remoteStateChange: Event<void>;
|
package/src/extensions/blast.ts
CHANGED
@@ -9,6 +9,7 @@ import { type Extension } from '@codemirror/state';
|
|
9
9
|
import { EditorView, keymap } from '@codemirror/view';
|
10
10
|
import defaultsDeep from 'lodash.defaultsdeep';
|
11
11
|
|
12
|
+
import { throttle } from '@dxos/async';
|
12
13
|
import { invariant } from '@dxos/invariant';
|
13
14
|
|
14
15
|
export type BlastOptions = {
|
@@ -214,12 +215,12 @@ class Blaster {
|
|
214
215
|
requestAnimationFrame(this.loop.bind(this));
|
215
216
|
}
|
216
217
|
|
217
|
-
shake = throttle
|
218
|
+
shake = throttle(({ time }: { time: number }) => {
|
218
219
|
this._shakeTime = this._shakeTimeMax || time;
|
219
220
|
this._shakeTimeMax = time;
|
220
221
|
}, 100);
|
221
222
|
|
222
|
-
spawn = throttle
|
223
|
+
spawn = throttle(({ element, point }: { element: Element; point: { x: number; y: number } }) => {
|
223
224
|
const color = getRGBComponents(element, this._options.color);
|
224
225
|
const numParticles = random(this._options.particleNumRange.min, this._options.particleNumRange.max);
|
225
226
|
const dir = this._lastPoint.x === point.x ? 0 : this._lastPoint.x < point.x ? 1 : -1;
|
@@ -336,20 +337,6 @@ class Effect2 extends Effect {
|
|
336
337
|
// Utils
|
337
338
|
//
|
338
339
|
|
339
|
-
function throttle<T>(callback: (arg: T) => void, limit: number): (arg: T) => void {
|
340
|
-
let wait = false;
|
341
|
-
return function (...args: any[]) {
|
342
|
-
if (!wait) {
|
343
|
-
// @ts-ignore
|
344
|
-
callback.apply(this, args);
|
345
|
-
wait = true;
|
346
|
-
setTimeout(() => {
|
347
|
-
wait = false;
|
348
|
-
}, limit);
|
349
|
-
}
|
350
|
-
};
|
351
|
-
}
|
352
|
-
|
353
340
|
const getRGBComponents = (node: Element, color: BlastOptions['color']): Particle['color'] => {
|
354
341
|
if (typeof color === 'function') {
|
355
342
|
return color();
|
@@ -3,7 +3,7 @@
|
|
3
3
|
//
|
4
4
|
|
5
5
|
import { StateEffect } from '@codemirror/state';
|
6
|
-
import { type
|
6
|
+
import { type Command, type EditorView, type KeyBinding } from '@codemirror/view';
|
7
7
|
|
8
8
|
import { commandState } from './state';
|
9
9
|
|
@@ -2,12 +2,13 @@
|
|
2
2
|
// Copyright 2024 DXOS.org
|
3
3
|
//
|
4
4
|
|
5
|
-
import {
|
6
|
-
import { EditorView, ViewPlugin, type ViewUpdate,
|
5
|
+
import { Prec, RangeSetBuilder, StateEffect, StateField } from '@codemirror/state';
|
6
|
+
import { Decoration, type DecorationSet, EditorView, ViewPlugin, type ViewUpdate, keymap } from '@codemirror/view';
|
7
7
|
|
8
|
-
import { placeholder, type PlaceholderOptions } from './placeholder';
|
9
8
|
import { type Range } from '../../types';
|
10
9
|
|
10
|
+
import { type PlaceholderOptions, placeholder } from './placeholder';
|
11
|
+
|
11
12
|
export type CommandMenuOptions = {
|
12
13
|
trigger: string | string[];
|
13
14
|
placeholder?: Partial<PlaceholderOptions>;
|
@@ -2,14 +2,14 @@
|
|
2
2
|
// Copyright 2024 DXOS.org
|
3
3
|
//
|
4
4
|
|
5
|
-
import {
|
5
|
+
import { type Extension, Prec } from '@codemirror/state';
|
6
6
|
import { EditorView, keymap } from '@codemirror/view';
|
7
7
|
|
8
8
|
import { isNonNullable } from '@dxos/util';
|
9
9
|
|
10
10
|
import { closeEffect, commandKeyBindings } from './action';
|
11
|
-
import {
|
12
|
-
import { commandConfig, commandState
|
11
|
+
import { type HintOptions, hint } from './hint';
|
12
|
+
import { type PopupOptions, commandConfig, commandState } from './state';
|
13
13
|
|
14
14
|
// TODO(burdon): Create knowledge base for CM notes and ideas.
|
15
15
|
// https://discuss.codemirror.net/t/inline-code-hints-like-vscode/5533/4
|
@@ -6,9 +6,10 @@
|
|
6
6
|
import { RangeSetBuilder } from '@codemirror/state';
|
7
7
|
import { Decoration, EditorView, ViewPlugin, type ViewUpdate, WidgetType } from '@codemirror/view';
|
8
8
|
|
9
|
-
import { commandState } from './state';
|
10
9
|
import { clientRectsFor, flattenRect } from '../../util';
|
11
10
|
|
11
|
+
import { commandState } from './state';
|
12
|
+
|
12
13
|
export type HintOptions = {
|
13
14
|
delay?: number;
|
14
15
|
onHint?: () => string | undefined;
|
@@ -4,7 +4,7 @@
|
|
4
4
|
//
|
5
5
|
|
6
6
|
import { type Extension } from '@codemirror/state';
|
7
|
-
import { Decoration, EditorView,
|
7
|
+
import { Decoration, EditorView, ViewPlugin, type ViewUpdate, WidgetType } from '@codemirror/view';
|
8
8
|
|
9
9
|
import { clientRectsFor, flattenRect } from '../../util';
|
10
10
|
|
@@ -3,13 +3,14 @@
|
|
3
3
|
//
|
4
4
|
|
5
5
|
import { StateField } from '@codemirror/state';
|
6
|
-
import {
|
6
|
+
import { type EditorView, type Tooltip, type TooltipView, showTooltip } from '@codemirror/view';
|
7
7
|
|
8
|
-
import { closeEffect, type Action, openEffect } from './action';
|
9
|
-
import { type CommandOptions } from './command';
|
10
8
|
import { type RenderCallback } from '../../types';
|
11
9
|
import { singleValueFacet } from '../../util';
|
12
10
|
|
11
|
+
import { type Action, closeEffect, openEffect } from './action';
|
12
|
+
import { type CommandOptions } from './command';
|
13
|
+
|
13
14
|
export const commandConfig = singleValueFacet<CommandOptions>();
|
14
15
|
|
15
16
|
export type PopupOptions = {
|