@handlewithcare/react-prosemirror 3.1.0-tiptap.36 → 3.1.0-tiptap.37

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 (42) hide show
  1. package/dist/tsconfig.tsbuildinfo +1 -1
  2. package/dist/types/props.d.ts +6 -6
  3. package/package.json +1 -1
  4. package/dist/cjs/components/CustomNodeView.js +0 -132
  5. package/dist/cjs/components/DefaultNodeView.js +0 -67
  6. package/dist/cjs/components/DocNodeView.js +0 -96
  7. package/dist/cjs/components/MarkView.js +0 -119
  8. package/dist/cjs/components/NodeView.js +0 -86
  9. package/dist/cjs/components/NodeViewComponentProps.js +0 -4
  10. package/dist/cjs/components/ReactNodeView.js +0 -174
  11. package/dist/cjs/components/marks/CustomMarkView.js +0 -110
  12. package/dist/cjs/components/marks/OldMarkView.js +0 -120
  13. package/dist/cjs/components/nodes/CustomNodeView.js +0 -135
  14. package/dist/cjs/contexts/ChildDescriptorsContext.js +0 -19
  15. package/dist/cjs/hooks/useNodeViewDescriptor.js +0 -156
  16. package/dist/cjs/tiptap/TiptapNodeView.js +0 -26
  17. package/dist/esm/components/CustomNodeView.js +0 -81
  18. package/dist/esm/components/DefaultNodeView.js +0 -16
  19. package/dist/esm/components/DocNodeView.js +0 -45
  20. package/dist/esm/components/MarkView.js +0 -68
  21. package/dist/esm/components/NodeView.js +0 -35
  22. package/dist/esm/components/NodeViewComponentProps.js +0 -1
  23. package/dist/esm/components/ReactNodeView.js +0 -123
  24. package/dist/esm/components/marks/CustomMarkView.js +0 -59
  25. package/dist/esm/components/marks/OldMarkView.js +0 -69
  26. package/dist/esm/components/nodes/CustomNodeView.js +0 -84
  27. package/dist/esm/contexts/ChildDescriptorsContext.js +0 -9
  28. package/dist/esm/hooks/useNodeViewDescriptor.js +0 -146
  29. package/dist/esm/tiptap/TiptapNodeView.js +0 -22
  30. package/dist/types/components/CustomNodeView.d.ts +0 -12
  31. package/dist/types/components/DefaultNodeView.d.ts +0 -3
  32. package/dist/types/components/DocNodeView.d.ts +0 -12
  33. package/dist/types/components/MarkView.d.ts +0 -9
  34. package/dist/types/components/NodeView.d.ts +0 -11
  35. package/dist/types/components/NodeViewComponentProps.d.ts +0 -12
  36. package/dist/types/components/ReactNodeView.d.ts +0 -13
  37. package/dist/types/components/marks/CustomMarkView.d.ts +0 -12
  38. package/dist/types/components/marks/OldMarkView.d.ts +0 -10
  39. package/dist/types/components/nodes/CustomNodeView.d.ts +0 -12
  40. package/dist/types/contexts/ChildDescriptorsContext.d.ts +0 -6
  41. package/dist/types/hooks/useNodeViewDescriptor.d.ts +0 -20
  42. package/dist/types/tiptap/TiptapNodeView.d.ts +0 -15
@@ -1,156 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "useNodeViewDescriptor", {
6
- enumerable: true,
7
- get: function() {
8
- return useNodeViewDescriptor;
9
- }
10
- });
11
- const _react = require("react");
12
- const _ReactEditorView = require("../ReactEditorView.js");
13
- const _ChildDescriptorsContext = require("../contexts/ChildDescriptorsContext.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");
18
- function findContentDOM(view, source, children) {
19
- // When a composition is happening, we want to essentially freeze everything,
20
- // so we maintain the current contentDOM.
21
- return view.composing ? source?.contentDOM ?? null : children[0]?.dom?.parentElement ?? null;
22
- }
23
- function useNodeViewDescriptor(ref, constructor, props) {
24
- const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
25
- const { parentRef, siblingsRef } = (0, _react.useContext)(_ChildDescriptorsContext.ChildDescriptorsContext);
26
- const [dom, setDOM] = (0, _react.useState)(null);
27
- const [nodeDOM, setNodeDOM] = (0, _react.useState)(null);
28
- const [contentDOM, setContentDOM] = (0, _react.useState)(null);
29
- const viewDescRef = (0, _react.useRef)();
30
- const childrenRef = (0, _react.useRef)([]);
31
- const create = (0, _useEffectEvent.useEffectEvent)(()=>{
32
- if (!(view instanceof _ReactEditorView.ReactEditorView)) {
33
- return;
34
- }
35
- const dom = ref.current;
36
- if (!dom) {
37
- return;
38
- }
39
- const { node, getPos, decorations, innerDecorations } = props;
40
- const nodeView = constructor(node, view, getPos, decorations, innerDecorations);
41
- if (!nodeView) {
42
- return;
43
- }
44
- const parent = parentRef.current;
45
- const children = childrenRef.current;
46
- const contentDOM = findContentDOM(view, nodeView, children);
47
- const nodeDOM = nodeView.dom;
48
- const viewDesc = new _viewdesc.ReactNodeViewDesc(parent, children, getPos, node, decorations, innerDecorations, dom, contentDOM, nodeDOM, nodeView);
49
- setDOM(dom);
50
- setContentDOM(contentDOM);
51
- setNodeDOM(nodeDOM);
52
- return viewDesc;
53
- });
54
- const update = (0, _useEffectEvent.useEffectEvent)(()=>{
55
- if (!(view instanceof _ReactEditorView.ReactEditorView)) {
56
- return false;
57
- }
58
- const viewDesc = viewDescRef.current;
59
- if (!viewDesc) {
60
- return false;
61
- }
62
- const dom = ref.current;
63
- if (!dom || dom !== viewDesc.dom) {
64
- return false;
65
- }
66
- const contentDOM = findContentDOM(view, viewDesc, viewDesc.children);
67
- if (contentDOM !== viewDesc.contentDOM) {
68
- return false;
69
- }
70
- if (!dom.contains(viewDesc.nodeDOM)) {
71
- return false;
72
- }
73
- const { node, decorations, innerDecorations } = props;
74
- return viewDesc.matchesNode(node, decorations, innerDecorations) || viewDesc.update(node, decorations, innerDecorations, view);
75
- });
76
- const destroy = (0, _useEffectEvent.useEffectEvent)(()=>{
77
- const viewDesc = viewDescRef.current;
78
- if (!viewDesc) {
79
- return;
80
- }
81
- viewDesc.destroy();
82
- const siblings = siblingsRef.current;
83
- if (siblings.includes(viewDesc)) {
84
- const index = siblings.indexOf(viewDesc);
85
- siblings.splice(index, 1);
86
- }
87
- setDOM(null);
88
- setContentDOM(null);
89
- setNodeDOM(null);
90
- });
91
- (0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
92
- viewDescRef.current = create();
93
- return ()=>{
94
- destroy();
95
- };
96
- }, [
97
- create,
98
- destroy
99
- ]);
100
- (0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
101
- if (!update()) {
102
- destroy();
103
- viewDescRef.current = create();
104
- }
105
- const viewDesc = viewDescRef.current;
106
- if (!viewDesc) {
107
- return;
108
- }
109
- if (view.dom === viewDesc.dom && view instanceof _ReactEditorView.ReactEditorView) {
110
- view.docView = viewDesc;
111
- }
112
- const parent = parentRef.current;
113
- const siblings = siblingsRef.current;
114
- const children = childrenRef.current;
115
- viewDesc.parent = parent;
116
- if (!siblings.includes(viewDesc)) {
117
- siblings.push(viewDesc);
118
- }
119
- siblings.sort(_viewdesc.sortViewDescs);
120
- for (const child of children){
121
- child.parent = viewDesc;
122
- // Because TextNodeViews can't locate the DOM nodes
123
- // for compositions, we need to override them here
124
- if (child instanceof _viewdesc.CompositionViewDesc) {
125
- const compositionTopDOM = viewDesc?.contentDOM?.firstChild;
126
- if (!compositionTopDOM) throw new Error(`Started a composition but couldn't find the text node it belongs to.`);
127
- let textDOM = compositionTopDOM;
128
- while(textDOM.firstChild){
129
- textDOM = textDOM.firstChild;
130
- }
131
- if (!textDOM || !(textDOM instanceof Text)) throw new Error(`Started a composition but couldn't find the text node it belongs to.`);
132
- child.dom = compositionTopDOM;
133
- child.textDOM = textDOM;
134
- child.text = textDOM.data;
135
- child.textDOM.pmViewDesc = child;
136
- // It should not be possible to be in a composition because one could
137
- // not start between the renders that switch the view type.
138
- view.input.compositionNodes.push(child);
139
- }
140
- }
141
- });
142
- const childContextValue = (0, _react.useMemo)(()=>({
143
- parentRef: viewDescRef,
144
- siblingsRef: childrenRef
145
- }), [
146
- childrenRef,
147
- viewDescRef
148
- ]);
149
- return {
150
- childContextValue,
151
- dom,
152
- contentDOM,
153
- nodeDOM,
154
- ref
155
- };
156
- }
@@ -1,26 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "ReactProseMirrorNodeView", {
6
- enumerable: true,
7
- get: function() {
8
- return ReactProseMirrorNodeView;
9
- }
10
- });
11
- const _core = require("@tiptap/core");
12
- let ReactProseMirrorNodeView = class ReactProseMirrorNodeView extends _core.NodeView {
13
- _dom;
14
- _contentDOM;
15
- constructor(component, props, dom, contentDOM, options){
16
- super(component, props, options);
17
- this._dom = dom;
18
- this._contentDOM = contentDOM;
19
- }
20
- get dom() {
21
- return this._dom;
22
- }
23
- get contentDOM() {
24
- return this._contentDOM;
25
- }
26
- };
@@ -1,81 +0,0 @@
1
- import { DOMSerializer } from "prosemirror-model";
2
- import React, { cloneElement, memo, useMemo, useRef } from "react";
3
- import { createPortal } from "react-dom";
4
- import { ChildDescriptorsContext } from "../contexts/ChildDescriptorsContext.js";
5
- import { useNodeViewDescriptor } from "../hooks/useNodeViewDescriptor.js";
6
- import { ChildNodeViews, wrapInDeco } from "./ChildNodeViews.js";
7
- export const CustomNodeView = /*#__PURE__*/ memo(function CustomNodeView(param) {
8
- let { constructor, node, getPos, innerDeco, outerDeco } = param;
9
- const ref = useRef(null);
10
- const innerRef = useRef(null);
11
- const nodeProps = useMemo(()=>({
12
- node,
13
- getPos,
14
- decorations: outerDeco,
15
- innerDecorations: innerDeco
16
- }), [
17
- node,
18
- getPos,
19
- outerDeco,
20
- innerDeco
21
- ]);
22
- const createNodeView = function() {
23
- for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
24
- args[_key] = arguments[_key];
25
- }
26
- const nodeView = constructor(...args);
27
- if (!nodeView || !nodeView.dom) {
28
- const spec = node.type.spec.toDOM?.(node);
29
- if (!spec) {
30
- throw new Error(`Node spec for ${node.type.name} is missing toDOM`);
31
- }
32
- return DOMSerializer.renderSpec(document, spec, null);
33
- }
34
- return nodeView;
35
- };
36
- const { childContextValue, contentDOM } = useNodeViewDescriptor(ref, function() {
37
- for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
38
- args[_key] = arguments[_key];
39
- }
40
- const nodeView = createNodeView(...args);
41
- const contentDOM = nodeView.contentDOM;
42
- const nodeDOM = nodeView.dom;
43
- const wrapperDOM = innerRef.current ?? ref.current;
44
- wrapperDOM.appendChild(nodeDOM);
45
- if (!contentDOM && nodeDOM instanceof HTMLElement && nodeDOM.tagName !== "BR") {
46
- if (!nodeDOM.hasAttribute("contenteditable")) {
47
- nodeDOM.contentEditable = "false";
48
- }
49
- if (node.type.spec.draggable) {
50
- nodeDOM.draggable = true;
51
- }
52
- }
53
- return {
54
- ...nodeView,
55
- destroy () {
56
- if (nodeView.destroy) {
57
- nodeView.destroy();
58
- }
59
- wrapperDOM.removeChild(nodeDOM);
60
- },
61
- selectNode: nodeView.selectNode?.bind(nodeView),
62
- deselectNode: nodeView.deselectNode?.bind(nodeView),
63
- stopEvent: nodeView.stopEvent?.bind(nodeView),
64
- ignoreMutation: nodeView.ignoreMutation?.bind(nodeView)
65
- };
66
- }, nodeProps);
67
- const Component = node.isInline ? "span" : "div";
68
- const props = {
69
- ref: innerRef
70
- };
71
- const children = !node.isLeaf && contentDOM ? /*#__PURE__*/ createPortal(/*#__PURE__*/ React.createElement(ChildDescriptorsContext.Provider, {
72
- value: childContextValue
73
- }, /*#__PURE__*/ React.createElement(ChildNodeViews, {
74
- getPos: getPos,
75
- node: node,
76
- innerDecorations: innerDeco
77
- })), contentDOM) : null;
78
- return /*#__PURE__*/ cloneElement(outerDeco.reduce(wrapInDeco, /*#__PURE__*/ React.createElement(Component, props, children)), {
79
- ref
80
- });
81
- });
@@ -1,16 +0,0 @@
1
- import React, { forwardRef, useMemo } from "react";
2
- import { OutputSpec } from "./OutputSpec.js";
3
- export const DefaultNodeView = /*#__PURE__*/ forwardRef(function DefaultNodeView(param, ref) {
4
- let { nodeProps: { node }, children, ...props } = param;
5
- const spec = useMemo(()=>node.type.spec.toDOM?.(node), [
6
- node
7
- ]);
8
- if (!spec) {
9
- throw new Error(`Node spec for ${node.type.name} is missing toDOM`);
10
- }
11
- return /*#__PURE__*/ React.createElement(OutputSpec, {
12
- ...props,
13
- outputSpec: spec,
14
- ref: ref
15
- }, children);
16
- });
@@ -1,45 +0,0 @@
1
- import React, { cloneElement, createElement, forwardRef, memo, useImperativeHandle, useMemo, useRef } from "react";
2
- import { ChildDescriptorsContext } from "../contexts/ChildDescriptorsContext.js";
3
- import { useNodeViewDescriptor } from "../hooks/useNodeViewDescriptor.js";
4
- import { ChildNodeViews, wrapInDeco } from "./ChildNodeViews.js";
5
- export const DocNodeView = /*#__PURE__*/ memo(/*#__PURE__*/ forwardRef(function DocNodeView(param, ref) {
6
- let { as, node, getPos, decorations, innerDecorations, setMount, ...elementProps } = param;
7
- const innerRef = useRef(null);
8
- useImperativeHandle(ref, ()=>innerRef.current);
9
- useImperativeHandle(setMount, ()=>innerRef.current);
10
- const nodeProps = useMemo(()=>({
11
- node,
12
- getPos,
13
- decorations,
14
- innerDecorations
15
- }), [
16
- node,
17
- getPos,
18
- decorations,
19
- innerDecorations
20
- ]);
21
- const { childContextValue } = useNodeViewDescriptor(innerRef, ()=>{
22
- const dom = innerRef.current;
23
- return {
24
- dom,
25
- contentDOM: dom,
26
- update () {
27
- return true;
28
- }
29
- };
30
- }, nodeProps);
31
- const children = /*#__PURE__*/ React.createElement(ChildDescriptorsContext.Provider, {
32
- value: childContextValue
33
- }, /*#__PURE__*/ React.createElement(ChildNodeViews, {
34
- getPos: getPos,
35
- node: node,
36
- innerDecorations: innerDecorations
37
- }));
38
- const props = {
39
- ...elementProps,
40
- suppressContentEditableWarning: true,
41
- ref: innerRef
42
- };
43
- const element = as ? /*#__PURE__*/ cloneElement(as, props, children) : /*#__PURE__*/ createElement("div", props, children);
44
- return nodeProps.decorations.reduce(wrapInDeco, element);
45
- }));
@@ -1,68 +0,0 @@
1
- import React, { forwardRef, memo, useContext, useImperativeHandle, useMemo, useRef } from "react";
2
- import { ChildDescriptorsContext } from "../contexts/ChildDescriptorsContext.js";
3
- import { useClientLayoutEffect } from "../hooks/useClientLayoutEffect.js";
4
- import { MarkViewDesc, sortViewDescs } from "../viewdesc.js";
5
- import { OutputSpec } from "./OutputSpec.js";
6
- export const MarkView = /*#__PURE__*/ memo(/*#__PURE__*/ forwardRef(function MarkView(param, ref) {
7
- let { mark, getPos, children } = param;
8
- const { siblingsRef, parentRef } = useContext(ChildDescriptorsContext);
9
- const viewDescRef = useRef(undefined);
10
- const childDescriptors = useRef([]);
11
- const domRef = useRef(null);
12
- useImperativeHandle(ref, ()=>{
13
- return domRef.current;
14
- }, []);
15
- const outputSpec = useMemo(()=>mark.type.spec.toDOM?.(mark, true), [
16
- mark
17
- ]);
18
- if (!outputSpec) throw new Error(`Mark spec for ${mark.type.name} is missing toDOM`);
19
- useClientLayoutEffect(()=>{
20
- const siblings = siblingsRef.current;
21
- return ()=>{
22
- if (!viewDescRef.current) return;
23
- if (siblings.includes(viewDescRef.current)) {
24
- const index = siblings.indexOf(viewDescRef.current);
25
- siblings.splice(index, 1);
26
- }
27
- };
28
- }, [
29
- siblingsRef
30
- ]);
31
- useClientLayoutEffect(()=>{
32
- if (!domRef.current) return;
33
- const firstChildDesc = childDescriptors.current[0];
34
- if (!viewDescRef.current) {
35
- viewDescRef.current = new MarkViewDesc(parentRef.current, childDescriptors.current, getPos, mark, domRef.current, firstChildDesc?.dom.parentElement ?? domRef.current, {
36
- dom: domRef.current,
37
- contentDOM: firstChildDesc?.dom.parentElement ?? domRef.current
38
- });
39
- } else {
40
- viewDescRef.current.parent = parentRef.current;
41
- viewDescRef.current.spec.dom = viewDescRef.current.dom = domRef.current;
42
- viewDescRef.current.children = childDescriptors.current;
43
- viewDescRef.current.spec.contentDOM = viewDescRef.current.contentDOM = firstChildDesc?.dom.parentElement ?? domRef.current;
44
- viewDescRef.current.mark = mark;
45
- }
46
- if (!siblingsRef.current.includes(viewDescRef.current)) {
47
- siblingsRef.current.push(viewDescRef.current);
48
- }
49
- siblingsRef.current.sort(sortViewDescs);
50
- for (const childDesc of childDescriptors.current){
51
- childDesc.parent = viewDescRef.current;
52
- }
53
- });
54
- const childContextValue = useMemo(()=>({
55
- parentRef: viewDescRef,
56
- siblingsRef: childDescriptors
57
- }), [
58
- childDescriptors,
59
- viewDescRef
60
- ]);
61
- return /*#__PURE__*/ React.createElement(OutputSpec, {
62
- ref: domRef,
63
- outputSpec: outputSpec,
64
- isMark: true
65
- }, /*#__PURE__*/ React.createElement(ChildDescriptorsContext.Provider, {
66
- value: childContextValue
67
- }, children));
68
- }));
@@ -1,35 +0,0 @@
1
- import React, { memo, useContext, useMemo } from "react";
2
- import { NodeViewContext } from "../contexts/NodeViewContext.js";
3
- import { CustomNodeView } from "./CustomNodeView.js";
4
- import { DefaultNodeView } from "./DefaultNodeView.js";
5
- import { ReactNodeView } from "./ReactNodeView.js";
6
- export const NodeView = /*#__PURE__*/ memo(function NodeView(props) {
7
- const { components, constructors } = useContext(NodeViewContext);
8
- const component = components[props.node.type.name] ?? DefaultNodeView;
9
- const constructor = constructors[props.node.type.name];
10
- // Construct a wrapper component so that the node view remounts when either
11
- // its component or constructor changes. A React node view would remount if
12
- // its underlying component changed without this wrapper, but a custom node
13
- // view otherwise uses the same React components for all custom node views.
14
- const Component = useMemo(()=>{
15
- if (constructor) {
16
- return function NodeView(props) {
17
- return /*#__PURE__*/ React.createElement(CustomNodeView, {
18
- constructor: constructor,
19
- ...props
20
- });
21
- };
22
- } else {
23
- return function NodeView(props) {
24
- return /*#__PURE__*/ React.createElement(ReactNodeView, {
25
- component: component,
26
- ...props
27
- });
28
- };
29
- }
30
- }, [
31
- constructor,
32
- component
33
- ]);
34
- return /*#__PURE__*/ React.createElement(Component, props);
35
- });
@@ -1 +0,0 @@
1
- export { };
@@ -1,123 +0,0 @@
1
- import React, { cloneElement, memo, useCallback, useMemo, useRef, useState } from "react";
2
- import { ChildDescriptorsContext } from "../contexts/ChildDescriptorsContext.js";
3
- import { IgnoreMutationContext } from "../contexts/IgnoreMutationContext.js";
4
- import { SelectNodeContext } from "../contexts/SelectNodeContext.js";
5
- import { StopEventContext } from "../contexts/StopEventContext.js";
6
- import { useNodeViewDescriptor } from "../hooks/useNodeViewDescriptor.js";
7
- import { ChildNodeViews, wrapInDeco } from "./ChildNodeViews.js";
8
- export const ReactNodeView = /*#__PURE__*/ memo(function ReactNodeView(param) {
9
- let { component: Component, outerDeco, getPos, node, innerDeco } = param;
10
- const [hasCustomSelectNode, setHasCustomSelectNode] = useState(false);
11
- const [selected, setSelected] = useState(false);
12
- const ref = useRef(null);
13
- const innerRef = useRef(null);
14
- const selectNodeRef = useRef(null);
15
- const deselectNodeRef = useRef(null);
16
- const stopEventRef = useRef(null);
17
- const ignoreMutationRef = useRef(null);
18
- const setSelectNode = useCallback((selectHandler, deselectHandler)=>{
19
- selectNodeRef.current = selectHandler;
20
- deselectNodeRef.current = deselectHandler;
21
- setHasCustomSelectNode(true);
22
- return ()=>{
23
- selectNodeRef.current = null;
24
- deselectNodeRef.current = null;
25
- setHasCustomSelectNode(false);
26
- };
27
- }, []);
28
- const setStopEvent = useCallback((handler)=>{
29
- stopEventRef.current = handler;
30
- return ()=>{
31
- stopEventRef.current = null;
32
- };
33
- }, []);
34
- const setIgnoreMutation = useCallback((handler)=>{
35
- ignoreMutationRef.current = handler;
36
- return ()=>{
37
- ignoreMutationRef.current = null;
38
- return ()=>{
39
- ignoreMutationRef.current = null;
40
- };
41
- };
42
- }, []);
43
- const nodeProps = useMemo(()=>({
44
- node: node,
45
- getPos: getPos,
46
- decorations: outerDeco,
47
- innerDecorations: innerDeco
48
- }), [
49
- getPos,
50
- innerDeco,
51
- node,
52
- outerDeco
53
- ]);
54
- const { childContextValue, contentDOM, nodeDOM } = useNodeViewDescriptor(ref, ()=>{
55
- setSelected(false);
56
- return {
57
- dom: innerRef.current ?? ref.current,
58
- update () {
59
- return true;
60
- },
61
- multiType: true,
62
- selectNode () {
63
- const selectNode = selectNodeRef.current;
64
- if (selectNode) {
65
- selectNode.call(this);
66
- }
67
- setSelected(true);
68
- },
69
- deselectNode () {
70
- const deselectNode = deselectNodeRef.current;
71
- if (deselectNode) {
72
- deselectNode.call(this);
73
- }
74
- setSelected(false);
75
- },
76
- stopEvent (event) {
77
- const stopEvent = stopEventRef.current;
78
- if (stopEvent) {
79
- return stopEvent.call(this, event);
80
- }
81
- return false;
82
- },
83
- ignoreMutation (mutation) {
84
- const ignoreMutation = ignoreMutationRef.current;
85
- if (ignoreMutation) {
86
- return ignoreMutation.call(this, mutation);
87
- }
88
- return false;
89
- }
90
- };
91
- }, nodeProps);
92
- const props = {
93
- nodeProps,
94
- ...!contentDOM && !nodeProps.node.isText && nodeDOM?.nodeName !== "BR" ? {
95
- contentEditable: false,
96
- suppressContentEditableWarning: true
97
- } : null,
98
- ...!hasCustomSelectNode && selected ? {
99
- className: "ProseMirror-selectednode"
100
- } : null,
101
- ...!hasCustomSelectNode && selected || node.type.spec.draggable ? {
102
- draggable: true
103
- } : null,
104
- ref: innerRef
105
- };
106
- const children = !node.isLeaf ? /*#__PURE__*/ React.createElement(ChildNodeViews, {
107
- getPos: getPos,
108
- node: node,
109
- innerDecorations: innerDeco
110
- }) : null;
111
- const element = /*#__PURE__*/ cloneElement(outerDeco.reduce(wrapInDeco, /*#__PURE__*/ React.createElement(Component, props, children)), {
112
- ref
113
- });
114
- return /*#__PURE__*/ React.createElement(SelectNodeContext.Provider, {
115
- value: setSelectNode
116
- }, /*#__PURE__*/ React.createElement(StopEventContext.Provider, {
117
- value: setStopEvent
118
- }, /*#__PURE__*/ React.createElement(IgnoreMutationContext.Provider, {
119
- value: setIgnoreMutation
120
- }, /*#__PURE__*/ React.createElement(ChildDescriptorsContext.Provider, {
121
- value: childContextValue
122
- }, element))));
123
- });
@@ -1,59 +0,0 @@
1
- import { DOMSerializer } from "prosemirror-model";
2
- import React, { memo, useMemo, useRef } from "react";
3
- import { createPortal } from "react-dom";
4
- import { ChildDescriptionsContext } from "../../contexts/ChildDescriptionsContext.js";
5
- import { useMarkViewDescription } from "../../hooks/useMarkViewDescription.js";
6
- export const CustomMarkView = /*#__PURE__*/ memo(function CustomMarkView(param) {
7
- let { constructor, mark, inline, getPos, children } = param;
8
- const ref = useRef(null);
9
- const innerRef = useRef(null);
10
- const markProps = useMemo(()=>({
11
- mark,
12
- inline,
13
- getPos,
14
- contentDOMRef: {
15
- current: null
16
- }
17
- }), [
18
- mark,
19
- inline,
20
- getPos
21
- ]);
22
- const createMarkView = function() {
23
- for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
24
- args[_key] = arguments[_key];
25
- }
26
- const markView = constructor(...args);
27
- if (!markView || !markView.dom) {
28
- const spec = mark.type.spec.toDOM?.(mark, inline);
29
- if (!spec) {
30
- throw new Error(`Mark spec for ${mark.type.name} is missing toDOM`);
31
- }
32
- return DOMSerializer.renderSpec(document, spec, null);
33
- }
34
- return markView;
35
- };
36
- const { childContextValue, contentDOM } = useMarkViewDescription(ref, function() {
37
- for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
38
- args[_key] = arguments[_key];
39
- }
40
- const markView = createMarkView(...args);
41
- const dom = markView.dom;
42
- const wrapperDOM = innerRef.current ?? ref.current;
43
- return {
44
- ...markView,
45
- destroy () {
46
- markView.destroy?.();
47
- wrapperDOM.removeChild(dom);
48
- },
49
- ignoreMutation: markView.ignoreMutation
50
- };
51
- }, (markView)=>markView?.contentDOM ?? null, markProps);
52
- const Component = inline ? "span" : "div";
53
- const props = {
54
- ref: innerRef
55
- };
56
- return /*#__PURE__*/ React.createElement(Component, props, contentDOM ? /*#__PURE__*/ createPortal(/*#__PURE__*/ React.createElement(ChildDescriptionsContext.Provider, {
57
- value: childContextValue
58
- }, children), contentDOM) : null);
59
- });