@handlewithcare/react-prosemirror 3.1.0-tiptap.42 → 3.1.0-tiptap.43
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/README.md +26 -0
- package/dist/cjs/ReactEditorView.js +74 -70
- package/dist/cjs/StaticEditorView.js +21 -18
- package/dist/cjs/browser.js +3 -1
- package/dist/cjs/commands/reorderSiblings.js +13 -9
- package/dist/cjs/components/ChildNodeViews.js +71 -68
- package/dist/cjs/components/CursorWrapper.js +17 -26
- package/dist/cjs/components/LayoutGroup.js +16 -12
- package/dist/cjs/components/NativeWidgetView.js +19 -15
- package/dist/cjs/components/OutputSpec.js +13 -9
- package/dist/cjs/components/ProseMirror.js +27 -37
- package/dist/cjs/components/ProseMirrorDoc.js +18 -25
- package/dist/cjs/components/SeparatorHackView.js +20 -17
- package/dist/cjs/components/TextNodeView.js +20 -22
- package/dist/cjs/components/TrailingHackView.js +17 -13
- package/dist/cjs/components/WidgetView.js +18 -14
- package/dist/cjs/components/marks/DefaultMarkView.js +15 -27
- package/dist/cjs/components/marks/MarkView.js +23 -32
- package/dist/cjs/components/marks/MarkViewConstructorView.js +22 -38
- package/dist/cjs/components/marks/ReactMarkView.js +16 -27
- package/dist/cjs/components/nodes/DefaultNodeView.js +15 -27
- package/dist/cjs/components/nodes/DocNodeView.js +16 -12
- package/dist/cjs/components/nodes/NodeView.js +26 -33
- package/dist/cjs/components/nodes/NodeViewConstructorView.js +29 -45
- package/dist/cjs/components/nodes/ReactNodeView.js +27 -39
- package/dist/cjs/constants.js +10 -6
- package/dist/cjs/contexts/ChildDescriptionsContext.js +3 -1
- package/dist/cjs/contexts/EditorContext.js +3 -1
- package/dist/cjs/contexts/EditorStateContext.js +3 -1
- package/dist/cjs/contexts/IgnoreMutationContext.js +3 -1
- package/dist/cjs/contexts/LayoutGroupContext.js +3 -1
- package/dist/cjs/contexts/NodeViewContext.js +3 -1
- package/dist/cjs/contexts/SelectNodeContext.js +3 -1
- package/dist/cjs/contexts/StopEventContext.js +3 -1
- package/dist/cjs/decorations/ReactWidgetType.js +19 -13
- package/dist/cjs/decorations/computeDocDeco.js +5 -3
- package/dist/cjs/decorations/iterDeco.js +19 -17
- package/dist/cjs/decorations/viewDecorations.js +15 -12
- package/dist/cjs/dom.js +34 -13
- package/dist/cjs/findDOMNode.js +9 -5
- package/dist/cjs/hooks/useClientLayoutEffect.js +3 -1
- package/dist/cjs/hooks/useComponentEventListeners.js +7 -6
- package/dist/cjs/hooks/useEditor.js +28 -30
- package/dist/cjs/hooks/useEditorEffect.js +9 -7
- package/dist/cjs/hooks/useEditorEventCallback.js +9 -7
- package/dist/cjs/hooks/useEditorEventListener.js +8 -6
- package/dist/cjs/hooks/useEditorState.js +5 -3
- package/dist/cjs/hooks/useEffectEvent.js +3 -1
- package/dist/cjs/hooks/useForceUpdate.js +3 -1
- package/dist/cjs/hooks/useIgnoreMutation.js +9 -7
- package/dist/cjs/hooks/useIsEditorStatic.js +5 -5
- package/dist/cjs/hooks/useIsNodeSelected.js +5 -3
- package/dist/cjs/hooks/useLayoutGroupEffect.js +7 -5
- package/dist/cjs/hooks/useMarkViewDescription.js +31 -25
- package/dist/cjs/hooks/useNodePos.js +7 -5
- package/dist/cjs/hooks/useNodeViewDescription.js +32 -28
- package/dist/cjs/hooks/useReactKeys.js +7 -5
- package/dist/cjs/hooks/useSelectNode.js +10 -8
- package/dist/cjs/hooks/useStopEvent.js +9 -7
- package/dist/cjs/index.js +66 -34
- package/dist/cjs/plugins/beforeInputPlugin.js +20 -23
- package/dist/cjs/plugins/componentEventListeners.js +8 -6
- package/dist/cjs/plugins/componentEventListenersPlugin.js +8 -6
- package/dist/cjs/plugins/reactKeys.js +15 -10
- package/dist/cjs/props.js +23 -19
- package/dist/cjs/refs.js +3 -1
- package/dist/cjs/testing/editorViewTestHelpers.js +40 -47
- package/dist/cjs/testing/setupProseMirrorView.js +7 -4
- package/dist/cjs/tiptap/ReactProseMirrorNodeView.js +10 -6
- package/dist/cjs/tiptap/TiptapEditor.js +15 -14
- package/dist/cjs/tiptap/TiptapEditorContent.js +18 -28
- package/dist/cjs/tiptap/TiptapEditorView.js +23 -34
- package/dist/cjs/tiptap/contexts/TiptapEditorContext.js +3 -1
- package/dist/cjs/tiptap/extensions/ReactProseMirror.js +8 -6
- package/dist/cjs/tiptap/extensions/ReactProseMirrorCommands.js +5 -3
- package/dist/cjs/tiptap/extensions/commands/updateAttributes.js +4 -2
- package/dist/cjs/tiptap/hooks/useIsInReactProseMirror.js +5 -3
- package/dist/cjs/tiptap/hooks/useTiptapEditor.js +12 -14
- package/dist/cjs/tiptap/hooks/useTiptapEditorEffect.js +12 -10
- package/dist/cjs/tiptap/hooks/useTiptapEditorEventCallback.js +6 -4
- package/dist/cjs/tiptap/index.js +36 -18
- package/dist/cjs/tiptap/tiptapNodeView.js +48 -62
- package/dist/cjs/viewdesc.js +119 -89
- package/dist/esm/ReactEditorView.js +68 -66
- package/dist/esm/StaticEditorView.js +18 -17
- package/dist/esm/commands/reorderSiblings.js +5 -5
- package/dist/esm/components/ChildNodeViews.js +33 -36
- package/dist/esm/components/CursorWrapper.js +5 -18
- package/dist/esm/components/LayoutGroup.js +1 -1
- package/dist/esm/components/NativeWidgetView.js +2 -2
- package/dist/esm/components/OutputSpec.js +1 -1
- package/dist/esm/components/ProseMirror.js +3 -17
- package/dist/esm/components/ProseMirrorDoc.js +6 -19
- package/dist/esm/components/SeparatorHackView.js +3 -4
- package/dist/esm/components/TextNodeView.js +6 -10
- package/dist/esm/components/TrailingHackView.js +2 -2
- package/dist/esm/components/WidgetView.js +3 -3
- package/dist/esm/components/marks/DefaultMarkView.js +6 -22
- package/dist/esm/components/marks/MarkView.js +11 -24
- package/dist/esm/components/marks/MarkViewConstructorView.js +7 -27
- package/dist/esm/components/marks/ReactMarkView.js +3 -18
- package/dist/esm/components/nodes/DefaultNodeView.js +6 -22
- package/dist/esm/components/nodes/DocNodeView.js +2 -2
- package/dist/esm/components/nodes/NodeView.js +11 -24
- package/dist/esm/components/nodes/NodeViewConstructorView.js +11 -31
- package/dist/esm/components/nodes/ReactNodeView.js +6 -22
- package/dist/esm/decorations/ReactWidgetType.js +10 -8
- package/dist/esm/decorations/iterDeco.js +13 -13
- package/dist/esm/decorations/viewDecorations.js +7 -6
- package/dist/esm/dom.js +1 -2
- package/dist/esm/findDOMNode.js +1 -1
- package/dist/esm/hooks/useComponentEventListeners.js +2 -3
- package/dist/esm/hooks/useEditor.js +5 -9
- package/dist/esm/hooks/useEditorEffect.js +1 -1
- package/dist/esm/hooks/useEditorEventCallback.js +1 -1
- package/dist/esm/hooks/useEditorEventListener.js +1 -1
- package/dist/esm/hooks/useIsEditorStatic.js +1 -3
- package/dist/esm/hooks/useMarkViewDescription.js +14 -10
- package/dist/esm/hooks/useNodeViewDescription.js +10 -8
- package/dist/esm/hooks/useReactKeys.js +1 -1
- package/dist/esm/plugins/beforeInputPlugin.js +12 -17
- package/dist/esm/plugins/reactKeys.js +3 -4
- package/dist/esm/props.js +15 -15
- package/dist/esm/testing/editorViewTestHelpers.js +20 -31
- package/dist/esm/testing/setupProseMirrorView.js +1 -2
- package/dist/esm/tiptap/ReactProseMirrorNodeView.js +7 -5
- package/dist/esm/tiptap/TiptapEditor.js +9 -10
- package/dist/esm/tiptap/TiptapEditorContent.js +4 -18
- package/dist/esm/tiptap/TiptapEditorView.js +8 -23
- package/dist/esm/tiptap/extensions/ReactProseMirror.js +1 -1
- package/dist/esm/tiptap/extensions/commands/updateAttributes.js +1 -1
- package/dist/esm/tiptap/hooks/useTiptapEditor.js +4 -8
- package/dist/esm/tiptap/hooks/useTiptapEditorEffect.js +4 -4
- package/dist/esm/tiptap/hooks/useTiptapEditorEventCallback.js +1 -1
- package/dist/esm/tiptap/tiptapNodeView.js +20 -38
- package/dist/esm/viewdesc.js +74 -66
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/types/constants.d.ts +1 -1
- package/dist/types/props.d.ts +8 -8
- package/package.json +1 -2
|
@@ -4,16 +4,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useIgnoreMutation", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useIgnoreMutation;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
12
|
+
const _IgnoreMutationContext = require("../contexts/IgnoreMutationContext.js");
|
|
13
|
+
const _useEditorEffect = require("./useEditorEffect.js");
|
|
14
|
+
const _useEditorEventCallback = require("./useEditorEventCallback.js");
|
|
13
15
|
function useIgnoreMutation(ignoreMutation) {
|
|
14
|
-
const register = (0, _react.useContext)(
|
|
15
|
-
const ignoreMutationMemo = (0,
|
|
16
|
-
(0,
|
|
16
|
+
const register = (0, _react.useContext)(_IgnoreMutationContext.IgnoreMutationContext);
|
|
17
|
+
const ignoreMutationMemo = (0, _useEditorEventCallback.useEditorEventCallback)(ignoreMutation);
|
|
18
|
+
(0, _useEditorEffect.useEditorEffect)(()=>{
|
|
17
19
|
return register(ignoreMutationMemo);
|
|
18
20
|
}, [
|
|
19
21
|
register,
|
|
@@ -4,12 +4,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useIsEditorStatic", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useIsEditorStatic;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
12
|
+
const _EditorContext = require("../contexts/EditorContext.js");
|
|
11
13
|
function useIsEditorStatic() {
|
|
12
|
-
|
|
13
|
-
var ref1;
|
|
14
|
-
return (ref1 = (ref = (0, _react.useContext)(_editorContextJs.EditorContext)) === null || ref === void 0 ? void 0 : ref.isStatic) !== null && ref1 !== void 0 ? ref1 : false;
|
|
14
|
+
return (0, _react.useContext)(_EditorContext.EditorContext)?.isStatic ?? false;
|
|
15
15
|
}
|
|
@@ -4,13 +4,15 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useIsNodeSelected", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useIsNodeSelected;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
12
|
+
const _useSelectNode = require("./useSelectNode.js");
|
|
11
13
|
function useIsNodeSelected() {
|
|
12
14
|
const [isSelected, setIsSelected] = (0, _react.useState)(false);
|
|
13
|
-
(0,
|
|
15
|
+
(0, _useSelectNode.useSelectNode)(()=>{
|
|
14
16
|
setIsSelected(true);
|
|
15
17
|
}, ()=>{
|
|
16
18
|
setIsSelected(false);
|
|
@@ -4,15 +4,17 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useLayoutGroupEffect", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useLayoutGroupEffect;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
+
const _LayoutGroupContext = require("../contexts/LayoutGroupContext.js");
|
|
13
|
+
const _useClientLayoutEffect = require("./useClientLayoutEffect.js");
|
|
12
14
|
function useLayoutGroupEffect(effect, deps) {
|
|
13
|
-
const register = (0, _react.useContext)(
|
|
15
|
+
const register = (0, _react.useContext)(_LayoutGroupContext.LayoutGroupContext);
|
|
14
16
|
// The rule for hooks wants to statically verify the deps,
|
|
15
17
|
// but the dependencies are up to the caller, not this implementation.
|
|
16
18
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
17
|
-
(0,
|
|
19
|
+
(0, _useClientLayoutEffect.useClientLayoutEffect)(()=>register(effect), deps);
|
|
18
20
|
}
|
|
@@ -4,31 +4,32 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useMarkViewDescription", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useMarkViewDescription;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
12
|
+
const _ReactEditorView = require("../ReactEditorView.js");
|
|
13
|
+
const _ChildDescriptionsContext = require("../contexts/ChildDescriptionsContext.js");
|
|
14
|
+
const _EditorContext = require("../contexts/EditorContext.js");
|
|
15
|
+
const _viewdesc = require("../viewdesc.js");
|
|
16
|
+
const _useClientLayoutEffect = require("./useClientLayoutEffect.js");
|
|
17
|
+
const _useEffectEvent = require("./useEffectEvent.js");
|
|
16
18
|
function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
17
|
-
|
|
18
|
-
const {
|
|
19
|
-
const { parentRef , siblingsRef } = (0, _react.useContext)(_childDescriptionsContextJs.ChildDescriptionsContext);
|
|
19
|
+
const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
|
|
20
|
+
const { parentRef, siblingsRef } = (0, _react.useContext)(_ChildDescriptionsContext.ChildDescriptionsContext);
|
|
20
21
|
const contentDOMRef = (0, _react.useRef)(null);
|
|
21
22
|
const viewDescRef = (0, _react.useRef)();
|
|
22
23
|
const childrenRef = (0, _react.useRef)([]);
|
|
23
|
-
const create = (0,
|
|
24
|
-
if (!(view instanceof
|
|
24
|
+
const create = (0, _useEffectEvent.useEffectEvent)(()=>{
|
|
25
|
+
if (!(view instanceof _ReactEditorView.ReactEditorView)) {
|
|
25
26
|
return;
|
|
26
27
|
}
|
|
27
28
|
const dom = getDOM();
|
|
28
29
|
if (!dom) {
|
|
29
30
|
return;
|
|
30
31
|
}
|
|
31
|
-
const { mark
|
|
32
|
+
const { mark, inline, getPos } = props;
|
|
32
33
|
const markView = constructor(mark, view, inline);
|
|
33
34
|
if (!markView) {
|
|
34
35
|
return;
|
|
@@ -36,12 +37,19 @@ function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
36
37
|
const parent = parentRef.current;
|
|
37
38
|
const children = childrenRef.current;
|
|
38
39
|
const contentDOM = getContentDOM(markView);
|
|
39
|
-
const viewDesc = new
|
|
40
|
+
const viewDesc = new _viewdesc.ReactMarkViewDesc(parent, children, getPos, mark, dom, contentDOM ?? markView.dom, markView);
|
|
41
|
+
// When create() runs after a destroy() (either here in a layout
|
|
42
|
+
// effect or in refUpdated), the inherited children still reference
|
|
43
|
+
// the just-destroyed desc. Re-parent them onto this fresh desc
|
|
44
|
+
// before any other code can observe the stale pointer.
|
|
45
|
+
for (const child of children){
|
|
46
|
+
child.parent = viewDesc;
|
|
47
|
+
}
|
|
40
48
|
contentDOMRef.current = contentDOM;
|
|
41
49
|
return viewDesc;
|
|
42
50
|
});
|
|
43
|
-
const update = (0,
|
|
44
|
-
if (!(view instanceof
|
|
51
|
+
const update = (0, _useEffectEvent.useEffectEvent)(()=>{
|
|
52
|
+
if (!(view instanceof _ReactEditorView.ReactEditorView)) {
|
|
45
53
|
return false;
|
|
46
54
|
}
|
|
47
55
|
const viewDesc = viewDescRef.current;
|
|
@@ -53,14 +61,13 @@ function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
53
61
|
return false;
|
|
54
62
|
}
|
|
55
63
|
const contentDOM = getContentDOM(viewDesc);
|
|
56
|
-
|
|
57
|
-
if (contentDOM !== ((_contentDOM = viewDesc.contentDOM) !== null && _contentDOM !== void 0 ? _contentDOM : dom)) {
|
|
64
|
+
if (contentDOM !== (viewDesc.contentDOM ?? dom)) {
|
|
58
65
|
return false;
|
|
59
66
|
}
|
|
60
|
-
const { mark
|
|
67
|
+
const { mark } = props;
|
|
61
68
|
return viewDesc.matchesMark(mark);
|
|
62
69
|
});
|
|
63
|
-
const destroy = (0,
|
|
70
|
+
const destroy = (0, _useEffectEvent.useEffectEvent)(()=>{
|
|
64
71
|
const viewDesc = viewDescRef.current;
|
|
65
72
|
if (!viewDesc) {
|
|
66
73
|
return;
|
|
@@ -73,7 +80,7 @@ function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
73
80
|
}
|
|
74
81
|
contentDOMRef.current = null;
|
|
75
82
|
});
|
|
76
|
-
(0,
|
|
83
|
+
(0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
|
|
77
84
|
viewDescRef.current = create();
|
|
78
85
|
return ()=>{
|
|
79
86
|
destroy();
|
|
@@ -92,7 +99,7 @@ function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
92
99
|
destroy,
|
|
93
100
|
update
|
|
94
101
|
]);
|
|
95
|
-
(0,
|
|
102
|
+
(0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
|
|
96
103
|
if (!update()) {
|
|
97
104
|
destroy();
|
|
98
105
|
viewDescRef.current = create();
|
|
@@ -108,7 +115,7 @@ function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
108
115
|
if (!siblings.includes(viewDesc)) {
|
|
109
116
|
siblings.push(viewDesc);
|
|
110
117
|
}
|
|
111
|
-
siblings.sort(
|
|
118
|
+
siblings.sort(_viewdesc.sortViewDescs);
|
|
112
119
|
for (const child of children){
|
|
113
120
|
child.parent = viewDesc;
|
|
114
121
|
}
|
|
@@ -120,10 +127,9 @@ function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
120
127
|
childrenRef,
|
|
121
128
|
viewDescRef
|
|
122
129
|
]);
|
|
123
|
-
var _current;
|
|
124
130
|
return {
|
|
125
131
|
childContextValue,
|
|
126
|
-
contentDOM:
|
|
132
|
+
contentDOM: contentDOMRef.current ?? viewDescRef.current?.dom,
|
|
127
133
|
refUpdated
|
|
128
134
|
};
|
|
129
135
|
}
|
|
@@ -4,13 +4,15 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useNodePos", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useNodePos;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
+
const _NodeView = require("../components/nodes/NodeView.js");
|
|
13
|
+
const _useEditorState = require("./useEditorState.js");
|
|
12
14
|
function useNodePos() {
|
|
13
|
-
(0,
|
|
14
|
-
const getPos = (0, _react.useContext)(
|
|
15
|
+
(0, _useEditorState.useEditorState)();
|
|
16
|
+
const getPos = (0, _react.useContext)(_NodeView.GetPosContext);
|
|
15
17
|
return getPos();
|
|
16
18
|
}
|
|
@@ -4,30 +4,32 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useNodeViewDescription", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useNodeViewDescription;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
12
|
+
const _ReactEditorView = require("../ReactEditorView.js");
|
|
13
|
+
const _ChildDescriptionsContext = require("../contexts/ChildDescriptionsContext.js");
|
|
14
|
+
const _EditorContext = require("../contexts/EditorContext.js");
|
|
15
|
+
const _viewdesc = require("../viewdesc.js");
|
|
16
|
+
const _useClientLayoutEffect = require("./useClientLayoutEffect.js");
|
|
17
|
+
const _useEffectEvent = require("./useEffectEvent.js");
|
|
16
18
|
function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
17
|
-
const { view
|
|
18
|
-
const { parentRef
|
|
19
|
+
const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
|
|
20
|
+
const { parentRef, siblingsRef } = (0, _react.useContext)(_ChildDescriptionsContext.ChildDescriptionsContext);
|
|
19
21
|
const contentDOMRef = (0, _react.useRef)(null);
|
|
20
22
|
const viewDescRef = (0, _react.useRef)();
|
|
21
23
|
const childrenRef = (0, _react.useRef)([]);
|
|
22
|
-
const create = (0,
|
|
23
|
-
if (!(view instanceof
|
|
24
|
+
const create = (0, _useEffectEvent.useEffectEvent)(()=>{
|
|
25
|
+
if (!(view instanceof _ReactEditorView.ReactEditorView)) {
|
|
24
26
|
return;
|
|
25
27
|
}
|
|
26
28
|
const dom = getDOM();
|
|
27
29
|
if (!dom) {
|
|
28
30
|
return;
|
|
29
31
|
}
|
|
30
|
-
const { node
|
|
32
|
+
const { node, getPos, decorations, innerDecorations } = props;
|
|
31
33
|
const nodeView = constructor(node, view, getPos, decorations, innerDecorations);
|
|
32
34
|
if (!nodeView) {
|
|
33
35
|
return;
|
|
@@ -36,17 +38,20 @@ function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
36
38
|
const children = childrenRef.current;
|
|
37
39
|
const contentDOM = getContentDOM(nodeView);
|
|
38
40
|
const nodeDOM = nodeView.dom;
|
|
39
|
-
const viewDesc = new
|
|
41
|
+
const viewDesc = new _viewdesc.ReactNodeViewDesc(parent, children, getPos, node, decorations, innerDecorations, dom, contentDOM, nodeDOM, nodeView);
|
|
42
|
+
for (const child of children){
|
|
43
|
+
child.parent = viewDesc;
|
|
44
|
+
}
|
|
40
45
|
const siblings = siblingsRef.current;
|
|
41
46
|
if (!siblings.includes(viewDesc)) {
|
|
42
47
|
siblings.push(viewDesc);
|
|
43
48
|
}
|
|
44
|
-
siblings.sort(
|
|
49
|
+
siblings.sort(_viewdesc.sortViewDescs);
|
|
45
50
|
contentDOMRef.current = getContentDOM(nodeView);
|
|
46
51
|
return viewDesc;
|
|
47
52
|
});
|
|
48
|
-
const update = (0,
|
|
49
|
-
if (!(view instanceof
|
|
53
|
+
const update = (0, _useEffectEvent.useEffectEvent)(()=>{
|
|
54
|
+
if (!(view instanceof _ReactEditorView.ReactEditorView)) {
|
|
50
55
|
return false;
|
|
51
56
|
}
|
|
52
57
|
const viewDesc = viewDescRef.current;
|
|
@@ -64,10 +69,10 @@ function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
64
69
|
if (!dom.contains(viewDesc.nodeDOM)) {
|
|
65
70
|
return false;
|
|
66
71
|
}
|
|
67
|
-
const { node
|
|
72
|
+
const { node, decorations, innerDecorations } = props;
|
|
68
73
|
return viewDesc.matchesNode(node, decorations, innerDecorations) || viewDesc.update(node, decorations, innerDecorations, view);
|
|
69
74
|
});
|
|
70
|
-
const destroy = (0,
|
|
75
|
+
const destroy = (0, _useEffectEvent.useEffectEvent)(()=>{
|
|
71
76
|
const viewDesc = viewDescRef.current;
|
|
72
77
|
if (!viewDesc) {
|
|
73
78
|
return;
|
|
@@ -80,7 +85,7 @@ function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
80
85
|
}
|
|
81
86
|
contentDOMRef.current = null;
|
|
82
87
|
});
|
|
83
|
-
(0,
|
|
88
|
+
(0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
|
|
84
89
|
viewDescRef.current = create();
|
|
85
90
|
return ()=>{
|
|
86
91
|
destroy();
|
|
@@ -100,7 +105,7 @@ function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
100
105
|
destroy,
|
|
101
106
|
update
|
|
102
107
|
]);
|
|
103
|
-
(0,
|
|
108
|
+
(0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
|
|
104
109
|
if (!update()) {
|
|
105
110
|
destroy();
|
|
106
111
|
viewDescRef.current = create();
|
|
@@ -109,7 +114,7 @@ function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
109
114
|
if (!viewDesc) {
|
|
110
115
|
return;
|
|
111
116
|
}
|
|
112
|
-
if (view.dom === viewDesc.dom && view instanceof
|
|
117
|
+
if (view.dom === viewDesc.dom && view instanceof _ReactEditorView.ReactEditorView) {
|
|
113
118
|
view.docView = viewDesc;
|
|
114
119
|
}
|
|
115
120
|
const parent = parentRef.current;
|
|
@@ -125,7 +130,7 @@ function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
125
130
|
// our parent's children, but our parent has no opportunity
|
|
126
131
|
// to sort its children, because it never renders. So
|
|
127
132
|
// we always sort our siblings, too.
|
|
128
|
-
siblings.sort(
|
|
133
|
+
siblings.sort(_viewdesc.sortViewDescs);
|
|
129
134
|
// If a child updates, usually it will re-render and sort
|
|
130
135
|
// our children for us. But it's possible to reorder
|
|
131
136
|
// child nodes without changing their keys or node
|
|
@@ -133,20 +138,19 @@ function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
|
133
138
|
// rerender. As a fallback, we do one last pass through
|
|
134
139
|
// our own child view descriptions and make sure
|
|
135
140
|
// they're ordered. This should be a cheap no-op in most cases.
|
|
136
|
-
children.sort(
|
|
141
|
+
children.sort(_viewdesc.sortViewDescs);
|
|
137
142
|
for (const child of children){
|
|
138
143
|
child.parent = viewDesc;
|
|
139
144
|
// Because TextNodeViews can't locate the DOM nodes
|
|
140
145
|
// for compositions, we need to override them here
|
|
141
|
-
if (child instanceof
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
if (!compositionTopDOM) throw new Error("Started a composition but couldn't find the text node it belongs to.");
|
|
146
|
+
if (child instanceof _viewdesc.CompositionViewDesc) {
|
|
147
|
+
const compositionTopDOM = viewDesc?.contentDOM?.firstChild;
|
|
148
|
+
if (!compositionTopDOM) throw new Error(`Started a composition but couldn't find the text node it belongs to.`);
|
|
145
149
|
let textDOM = compositionTopDOM;
|
|
146
150
|
while(textDOM.firstChild){
|
|
147
151
|
textDOM = textDOM.firstChild;
|
|
148
152
|
}
|
|
149
|
-
if (!textDOM || !(textDOM instanceof Text)) throw new Error(
|
|
153
|
+
if (!textDOM || !(textDOM instanceof Text)) throw new Error(`Started a composition but couldn't find the text node it belongs to.`);
|
|
150
154
|
child.dom = compositionTopDOM;
|
|
151
155
|
child.textDOM = textDOM;
|
|
152
156
|
child.text = textDOM.data;
|
|
@@ -4,12 +4,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useReactKeys", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useReactKeys;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
+
const _EditorContext = require("../contexts/EditorContext.js");
|
|
13
|
+
const _reactKeys = require("../plugins/reactKeys.js");
|
|
12
14
|
function useReactKeys() {
|
|
13
|
-
const { view
|
|
14
|
-
return
|
|
15
|
+
const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
|
|
16
|
+
return _reactKeys.reactKeysPluginKey.getState(view.state);
|
|
15
17
|
}
|
|
@@ -4,21 +4,23 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useSelectNode", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useSelectNode;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
12
|
+
const _SelectNodeContext = require("../contexts/SelectNodeContext.js");
|
|
13
|
+
const _useEditorEffect = require("./useEditorEffect.js");
|
|
14
|
+
const _useEditorEventCallback = require("./useEditorEventCallback.js");
|
|
13
15
|
function noop() {
|
|
14
16
|
// empty
|
|
15
17
|
}
|
|
16
18
|
function useSelectNode(selectNode) {
|
|
17
19
|
let deselectNode = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : noop;
|
|
18
|
-
const register = (0, _react.useContext)(
|
|
19
|
-
const selectNodeMemo = (0,
|
|
20
|
-
const deselectNodeMemo = (0,
|
|
21
|
-
return (0,
|
|
20
|
+
const register = (0, _react.useContext)(_SelectNodeContext.SelectNodeContext);
|
|
21
|
+
const selectNodeMemo = (0, _useEditorEventCallback.useEditorEventCallback)(selectNode);
|
|
22
|
+
const deselectNodeMemo = (0, _useEditorEventCallback.useEditorEventCallback)(deselectNode);
|
|
23
|
+
return (0, _useEditorEffect.useEditorEffect)(()=>{
|
|
22
24
|
return register(selectNodeMemo, deselectNodeMemo);
|
|
23
25
|
}, [
|
|
24
26
|
register,
|
|
@@ -4,16 +4,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
Object.defineProperty(exports, "useStopEvent", {
|
|
6
6
|
enumerable: true,
|
|
7
|
-
get: ()
|
|
7
|
+
get: function() {
|
|
8
|
+
return useStopEvent;
|
|
9
|
+
}
|
|
8
10
|
});
|
|
9
11
|
const _react = require("react");
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
12
|
+
const _StopEventContext = require("../contexts/StopEventContext.js");
|
|
13
|
+
const _useEditorEffect = require("./useEditorEffect.js");
|
|
14
|
+
const _useEditorEventCallback = require("./useEditorEventCallback.js");
|
|
13
15
|
function useStopEvent(stopEvent) {
|
|
14
|
-
const register = (0, _react.useContext)(
|
|
15
|
-
const stopEventMemo = (0,
|
|
16
|
-
(0,
|
|
16
|
+
const register = (0, _react.useContext)(_StopEventContext.StopEventContext);
|
|
17
|
+
const stopEventMemo = (0, _useEditorEventCallback.useEditorEventCallback)(stopEvent);
|
|
18
|
+
(0, _useEditorEffect.useEditorEffect)(()=>{
|
|
17
19
|
return register(stopEventMemo);
|
|
18
20
|
}, [
|
|
19
21
|
register,
|
package/dist/cjs/index.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
/* Copyright (c) The New York Times Company */ "use
|
|
1
|
+
/* Copyright (c) The New York Times Company */ "use client";
|
|
2
|
+
"use strict";
|
|
2
3
|
Object.defineProperty(exports, "__esModule", {
|
|
3
4
|
value: true
|
|
4
5
|
});
|
|
@@ -9,37 +10,68 @@ function _export(target, all) {
|
|
|
9
10
|
});
|
|
10
11
|
}
|
|
11
12
|
_export(exports, {
|
|
12
|
-
ProseMirror: ()
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
13
|
+
ProseMirror: function() {
|
|
14
|
+
return _ProseMirror.ProseMirror;
|
|
15
|
+
},
|
|
16
|
+
ProseMirrorDoc: function() {
|
|
17
|
+
return _ProseMirrorDoc.ProseMirrorDoc;
|
|
18
|
+
},
|
|
19
|
+
reactKeys: function() {
|
|
20
|
+
return _reactKeys.reactKeys;
|
|
21
|
+
},
|
|
22
|
+
reorderSiblings: function() {
|
|
23
|
+
return _reorderSiblings.reorderSiblings;
|
|
24
|
+
},
|
|
25
|
+
useEditorEffect: function() {
|
|
26
|
+
return _useEditorEffect.useEditorEffect;
|
|
27
|
+
},
|
|
28
|
+
useEditorEventCallback: function() {
|
|
29
|
+
return _useEditorEventCallback.useEditorEventCallback;
|
|
30
|
+
},
|
|
31
|
+
useEditorEventListener: function() {
|
|
32
|
+
return _useEditorEventListener.useEditorEventListener;
|
|
33
|
+
},
|
|
34
|
+
useEditorState: function() {
|
|
35
|
+
return _useEditorState.useEditorState;
|
|
36
|
+
},
|
|
37
|
+
useIgnoreMutation: function() {
|
|
38
|
+
return _useIgnoreMutation.useIgnoreMutation;
|
|
39
|
+
},
|
|
40
|
+
useIsEditorStatic: function() {
|
|
41
|
+
return _useIsEditorStatic.useIsEditorStatic;
|
|
42
|
+
},
|
|
43
|
+
useIsNodeSelected: function() {
|
|
44
|
+
return _useIsNodeSelected.useIsNodeSelected;
|
|
45
|
+
},
|
|
46
|
+
useMergedDOMRefs: function() {
|
|
47
|
+
return _refs.useMergedDOMRefs;
|
|
48
|
+
},
|
|
49
|
+
useNodePos: function() {
|
|
50
|
+
return _useNodePos.useNodePos;
|
|
51
|
+
},
|
|
52
|
+
useSelectNode: function() {
|
|
53
|
+
return _useSelectNode.useSelectNode;
|
|
54
|
+
},
|
|
55
|
+
useStopEvent: function() {
|
|
56
|
+
return _useStopEvent.useStopEvent;
|
|
57
|
+
},
|
|
58
|
+
widget: function() {
|
|
59
|
+
return _ReactWidgetType.widget;
|
|
60
|
+
}
|
|
28
61
|
});
|
|
29
|
-
const
|
|
30
|
-
const
|
|
31
|
-
const
|
|
32
|
-
const
|
|
33
|
-
const
|
|
34
|
-
const
|
|
35
|
-
const
|
|
36
|
-
const
|
|
37
|
-
const
|
|
38
|
-
const
|
|
39
|
-
const
|
|
40
|
-
const
|
|
41
|
-
const
|
|
42
|
-
const
|
|
43
|
-
const
|
|
44
|
-
const
|
|
45
|
-
"use client";
|
|
62
|
+
const _ProseMirror = require("./components/ProseMirror.js");
|
|
63
|
+
const _ProseMirrorDoc = require("./components/ProseMirrorDoc.js");
|
|
64
|
+
const _reorderSiblings = require("./commands/reorderSiblings.js");
|
|
65
|
+
const _useEditorEffect = require("./hooks/useEditorEffect.js");
|
|
66
|
+
const _useEditorEventCallback = require("./hooks/useEditorEventCallback.js");
|
|
67
|
+
const _useEditorEventListener = require("./hooks/useEditorEventListener.js");
|
|
68
|
+
const _useEditorState = require("./hooks/useEditorState.js");
|
|
69
|
+
const _useNodePos = require("./hooks/useNodePos.js");
|
|
70
|
+
const _useStopEvent = require("./hooks/useStopEvent.js");
|
|
71
|
+
const _useSelectNode = require("./hooks/useSelectNode.js");
|
|
72
|
+
const _useIgnoreMutation = require("./hooks/useIgnoreMutation.js");
|
|
73
|
+
const _useIsEditorStatic = require("./hooks/useIsEditorStatic.js");
|
|
74
|
+
const _useIsNodeSelected = require("./hooks/useIsNodeSelected.js");
|
|
75
|
+
const _reactKeys = require("./plugins/reactKeys.js");
|
|
76
|
+
const _ReactWidgetType = require("./decorations/ReactWidgetType.js");
|
|
77
|
+
const _refs = require("./refs.js");
|