@handlewithcare/react-prosemirror 3.1.0-tiptap.40 → 3.1.0-tiptap.42
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 +2 -2
- package/dist/cjs/ReactEditorView.js +71 -75
- package/dist/cjs/StaticEditorView.js +19 -22
- package/dist/cjs/browser.js +1 -3
- package/dist/cjs/commands/reorderSiblings.js +9 -13
- package/dist/cjs/components/ChildNodeViews.js +68 -71
- package/dist/cjs/components/CursorWrapper.js +26 -17
- package/dist/cjs/components/LayoutGroup.js +12 -16
- package/dist/cjs/components/NativeWidgetView.js +15 -19
- package/dist/cjs/components/OutputSpec.js +9 -13
- package/dist/cjs/components/ProseMirror.js +37 -27
- package/dist/cjs/components/ProseMirrorDoc.js +25 -18
- package/dist/cjs/components/SeparatorHackView.js +20 -21
- package/dist/cjs/components/TextNodeView.js +22 -20
- package/dist/cjs/components/TrailingHackView.js +13 -17
- package/dist/cjs/components/WidgetView.js +14 -18
- package/dist/cjs/components/marks/DefaultMarkView.js +27 -15
- package/dist/cjs/components/marks/MarkView.js +32 -23
- package/dist/cjs/components/marks/MarkViewConstructorView.js +38 -22
- package/dist/cjs/components/marks/ReactMarkView.js +27 -16
- package/dist/cjs/components/nodes/DefaultNodeView.js +27 -15
- package/dist/cjs/components/nodes/DocNodeView.js +12 -16
- package/dist/cjs/components/nodes/NodeView.js +33 -26
- package/dist/cjs/components/nodes/NodeViewConstructorView.js +45 -29
- package/dist/cjs/components/nodes/ReactNodeView.js +39 -27
- package/dist/cjs/constants.js +6 -10
- package/dist/cjs/contexts/ChildDescriptionsContext.js +1 -3
- package/dist/cjs/contexts/EditorContext.js +1 -3
- package/dist/cjs/contexts/EditorStateContext.js +1 -3
- package/dist/cjs/contexts/IgnoreMutationContext.js +1 -3
- package/dist/cjs/contexts/LayoutGroupContext.js +1 -3
- package/dist/cjs/contexts/NodeViewContext.js +1 -3
- package/dist/cjs/contexts/SelectNodeContext.js +1 -3
- package/dist/cjs/contexts/StopEventContext.js +1 -3
- package/dist/cjs/decorations/ReactWidgetType.js +13 -19
- package/dist/cjs/decorations/computeDocDeco.js +3 -5
- package/dist/cjs/decorations/iterDeco.js +17 -19
- package/dist/cjs/decorations/viewDecorations.js +12 -15
- package/dist/cjs/dom.js +13 -34
- package/dist/cjs/findDOMNode.js +5 -9
- package/dist/cjs/hooks/useClientLayoutEffect.js +1 -3
- package/dist/cjs/hooks/useComponentEventListeners.js +6 -7
- package/dist/cjs/hooks/useEditor.js +30 -28
- package/dist/cjs/hooks/useEditorEffect.js +7 -9
- package/dist/cjs/hooks/useEditorEventCallback.js +7 -9
- package/dist/cjs/hooks/useEditorEventListener.js +6 -8
- package/dist/cjs/hooks/useEditorState.js +3 -5
- package/dist/cjs/hooks/useEffectEvent.js +1 -3
- package/dist/cjs/hooks/useForceUpdate.js +1 -3
- package/dist/cjs/hooks/useIgnoreMutation.js +7 -9
- package/dist/cjs/hooks/useIsEditorStatic.js +5 -5
- package/dist/cjs/hooks/useIsNodeSelected.js +3 -5
- package/dist/cjs/hooks/useLayoutGroupEffect.js +5 -7
- package/dist/cjs/hooks/useMarkViewDescription.js +25 -24
- package/dist/cjs/hooks/useNodePos.js +5 -7
- package/dist/cjs/hooks/useNodeViewDescription.js +41 -28
- package/dist/cjs/hooks/useReactKeys.js +5 -7
- package/dist/cjs/hooks/useSelectNode.js +8 -10
- package/dist/cjs/hooks/useStopEvent.js +7 -9
- package/dist/cjs/index.js +34 -66
- package/dist/cjs/plugins/beforeInputPlugin.js +23 -20
- package/dist/cjs/plugins/componentEventListeners.js +6 -8
- package/dist/cjs/plugins/componentEventListenersPlugin.js +6 -8
- package/dist/cjs/plugins/reactKeys.js +10 -15
- package/dist/cjs/props.js +19 -23
- package/dist/cjs/refs.js +1 -3
- package/dist/cjs/testing/editorViewTestHelpers.js +47 -40
- package/dist/cjs/testing/setupProseMirrorView.js +4 -7
- package/dist/cjs/tiptap/ReactProseMirrorNodeView.js +6 -10
- package/dist/cjs/tiptap/TiptapEditor.js +14 -15
- package/dist/cjs/tiptap/TiptapEditorContent.js +28 -18
- package/dist/cjs/tiptap/TiptapEditorView.js +34 -23
- package/dist/cjs/tiptap/contexts/TiptapEditorContext.js +1 -3
- package/dist/cjs/tiptap/extensions/ReactProseMirror.js +6 -8
- package/dist/cjs/tiptap/extensions/ReactProseMirrorCommands.js +3 -5
- package/dist/cjs/tiptap/extensions/commands/updateAttributes.js +2 -4
- package/dist/cjs/tiptap/hooks/useIsInReactProseMirror.js +3 -5
- package/dist/cjs/tiptap/hooks/useTiptapEditor.js +14 -12
- package/dist/cjs/tiptap/hooks/useTiptapEditorEffect.js +10 -12
- package/dist/cjs/tiptap/hooks/useTiptapEditorEventCallback.js +4 -6
- package/dist/cjs/tiptap/index.js +18 -36
- package/dist/cjs/tiptap/tiptapNodeView.js +62 -48
- package/dist/cjs/viewdesc.js +95 -119
- package/dist/esm/ReactEditorView.js +67 -69
- package/dist/esm/StaticEditorView.js +18 -19
- package/dist/esm/commands/reorderSiblings.js +5 -5
- package/dist/esm/components/ChildNodeViews.js +36 -33
- package/dist/esm/components/CursorWrapper.js +18 -5
- 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 +17 -3
- package/dist/esm/components/ProseMirrorDoc.js +19 -6
- package/dist/esm/components/SeparatorHackView.js +8 -5
- package/dist/esm/components/TextNodeView.js +10 -6
- package/dist/esm/components/TrailingHackView.js +2 -2
- package/dist/esm/components/WidgetView.js +3 -3
- package/dist/esm/components/marks/DefaultMarkView.js +22 -6
- package/dist/esm/components/marks/MarkView.js +24 -11
- package/dist/esm/components/marks/MarkViewConstructorView.js +27 -7
- package/dist/esm/components/marks/ReactMarkView.js +18 -3
- package/dist/esm/components/nodes/DefaultNodeView.js +22 -6
- package/dist/esm/components/nodes/DocNodeView.js +2 -2
- package/dist/esm/components/nodes/NodeView.js +24 -11
- package/dist/esm/components/nodes/NodeViewConstructorView.js +31 -11
- package/dist/esm/components/nodes/ReactNodeView.js +22 -6
- package/dist/esm/decorations/ReactWidgetType.js +8 -10
- package/dist/esm/decorations/iterDeco.js +13 -13
- package/dist/esm/decorations/viewDecorations.js +6 -7
- package/dist/esm/dom.js +2 -1
- package/dist/esm/findDOMNode.js +1 -1
- package/dist/esm/hooks/useComponentEventListeners.js +3 -2
- package/dist/esm/hooks/useEditor.js +9 -5
- 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 +3 -1
- package/dist/esm/hooks/useMarkViewDescription.js +10 -7
- package/dist/esm/hooks/useNodeViewDescription.js +22 -7
- package/dist/esm/hooks/useReactKeys.js +1 -1
- package/dist/esm/plugins/beforeInputPlugin.js +17 -12
- package/dist/esm/plugins/reactKeys.js +4 -3
- package/dist/esm/props.js +15 -15
- package/dist/esm/testing/editorViewTestHelpers.js +31 -20
- package/dist/esm/testing/setupProseMirrorView.js +2 -1
- package/dist/esm/tiptap/ReactProseMirrorNodeView.js +5 -7
- package/dist/esm/tiptap/TiptapEditor.js +10 -9
- package/dist/esm/tiptap/TiptapEditorContent.js +18 -4
- package/dist/esm/tiptap/TiptapEditorView.js +23 -8
- 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 +8 -4
- package/dist/esm/tiptap/hooks/useTiptapEditorEffect.js +4 -4
- package/dist/esm/tiptap/hooks/useTiptapEditorEventCallback.js +1 -1
- package/dist/esm/tiptap/tiptapNodeView.js +38 -20
- package/dist/esm/viewdesc.js +72 -74
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/types/ReactEditorView.d.ts +2 -2
- package/dist/types/StaticEditorView.d.ts +2 -1
- package/dist/types/props.d.ts +26 -26
- package/dist/types/viewdesc.d.ts +2 -0
- package/package.json +10 -6
|
@@ -43,41 +43,41 @@ onWidget, onNode) {
|
|
|
43
43
|
if (widget) {
|
|
44
44
|
if (widgets) {
|
|
45
45
|
widgets.sort(compareSide);
|
|
46
|
-
for(let
|
|
47
|
-
!(widgets[
|
|
46
|
+
for(let i1 = 0; i1 < widgets.length; i1++)onWidget(widgets[i1], // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
47
|
+
!(widgets[i1].type instanceof ReactWidgetType), offset, parentIndex + i1, !!restNode);
|
|
48
48
|
} else {
|
|
49
49
|
onWidget(widget, // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
50
50
|
!(widget.type instanceof ReactWidgetType), offset, parentIndex, !!restNode);
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
53
|
}
|
|
54
|
-
let
|
|
54
|
+
let child1, index;
|
|
55
55
|
if (restNode) {
|
|
56
56
|
index = -1;
|
|
57
|
-
|
|
57
|
+
child1 = restNode;
|
|
58
58
|
restNode = null;
|
|
59
59
|
} else if (parentIndex < parent.childCount) {
|
|
60
60
|
index = parentIndex;
|
|
61
|
-
|
|
61
|
+
child1 = parent.child(parentIndex++);
|
|
62
62
|
} else {
|
|
63
63
|
break;
|
|
64
64
|
}
|
|
65
|
-
for(let
|
|
65
|
+
for(let i2 = 0; i2 < active.length; i2++)if (active[i2].to <= offset) active.splice(i2--, 1);
|
|
66
66
|
while(decoIndex < locals.length && locals[decoIndex].from <= offset && locals[decoIndex].to > offset)active.push(locals[decoIndex++]);
|
|
67
|
-
let end = offset +
|
|
68
|
-
if (
|
|
67
|
+
let end = offset + child1.nodeSize;
|
|
68
|
+
if (child1.isText) {
|
|
69
69
|
let cutAt = end;
|
|
70
70
|
if (decoIndex < locals.length && locals[decoIndex].from < cutAt) cutAt = locals[decoIndex].from;
|
|
71
|
-
for(let
|
|
71
|
+
for(let i3 = 0; i3 < active.length; i3++)if (active[i3].to < cutAt) cutAt = active[i3].to;
|
|
72
72
|
if (cutAt < end) {
|
|
73
|
-
restNode =
|
|
74
|
-
|
|
73
|
+
restNode = child1.cut(cutAt - offset);
|
|
74
|
+
child1 = child1.cut(0, cutAt - offset);
|
|
75
75
|
end = cutAt;
|
|
76
76
|
index = -1;
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
|
-
const outerDeco =
|
|
80
|
-
onNode(
|
|
79
|
+
const outerDeco = child1.isInline && !child1.isLeaf ? active.filter((d)=>!d.inline) : active.slice();
|
|
80
|
+
onNode(child1, outerDeco, deco.forChild(offset, child1), offset, index);
|
|
81
81
|
offset = end;
|
|
82
82
|
}
|
|
83
83
|
}
|
|
@@ -6,10 +6,6 @@ const empty = DecorationSet.empty;
|
|
|
6
6
|
// treat multiple DecorationSet objects as if it were a single object
|
|
7
7
|
// with (a subset of) the same interface.
|
|
8
8
|
let DecorationGroup = class DecorationGroup {
|
|
9
|
-
members;
|
|
10
|
-
constructor(members){
|
|
11
|
-
this.members = members;
|
|
12
|
-
}
|
|
13
9
|
map(mapping, doc) {
|
|
14
10
|
const mappedDecos = this.members.map((member)=>member.map(mapping, doc, noSpec));
|
|
15
11
|
return DecorationGroup.from(mappedDecos);
|
|
@@ -65,6 +61,9 @@ let DecorationGroup = class DecorationGroup {
|
|
|
65
61
|
for(let i = 0; i < this.members.length; i++)// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
66
62
|
this.members[i].forEachSet(f);
|
|
67
63
|
}
|
|
64
|
+
constructor(members){
|
|
65
|
+
this.members = members;
|
|
66
|
+
}
|
|
68
67
|
};
|
|
69
68
|
// Used to sort decorations so that ones with a low start position
|
|
70
69
|
// come first, and within a set with the same start position, those
|
|
@@ -152,9 +151,9 @@ const ViewDecorationsCache = new WeakMap();
|
|
|
152
151
|
areSetsEqual = false;
|
|
153
152
|
}
|
|
154
153
|
if (!areSetsEqual) {
|
|
155
|
-
const
|
|
156
|
-
ViewDecorationsCache.set(view,
|
|
157
|
-
return
|
|
154
|
+
const result1 = DecorationGroup.from(found);
|
|
155
|
+
ViewDecorationsCache.set(view, result1);
|
|
156
|
+
return result1;
|
|
158
157
|
}
|
|
159
158
|
return previous;
|
|
160
159
|
}
|
package/dist/esm/dom.js
CHANGED
|
@@ -36,7 +36,8 @@ function scanFor(node, off, targetNode, targetOff, dir) {
|
|
|
36
36
|
} else if (node.nodeType == 1) {
|
|
37
37
|
const child = node.childNodes[off + (dir < 0 ? -1 : 0)];
|
|
38
38
|
if (child.nodeType == 1 && child.contentEditable == "false") {
|
|
39
|
-
|
|
39
|
+
var ref;
|
|
40
|
+
if ((ref = child.pmViewDesc) === null || ref === void 0 ? void 0 : ref.ignoreForSelection) off += dir;
|
|
40
41
|
else return false;
|
|
41
42
|
} else {
|
|
42
43
|
node = child;
|
package/dist/esm/findDOMNode.js
CHANGED
|
@@ -16,7 +16,7 @@ function findHostInstance(component) {
|
|
|
16
16
|
throw new Error("Unable to find node on an unmounted component.");
|
|
17
17
|
} else {
|
|
18
18
|
const keys = Object.keys(component).join(",");
|
|
19
|
-
throw new Error(
|
|
19
|
+
throw new Error("Argument appears to not be a ReactComponent. Keys: ".concat(keys));
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
const hostFiber = findCurrentHostFiber(fiber);
|
|
@@ -28,7 +28,8 @@ import { componentEventListeners } from "../plugins/componentEventListeners.js";
|
|
|
28
28
|
*/ export function useComponentEventListeners() {
|
|
29
29
|
const [registry, setRegistry] = useState(new Map());
|
|
30
30
|
const registerEventListener = useCallback((eventType, handler)=>{
|
|
31
|
-
|
|
31
|
+
var ref;
|
|
32
|
+
const handlers = (ref = registry.get(eventType)) !== null && ref !== void 0 ? ref : [];
|
|
32
33
|
handlers.unshift(handler);
|
|
33
34
|
if (!registry.has(eventType)) {
|
|
34
35
|
registry.set(eventType, handlers);
|
|
@@ -39,7 +40,7 @@ import { componentEventListeners } from "../plugins/componentEventListeners.js";
|
|
|
39
40
|
]);
|
|
40
41
|
const unregisterEventListener = useCallback((eventType, handler)=>{
|
|
41
42
|
const handlers = registry.get(eventType);
|
|
42
|
-
handlers
|
|
43
|
+
handlers === null || handlers === void 0 ? void 0 : handlers.splice(handlers.indexOf(handler), 1);
|
|
43
44
|
}, [
|
|
44
45
|
registry
|
|
45
46
|
]);
|
|
@@ -27,17 +27,20 @@ let didWarnValueDefaultValue = false;
|
|
|
27
27
|
const flushSyncRef = useRef(true);
|
|
28
28
|
const [cursorWrapper, _setCursorWrapper] = useState(null);
|
|
29
29
|
const forceUpdate = useForceUpdate();
|
|
30
|
-
|
|
30
|
+
var _defaultState;
|
|
31
|
+
const defaultState = (_defaultState = options.defaultState) !== null && _defaultState !== void 0 ? _defaultState : EMPTY_STATE;
|
|
31
32
|
const [_state, setState] = useState(defaultState);
|
|
32
|
-
|
|
33
|
-
const
|
|
33
|
+
var _state1;
|
|
34
|
+
const state = (_state1 = options.state) !== null && _state1 !== void 0 ? _state1 : _state;
|
|
35
|
+
const { componentEventListenersPlugin , registerEventListener , unregisterEventListener } = useComponentEventListeners();
|
|
34
36
|
const setCursorWrapper = useCallback((deco)=>{
|
|
35
37
|
flushSync(()=>{
|
|
36
38
|
_setCursorWrapper(deco);
|
|
37
39
|
});
|
|
38
40
|
}, []);
|
|
41
|
+
var _plugins;
|
|
39
42
|
const plugins = useMemo(()=>[
|
|
40
|
-
...options.plugins
|
|
43
|
+
...(_plugins = options.plugins) !== null && _plugins !== void 0 ? _plugins : [],
|
|
41
44
|
componentEventListenersPlugin,
|
|
42
45
|
beforeInputPlugin(setCursorWrapper)
|
|
43
46
|
], [
|
|
@@ -109,13 +112,14 @@ let didWarnValueDefaultValue = false;
|
|
|
109
112
|
}
|
|
110
113
|
});
|
|
111
114
|
view.update(directEditorProps);
|
|
115
|
+
var _static;
|
|
112
116
|
const editor = useMemo(()=>({
|
|
113
117
|
view,
|
|
114
118
|
cursorWrapper,
|
|
115
119
|
flushSyncRef,
|
|
116
120
|
registerEventListener,
|
|
117
121
|
unregisterEventListener,
|
|
118
|
-
isStatic: options.static
|
|
122
|
+
isStatic: (_static = options.static) !== null && _static !== void 0 ? _static : false
|
|
119
123
|
}), [
|
|
120
124
|
cursorWrapper,
|
|
121
125
|
options.static,
|
|
@@ -20,7 +20,7 @@ import { useLayoutGroupEffect } from "./useLayoutGroupEffect.js";
|
|
|
20
20
|
* as a child of the TiptapEditorView component, including
|
|
21
21
|
* React node view components.
|
|
22
22
|
*/ export function useEditorEffect(effect, dependencies) {
|
|
23
|
-
const { view, flushSyncRef
|
|
23
|
+
const { view , flushSyncRef } = useContext(EditorContext);
|
|
24
24
|
// The rules of hooks want `effect` to be included in the
|
|
25
25
|
// dependency list, but dependency issues for `effect` will
|
|
26
26
|
// be caught by the linter at the call-site for
|
|
@@ -20,7 +20,7 @@ function assertIsReactEditorView(view) {
|
|
|
20
20
|
* React node view components.
|
|
21
21
|
*/ export function useEditorEventCallback(callback) {
|
|
22
22
|
const ref = useRef(callback);
|
|
23
|
-
const { view
|
|
23
|
+
const { view } = useContext(EditorContext);
|
|
24
24
|
useEditorEffect(()=>{
|
|
25
25
|
ref.current = callback;
|
|
26
26
|
}, [
|
|
@@ -6,7 +6,7 @@ import { useEditorEffect } from "./useEditorEffect.js";
|
|
|
6
6
|
* [the ProseMirror docs](https://prosemirror.net/docs/ref/#view.EditorProps.handleDOMEvents)
|
|
7
7
|
* for more details.
|
|
8
8
|
*/ export function useEditorEventListener(eventType, handler) {
|
|
9
|
-
const { registerEventListener, unregisterEventListener
|
|
9
|
+
const { registerEventListener , unregisterEventListener } = useContext(EditorContext);
|
|
10
10
|
const ref = useRef(handler);
|
|
11
11
|
useEditorEffect(()=>{
|
|
12
12
|
ref.current = handler;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { useContext } from "react";
|
|
2
2
|
import { EditorContext } from "../contexts/EditorContext.js";
|
|
3
3
|
export function useIsEditorStatic() {
|
|
4
|
-
|
|
4
|
+
var ref;
|
|
5
|
+
var ref1;
|
|
6
|
+
return (ref1 = (ref = useContext(EditorContext)) === null || ref === void 0 ? void 0 : ref.isStatic) !== null && ref1 !== void 0 ? ref1 : false;
|
|
5
7
|
}
|
|
@@ -6,8 +6,9 @@ import { ReactMarkViewDesc, sortViewDescs } from "../viewdesc.js";
|
|
|
6
6
|
import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
|
|
7
7
|
import { useEffectEvent } from "./useEffectEvent.js";
|
|
8
8
|
export function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
9
|
-
|
|
10
|
-
const {
|
|
9
|
+
var ref;
|
|
10
|
+
const { view } = useContext(EditorContext);
|
|
11
|
+
const { parentRef , siblingsRef } = useContext(ChildDescriptionsContext);
|
|
11
12
|
const contentDOMRef = useRef(null);
|
|
12
13
|
const viewDescRef = useRef();
|
|
13
14
|
const childrenRef = useRef([]);
|
|
@@ -19,7 +20,7 @@ export function useMarkViewDescription(getDOM, getContentDOM, constructor, props
|
|
|
19
20
|
if (!dom) {
|
|
20
21
|
return;
|
|
21
22
|
}
|
|
22
|
-
const { mark, inline, getPos
|
|
23
|
+
const { mark , inline , getPos } = props;
|
|
23
24
|
const markView = constructor(mark, view, inline);
|
|
24
25
|
if (!markView) {
|
|
25
26
|
return;
|
|
@@ -27,7 +28,7 @@ export function useMarkViewDescription(getDOM, getContentDOM, constructor, props
|
|
|
27
28
|
const parent = parentRef.current;
|
|
28
29
|
const children = childrenRef.current;
|
|
29
30
|
const contentDOM = getContentDOM(markView);
|
|
30
|
-
const viewDesc = new ReactMarkViewDesc(parent, children, getPos, mark, dom, contentDOM
|
|
31
|
+
const viewDesc = new ReactMarkViewDesc(parent, children, getPos, mark, dom, contentDOM !== null && contentDOM !== void 0 ? contentDOM : markView.dom, markView);
|
|
31
32
|
contentDOMRef.current = contentDOM;
|
|
32
33
|
return viewDesc;
|
|
33
34
|
});
|
|
@@ -44,10 +45,11 @@ export function useMarkViewDescription(getDOM, getContentDOM, constructor, props
|
|
|
44
45
|
return false;
|
|
45
46
|
}
|
|
46
47
|
const contentDOM = getContentDOM(viewDesc);
|
|
47
|
-
|
|
48
|
+
var _contentDOM;
|
|
49
|
+
if (contentDOM !== ((_contentDOM = viewDesc.contentDOM) !== null && _contentDOM !== void 0 ? _contentDOM : dom)) {
|
|
48
50
|
return false;
|
|
49
51
|
}
|
|
50
|
-
const { mark
|
|
52
|
+
const { mark } = props;
|
|
51
53
|
return viewDesc.matchesMark(mark);
|
|
52
54
|
});
|
|
53
55
|
const destroy = useEffectEvent(()=>{
|
|
@@ -110,9 +112,10 @@ export function useMarkViewDescription(getDOM, getContentDOM, constructor, props
|
|
|
110
112
|
childrenRef,
|
|
111
113
|
viewDescRef
|
|
112
114
|
]);
|
|
115
|
+
var _current;
|
|
113
116
|
return {
|
|
114
117
|
childContextValue,
|
|
115
|
-
contentDOM: contentDOMRef.current
|
|
118
|
+
contentDOM: (_current = contentDOMRef.current) !== null && _current !== void 0 ? _current : (ref = viewDescRef.current) === null || ref === void 0 ? void 0 : ref.dom,
|
|
116
119
|
refUpdated
|
|
117
120
|
};
|
|
118
121
|
}
|
|
@@ -6,8 +6,8 @@ import { CompositionViewDesc, ReactNodeViewDesc, sortViewDescs } from "../viewde
|
|
|
6
6
|
import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
|
|
7
7
|
import { useEffectEvent } from "./useEffectEvent.js";
|
|
8
8
|
export function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
|
|
9
|
-
const { view
|
|
10
|
-
const { parentRef, siblingsRef
|
|
9
|
+
const { view } = useContext(EditorContext);
|
|
10
|
+
const { parentRef , siblingsRef } = useContext(ChildDescriptionsContext);
|
|
11
11
|
const contentDOMRef = useRef(null);
|
|
12
12
|
const viewDescRef = useRef();
|
|
13
13
|
const childrenRef = useRef([]);
|
|
@@ -19,7 +19,7 @@ export function useNodeViewDescription(getDOM, getContentDOM, constructor, props
|
|
|
19
19
|
if (!dom) {
|
|
20
20
|
return;
|
|
21
21
|
}
|
|
22
|
-
const { node, getPos, decorations, innerDecorations
|
|
22
|
+
const { node , getPos , decorations , innerDecorations } = props;
|
|
23
23
|
const nodeView = constructor(node, view, getPos, decorations, innerDecorations);
|
|
24
24
|
if (!nodeView) {
|
|
25
25
|
return;
|
|
@@ -56,7 +56,7 @@ export function useNodeViewDescription(getDOM, getContentDOM, constructor, props
|
|
|
56
56
|
if (!dom.contains(viewDesc.nodeDOM)) {
|
|
57
57
|
return false;
|
|
58
58
|
}
|
|
59
|
-
const { node, decorations, innerDecorations
|
|
59
|
+
const { node , decorations , innerDecorations } = props;
|
|
60
60
|
return viewDesc.matchesNode(node, decorations, innerDecorations) || viewDesc.update(node, decorations, innerDecorations, view);
|
|
61
61
|
});
|
|
62
62
|
const destroy = useEffectEvent(()=>{
|
|
@@ -111,19 +111,34 @@ export function useNodeViewDescription(getDOM, getContentDOM, constructor, props
|
|
|
111
111
|
if (!siblings.includes(viewDesc)) {
|
|
112
112
|
siblings.push(viewDesc);
|
|
113
113
|
}
|
|
114
|
+
// In strict/concurrent mode, a node can sometimes re-render
|
|
115
|
+
// entirely on its own, without even its parent re-rendering.
|
|
116
|
+
// In this case, we will have added our view descriptions to
|
|
117
|
+
// our parent's children, but our parent has no opportunity
|
|
118
|
+
// to sort its children, because it never renders. So
|
|
119
|
+
// we always sort our siblings, too.
|
|
114
120
|
siblings.sort(sortViewDescs);
|
|
121
|
+
// If a child updates, usually it will re-render and sort
|
|
122
|
+
// our children for us. But it's possible to reorder
|
|
123
|
+
// child nodes without changing their keys or node
|
|
124
|
+
// instances, in which case our children _won't_
|
|
125
|
+
// rerender. As a fallback, we do one last pass through
|
|
126
|
+
// our own child view descriptions and make sure
|
|
127
|
+
// they're ordered. This should be a cheap no-op in most cases.
|
|
128
|
+
children.sort(sortViewDescs);
|
|
115
129
|
for (const child of children){
|
|
116
130
|
child.parent = viewDesc;
|
|
117
131
|
// Because TextNodeViews can't locate the DOM nodes
|
|
118
132
|
// for compositions, we need to override them here
|
|
119
133
|
if (child instanceof CompositionViewDesc) {
|
|
120
|
-
|
|
121
|
-
|
|
134
|
+
var ref;
|
|
135
|
+
const compositionTopDOM = viewDesc === null || viewDesc === void 0 ? void 0 : (ref = viewDesc.contentDOM) === null || ref === void 0 ? void 0 : ref.firstChild;
|
|
136
|
+
if (!compositionTopDOM) throw new Error("Started a composition but couldn't find the text node it belongs to.");
|
|
122
137
|
let textDOM = compositionTopDOM;
|
|
123
138
|
while(textDOM.firstChild){
|
|
124
139
|
textDOM = textDOM.firstChild;
|
|
125
140
|
}
|
|
126
|
-
if (!textDOM || !(textDOM instanceof Text)) throw new Error(
|
|
141
|
+
if (!textDOM || !(textDOM instanceof Text)) throw new Error("Started a composition but couldn't find the text node it belongs to.");
|
|
127
142
|
child.dom = compositionTopDOM;
|
|
128
143
|
child.textDOM = textDOM;
|
|
129
144
|
child.text = textDOM.data;
|
|
@@ -2,6 +2,6 @@ import { useContext } from "react";
|
|
|
2
2
|
import { EditorContext } from "../contexts/EditorContext.js";
|
|
3
3
|
import { reactKeysPluginKey } from "../plugins/reactKeys.js";
|
|
4
4
|
export function useReactKeys() {
|
|
5
|
-
const { view
|
|
5
|
+
const { view } = useContext(EditorContext);
|
|
6
6
|
return reactKeysPluginKey.getState(view.state);
|
|
7
7
|
}
|
|
@@ -4,12 +4,14 @@ import { widget } from "../decorations/ReactWidgetType.js";
|
|
|
4
4
|
function insertText(view, eventData) {
|
|
5
5
|
let options = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
|
|
6
6
|
if (eventData === null) return false;
|
|
7
|
-
|
|
8
|
-
const
|
|
7
|
+
var _from;
|
|
8
|
+
const from = (_from = options.from) !== null && _from !== void 0 ? _from : view.state.selection.from;
|
|
9
|
+
var _to;
|
|
10
|
+
const to = (_to = options.to) !== null && _to !== void 0 ? _to : view.state.selection.to;
|
|
9
11
|
if (view.someProp("handleTextInput", (f)=>f(view, from, to, eventData, ()=>view.state.tr.insertText(eventData, from, to)))) {
|
|
10
12
|
return true;
|
|
11
13
|
}
|
|
12
|
-
const { tr
|
|
14
|
+
const { tr } = view.state;
|
|
13
15
|
if (options.marks) tr.ensureMarks(options.marks);
|
|
14
16
|
tr.insertText(eventData, from, to);
|
|
15
17
|
view.dispatch(tr);
|
|
@@ -22,10 +24,11 @@ export function beforeInputPlugin(setCursorWrapper) {
|
|
|
22
24
|
props: {
|
|
23
25
|
handleDOMEvents: {
|
|
24
26
|
compositionstart (view) {
|
|
25
|
-
const { state
|
|
27
|
+
const { state } = view;
|
|
26
28
|
view.dispatch(state.tr.deleteSelection());
|
|
27
29
|
const $pos = state.selection.$from;
|
|
28
|
-
|
|
30
|
+
var _storedMarks;
|
|
31
|
+
compositionMarks = (_storedMarks = state.storedMarks) !== null && _storedMarks !== void 0 ? _storedMarks : $pos.marks();
|
|
29
32
|
if (compositionMarks) {
|
|
30
33
|
setCursorWrapper(widget(state.selection.from, CursorWrapper, {
|
|
31
34
|
key: "cursor-wrapper",
|
|
@@ -35,7 +38,7 @@ export function beforeInputPlugin(setCursorWrapper) {
|
|
|
35
38
|
// Snapshot the siblings of the node that contains the
|
|
36
39
|
// current cursor. We'll restore this later, so that React
|
|
37
40
|
// doesn't panic about unknown DOM nodes.
|
|
38
|
-
const { node: parent
|
|
41
|
+
const { node: parent } = view.domAtPos($pos.pos);
|
|
39
42
|
precompositionSnapshot = [];
|
|
40
43
|
for (const node of parent.childNodes){
|
|
41
44
|
precompositionSnapshot.push(node);
|
|
@@ -50,8 +53,8 @@ export function beforeInputPlugin(setCursorWrapper) {
|
|
|
50
53
|
compositionend (view, event) {
|
|
51
54
|
// @ts-expect-error Internal property - input
|
|
52
55
|
view.input.composing = false;
|
|
53
|
-
const { state
|
|
54
|
-
const { node: parent
|
|
56
|
+
const { state } = view;
|
|
57
|
+
const { node: parent } = view.domAtPos(state.selection.from);
|
|
55
58
|
if (precompositionSnapshot) {
|
|
56
59
|
// Restore the snapshot of the parent node's children
|
|
57
60
|
// from before the composition started. This gives us a
|
|
@@ -103,13 +106,15 @@ export function beforeInputPlugin(setCursorWrapper) {
|
|
|
103
106
|
keyCode: 13,
|
|
104
107
|
shiftKey: event.inputType === "insertLineBreak"
|
|
105
108
|
});
|
|
109
|
+
var ref;
|
|
106
110
|
// Use someProp to directly call ProseMirror handlers
|
|
107
|
-
return view.someProp("handleKeyDown", (f)=>f(view, keyEvent))
|
|
111
|
+
return (ref = view.someProp("handleKeyDown", (f)=>f(view, keyEvent))) !== null && ref !== void 0 ? ref : false;
|
|
108
112
|
}
|
|
109
113
|
case "insertReplacementText":
|
|
110
114
|
{
|
|
115
|
+
var ref1, ref2;
|
|
111
116
|
const ranges = event.getTargetRanges();
|
|
112
|
-
event.dataTransfer
|
|
117
|
+
(ref2 = (ref1 = event.dataTransfer) === null || ref1 === void 0 ? void 0 : ref1.items[0]) === null || ref2 === void 0 ? void 0 : ref2.getAsString((data)=>{
|
|
113
118
|
for (const range of ranges){
|
|
114
119
|
const from = view.posAtDOM(range.startContainer, range.startOffset, 1);
|
|
115
120
|
const to = view.posAtDOM(range.endContainer, range.endOffset, 1);
|
|
@@ -137,11 +142,11 @@ export function beforeInputPlugin(setCursorWrapper) {
|
|
|
137
142
|
case "deleteContent":
|
|
138
143
|
{
|
|
139
144
|
const targetRanges = event.getTargetRanges();
|
|
140
|
-
const { tr
|
|
145
|
+
const { tr } = view.state;
|
|
141
146
|
for (const range of targetRanges){
|
|
142
147
|
const start = view.posAtDOM(range.startContainer, range.startOffset);
|
|
143
148
|
const end = view.posAtDOM(range.endContainer, range.endOffset);
|
|
144
|
-
const { doc
|
|
149
|
+
const { doc } = view.state;
|
|
145
150
|
const storedMarks = doc.resolve(start).marksAcross(doc.resolve(end));
|
|
146
151
|
tr.delete(start, end).setStoredMarks(storedMarks);
|
|
147
152
|
}
|
|
@@ -36,10 +36,11 @@ export const reactKeysPluginKey = new PluginKey("@handlewithcare/react-prosemirr
|
|
|
36
36
|
* and assign its key to that new position, dropping it if the
|
|
37
37
|
* node was deleted.
|
|
38
38
|
*/ apply (tr, value, _, newState) {
|
|
39
|
+
var ref;
|
|
39
40
|
if (!tr.docChanged || composing) {
|
|
40
41
|
return value;
|
|
41
42
|
}
|
|
42
|
-
const overrides = tr.getMeta(reactKeysPluginKey)
|
|
43
|
+
const overrides = (ref = tr.getMeta(reactKeysPluginKey)) === null || ref === void 0 ? void 0 : ref.overrides;
|
|
43
44
|
const next = {
|
|
44
45
|
posToKey: new Map(),
|
|
45
46
|
keyToPos: new Map()
|
|
@@ -49,8 +50,8 @@ export const reactKeysPluginKey = new PluginKey("@handlewithcare/react-prosemirr
|
|
|
49
50
|
return a - b;
|
|
50
51
|
});
|
|
51
52
|
for (const [pos, key] of posToKeyEntries){
|
|
52
|
-
const override = overrides
|
|
53
|
-
const { pos: newPos, deleted
|
|
53
|
+
const override = overrides === null || overrides === void 0 ? void 0 : overrides[pos];
|
|
54
|
+
const { pos: newPos , deleted } = override === undefined ? tr.mapping.mapResult(pos) : {
|
|
54
55
|
pos: override,
|
|
55
56
|
deleted: false
|
|
56
57
|
};
|
package/dist/esm/props.js
CHANGED
|
@@ -25,7 +25,7 @@ function mergeStyleProps(a, b) {
|
|
|
25
25
|
if (!("STYLE" in b) || typeof b.STYLE !== "string") {
|
|
26
26
|
return a.STYLE;
|
|
27
27
|
}
|
|
28
|
-
return
|
|
28
|
+
return "".concat(a.STYLE.match(/;\s*$/) ? a.STYLE : "".concat(a.STYLE, ";"), " ").concat(b.STYLE);
|
|
29
29
|
}
|
|
30
30
|
/**
|
|
31
31
|
* Merges two sets of React props. Class names
|
|
@@ -178,32 +178,32 @@ function mergeStyleProps(a, b) {
|
|
|
178
178
|
}
|
|
179
179
|
case "maxlength":
|
|
180
180
|
{
|
|
181
|
-
const
|
|
182
|
-
if (!Number.isNaN(
|
|
181
|
+
const numValue1 = parseInt(attrValue, 10);
|
|
182
|
+
if (!Number.isNaN(numValue1)) {
|
|
183
183
|
props.maxLength = attrValue;
|
|
184
184
|
}
|
|
185
185
|
break;
|
|
186
186
|
}
|
|
187
187
|
case "minlength":
|
|
188
188
|
{
|
|
189
|
-
const
|
|
190
|
-
if (!Number.isNaN(
|
|
189
|
+
const numValue2 = parseInt(attrValue, 10);
|
|
190
|
+
if (!Number.isNaN(numValue2)) {
|
|
191
191
|
props.minLength = attrValue;
|
|
192
192
|
}
|
|
193
193
|
break;
|
|
194
194
|
}
|
|
195
195
|
case "max":
|
|
196
196
|
{
|
|
197
|
-
const
|
|
198
|
-
if (!Number.isNaN(
|
|
197
|
+
const numValue3 = parseInt(attrValue, 10);
|
|
198
|
+
if (!Number.isNaN(numValue3)) {
|
|
199
199
|
props.max = attrValue;
|
|
200
200
|
}
|
|
201
201
|
break;
|
|
202
202
|
}
|
|
203
203
|
case "min":
|
|
204
204
|
{
|
|
205
|
-
const
|
|
206
|
-
if (!Number.isNaN(
|
|
205
|
+
const numValue4 = parseInt(attrValue, 10);
|
|
206
|
+
if (!Number.isNaN(numValue4)) {
|
|
207
207
|
props.min = attrValue;
|
|
208
208
|
}
|
|
209
209
|
break;
|
|
@@ -225,8 +225,8 @@ function mergeStyleProps(a, b) {
|
|
|
225
225
|
}
|
|
226
226
|
case "size":
|
|
227
227
|
{
|
|
228
|
-
const
|
|
229
|
-
if (!Number.isNaN(
|
|
228
|
+
const numValue5 = parseInt(attrValue, 10);
|
|
229
|
+
if (!Number.isNaN(numValue5)) {
|
|
230
230
|
props.size = attrValue;
|
|
231
231
|
}
|
|
232
232
|
break;
|
|
@@ -237,8 +237,8 @@ function mergeStyleProps(a, b) {
|
|
|
237
237
|
props.step = attrValue;
|
|
238
238
|
break;
|
|
239
239
|
}
|
|
240
|
-
const
|
|
241
|
-
if (!Number.isNaN(
|
|
240
|
+
const numValue6 = parseInt(attrValue, 10);
|
|
241
|
+
if (!Number.isNaN(numValue6) && numValue6 > 0) {
|
|
242
242
|
props.step = attrValue;
|
|
243
243
|
}
|
|
244
244
|
break;
|
|
@@ -250,8 +250,8 @@ function mergeStyleProps(a, b) {
|
|
|
250
250
|
}
|
|
251
251
|
case "rows":
|
|
252
252
|
{
|
|
253
|
-
const
|
|
254
|
-
if (!Number.isNaN(
|
|
253
|
+
const numValue7 = parseInt(attrValue, 10);
|
|
254
|
+
if (!Number.isNaN(numValue7)) {
|
|
255
255
|
props.rows = attrValue;
|
|
256
256
|
}
|
|
257
257
|
break;
|
|
@@ -1,4 +1,18 @@
|
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */ function _extends() {
|
|
2
|
+
_extends = Object.assign || function(target) {
|
|
3
|
+
for(var i = 1; i < arguments.length; i++){
|
|
4
|
+
var source = arguments[i];
|
|
5
|
+
for(var key in source){
|
|
6
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
7
|
+
target[key] = source[key];
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
return target;
|
|
12
|
+
};
|
|
13
|
+
return _extends.apply(this, arguments);
|
|
14
|
+
}
|
|
15
|
+
import { render } from "@testing-library/react";
|
|
2
16
|
import { expect } from "expect";
|
|
3
17
|
import { Node } from "prosemirror-model";
|
|
4
18
|
import { EditorState, TextSelection } from "prosemirror-state";
|
|
@@ -15,7 +29,7 @@ const toEqualNode = function(actual, expected) {
|
|
|
15
29
|
const pass = eq(actual, expected);
|
|
16
30
|
return {
|
|
17
31
|
message: ()=>// `this` context will have correct typings
|
|
18
|
-
|
|
32
|
+
"expected ".concat(this.utils.printReceived(actual), " ").concat(pass ? "not " : "", "to equal ").concat(this.utils.printExpected(expected)),
|
|
19
33
|
pass
|
|
20
34
|
};
|
|
21
35
|
};
|
|
@@ -23,14 +37,15 @@ expect.extend({
|
|
|
23
37
|
toEqualNode
|
|
24
38
|
});
|
|
25
39
|
export function tempEditor(param) {
|
|
26
|
-
let { doc: startDoc, selection, controlled, plugins, ...props } = param;
|
|
27
|
-
|
|
40
|
+
let { doc: startDoc , selection , controlled , plugins , ...props } = param;
|
|
41
|
+
var ref, ref1;
|
|
42
|
+
startDoc = startDoc !== null && startDoc !== void 0 ? startDoc : doc(p());
|
|
28
43
|
const state = EditorState.create({
|
|
29
44
|
doc: startDoc,
|
|
30
45
|
schema,
|
|
31
|
-
selection: selection
|
|
46
|
+
selection: (selection !== null && selection !== void 0 ? selection : (ref = startDoc.tag) === null || ref === void 0 ? void 0 : ref.a) ? TextSelection.create(startDoc, startDoc.tag.a, (ref1 = startDoc.tag) === null || ref1 === void 0 ? void 0 : ref1.b) : undefined,
|
|
32
47
|
plugins: [
|
|
33
|
-
...plugins
|
|
48
|
+
...plugins !== null && plugins !== void 0 ? plugins : [],
|
|
34
49
|
reactKeys()
|
|
35
50
|
]
|
|
36
51
|
});
|
|
@@ -41,25 +56,21 @@ export function tempEditor(param) {
|
|
|
41
56
|
});
|
|
42
57
|
return null;
|
|
43
58
|
}
|
|
44
|
-
const { rerender, unmount
|
|
45
|
-
|
|
59
|
+
const { rerender , unmount } = render(/*#__PURE__*/ React.createElement(ProseMirror, _extends({}, controlled ? {
|
|
60
|
+
state
|
|
61
|
+
} : {
|
|
62
|
+
defaultState: state
|
|
63
|
+
}, props), /*#__PURE__*/ React.createElement(Test, null), /*#__PURE__*/ React.createElement(ProseMirrorDoc, null)));
|
|
64
|
+
function rerenderEditor() {
|
|
65
|
+
let { ...newProps } = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
|
|
66
|
+
rerender(/*#__PURE__*/ React.createElement(ProseMirror, _extends({}, controlled ? {
|
|
46
67
|
state
|
|
47
68
|
} : {
|
|
48
69
|
defaultState: state
|
|
49
|
-
},
|
|
50
|
-
...props
|
|
51
|
-
}, /*#__PURE__*/ React.createElement(Test, null), /*#__PURE__*/ React.createElement(ProseMirrorDoc, null)));
|
|
52
|
-
function rerenderEditor() {
|
|
53
|
-
let { ...newProps } = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
|
|
54
|
-
rerender(/*#__PURE__*/ React.createElement(ProseMirror, {
|
|
55
|
-
...controlled ? {
|
|
56
|
-
state
|
|
57
|
-
} : {
|
|
58
|
-
defaultState: state
|
|
59
|
-
},
|
|
70
|
+
}, {
|
|
60
71
|
...props,
|
|
61
72
|
...newProps
|
|
62
|
-
}, /*#__PURE__*/ React.createElement(Test, null), /*#__PURE__*/ React.createElement(ProseMirrorDoc, null)));
|
|
73
|
+
}), /*#__PURE__*/ React.createElement(Test, null), /*#__PURE__*/ React.createElement(ProseMirrorDoc, null)));
|
|
63
74
|
return view;
|
|
64
75
|
}
|
|
65
76
|
return {
|
|
@@ -53,7 +53,8 @@ const mockGetClientRects = ()=>{
|
|
|
53
53
|
];
|
|
54
54
|
const domRectList = Object.assign(list, {
|
|
55
55
|
item (index) {
|
|
56
|
-
|
|
56
|
+
var _index;
|
|
57
|
+
return (_index = list[index]) !== null && _index !== void 0 ? _index : null;
|
|
57
58
|
}
|
|
58
59
|
});
|
|
59
60
|
return domRectList;
|