@dxos/react-ui-editor 0.4.8-main.5f46a83 → 0.4.8-main.6304ea3
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/index.mjs +2285 -2106
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/types/src/components/TextEditor/TextEditor.d.ts +2 -2
- package/dist/types/src/components/TextEditor/TextEditor.d.ts.map +1 -1
- package/dist/types/src/components/TextEditor/TextEditor.stories.d.ts +3 -2
- package/dist/types/src/components/TextEditor/TextEditor.stories.d.ts.map +1 -1
- package/dist/types/src/components/Toolbar/Toolbar.d.ts +11 -5
- package/dist/types/src/components/Toolbar/Toolbar.d.ts.map +1 -1
- package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts +4 -2
- package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts.map +1 -1
- package/dist/types/src/extensions/automerge/automerge.stories.d.ts +1 -0
- package/dist/types/src/extensions/automerge/automerge.stories.d.ts.map +1 -1
- package/dist/types/src/{hooks → extensions/awareness}/awareness-provider.d.ts +1 -1
- package/dist/types/src/extensions/awareness/awareness-provider.d.ts.map +1 -0
- package/dist/types/src/extensions/awareness/awareness.d.ts.map +1 -0
- package/dist/types/src/extensions/awareness/index.d.ts +3 -0
- package/dist/types/src/extensions/awareness/index.d.ts.map +1 -0
- 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/cursor.d.ts +1 -1
- package/dist/types/src/extensions/cursor.d.ts.map +1 -1
- package/dist/types/src/{hooks/extension-utils.d.ts → extensions/factories.d.ts} +2 -7
- package/dist/types/src/extensions/factories.d.ts.map +1 -0
- package/dist/types/src/extensions/index.d.ts +3 -0
- package/dist/types/src/extensions/index.d.ts.map +1 -1
- package/dist/types/src/extensions/markdown/formatting.d.ts +7 -4
- package/dist/types/src/extensions/markdown/formatting.d.ts.map +1 -1
- package/dist/types/src/extensions/markdown/image.d.ts +6 -0
- package/dist/types/src/extensions/markdown/image.d.ts.map +1 -1
- package/dist/types/src/extensions/modes.d.ts +1 -0
- package/dist/types/src/extensions/modes.d.ts.map +1 -1
- package/dist/types/src/extensions/state.d.ts +20 -0
- package/dist/types/src/extensions/state.d.ts.map +1 -0
- package/dist/types/src/{hooks/defs.d.ts → extensions/types.d.ts} +1 -1
- package/dist/types/src/extensions/types.d.ts.map +1 -0
- package/dist/types/src/hooks/index.d.ts +1 -3
- package/dist/types/src/hooks/index.d.ts.map +1 -1
- package/dist/types/src/hooks/useActionHandler.d.ts.map +1 -1
- package/dist/types/src/hooks/useDocAccessor.d.ts +7 -0
- package/dist/types/src/hooks/useDocAccessor.d.ts.map +1 -0
- package/dist/types/src/hooks/useTextEditor.d.ts.map +1 -1
- package/dist/types/src/hooks/useTextEditor.stories.d.ts +1 -0
- package/dist/types/src/hooks/useTextEditor.stories.d.ts.map +1 -1
- package/dist/types/src/translations.d.ts +1 -0
- package/dist/types/src/translations.d.ts.map +1 -1
- package/package.json +25 -27
- package/src/components/TextEditor/TextEditor.stories.tsx +21 -11
- package/src/components/TextEditor/TextEditor.tsx +13 -12
- package/src/components/Toolbar/Toolbar.stories.tsx +28 -33
- package/src/components/Toolbar/Toolbar.tsx +101 -35
- package/src/extensions/automerge/automerge.stories.tsx +2 -1
- package/src/{hooks → extensions/awareness}/awareness-provider.ts +1 -1
- package/src/extensions/{awareness.ts → awareness/awareness.ts} +1 -1
- package/src/extensions/awareness/index.ts +6 -0
- package/src/extensions/comments.ts +3 -3
- package/src/extensions/cursor.ts +1 -1
- package/src/{hooks/extension-utils.ts → extensions/factories.ts} +3 -21
- package/src/extensions/index.ts +3 -0
- package/src/extensions/markdown/decorate.ts +1 -1
- package/src/extensions/markdown/formatting.test.ts +13 -13
- package/src/extensions/markdown/formatting.ts +91 -83
- package/src/extensions/markdown/image.ts +6 -0
- package/src/extensions/modes.ts +3 -1
- package/src/extensions/state.ts +90 -0
- package/src/{hooks/defs.ts → extensions/types.ts} +1 -0
- package/src/hooks/index.ts +1 -4
- package/src/hooks/useActionHandler.ts +5 -1
- package/src/hooks/useDocAccessor.ts +21 -0
- package/src/hooks/useTextEditor.stories.tsx +4 -4
- package/src/hooks/useTextEditor.ts +3 -0
- package/src/translations.ts +1 -0
- package/dist/types/src/extensions/awareness.d.ts.map +0 -1
- package/dist/types/src/hooks/awareness-provider.d.ts.map +0 -1
- package/dist/types/src/hooks/defs.d.ts.map +0 -1
- package/dist/types/src/hooks/extension-utils.d.ts.map +0 -1
- /package/dist/types/src/extensions/{awareness.d.ts → awareness/awareness.d.ts} +0 -0
|
@@ -11,7 +11,7 @@ export type Formatting = {
|
|
|
11
11
|
link: boolean;
|
|
12
12
|
listStyle: null | 'ordered' | 'bullet' | 'task';
|
|
13
13
|
};
|
|
14
|
-
export declare const
|
|
14
|
+
export declare const formattingEquals: (a: Formatting, b: Formatting) => boolean;
|
|
15
15
|
export declare enum Inline {
|
|
16
16
|
Strong = 0,
|
|
17
17
|
Emphasis = 1,
|
|
@@ -34,7 +34,10 @@ export declare const toggleStrikethrough: StateCommand;
|
|
|
34
34
|
export declare const toggleInlineCode: StateCommand;
|
|
35
35
|
export declare const insertTable: (view: EditorView) => void;
|
|
36
36
|
export declare const removeLink: StateCommand;
|
|
37
|
-
export declare const addLink:
|
|
37
|
+
export declare const addLink: ({ url, image }?: {
|
|
38
|
+
url?: string | undefined;
|
|
39
|
+
image?: boolean | undefined;
|
|
40
|
+
}) => StateCommand;
|
|
38
41
|
export declare const addList: (type: List) => StateCommand;
|
|
39
42
|
export declare const removeList: (type: List) => StateCommand;
|
|
40
43
|
export declare const toggleList: (type: List) => StateCommand;
|
|
@@ -52,7 +55,7 @@ export declare const formattingKeymap: (options?: FormattingOptions) => Extensio
|
|
|
52
55
|
*/
|
|
53
56
|
export declare const getFormatting: (state: EditorState) => Formatting;
|
|
54
57
|
/**
|
|
55
|
-
* Hook
|
|
58
|
+
* Hook provides an extension to compute the current formatting state.
|
|
56
59
|
*/
|
|
57
|
-
export declare const useFormattingState: () => [Formatting |
|
|
60
|
+
export declare const useFormattingState: () => [Formatting | undefined, Extension];
|
|
58
61
|
//# sourceMappingURL=formatting.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formatting.d.ts","sourceRoot":"","sources":["../../../../../src/extensions/markdown/formatting.ts"],"names":[],"mappings":"AAMA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,YAAY,EACjB,KAAK,WAAW,EAKjB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAU,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"formatting.d.ts","sourceRoot":"","sources":["../../../../../src/extensions/markdown/formatting.ts"],"names":[],"mappings":"AAMA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,YAAY,EACjB,KAAK,WAAW,EAKjB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAU,MAAM,kBAAkB,CAAC;AActD,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,EAAE,OAAO,CAAC;IAGnB,SAAS,EACL,WAAW,GACX,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,WAAW,GACX,WAAW,GACX,IAAI,CAAC;IAET,UAAU,EAAE,OAAO,CAAC;IAEpB,MAAM,EAAE,OAAO,CAAC;IAEhB,QAAQ,EAAE,OAAO,CAAC;IAElB,aAAa,EAAE,OAAO,CAAC;IAEvB,IAAI,EAAE,OAAO,CAAC;IAEd,IAAI,EAAE,OAAO,CAAC;IAEd,SAAS,EAAE,IAAI,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;CACjD,CAAC;AAEF,eAAO,MAAM,gBAAgB,MAAO,UAAU,KAAK,UAAU,YAQ9B,CAAC;AAEhC,oBAAY,MAAM;IAChB,MAAM,IAAI;IACV,QAAQ,IAAI;IACZ,aAAa,IAAI;IACjB,IAAI,IAAI;CACT;AAED,oBAAY,IAAI;IACd,OAAO,IAAA;IACP,MAAM,IAAA;IACN,IAAI,IAAA;CACL;AAMD,eAAO,MAAM,UAAU,UACb,MAAM,KAAG,YAkEhB,CAAC;AAMJ,eAAO,MAAM,QAAQ,SACZ,MAAM,UAAU,OAAO,KAAG,YAoKhC,CAAC;AAEJ,eAAO,MAAM,QAAQ,UAAW,MAAM,KAAG,YAAqC,CAAC;AAE/E,eAAO,MAAM,WAAW,UAAW,MAAM,KAAG,YAAsC,CAAC;AAEnF,eAAO,MAAM,WAAW,UACd,MAAM,KAAG,YAahB,CAAC;AAEJ,eAAO,MAAM,YAAY,cAA6B,CAAC;AACvD,eAAO,MAAM,cAAc,cAA+B,CAAC;AAC3D,eAAO,MAAM,mBAAmB,cAAoC,CAAC;AACrE,eAAO,MAAM,gBAAgB,cAA2B,CAAC;AA0EzD,eAAO,MAAM,WAAW,SAAU,UAAU,SAS3C,CAAC;AA4BF,eAAO,MAAM,UAAU,EAAE,YAUxB,CAAC;AAGF,eAAO,MAAM,OAAO;;;MACwC,YAsFzD,CAAC;AAMJ,eAAO,MAAM,OAAO,SACX,IAAI,KAAG,YAmJb,CAAC;AAEJ,eAAO,MAAM,UAAU,SACd,IAAI,KAAG,YAwDb,CAAC;AAEJ,eAAO,MAAM,UAAU,SACd,IAAI,KAAG,YAMb,CAAC;AAqBJ,eAAO,MAAM,aAAa,WACf,OAAO,KAAG,YAwElB,CAAC;AAEJ,eAAO,MAAM,aAAa,cAAsB,CAAC;AAEjD,eAAO,MAAM,gBAAgB,cAAuB,CAAC;AAErD,eAAO,MAAM,gBAAgB,EAAE,YAE9B,CAAC;AAMF,eAAO,MAAM,YAAY,EAAE,YAsD1B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,YAyC7B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,YAE7B,CAAC;AAMF,MAAM,MAAM,iBAAiB,GAAG,EAAE,CAAC;AAEnC,eAAO,MAAM,gBAAgB,aAAa,iBAAiB,KAAQ,SASlE,CAAC;AA4CF;;GAEG;AACH,eAAO,MAAM,aAAa,UAAW,WAAW,KAAG,UAqKlD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,kBAAkB,QAAO,CAAC,UAAU,GAAG,SAAS,EAAE,SAAS,CAkBvE,CAAC"}
|
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import { type Extension } from '@codemirror/state';
|
|
2
2
|
export type ImageOptions = {};
|
|
3
3
|
export declare const image: (options?: ImageOptions) => Extension;
|
|
4
|
+
export type ImageUploadOptions = {
|
|
5
|
+
onSelect: () => {
|
|
6
|
+
url: string;
|
|
7
|
+
};
|
|
8
|
+
};
|
|
9
|
+
export declare const imageUpload: (options?: ImageOptions) => void;
|
|
4
10
|
//# sourceMappingURL=image.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../../../src/extensions/markdown/image.ts"],"names":[],"mappings":"AAKA,OAAO,EAAoB,KAAK,SAAS,EAA4C,MAAM,mBAAmB,CAAC;AAG/G,MAAM,MAAM,YAAY,GAAG,EAAE,CAAC;AAE9B,eAAO,MAAM,KAAK,aAAa,YAAY,KAAQ,SA8BlD,CAAC"}
|
|
1
|
+
{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../../../src/extensions/markdown/image.ts"],"names":[],"mappings":"AAKA,OAAO,EAAoB,KAAK,SAAS,EAA4C,MAAM,mBAAmB,CAAC;AAG/G,MAAM,MAAM,YAAY,GAAG,EAAE,CAAC;AAE9B,eAAO,MAAM,KAAK,aAAa,YAAY,KAAQ,SA8BlD,CAAC;AA4DF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,EAAE,MAAM;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,WAAW,aAAa,YAAY,SAAY,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modes.d.ts","sourceRoot":"","sources":["../../../../src/extensions/modes.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAI1D,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,KAAK,GAAG,SAAS,CAAC;AAEvD,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAErB,CAAC;AAEH,eAAO,MAAM,WAAW,EAAE;IAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAA;CAgBpD,CAAC"}
|
|
1
|
+
{"version":3,"file":"modes.d.ts","sourceRoot":"","sources":["../../../../src/extensions/modes.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAI1D,eAAO,MAAM,UAAU,oBAAoB,CAAC;AAE5C,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,KAAK,GAAG,SAAS,CAAC;AAEvD,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAErB,CAAC;AAEH,eAAO,MAAM,WAAW,EAAE;IAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAA;CAgBpD,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { type Extension } from '@codemirror/state';
|
|
2
|
+
export type SelectionState = {
|
|
3
|
+
scrollTo: {
|
|
4
|
+
from: number;
|
|
5
|
+
};
|
|
6
|
+
selection: {
|
|
7
|
+
anchor: number;
|
|
8
|
+
head?: number;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
export type StateOptions = {
|
|
12
|
+
setState: (id: string, state: SelectionState) => void;
|
|
13
|
+
getState: (id: string) => SelectionState | undefined;
|
|
14
|
+
};
|
|
15
|
+
export declare const localStorageStateStoreAdapter: StateOptions;
|
|
16
|
+
/**
|
|
17
|
+
* Track scrolling and selection state to be restored when switching to document.
|
|
18
|
+
*/
|
|
19
|
+
export declare const state: ({ getState, setState }?: Partial<StateOptions>) => Extension;
|
|
20
|
+
//# sourceMappingURL=state.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../../../../src/extensions/state.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAe,MAAM,mBAAmB,CAAC;AAYhE,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE;QACR,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,SAAS,EAAE;QACT,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IACtD,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,cAAc,GAAG,SAAS,CAAC;CACtD,CAAC;AAGF,eAAO,MAAM,6BAA6B,EAAE,YAU3C,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,KAAK,4BAA4B,QAAQ,YAAY,CAAC,KAAQ,SA0C1E,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/extensions/types.ts"],"names":[],"mappings":"AAKA,MAAM,MAAM,KAAK,GAAG;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAIF,MAAM,MAAM,OAAO,GAAG;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/hooks/index.ts"],"names":[],"mappings":"AAIA,cAAc,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/hooks/index.ts"],"names":[],"mappings":"AAIA,cAAc,oBAAoB,CAAC;AACnC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useActionHandler.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useActionHandler.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAEnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAqBlD,eAAO,MAAM,gBAAgB,UAAW,UAAU,GAAG,IAAI,KAAG,YAAY,CAAC,UAAU,
|
|
1
|
+
{"version":3,"file":"useActionHandler.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useActionHandler.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAEnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAqBlD,eAAO,MAAM,gBAAgB,UAAW,UAAU,GAAG,IAAI,KAAG,YAAY,CAAC,UAAU,CAqElF,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDocAccessor.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useDocAccessor.ts"],"names":[],"mappings":"AAMA,OAAO,EAAqB,KAAK,WAAW,EAAkB,KAAK,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAGzG,eAAO,MAAM,cAAc,kBACnB,UAAU;QACT,MAAM;SAAO,MAAM,GAAG,SAAS;;CASvC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTextEditor.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useTextEditor.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAwC,MAAM,OAAO,CAAC;AAKlG,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAIrD,MAAM,MAAM,aAAa,GAAG;IAC1B,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,eAAe,EAAE,iBAAiB,GAAG,YAAY,CAAC,CAAC;AAEzF;;GAEG;AACH,eAAO,MAAM,aAAa,QAAQ,MAAM,kBAAkB,4BAA2C,
|
|
1
|
+
{"version":3,"file":"useTextEditor.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useTextEditor.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAwC,MAAM,OAAO,CAAC;AAKlG,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAIrD,MAAM,MAAM,aAAa,GAAG;IAC1B,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,eAAe,EAAE,iBAAiB,GAAG,YAAY,CAAC,CAAC;AAEzF;;GAEG;AACH,eAAO,MAAM,aAAa,QAAQ,MAAM,kBAAkB,4BAA2C,aA4EpG,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTextEditor.stories.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useTextEditor.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAwBpB,KAAK,UAAU,GAAG;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;;;;mBA2Ee,UAAU
|
|
1
|
+
{"version":3,"file":"useTextEditor.stories.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useTextEditor.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAwBpB,KAAK,UAAU,GAAG;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;;;;mBA2Ee,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;AAH3B,wBASE;AAEF,eAAO,MAAM,OAAO;;CAKnB,CAAC;AAEF,eAAO,MAAM,KAAK;;CAQjB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;CAMpB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"translations.d.ts","sourceRoot":"","sources":["../../../src/translations.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,cAAc,oBAAoB,CAAC
|
|
1
|
+
{"version":3,"file":"translations.d.ts","sourceRoot":"","sources":["../../../src/translations.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,cAAc,oBAAoB,CAAC;;;;;;;;;;;;;;;;;;;;;AAEhD,wBAqBE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dxos/react-ui-editor",
|
|
3
|
-
"version": "0.4.8-main.
|
|
3
|
+
"version": "0.4.8-main.6304ea3",
|
|
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",
|
|
@@ -36,21 +36,22 @@
|
|
|
36
36
|
"lodash.get": "^4.4.2",
|
|
37
37
|
"lodash.pick": "^4.4.0",
|
|
38
38
|
"lodash.sortby": "^4.7.0",
|
|
39
|
+
"react-dropzone": "^14.2.3",
|
|
39
40
|
"style-mod": "^4.1.0",
|
|
40
|
-
"@dxos/
|
|
41
|
-
"@dxos/
|
|
42
|
-
"@dxos/debug": "0.4.8-main.
|
|
43
|
-
"@dxos/automerge": "0.4.8-main.
|
|
44
|
-
"@dxos/
|
|
45
|
-
"@dxos/
|
|
46
|
-
"@dxos/
|
|
47
|
-
"@dxos/
|
|
48
|
-
"@dxos/
|
|
49
|
-
"@dxos/
|
|
50
|
-
"@dxos/react-ui": "0.4.8-main.
|
|
51
|
-
"@dxos/react-ui-theme": "0.4.8-main.
|
|
52
|
-
"@dxos/text-model": "0.4.8-main.
|
|
53
|
-
"@dxos/util": "0.4.8-main.
|
|
41
|
+
"@dxos/context": "0.4.8-main.6304ea3",
|
|
42
|
+
"@dxos/async": "0.4.8-main.6304ea3",
|
|
43
|
+
"@dxos/debug": "0.4.8-main.6304ea3",
|
|
44
|
+
"@dxos/automerge": "0.4.8-main.6304ea3",
|
|
45
|
+
"@dxos/display-name": "0.4.8-main.6304ea3",
|
|
46
|
+
"@dxos/echo-schema": "0.4.8-main.6304ea3",
|
|
47
|
+
"@dxos/protocols": "0.4.8-main.6304ea3",
|
|
48
|
+
"@dxos/log": "0.4.8-main.6304ea3",
|
|
49
|
+
"@dxos/invariant": "0.4.8-main.6304ea3",
|
|
50
|
+
"@dxos/react-async": "0.4.8-main.6304ea3",
|
|
51
|
+
"@dxos/react-ui": "0.4.8-main.6304ea3",
|
|
52
|
+
"@dxos/react-ui-theme": "0.4.8-main.6304ea3",
|
|
53
|
+
"@dxos/text-model": "0.4.8-main.6304ea3",
|
|
54
|
+
"@dxos/util": "0.4.8-main.6304ea3"
|
|
54
55
|
},
|
|
55
56
|
"devDependencies": {
|
|
56
57
|
"@automerge/automerge-repo-network-broadcastchannel": "^1.1.1",
|
|
@@ -68,7 +69,6 @@
|
|
|
68
69
|
"@types/react-test-renderer": "^17.0.2",
|
|
69
70
|
"@vitest/browser": "^1.3.1",
|
|
70
71
|
"@vitest/ui": "^1.3.1",
|
|
71
|
-
"deepsignal": "^1.5.0",
|
|
72
72
|
"happy-dom": "^13.3.1",
|
|
73
73
|
"jsdom": "^20.0.1",
|
|
74
74
|
"react": "^18.2.0",
|
|
@@ -78,22 +78,20 @@
|
|
|
78
78
|
"vite-plugin-top-level-await": "^1.4.1",
|
|
79
79
|
"vite-plugin-wasm": "^3.3.0",
|
|
80
80
|
"vitest": "^1.3.1",
|
|
81
|
-
"@dxos/config": "0.4.8-main.
|
|
82
|
-
"@dxos/echo-signals": "0.4.8-main.
|
|
83
|
-
"@dxos/echo-typegen": "0.4.8-main.
|
|
84
|
-
"@dxos/
|
|
85
|
-
"@dxos/
|
|
86
|
-
"@dxos/
|
|
87
|
-
"@dxos/
|
|
88
|
-
"@dxos/
|
|
81
|
+
"@dxos/config": "0.4.8-main.6304ea3",
|
|
82
|
+
"@dxos/echo-signals": "0.4.8-main.6304ea3",
|
|
83
|
+
"@dxos/echo-typegen": "0.4.8-main.6304ea3",
|
|
84
|
+
"@dxos/keyboard": "0.4.8-main.6304ea3",
|
|
85
|
+
"@dxos/react-client": "0.4.8-main.6304ea3",
|
|
86
|
+
"@dxos/random": "0.4.8-main.6304ea3",
|
|
87
|
+
"@dxos/storybook-utils": "0.4.8-main.6304ea3",
|
|
88
|
+
"@dxos/react-ui": "0.4.8-main.6304ea3"
|
|
89
89
|
},
|
|
90
90
|
"peerDependencies": {
|
|
91
91
|
"@phosphor-icons/react": "^2.0.5",
|
|
92
|
-
"@vitest/browser": "^1.3.1",
|
|
93
|
-
"@vitest/ui": "^1.3.1",
|
|
94
92
|
"react": "^18.2.0",
|
|
95
93
|
"react-dom": "^18.2.0",
|
|
96
|
-
"@dxos/react-client": "0.4.8-main.
|
|
94
|
+
"@dxos/react-client": "0.4.8-main.6304ea3"
|
|
97
95
|
},
|
|
98
96
|
"publishConfig": {
|
|
99
97
|
"access": "public"
|
|
@@ -20,12 +20,16 @@ import { withTheme } from '@dxos/storybook-utils';
|
|
|
20
20
|
|
|
21
21
|
import { TextEditor, type TextEditorProps } from './TextEditor';
|
|
22
22
|
import {
|
|
23
|
+
EditorModes,
|
|
23
24
|
annotations,
|
|
24
25
|
autocomplete,
|
|
25
26
|
blast,
|
|
26
27
|
command,
|
|
27
28
|
comments,
|
|
29
|
+
createBasicExtensions,
|
|
30
|
+
createDataExtensions,
|
|
28
31
|
createMarkdownExtensions,
|
|
32
|
+
createThemeExtensions,
|
|
29
33
|
decorateMarkdown,
|
|
30
34
|
defaultOptions,
|
|
31
35
|
dnd,
|
|
@@ -34,21 +38,17 @@ import {
|
|
|
34
38
|
linkTooltip,
|
|
35
39
|
listener,
|
|
36
40
|
mention,
|
|
37
|
-
|
|
41
|
+
state,
|
|
38
42
|
table,
|
|
39
43
|
typewriter,
|
|
40
|
-
|
|
44
|
+
useComments,
|
|
41
45
|
type CommandAction,
|
|
42
46
|
type CommandOptions,
|
|
47
|
+
type Comment,
|
|
43
48
|
type CommentsOptions,
|
|
49
|
+
type SelectionState,
|
|
44
50
|
} from '../../extensions';
|
|
45
|
-
import {
|
|
46
|
-
type Comment,
|
|
47
|
-
createBasicExtensions,
|
|
48
|
-
createDataExtensions,
|
|
49
|
-
createThemeExtensions,
|
|
50
|
-
useDocAccessor,
|
|
51
|
-
} from '../../hooks';
|
|
51
|
+
import { useDocAccessor } from '../../hooks';
|
|
52
52
|
import translations from '../../translations';
|
|
53
53
|
|
|
54
54
|
faker.seed(101);
|
|
@@ -243,7 +243,7 @@ type StoryProps = {
|
|
|
243
243
|
} & Pick<TextEditorProps, 'extensions'>;
|
|
244
244
|
|
|
245
245
|
const Story = ({
|
|
246
|
-
id = '
|
|
246
|
+
id = 'editor-' + PublicKey.random().toHex().slice(0, 8),
|
|
247
247
|
text,
|
|
248
248
|
comments,
|
|
249
249
|
extensions: _extensions = [],
|
|
@@ -327,8 +327,18 @@ export const Empty = {
|
|
|
327
327
|
render: () => <Story />,
|
|
328
328
|
};
|
|
329
329
|
|
|
330
|
+
const global = new Map<string, SelectionState>();
|
|
331
|
+
|
|
330
332
|
export const Scrolling = {
|
|
331
|
-
render: () =>
|
|
333
|
+
render: () => (
|
|
334
|
+
<Story
|
|
335
|
+
text={str('# Large Document', '', large)}
|
|
336
|
+
extensions={state({
|
|
337
|
+
setState: (id, state) => global.set(id, state),
|
|
338
|
+
getState: (id) => global.get(id),
|
|
339
|
+
})}
|
|
340
|
+
/>
|
|
341
|
+
),
|
|
332
342
|
};
|
|
333
343
|
|
|
334
344
|
export const ScrollingWithImages = {
|
|
@@ -18,7 +18,7 @@ import React, {
|
|
|
18
18
|
import { log } from '@dxos/log';
|
|
19
19
|
import { isNotFalsy } from '@dxos/util';
|
|
20
20
|
|
|
21
|
-
import { documentId, editorMode } from '../../extensions';
|
|
21
|
+
import { documentId, editorMode, focusEvent } from '../../extensions';
|
|
22
22
|
import { logChanges } from '../../util';
|
|
23
23
|
|
|
24
24
|
export type CursorInfo = {
|
|
@@ -34,7 +34,7 @@ export type TextEditorProps = Pick<EditorStateConfig, 'doc' | 'selection' | 'ext
|
|
|
34
34
|
id?: string;
|
|
35
35
|
className?: string;
|
|
36
36
|
autoFocus?: boolean;
|
|
37
|
-
scrollTo?: StateEffect<
|
|
37
|
+
scrollTo?: StateEffect<unknown>;
|
|
38
38
|
moveToEndOfLine?: boolean;
|
|
39
39
|
debug?: boolean;
|
|
40
40
|
dataTestId?: string;
|
|
@@ -56,14 +56,14 @@ export const TextEditor = forwardRef<EditorView | null, TextEditorProps>(
|
|
|
56
56
|
extensions,
|
|
57
57
|
className,
|
|
58
58
|
autoFocus,
|
|
59
|
-
scrollTo = EditorView.scrollIntoView(0),
|
|
59
|
+
scrollTo = EditorView.scrollIntoView(0, { yMargin: 0 }),
|
|
60
60
|
moveToEndOfLine,
|
|
61
61
|
debug,
|
|
62
62
|
dataTestId,
|
|
63
63
|
},
|
|
64
64
|
forwardedRef,
|
|
65
65
|
) => {
|
|
66
|
-
//
|
|
66
|
+
// NOTE: Increments by 2 in strict mode.
|
|
67
67
|
const [instanceId] = useState(() => `text-editor-${++instanceCount}`);
|
|
68
68
|
|
|
69
69
|
// TODO(burdon): Make tabster optional.
|
|
@@ -85,7 +85,7 @@ export const TextEditor = forwardRef<EditorView | null, TextEditorProps>(
|
|
|
85
85
|
// Create editor state and view.
|
|
86
86
|
// The view is recreated if the model or extensions are changed.
|
|
87
87
|
useEffect(() => {
|
|
88
|
-
log('
|
|
88
|
+
log('create', { id, instanceId });
|
|
89
89
|
|
|
90
90
|
//
|
|
91
91
|
// EditorState
|
|
@@ -104,7 +104,7 @@ export const TextEditor = forwardRef<EditorView | null, TextEditorProps>(
|
|
|
104
104
|
// Focus.
|
|
105
105
|
EditorView.updateListener.of((update) => {
|
|
106
106
|
update.transactions.forEach((transaction) => {
|
|
107
|
-
if (transaction.isUserEvent(
|
|
107
|
+
if (transaction.isUserEvent(focusEvent)) {
|
|
108
108
|
rootRef.current?.focus();
|
|
109
109
|
}
|
|
110
110
|
});
|
|
@@ -122,6 +122,7 @@ export const TextEditor = forwardRef<EditorView | null, TextEditorProps>(
|
|
|
122
122
|
state,
|
|
123
123
|
parent: rootRef.current!,
|
|
124
124
|
scrollTo,
|
|
125
|
+
|
|
125
126
|
// NOTE: Uncomment to debug/monitor all transactions.
|
|
126
127
|
// https://codemirror.net/docs/ref/#view.EditorView.dispatch
|
|
127
128
|
dispatchTransactions: (trs, view) => {
|
|
@@ -132,12 +133,10 @@ export const TextEditor = forwardRef<EditorView | null, TextEditorProps>(
|
|
|
132
133
|
},
|
|
133
134
|
});
|
|
134
135
|
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
// Position cursor at end of line.
|
|
138
|
-
if (moveToEndOfLine) {
|
|
136
|
+
// Position cursor at end of first line.
|
|
137
|
+
if (moveToEndOfLine && !(scrollTo || selection)) {
|
|
139
138
|
const { to } = view.state.doc.lineAt(0);
|
|
140
|
-
view
|
|
139
|
+
view.dispatch({ selection: { anchor: to } });
|
|
141
140
|
}
|
|
142
141
|
|
|
143
142
|
// Remove tabster attribute (rely on custom keymap).
|
|
@@ -145,9 +144,11 @@ export const TextEditor = forwardRef<EditorView | null, TextEditorProps>(
|
|
|
145
144
|
rootRef.current?.removeAttribute('data-tabster');
|
|
146
145
|
}
|
|
147
146
|
|
|
147
|
+
setView(view);
|
|
148
|
+
|
|
148
149
|
return () => {
|
|
150
|
+
log('destroy', { id, instanceId });
|
|
149
151
|
view?.destroy();
|
|
150
|
-
setView(null);
|
|
151
152
|
};
|
|
152
153
|
}, [doc, selection, extensions]);
|
|
153
154
|
|
|
@@ -15,38 +15,36 @@ import { withTheme } from '@dxos/storybook-utils';
|
|
|
15
15
|
|
|
16
16
|
import { Toolbar } from './Toolbar';
|
|
17
17
|
import {
|
|
18
|
-
|
|
18
|
+
type Comment,
|
|
19
19
|
comments,
|
|
20
|
+
createBasicExtensions,
|
|
21
|
+
createDataExtensions,
|
|
22
|
+
createMarkdownExtensions,
|
|
23
|
+
createThemeExtensions,
|
|
24
|
+
decorateMarkdown,
|
|
20
25
|
formattingKeymap,
|
|
26
|
+
image,
|
|
21
27
|
table,
|
|
22
28
|
useComments,
|
|
23
29
|
useFormattingState,
|
|
24
|
-
createMarkdownExtensions,
|
|
25
|
-
image,
|
|
26
30
|
} from '../../extensions';
|
|
27
|
-
import {
|
|
28
|
-
type Comment,
|
|
29
|
-
createBasicExtensions,
|
|
30
|
-
createDataExtensions,
|
|
31
|
-
createThemeExtensions,
|
|
32
|
-
useActionHandler,
|
|
33
|
-
useDocAccessor,
|
|
34
|
-
useTextEditor,
|
|
35
|
-
} from '../../hooks';
|
|
31
|
+
import { useActionHandler, useDocAccessor, useTextEditor } from '../../hooks';
|
|
36
32
|
import translations from '../../translations';
|
|
37
33
|
|
|
38
34
|
faker.seed(101);
|
|
39
35
|
|
|
40
36
|
const Story: FC<{ content: string }> = ({ content }) => {
|
|
37
|
+
console.log('STORY');
|
|
41
38
|
const { themeMode } = useThemeContext();
|
|
42
39
|
const [item] = useState({ text: new TextObject(content) });
|
|
43
40
|
const { id, doc, accessor } = useDocAccessor(item.text);
|
|
44
41
|
const [formattingState, formattingObserver] = useFormattingState();
|
|
45
|
-
const { parentRef, view } = useTextEditor(
|
|
46
|
-
|
|
42
|
+
const { parentRef, view } = useTextEditor(() => {
|
|
43
|
+
return {
|
|
47
44
|
id,
|
|
48
45
|
doc,
|
|
49
46
|
extensions: [
|
|
47
|
+
formattingObserver,
|
|
50
48
|
createBasicExtensions(),
|
|
51
49
|
createMarkdownExtensions({ themeMode }),
|
|
52
50
|
createThemeExtensions({ themeMode, slots: { editor: { className: 'p-2' } } }),
|
|
@@ -62,39 +60,36 @@ const Story: FC<{ content: string }> = ({ content }) => {
|
|
|
62
60
|
formattingKeymap(),
|
|
63
61
|
image(),
|
|
64
62
|
table(),
|
|
65
|
-
formattingObserver,
|
|
66
63
|
],
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
|
|
64
|
+
};
|
|
65
|
+
}, [id, accessor, formattingObserver, themeMode]);
|
|
66
|
+
|
|
67
|
+
const handleAction = useActionHandler(view);
|
|
70
68
|
|
|
71
69
|
const [_comments, setComments] = useState<Comment[]>([]);
|
|
72
70
|
useComments(view, id, _comments);
|
|
73
71
|
|
|
74
|
-
const handleAction = useActionHandler(view);
|
|
75
|
-
|
|
76
72
|
return (
|
|
77
|
-
<
|
|
78
|
-
<
|
|
79
|
-
<Toolbar.
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
73
|
+
<Tooltip.Provider>
|
|
74
|
+
<div role='none' className='fixed inset-0 flex flex-col'>
|
|
75
|
+
<Toolbar.Root onAction={handleAction} state={formattingState} classNames={textBlockWidth}>
|
|
76
|
+
<Toolbar.Markdown />
|
|
77
|
+
<Toolbar.Custom onUpload={async (file) => ({ url: file.name })} />
|
|
78
|
+
<Toolbar.Separator />
|
|
79
|
+
<Toolbar.Actions />
|
|
80
|
+
</Toolbar.Root>
|
|
81
|
+
<div ref={parentRef} className={textBlockWidth} />
|
|
82
|
+
</div>
|
|
83
|
+
</Tooltip.Provider>
|
|
85
84
|
);
|
|
86
85
|
};
|
|
87
86
|
|
|
88
87
|
export default {
|
|
89
88
|
title: 'react-ui-editor/Toolbar',
|
|
90
89
|
component: Toolbar,
|
|
91
|
-
render: (args: any) => (
|
|
92
|
-
<Tooltip.Provider>
|
|
93
|
-
<Story {...args} />
|
|
94
|
-
</Tooltip.Provider>
|
|
95
|
-
),
|
|
96
90
|
decorators: [withTheme],
|
|
97
91
|
parameters: { translations, layout: 'fullscreen' },
|
|
92
|
+
render: (args: any) => <Story {...args} />,
|
|
98
93
|
};
|
|
99
94
|
|
|
100
95
|
const content = [
|