@handlewithcare/react-prosemirror 2.4.12 → 2.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (149) hide show
  1. package/dist/cjs/AbstractEditorView.js +4 -0
  2. package/dist/cjs/ReactEditorView.js +156 -0
  3. package/dist/cjs/StaticEditorView.js +86 -0
  4. package/dist/cjs/components/ChildNodeViews.js +58 -29
  5. package/dist/cjs/components/CustomNodeView.js +77 -137
  6. package/dist/cjs/{hooks/useNodePos.js → components/DefaultNodeView.js} +24 -26
  7. package/dist/cjs/components/DocNodeView.js +33 -41
  8. package/dist/cjs/components/MarkView.js +1 -2
  9. package/dist/cjs/components/NativeWidgetView.js +2 -3
  10. package/dist/cjs/components/NodeView.js +31 -21
  11. package/dist/cjs/components/ProseMirror.js +25 -17
  12. package/dist/cjs/components/ProseMirrorDoc.js +7 -27
  13. package/dist/cjs/components/ReactNodeView.js +98 -61
  14. package/dist/cjs/components/SeparatorHackView.js +1 -2
  15. package/dist/cjs/components/TextNodeView.js +4 -5
  16. package/dist/cjs/components/TrailingHackView.js +1 -2
  17. package/dist/cjs/components/WidgetView.js +2 -4
  18. package/dist/cjs/constants.js +33 -0
  19. package/dist/cjs/hooks/useEditor.js +33 -229
  20. package/dist/cjs/hooks/useEditorEffect.js +2 -2
  21. package/dist/cjs/hooks/useEditorEventCallback.js +8 -5
  22. package/dist/cjs/hooks/useIgnoreMutation.js +1 -1
  23. package/dist/cjs/hooks/useNodeViewDescriptor.js +123 -80
  24. package/dist/cjs/hooks/useReactKeys.js +1 -1
  25. package/dist/cjs/hooks/useSelectNode.js +9 -7
  26. package/dist/cjs/hooks/useStopEvent.js +1 -1
  27. package/dist/cjs/plugins/beforeInputPlugin.js +12 -0
  28. package/dist/cjs/testing/editorViewTestHelpers.js +0 -2
  29. package/dist/cjs/viewdesc.js +104 -25
  30. package/dist/esm/AbstractEditorView.js +1 -0
  31. package/dist/esm/ReactEditorView.js +156 -0
  32. package/dist/esm/StaticEditorView.js +76 -0
  33. package/dist/esm/components/ChildNodeViews.js +59 -31
  34. package/dist/esm/components/CustomNodeView.js +78 -138
  35. package/dist/esm/components/DefaultNodeView.js +16 -0
  36. package/dist/esm/components/DocNodeView.js +33 -41
  37. package/dist/esm/components/MarkView.js +1 -2
  38. package/dist/esm/components/NativeWidgetView.js +2 -3
  39. package/dist/esm/components/NodeView.js +32 -22
  40. package/dist/esm/components/ProseMirror.js +25 -17
  41. package/dist/esm/components/ProseMirrorDoc.js +7 -28
  42. package/dist/esm/components/ReactNodeView.js +99 -62
  43. package/dist/esm/components/SeparatorHackView.js +1 -2
  44. package/dist/esm/components/TextNodeView.js +4 -5
  45. package/dist/esm/components/TrailingHackView.js +1 -2
  46. package/dist/esm/components/WidgetView.js +2 -4
  47. package/dist/esm/constants.js +15 -0
  48. package/dist/esm/hooks/useEditor.js +29 -218
  49. package/dist/esm/hooks/useEditorEffect.js +2 -2
  50. package/dist/esm/hooks/useEditorEventCallback.js +8 -5
  51. package/dist/esm/hooks/useIgnoreMutation.js +1 -1
  52. package/dist/esm/hooks/useNodeViewDescriptor.js +125 -82
  53. package/dist/esm/hooks/useReactKeys.js +1 -1
  54. package/dist/esm/hooks/useSelectNode.js +9 -7
  55. package/dist/esm/hooks/useStopEvent.js +1 -1
  56. package/dist/esm/plugins/beforeInputPlugin.js +12 -0
  57. package/dist/esm/testing/editorViewTestHelpers.js +0 -2
  58. package/dist/esm/viewdesc.js +94 -18
  59. package/dist/tsconfig.tsbuildinfo +1 -1
  60. package/dist/types/AbstractEditorView.d.ts +27 -0
  61. package/dist/types/ReactEditorView.d.ts +80 -0
  62. package/dist/types/StaticEditorView.d.ts +24 -0
  63. package/dist/types/components/ChildNodeViews.d.ts +2 -2
  64. package/dist/types/components/CustomNodeView.d.ts +3 -3
  65. package/dist/types/components/DefaultNodeView.d.ts +3 -0
  66. package/dist/types/components/DocNodeView.d.ts +9 -17
  67. package/dist/types/components/MarkView.d.ts +2 -2
  68. package/dist/types/components/NativeWidgetView.d.ts +2 -2
  69. package/dist/types/components/NodeView.d.ts +5 -5
  70. package/dist/types/components/NodeViewComponentProps.d.ts +3 -4
  71. package/dist/types/components/ProseMirrorDoc.d.ts +14 -8
  72. package/dist/types/components/ReactNodeView.d.ts +4 -2
  73. package/dist/types/components/SeparatorHackView.d.ts +2 -2
  74. package/dist/types/components/TextNodeView.d.ts +4 -3
  75. package/dist/types/components/TrailingHackView.d.ts +2 -2
  76. package/dist/types/components/WidgetView.d.ts +2 -2
  77. package/dist/types/constants.d.ts +4 -0
  78. package/dist/types/contexts/EditorContext.d.ts +6 -4
  79. package/dist/types/contexts/IgnoreMutationContext.d.ts +2 -1
  80. package/dist/types/contexts/NodeViewContext.d.ts +3 -1
  81. package/dist/types/contexts/SelectNodeContext.d.ts +3 -1
  82. package/dist/types/contexts/StopEventContext.d.ts +2 -1
  83. package/dist/types/decorations/computeDocDeco.d.ts +3 -2
  84. package/dist/types/decorations/viewDecorations.d.ts +3 -2
  85. package/dist/types/hooks/useEditor.d.ts +5 -46
  86. package/dist/types/hooks/useNodeViewDescriptor.d.ts +18 -10
  87. package/dist/types/hooks/useReactKeys.d.ts +1 -1
  88. package/dist/types/hooks/useSelectNode.d.ts +2 -1
  89. package/dist/types/props.d.ts +3 -3
  90. package/dist/types/viewdesc.d.ts +29 -11
  91. package/package.json +7 -3
  92. package/dist/cjs/components/Editor.js +0 -28
  93. package/dist/cjs/components/NodeViews.js +0 -73
  94. package/dist/cjs/components/__tests__/LayoutGroup.test.js +0 -141
  95. package/dist/cjs/components/__tests__/ProseMirror.test.js +0 -255
  96. package/dist/cjs/contexts/NodeViewsContext.js +0 -10
  97. package/dist/cjs/hooks/__tests__/useEditorViewLayoutEffect.test.js +0 -107
  98. package/dist/cjs/hooks/__tests__/useNodeViews.test.js +0 -159
  99. package/dist/cjs/hooks/useClientOnly.js +0 -19
  100. package/dist/cjs/hooks/useEditorView.js +0 -100
  101. package/dist/cjs/hooks/useNodeViews.js +0 -100
  102. package/dist/cjs/nodeViews/createReactNodeViewConstructor.js +0 -244
  103. package/dist/cjs/nodeViews/phrasingContentTags.js +0 -57
  104. package/dist/cjs/plugins/__tests__/react.test.js +0 -139
  105. package/dist/cjs/plugins/react.js +0 -71
  106. package/dist/cjs/selection/SelectionDOMObserver.js +0 -171
  107. package/dist/cjs/selection/hasFocusAndSelection.js +0 -35
  108. package/dist/cjs/selection/selectionFromDOM.js +0 -77
  109. package/dist/cjs/selection/selectionToDOM.js +0 -226
  110. package/dist/cjs/ssr.js +0 -85
  111. package/dist/esm/components/Editor.js +0 -15
  112. package/dist/esm/components/NodeViews.js +0 -26
  113. package/dist/esm/components/__tests__/LayoutGroup.test.js +0 -98
  114. package/dist/esm/components/__tests__/ProseMirror.test.js +0 -207
  115. package/dist/esm/contexts/NodeViewsContext.js +0 -9
  116. package/dist/esm/hooks/__tests__/useEditorViewLayoutEffect.test.js +0 -98
  117. package/dist/esm/hooks/__tests__/useNodeViews.test.js +0 -116
  118. package/dist/esm/hooks/useClientOnly.js +0 -9
  119. package/dist/esm/hooks/useEditorView.js +0 -99
  120. package/dist/esm/hooks/useNodePos.js +0 -16
  121. package/dist/esm/hooks/useNodeViews.js +0 -53
  122. package/dist/esm/nodeViews/createReactNodeViewConstructor.js +0 -214
  123. package/dist/esm/nodeViews/phrasingContentTags.js +0 -49
  124. package/dist/esm/plugins/__tests__/react.test.js +0 -135
  125. package/dist/esm/plugins/react.js +0 -64
  126. package/dist/esm/selection/SelectionDOMObserver.js +0 -161
  127. package/dist/esm/selection/hasFocusAndSelection.js +0 -17
  128. package/dist/esm/selection/selectionFromDOM.js +0 -59
  129. package/dist/esm/selection/selectionToDOM.js +0 -196
  130. package/dist/esm/ssr.js +0 -82
  131. package/dist/types/components/Editor.d.ts +0 -7
  132. package/dist/types/components/NodeViews.d.ts +0 -6
  133. package/dist/types/components/__tests__/LayoutGroup.test.d.ts +0 -1
  134. package/dist/types/contexts/NodeViewsContext.d.ts +0 -19
  135. package/dist/types/hooks/__tests__/useEditorViewLayoutEffect.test.d.ts +0 -1
  136. package/dist/types/hooks/__tests__/useNodeViews.test.d.ts +0 -1
  137. package/dist/types/hooks/useClientOnly.d.ts +0 -1
  138. package/dist/types/hooks/useEditorView.d.ts +0 -23
  139. package/dist/types/hooks/useNodePos.d.ts +0 -9
  140. package/dist/types/hooks/useNodeViews.d.ts +0 -5
  141. package/dist/types/nodeViews/createReactNodeViewConstructor.d.ts +0 -48
  142. package/dist/types/nodeViews/phrasingContentTags.d.ts +0 -1
  143. package/dist/types/plugins/__tests__/react.test.d.ts +0 -1
  144. package/dist/types/plugins/react.d.ts +0 -21
  145. package/dist/types/selection/SelectionDOMObserver.d.ts +0 -33
  146. package/dist/types/selection/hasFocusAndSelection.d.ts +0 -3
  147. package/dist/types/selection/selectionFromDOM.d.ts +0 -4
  148. package/dist/types/selection/selectionToDOM.d.ts +0 -9
  149. package/dist/types/ssr.d.ts +0 -19
@@ -1,5 +1,6 @@
1
1
  import { Mark, Node, TagParseRule } from "prosemirror-model";
2
- import { Decoration, DecorationSource, EditorView } from "prosemirror-view";
2
+ import { Decoration, DecorationSource, EditorView, NodeView } from "prosemirror-view";
3
+ import { ReactEditorView } from "./ReactEditorView.js";
3
4
  import { DOMNode } from "./dom.js";
4
5
  declare global {
5
6
  interface Node {
@@ -54,7 +55,7 @@ export declare class ViewDesc {
54
55
  };
55
56
  emptyChildAt(side: number): boolean;
56
57
  domAfterPos(pos: number): DOMNode;
57
- setSelection(anchor: number, head: number, view: EditorView, force?: boolean): void;
58
+ setSelection(anchor: number, head: number, view: ReactEditorView, force?: boolean): void;
58
59
  ignoreMutation(mutation: ViewMutationRecord): boolean;
59
60
  get contentLost(): boolean | null;
60
61
  markDirty(from: number, to: number): void;
@@ -111,17 +112,17 @@ export declare class NodeViewDesc extends ViewDesc {
111
112
  outerDeco: readonly Decoration[];
112
113
  innerDeco: DecorationSource;
113
114
  nodeDOM: DOMNode;
114
- stopEvent: (event: Event) => boolean;
115
- selectNode: () => void;
116
- deselectNode: () => void;
117
- ignoreMutation: (mutation: ViewMutationRecord) => boolean;
118
- constructor(parent: ViewDesc | undefined, children: ViewDesc[], getPos: () => number, node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource, dom: DOMNode, contentDOM: HTMLElement | null, nodeDOM: DOMNode, stopEvent: (event: Event) => boolean, selectNode: () => void, deselectNode: () => void, ignoreMutation: (mutation: ViewMutationRecord) => boolean);
119
- updateOuterDeco(): void;
115
+ constructor(parent: ViewDesc | undefined, children: ViewDesc[], getPos: () => number, node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource, dom: DOMNode, contentDOM: HTMLElement | null, nodeDOM: DOMNode);
120
116
  parseRule(): Omit<TagParseRule, "tag"> | null;
121
117
  matchesNode(node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource): boolean;
122
118
  get size(): number;
123
- get border(): 1 | 0;
124
- update(_node: Node, _outerDeco: readonly Decoration[], _innerDeco: DecorationSource, _view: EditorView): boolean;
119
+ get border(): 0 | 1;
120
+ updateChildren(_view: EditorView, _pos: number): void;
121
+ update(node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource, view: EditorView): boolean;
122
+ updateInner(node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource, view: EditorView): void;
123
+ updateOuterDeco(outerDeco: readonly Decoration[]): void;
124
+ selectNode(): void;
125
+ deselectNode(): void;
125
126
  get domAtom(): boolean;
126
127
  }
127
128
  export declare class TextViewDesc extends NodeViewDesc {
@@ -129,7 +130,7 @@ export declare class TextViewDesc extends NodeViewDesc {
129
130
  parseRule(): {
130
131
  skip: any;
131
132
  };
132
- update(_node: Node, _outerDeco: readonly Decoration[], _innerDeco: DecorationSource, _view: EditorView): boolean;
133
+ update(_node: Node, _outerDeco: readonly Decoration[], _innerDeco: DecorationSource, _view: ReactEditorView): boolean;
133
134
  inParent(): boolean;
134
135
  domFromPos(pos: number): {
135
136
  node: globalThis.Node;
@@ -147,3 +148,20 @@ export declare class TrailingHackViewDesc extends ViewDesc {
147
148
  get domAtom(): boolean;
148
149
  get ignoreForCoords(): boolean;
149
150
  }
151
+ declare class CustomNodeViewDesc extends NodeViewDesc {
152
+ readonly spec: NodeView;
153
+ constructor(parent: ViewDesc | undefined, children: ViewDesc[], getPos: () => number, node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource, dom: DOMNode, contentDOM: HTMLElement | null, nodeDOM: DOMNode, spec: NodeView);
154
+ update(node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource, view: EditorView): boolean;
155
+ selectNode(): void;
156
+ deselectNode(): void;
157
+ setSelection(anchor: number, head: number, view: ReactEditorView, force: boolean): void;
158
+ destroy(): void;
159
+ stopEvent(event: Event): boolean;
160
+ ignoreMutation(mutation: ViewMutationRecord): boolean;
161
+ }
162
+ export declare class ReactNodeViewDesc extends CustomNodeViewDesc {
163
+ updateChildren(_view: EditorView, _pos: number): void;
164
+ updateOuterDeco(outerDeco: readonly Decoration[]): void;
165
+ destroy(): void;
166
+ }
167
+ export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@handlewithcare/react-prosemirror",
3
- "version": "2.4.12",
3
+ "version": "2.5.1",
4
4
  "license": "Apache-2.0",
5
5
  "type": "module",
6
6
  "main": "dist/cjs/index.js",
@@ -118,8 +118,9 @@
118
118
  "prosemirror-model": "^1.0.0",
119
119
  "prosemirror-state": "^1.0.0",
120
120
  "prosemirror-view": "1.39.2",
121
- "react": ">=17 <=19.1.0",
122
- "react-dom": ">=17 <=19.1.0"
121
+ "react": ">=17 <20",
122
+ "react-dom": ">=17 <20",
123
+ "react-reconciler": ">=0.26.1 <=0.32.0"
123
124
  },
124
125
  "packageManager": "yarn@4.6.0",
125
126
  "engines": {
@@ -127,5 +128,8 @@
127
128
  },
128
129
  "dependencies": {
129
130
  "classnames": "^2.3.2"
131
+ },
132
+ "publishConfig": {
133
+ "access": "public"
130
134
  }
131
135
  }
@@ -1,28 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "Editor", {
6
- enumerable: true,
7
- get: ()=>Editor
8
- });
9
- const _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
10
- const _editorContextJs = require("../contexts/EditorContext.js");
11
- const _useEditorViewJs = require("../hooks/useEditorView.js");
12
- const _useNodeViewsJs = require("../hooks/useNodeViews.js");
13
- function _interopRequireDefault(obj) {
14
- return obj && obj.__esModule ? obj : {
15
- default: obj
16
- };
17
- }
18
- function Editor(param) {
19
- let { mount , children , ...options } = param;
20
- const { nodeViews , nodeViewsComponent } = (0, _useNodeViewsJs.useNodeViews)(options.nodeViews);
21
- const value = (0, _useEditorViewJs.useEditorView)(mount, {
22
- ...options,
23
- nodeViews
24
- });
25
- return /*#__PURE__*/ _react.default.createElement(_editorContextJs.EditorContext.Provider, {
26
- value: value
27
- }, children, nodeViewsComponent);
28
- }
@@ -1,73 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "NodeViews", {
6
- enumerable: true,
7
- get: ()=>NodeViews
8
- });
9
- const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
10
- const _nodeViewsContextJs = require("../contexts/NodeViewsContext.js");
11
- const _useEditorEffectJs = require("../hooks/useEditorEffect.js");
12
- const _reactJs = require("../plugins/react.js");
13
- function _getRequireWildcardCache(nodeInterop) {
14
- if (typeof WeakMap !== "function") return null;
15
- var cacheBabelInterop = new WeakMap();
16
- var cacheNodeInterop = new WeakMap();
17
- return (_getRequireWildcardCache = function(nodeInterop) {
18
- return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
19
- })(nodeInterop);
20
- }
21
- function _interopRequireWildcard(obj, nodeInterop) {
22
- if (!nodeInterop && obj && obj.__esModule) {
23
- return obj;
24
- }
25
- if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
26
- return {
27
- default: obj
28
- };
29
- }
30
- var cache = _getRequireWildcardCache(nodeInterop);
31
- if (cache && cache.has(obj)) {
32
- return cache.get(obj);
33
- }
34
- var newObj = {};
35
- var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
36
- for(var key in obj){
37
- if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
38
- var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
39
- if (desc && (desc.get || desc.set)) {
40
- Object.defineProperty(newObj, key, desc);
41
- } else {
42
- newObj[key] = obj[key];
43
- }
44
- }
45
- }
46
- newObj.default = obj;
47
- if (cache) {
48
- cache.set(obj, newObj);
49
- }
50
- return newObj;
51
- }
52
- function NodeViews(param) {
53
- let { portals } = param;
54
- const rootRegisteredPortals = portals[_reactJs.ROOT_NODE_KEY];
55
- const [rootPortals, setRootPortals] = (0, _react.useState)(rootRegisteredPortals?.map((param)=>{
56
- let { portal } = param;
57
- return portal;
58
- }) ?? []);
59
- // `getPos` is technically derived from the EditorView
60
- // state, so it's not safe to call until after the EditorView
61
- // has been updated
62
- (0, _useEditorEffectJs.useEditorEffect)(()=>{
63
- setRootPortals(rootRegisteredPortals?.sort((a, b)=>a.getPos() - b.getPos()).map((param)=>{
64
- let { portal } = param;
65
- return portal;
66
- }) ?? []);
67
- }, [
68
- rootRegisteredPortals
69
- ]);
70
- return /*#__PURE__*/ _react.default.createElement(_nodeViewsContextJs.NodeViewsContext.Provider, {
71
- value: portals
72
- }, rootPortals);
73
- }
@@ -1,141 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- const _react = require("@testing-library/react");
6
- const _react1 = /*#__PURE__*/ _interopRequireWildcard(require("react"));
7
- const _useLayoutGroupEffectJs = require("../../hooks/useLayoutGroupEffect.js");
8
- const _layoutGroupJs = require("../LayoutGroup.js");
9
- function _getRequireWildcardCache(nodeInterop) {
10
- if (typeof WeakMap !== "function") return null;
11
- var cacheBabelInterop = new WeakMap();
12
- var cacheNodeInterop = new WeakMap();
13
- return (_getRequireWildcardCache = function(nodeInterop) {
14
- return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
15
- })(nodeInterop);
16
- }
17
- function _interopRequireWildcard(obj, nodeInterop) {
18
- if (!nodeInterop && obj && obj.__esModule) {
19
- return obj;
20
- }
21
- if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
22
- return {
23
- default: obj
24
- };
25
- }
26
- var cache = _getRequireWildcardCache(nodeInterop);
27
- if (cache && cache.has(obj)) {
28
- return cache.get(obj);
29
- }
30
- var newObj = {};
31
- var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
32
- for(var key in obj){
33
- if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
34
- var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
35
- if (desc && (desc.get || desc.set)) {
36
- Object.defineProperty(newObj, key, desc);
37
- } else {
38
- newObj[key] = obj[key];
39
- }
40
- }
41
- }
42
- newObj.default = obj;
43
- if (cache) {
44
- cache.set(obj, newObj);
45
- }
46
- return newObj;
47
- }
48
- describe("LayoutGroup", ()=>{
49
- jest.useFakeTimers("modern");
50
- it("registers multiple effects and runs them", ()=>{
51
- function Parent() {
52
- return /*#__PURE__*/ _react1.default.createElement(_layoutGroupJs.LayoutGroup, null, /*#__PURE__*/ _react1.default.createElement(Child, null));
53
- }
54
- function Child() {
55
- const [double, setDouble] = (0, _react1.useState)(1);
56
- (0, _react1.useLayoutEffect)(()=>{
57
- if (double === 2) {
58
- setTimeout(()=>{
59
- setDouble((d)=>d * 2.5);
60
- }, 500);
61
- }
62
- if (double === 20) {
63
- setDouble((d)=>d * 2.5);
64
- }
65
- }, [
66
- double
67
- ]);
68
- (0, _useLayoutGroupEffectJs.useLayoutGroupEffect)(()=>{
69
- const timeout = setTimeout(()=>{
70
- setDouble((d)=>d * 2);
71
- }, 1000);
72
- return ()=>{
73
- clearTimeout(timeout);
74
- };
75
- }, [
76
- double
77
- ]);
78
- return /*#__PURE__*/ _react1.default.createElement("div", null, /*#__PURE__*/ _react1.default.createElement("div", {
79
- "data-testid": "double"
80
- }, double));
81
- }
82
- // The component mounts ...
83
- // ... the initial value should be 1
84
- // ... there should be one timeout scheduled by the deferred effect
85
- (0, _react.render)(/*#__PURE__*/ _react1.default.createElement(Parent, null));
86
- expect(_react.screen.getByTestId("double").innerHTML).toBe("1");
87
- // This block assert that deferred effects run.
88
- // --------------------------------------------
89
- // 1000 milliseconds go by ...
90
- // ... the timeout set by the deferred effect should run
91
- // ... the timeout should double the new value to 2
92
- // ... the immediate effect should set a timeout
93
- // ... the deferred effect should set a timeout
94
- (0, _react.act)(()=>{
95
- jest.advanceTimersByTime(1000);
96
- });
97
- expect(_react.screen.getByTestId("double").innerHTML).toBe("2");
98
- // The next three blocks assert that cleanup of deferred effects run.
99
- // ------------------------------------------------------------------
100
- // 500 milliseconds go by ...
101
- // ... the timeout set by the immediate effect should run
102
- // ... the timeout should set the value to 5
103
- // ... the old deferred effect should cancel its timeout
104
- // ... the new deferred effect should set a new timeout
105
- (0, _react.act)(()=>{
106
- jest.advanceTimersByTime(500);
107
- });
108
- expect(_react.screen.getByTestId("double").innerHTML).toBe("5");
109
- // ... 500 more milliseconds go by ...
110
- // ... the canceled timeout should not run
111
- // ... the rescheduled timoeut should not yet run
112
- (0, _react.act)(()=>{
113
- jest.advanceTimersByTime(500);
114
- });
115
- expect(_react.screen.getByTestId("double").innerHTML).toBe("5");
116
- // ... 500 more milliseconds go by ...
117
- // ... the rescheduled timeout should run
118
- // ... the timeout should double the value to 10
119
- // ... the deferred effect should set a new timeout
120
- (0, _react.act)(()=>{
121
- jest.advanceTimersByTime(500);
122
- });
123
- expect(_react.screen.getByTestId("double").innerHTML).toBe("10");
124
- // The next block asserts that cancelation of deferred effects works.
125
- // ------------------------------------------------------------------
126
- // 1000 milliseconds go by ...
127
- // ... the timeout set by the deferred effect should run
128
- // ... the timeout should double the value to 20
129
- // ... the immediate effect should then set the value to 50
130
- // ... the deferred effect from the first render should not run
131
- // ... the deferred effect from the second render should run
132
- // ... the deferred effect that does run should set a new timeout
133
- (0, _react.act)(()=>{
134
- jest.advanceTimersByTime(1000);
135
- });
136
- // For this assertion, we need to clear a timer from the React scheduler.
137
- jest.advanceTimersByTime(1);
138
- expect(_react.screen.getByTestId("double").innerHTML).toBe("50");
139
- expect(jest.getTimerCount()).toBe(1);
140
- });
141
- });
@@ -1,255 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- const _react = require("@testing-library/react");
6
- const _userEvent = /*#__PURE__*/ _interopRequireDefault(require("@testing-library/user-event"));
7
- const _prosemirrorModel = require("prosemirror-model");
8
- const _prosemirrorState = require("prosemirror-state");
9
- const _react1 = /*#__PURE__*/ _interopRequireWildcard(require("react"));
10
- const _reactJs = require("../../plugins/react.js");
11
- const _setupProseMirrorViewJs = require("../../testing/setupProseMirrorView.js");
12
- const _proseMirrorJs = require("../ProseMirror.js");
13
- function _interopRequireDefault(obj) {
14
- return obj && obj.__esModule ? obj : {
15
- default: obj
16
- };
17
- }
18
- function _getRequireWildcardCache(nodeInterop) {
19
- if (typeof WeakMap !== "function") return null;
20
- var cacheBabelInterop = new WeakMap();
21
- var cacheNodeInterop = new WeakMap();
22
- return (_getRequireWildcardCache = function(nodeInterop) {
23
- return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
24
- })(nodeInterop);
25
- }
26
- function _interopRequireWildcard(obj, nodeInterop) {
27
- if (!nodeInterop && obj && obj.__esModule) {
28
- return obj;
29
- }
30
- if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
31
- return {
32
- default: obj
33
- };
34
- }
35
- var cache = _getRequireWildcardCache(nodeInterop);
36
- if (cache && cache.has(obj)) {
37
- return cache.get(obj);
38
- }
39
- var newObj = {};
40
- var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
41
- for(var key in obj){
42
- if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
43
- var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
44
- if (desc && (desc.get || desc.set)) {
45
- Object.defineProperty(newObj, key, desc);
46
- } else {
47
- newObj[key] = obj[key];
48
- }
49
- }
50
- }
51
- newObj.default = obj;
52
- if (cache) {
53
- cache.set(obj, newObj);
54
- }
55
- return newObj;
56
- }
57
- // Mock `ReactDOM.flushSync` to call `act` to flush updates from DOM mutations.
58
- jest.mock("react-dom", ()=>({
59
- ...jest.requireActual("react-dom"),
60
- flushSync: (fn)=>(0, _react.act)(fn)
61
- }));
62
- describe("ProseMirror", ()=>{
63
- beforeAll(()=>{
64
- (0, _setupProseMirrorViewJs.setupProseMirrorView)();
65
- });
66
- it("renders a contenteditable", async ()=>{
67
- const schema = new _prosemirrorModel.Schema({
68
- nodes: {
69
- text: {},
70
- doc: {
71
- content: "text*"
72
- }
73
- }
74
- });
75
- const defaultState = _prosemirrorState.EditorState.create({
76
- schema
77
- });
78
- function TestEditor() {
79
- const [mount, setMount] = (0, _react1.useState)(null);
80
- return /*#__PURE__*/ _react1.default.createElement(_proseMirrorJs.ProseMirror, {
81
- mount: mount,
82
- defaultState: defaultState
83
- }, /*#__PURE__*/ _react1.default.createElement("div", {
84
- "data-testid": "editor",
85
- ref: setMount
86
- }));
87
- }
88
- const user = _userEvent.default.setup();
89
- (0, _react.render)(/*#__PURE__*/ _react1.default.createElement(TestEditor, null));
90
- const editor = _react.screen.getByTestId("editor");
91
- await user.type(editor, "Hello, world!");
92
- expect(editor.textContent).toBe("Hello, world!");
93
- });
94
- it("supports observing transaction dispatch", async ()=>{
95
- const schema = new _prosemirrorModel.Schema({
96
- nodes: {
97
- text: {},
98
- doc: {
99
- content: "text*"
100
- }
101
- }
102
- });
103
- const defaultState = _prosemirrorState.EditorState.create({
104
- schema
105
- });
106
- const dispatchTransaction = jest.fn();
107
- function TestEditor() {
108
- const [mount, setMount] = (0, _react1.useState)(null);
109
- return /*#__PURE__*/ _react1.default.createElement(_proseMirrorJs.ProseMirror, {
110
- mount: mount,
111
- defaultState: defaultState,
112
- dispatchTransaction: dispatchTransaction
113
- }, /*#__PURE__*/ _react1.default.createElement("div", {
114
- "data-testid": "editor",
115
- ref: setMount
116
- }));
117
- }
118
- const user = _userEvent.default.setup();
119
- (0, _react.render)(/*#__PURE__*/ _react1.default.createElement(TestEditor, null));
120
- const editor = _react.screen.getByTestId("editor");
121
- await user.type(editor, "Hello, world!");
122
- expect(editor.textContent).toBe("Hello, world!");
123
- expect(dispatchTransaction).toHaveBeenCalledTimes(13);
124
- });
125
- it("supports controlling the editor state", async ()=>{
126
- const schema = new _prosemirrorModel.Schema({
127
- nodes: {
128
- text: {},
129
- doc: {
130
- content: "text*"
131
- }
132
- }
133
- });
134
- let observedState = _prosemirrorState.EditorState.create({
135
- schema
136
- });
137
- function TestEditor() {
138
- const [state, setState] = (0, _react1.useState)(observedState);
139
- const [mount, setMount] = (0, _react1.useState)(null);
140
- (0, _react1.useEffect)(()=>{
141
- observedState = state;
142
- }, [
143
- state
144
- ]);
145
- return /*#__PURE__*/ _react1.default.createElement(_proseMirrorJs.ProseMirror, {
146
- mount: mount,
147
- state: state,
148
- dispatchTransaction: (tr)=>{
149
- setState((s)=>s.apply(tr));
150
- }
151
- }, /*#__PURE__*/ _react1.default.createElement("div", {
152
- "data-testid": "editor",
153
- ref: setMount
154
- }));
155
- }
156
- const user = _userEvent.default.setup();
157
- (0, _react.render)(/*#__PURE__*/ _react1.default.createElement(TestEditor, null));
158
- const editor = _react.screen.getByTestId("editor");
159
- await user.type(editor, "Hello, world!");
160
- expect(observedState.doc.textContent).toBe("Hello, world!");
161
- });
162
- it("updates props atomically", async ()=>{
163
- const schema = new _prosemirrorModel.Schema({
164
- nodes: {
165
- text: {},
166
- doc: {
167
- content: "text*"
168
- }
169
- }
170
- });
171
- const defaultState = _prosemirrorState.EditorState.create({
172
- schema
173
- });
174
- let allStatesMatched = true;
175
- function TestEditor() {
176
- const [state, setState] = (0, _react1.useState)(defaultState);
177
- const [mount, setMount] = (0, _react1.useState)(null);
178
- // Check that function props get invoked with the latest React state.
179
- const editable = (viewState)=>{
180
- allStatesMatched &&= viewState === state;
181
- return true;
182
- };
183
- return /*#__PURE__*/ _react1.default.createElement(_proseMirrorJs.ProseMirror, {
184
- mount: mount,
185
- editable: editable,
186
- state: state,
187
- dispatchTransaction: (tr)=>{
188
- setState((s)=>s.apply(tr));
189
- }
190
- }, /*#__PURE__*/ _react1.default.createElement("div", {
191
- "data-testid": "editor",
192
- ref: setMount
193
- }));
194
- }
195
- const user = _userEvent.default.setup();
196
- (0, _react.render)(/*#__PURE__*/ _react1.default.createElement(TestEditor, null));
197
- const editor = _react.screen.getByTestId("editor");
198
- await user.type(editor, "Hello, world!");
199
- expect(allStatesMatched).toBe(true);
200
- });
201
- it("supports React NodeViews", async ()=>{
202
- const schema = new _prosemirrorModel.Schema({
203
- nodes: {
204
- text: {},
205
- paragraph: {
206
- content: "text*"
207
- },
208
- doc: {
209
- content: "paragraph+"
210
- }
211
- }
212
- });
213
- const defaultState = _prosemirrorState.EditorState.create({
214
- schema,
215
- plugins: [
216
- (0, _reactJs.react)()
217
- ]
218
- });
219
- function Paragraph(param) {
220
- let { children } = param;
221
- return /*#__PURE__*/ _react1.default.createElement("p", {
222
- "data-testid": "paragraph"
223
- }, children);
224
- }
225
- const nodeViews = {
226
- paragraph: ()=>({
227
- component: Paragraph,
228
- dom: document.createElement("div"),
229
- contentDOM: document.createElement("span")
230
- })
231
- };
232
- function TestEditor() {
233
- const [mount, setMount] = (0, _react1.useState)(null);
234
- return /*#__PURE__*/ _react1.default.createElement(_proseMirrorJs.ProseMirror, {
235
- mount: mount,
236
- defaultState: defaultState,
237
- nodeViews: nodeViews
238
- }, /*#__PURE__*/ _react1.default.createElement("div", {
239
- "data-testid": "editor",
240
- ref: setMount
241
- }));
242
- }
243
- const user = _userEvent.default.setup();
244
- (0, _react.render)(/*#__PURE__*/ _react1.default.createElement(TestEditor, null));
245
- const editor = _react.screen.getByTestId("editor");
246
- await user.type(editor, "Hello, world!");
247
- expect(editor.textContent).toBe("Hello, world!");
248
- // Ensure that ProseMirror really rendered our Paragraph
249
- // component, not just any old <p> tag
250
- expect(_react.screen.getAllByTestId("paragraph").length).toBeGreaterThanOrEqual(1);
251
- });
252
- afterAll(()=>{
253
- (0, _setupProseMirrorViewJs.teardownProseMirrorView)();
254
- });
255
- });
@@ -1,10 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "NodeViewsContext", {
6
- enumerable: true,
7
- get: ()=>NodeViewsContext
8
- });
9
- const _react = require("react");
10
- const NodeViewsContext = (0, _react.createContext)(null);