@handlewithcare/react-prosemirror 2.9.0-tiptap.24 → 3.0.0
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 +140 -75
- package/dist/cjs/StaticEditorView.js +0 -3
- package/dist/cjs/components/ChildNodeViews.js +4 -4
- package/dist/cjs/components/NativeWidgetView.js +2 -2
- package/dist/cjs/components/OutputSpec.js +10 -3
- package/dist/cjs/components/ProseMirror.js +11 -17
- package/dist/cjs/components/SeparatorHackView.js +2 -2
- package/dist/cjs/components/TrailingHackView.js +2 -2
- package/dist/cjs/components/WidgetView.js +2 -2
- package/dist/cjs/components/marks/DefaultMarkView.js +2 -1
- package/dist/cjs/components/marks/MarkView.js +2 -2
- package/dist/cjs/components/marks/{CustomMarkView.js → MarkViewConstructorView.js} +16 -7
- package/dist/cjs/components/marks/ReactMarkView.js +26 -6
- package/dist/cjs/components/nodes/DefaultNodeView.js +3 -2
- package/dist/cjs/components/nodes/DocNodeView.js +7 -6
- package/dist/cjs/components/nodes/NodeView.js +17 -6
- package/dist/cjs/components/nodes/{CustomNodeView.js → NodeViewConstructorView.js} +22 -9
- package/dist/cjs/components/nodes/ReactNodeView.js +59 -17
- package/dist/cjs/contexts/{ChildDescriptorsContext.js → ChildDescriptionsContext.js} +3 -3
- package/dist/cjs/hooks/useEditor.js +0 -4
- package/dist/cjs/hooks/useEditorEventCallback.js +1 -1
- package/dist/cjs/hooks/useMarkViewDescription.js +24 -21
- package/dist/cjs/hooks/useNodePos.js +18 -0
- package/dist/cjs/hooks/{useNodeViewDescriptor.js → useNodeViewDescription.js} +30 -25
- package/dist/cjs/index.js +8 -0
- package/dist/cjs/refs.js +28 -0
- package/dist/cjs/viewdesc.js +18 -5
- package/dist/esm/StaticEditorView.js +0 -3
- package/dist/esm/components/ChildNodeViews.js +4 -4
- package/dist/esm/components/NativeWidgetView.js +2 -2
- package/dist/esm/components/OutputSpec.js +10 -3
- package/dist/esm/components/ProseMirror.js +11 -17
- package/dist/esm/components/SeparatorHackView.js +2 -2
- package/dist/esm/components/TrailingHackView.js +2 -2
- package/dist/esm/components/WidgetView.js +2 -2
- package/dist/esm/components/marks/DefaultMarkView.js +2 -1
- package/dist/esm/components/marks/MarkView.js +2 -2
- package/dist/esm/components/marks/{CustomMarkView.js → MarkViewConstructorView.js} +14 -5
- package/dist/esm/components/marks/ReactMarkView.js +26 -6
- package/dist/esm/components/nodes/DefaultNodeView.js +3 -2
- package/dist/esm/components/nodes/DocNodeView.js +8 -7
- package/dist/esm/components/nodes/NodeView.js +7 -4
- package/dist/esm/components/nodes/{CustomNodeView.js → NodeViewConstructorView.js} +20 -7
- package/dist/esm/components/nodes/ReactNodeView.js +59 -17
- package/dist/esm/contexts/{ChildDescriptorsContext.js → ChildDescriptionsContext.js} +1 -1
- package/dist/esm/hooks/useEditor.js +0 -4
- package/dist/esm/hooks/useEditorEffect.js +0 -4
- package/dist/esm/hooks/useEditorEventCallback.js +6 -4
- package/dist/esm/hooks/useMarkViewDescription.js +26 -23
- package/dist/esm/hooks/useNodePos.js +15 -0
- package/dist/esm/hooks/{useNodeViewDescriptor.js → useNodeViewDescription.js} +29 -24
- package/dist/esm/index.js +2 -0
- package/dist/esm/refs.js +18 -0
- package/dist/esm/viewdesc.js +13 -6
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/types/AbstractEditorView.d.ts +0 -1
- package/dist/types/StaticEditorView.d.ts +0 -1
- package/dist/types/components/OutputSpec.d.ts +2 -1
- package/dist/types/components/ProseMirror.d.ts +3 -11
- package/dist/types/components/ProseMirrorDoc.d.ts +2 -2
- package/dist/types/components/marks/DefaultMarkView.d.ts +1 -1
- package/dist/types/components/marks/MarkViewComponentProps.d.ts +4 -3
- package/dist/types/components/marks/{CustomMarkView.d.ts → MarkViewConstructorView.d.ts} +1 -1
- package/dist/types/components/nodes/DefaultNodeView.d.ts +1 -1
- package/dist/types/components/nodes/DocNodeView.d.ts +2 -2
- package/dist/types/components/nodes/NodeView.d.ts +1 -0
- package/dist/types/components/nodes/NodeViewComponentProps.d.ts +4 -3
- package/dist/types/components/{CustomNodeView.d.ts → nodes/NodeViewConstructorView.d.ts} +1 -1
- package/dist/types/constants.d.ts +1 -1
- package/dist/types/contexts/{ChildDescriptorsContext.d.ts → ChildDescriptionsContext.d.ts} +1 -1
- package/dist/types/hooks/useEditorEffect.d.ts +0 -4
- package/dist/types/hooks/useEditorEventCallback.d.ts +6 -4
- package/dist/types/hooks/useMarkViewDescription.d.ts +6 -9
- package/dist/types/hooks/useNodePos.d.ts +9 -0
- package/dist/types/hooks/{useNodeViewDescriptor.d.ts → useNodeViewDescription.d.ts} +5 -9
- package/dist/types/index.d.ts +2 -0
- package/dist/types/props.d.ts +26 -26
- package/dist/types/refs.d.ts +2 -0
- package/dist/types/viewdesc.d.ts +4 -0
- package/package.json +12 -20
- package/dist/cjs/components/CustomNodeView.js +0 -132
- package/dist/cjs/components/DefaultNodeView.js +0 -67
- package/dist/cjs/components/DocNodeView.js +0 -96
- package/dist/cjs/components/MarkView.js +0 -119
- package/dist/cjs/components/NodeView.js +0 -86
- package/dist/cjs/components/NodeViewComponentProps.js +0 -4
- package/dist/cjs/components/ReactNodeView.js +0 -174
- package/dist/cjs/components/marks/OldMarkView.js +0 -120
- package/dist/cjs/tiptap/ReactProseMirrorNodeView.js +0 -26
- package/dist/cjs/tiptap/TiptapEditor.js +0 -34
- package/dist/cjs/tiptap/TiptapEditorContent.js +0 -142
- package/dist/cjs/tiptap/TiptapEditorView.js +0 -118
- package/dist/cjs/tiptap/TiptapNodeView.js +0 -26
- package/dist/cjs/tiptap/contexts/TiptapEditorContext.js +0 -12
- package/dist/cjs/tiptap/extensions/ReactProseMirror.js +0 -40
- package/dist/cjs/tiptap/hooks/useIsInReactProseMirror.js +0 -15
- package/dist/cjs/tiptap/hooks/useTiptapEditor.js +0 -43
- package/dist/cjs/tiptap/hooks/useTiptapEditorEffect.js +0 -35
- package/dist/cjs/tiptap/hooks/useTiptapEditorEventCallback.js +0 -35
- package/dist/cjs/tiptap/index.js +0 -48
- package/dist/cjs/tiptap/tiptapNodeView.js +0 -237
- package/dist/esm/components/CustomNodeView.js +0 -81
- package/dist/esm/components/DefaultNodeView.js +0 -16
- package/dist/esm/components/DocNodeView.js +0 -45
- package/dist/esm/components/MarkView.js +0 -68
- package/dist/esm/components/NodeView.js +0 -35
- package/dist/esm/components/NodeViewComponentProps.js +0 -1
- package/dist/esm/components/ReactNodeView.js +0 -123
- package/dist/esm/components/marks/OldMarkView.js +0 -69
- package/dist/esm/tiptap/ReactProseMirrorNodeView.js +0 -22
- package/dist/esm/tiptap/TiptapEditor.js +0 -24
- package/dist/esm/tiptap/TiptapEditorContent.js +0 -91
- package/dist/esm/tiptap/TiptapEditorView.js +0 -69
- package/dist/esm/tiptap/TiptapNodeView.js +0 -22
- package/dist/esm/tiptap/contexts/TiptapEditorContext.js +0 -2
- package/dist/esm/tiptap/extensions/ReactProseMirror.js +0 -30
- package/dist/esm/tiptap/hooks/useIsInReactProseMirror.js +0 -5
- package/dist/esm/tiptap/hooks/useTiptapEditor.js +0 -33
- package/dist/esm/tiptap/hooks/useTiptapEditorEffect.js +0 -42
- package/dist/esm/tiptap/hooks/useTiptapEditorEventCallback.js +0 -35
- package/dist/esm/tiptap/index.js +0 -9
- package/dist/esm/tiptap/tiptapNodeView.js +0 -205
- package/dist/types/components/DefaultNodeView.d.ts +0 -3
- package/dist/types/components/DocNodeView.d.ts +0 -12
- package/dist/types/components/MarkView.d.ts +0 -9
- package/dist/types/components/NodeView.d.ts +0 -11
- package/dist/types/components/NodeViewComponentProps.d.ts +0 -12
- package/dist/types/components/ReactNodeView.d.ts +0 -13
- package/dist/types/components/marks/OldMarkView.d.ts +0 -10
- package/dist/types/components/nodes/CustomNodeView.d.ts +0 -12
- package/dist/types/tiptap/ReactProseMirrorNodeView.d.ts +0 -15
- package/dist/types/tiptap/TiptapEditor.d.ts +0 -6
- package/dist/types/tiptap/TiptapEditorContent.d.ts +0 -19
- package/dist/types/tiptap/TiptapEditorView.d.ts +0 -16
- package/dist/types/tiptap/TiptapNodeView.d.ts +0 -15
- package/dist/types/tiptap/contexts/TiptapEditorContext.d.ts +0 -6
- package/dist/types/tiptap/extensions/ReactProseMirror.d.ts +0 -9
- package/dist/types/tiptap/hooks/useIsInReactProseMirror.d.ts +0 -1
- package/dist/types/tiptap/hooks/useTiptapEditor.d.ts +0 -4
- package/dist/types/tiptap/hooks/useTiptapEditorEffect.d.ts +0 -21
- package/dist/types/tiptap/hooks/useTiptapEditorEventCallback.d.ts +0 -13
- package/dist/types/tiptap/index.d.ts +0 -9
- package/dist/types/tiptap/tiptapNodeView.d.ts +0 -50
|
@@ -11,7 +11,6 @@ export interface AbstractEditorView {
|
|
|
11
11
|
readonly nodeViews: NodeViewSet;
|
|
12
12
|
readonly props: DirectEditorProps;
|
|
13
13
|
readonly state: EditorState;
|
|
14
|
-
readonly isDestroyed: boolean;
|
|
15
14
|
setProps(props: Partial<DirectEditorProps>): void;
|
|
16
15
|
update(props: DirectEditorProps): void;
|
|
17
16
|
updateState(state: EditorState): void;
|
|
@@ -9,7 +9,6 @@ export declare class StaticEditorView implements AbstractEditorView {
|
|
|
9
9
|
get dom(): null;
|
|
10
10
|
get editable(): boolean;
|
|
11
11
|
get state(): EditorState;
|
|
12
|
-
get isDestroyed(): boolean;
|
|
13
12
|
setProps(props: Partial<DirectEditorProps>): void;
|
|
14
13
|
update(props: DirectEditorProps): void;
|
|
15
14
|
updateState(state: EditorState): void;
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { DOMOutputSpec } from "prosemirror-model";
|
|
2
|
-
import React, { HTMLProps, ReactNode } from "react";
|
|
2
|
+
import React, { HTMLProps, ReactNode, Ref } from "react";
|
|
3
3
|
type Props = HTMLProps<HTMLElement> & {
|
|
4
4
|
outputSpec: DOMOutputSpec;
|
|
5
5
|
isMark?: boolean;
|
|
6
6
|
children?: ReactNode;
|
|
7
|
+
contentDOMRef: Ref<HTMLElement | null>;
|
|
7
8
|
};
|
|
8
9
|
declare const ForwardedOutputSpec: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLElement>>>;
|
|
9
10
|
export { ForwardedOutputSpec as OutputSpec };
|
|
@@ -1,22 +1,14 @@
|
|
|
1
|
-
import { MarkViewConstructor, NodeViewConstructor } from "prosemirror-view";
|
|
2
1
|
import React, { ComponentType, ReactNode } from "react";
|
|
3
2
|
import { UseEditorOptions } from "../hooks/useEditor.js";
|
|
4
3
|
import { MarkViewComponentProps } from "./marks/MarkViewComponentProps.js";
|
|
5
4
|
import { NodeViewComponentProps } from "./nodes/NodeViewComponentProps.js";
|
|
6
|
-
export type Props =
|
|
7
|
-
className?: string;
|
|
5
|
+
export type Props = UseEditorOptions & {
|
|
8
6
|
children?: ReactNode;
|
|
9
|
-
|
|
7
|
+
nodeViewComponents?: {
|
|
10
8
|
[nodeType: string]: ComponentType<NodeViewComponentProps>;
|
|
11
9
|
};
|
|
12
|
-
|
|
13
|
-
[nodeType: string]: NodeViewConstructor;
|
|
14
|
-
};
|
|
15
|
-
markViews?: {
|
|
10
|
+
markViewComponents?: {
|
|
16
11
|
[markType: string]: ComponentType<MarkViewComponentProps>;
|
|
17
12
|
};
|
|
18
|
-
customMarkViews?: {
|
|
19
|
-
[markType: string]: MarkViewConstructor;
|
|
20
|
-
};
|
|
21
13
|
};
|
|
22
14
|
export declare function ProseMirror(props: Props): React.JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Node } from "prosemirror-model";
|
|
2
2
|
import { Decoration, DecorationSource } from "prosemirror-view";
|
|
3
|
-
import React, {
|
|
3
|
+
import React, { ElementType, HTMLProps } from "react";
|
|
4
4
|
interface DocNodeViewContextValue {
|
|
5
5
|
node: Node;
|
|
6
6
|
getPos: () => number;
|
|
@@ -10,7 +10,7 @@ interface DocNodeViewContextValue {
|
|
|
10
10
|
}
|
|
11
11
|
export declare const DocNodeViewContext: React.Context<DocNodeViewContextValue>;
|
|
12
12
|
interface Props extends Omit<HTMLProps<HTMLElement>, "as"> {
|
|
13
|
-
as?:
|
|
13
|
+
as?: ElementType;
|
|
14
14
|
}
|
|
15
15
|
export declare const ProseMirrorDoc: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLElement>>;
|
|
16
16
|
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { MarkViewComponentProps } from "./MarkViewComponentProps.js";
|
|
3
|
-
export declare const DefaultMarkView: React.ForwardRefExoticComponent<Omit<MarkViewComponentProps
|
|
3
|
+
export declare const DefaultMarkView: React.ForwardRefExoticComponent<Omit<MarkViewComponentProps<React.AllHTMLAttributes<HTMLElement>>, "ref"> & React.RefAttributes<HTMLElement>>;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { Mark } from "prosemirror-model";
|
|
2
|
-
import { AllHTMLAttributes, LegacyRef } from "react";
|
|
3
|
-
export
|
|
2
|
+
import { AllHTMLAttributes, LegacyRef, Ref } from "react";
|
|
3
|
+
export type MarkViewComponentProps<Attributes = AllHTMLAttributes<HTMLElement>> = Attributes & {
|
|
4
4
|
markProps: {
|
|
5
5
|
mark: Mark;
|
|
6
6
|
inline: boolean;
|
|
7
7
|
getPos: () => number;
|
|
8
|
+
contentDOMRef: Exclude<Ref<any>, null>;
|
|
8
9
|
};
|
|
9
10
|
ref: LegacyRef<any>;
|
|
10
|
-
}
|
|
11
|
+
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { NodeViewComponentProps } from "../nodes/NodeViewComponentProps.js";
|
|
3
|
-
export declare const DefaultNodeView: React.ForwardRefExoticComponent<Omit<NodeViewComponentProps
|
|
3
|
+
export declare const DefaultNodeView: React.ForwardRefExoticComponent<Omit<NodeViewComponentProps<React.AllHTMLAttributes<HTMLElement>>, "ref"> & React.RefAttributes<HTMLElement>>;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { Node } from "prosemirror-model";
|
|
2
2
|
import { Decoration, DecorationSource } from "prosemirror-view";
|
|
3
|
-
import React, {
|
|
3
|
+
import React, { ElementType, HTMLProps } from "react";
|
|
4
4
|
export interface DocNodeViewProps extends Omit<HTMLProps<HTMLElement>, "as"> {
|
|
5
|
-
as?:
|
|
5
|
+
as?: ElementType;
|
|
6
6
|
node: Node;
|
|
7
7
|
getPos: () => number;
|
|
8
8
|
decorations: readonly Decoration[];
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { Node } from "prosemirror-model";
|
|
2
2
|
import { Decoration, DecorationSource } from "prosemirror-view";
|
|
3
|
-
import { AllHTMLAttributes, LegacyRef } from "react";
|
|
4
|
-
export
|
|
3
|
+
import { AllHTMLAttributes, LegacyRef, Ref } from "react";
|
|
4
|
+
export type NodeViewComponentProps<Attributes = AllHTMLAttributes<HTMLElement>> = Attributes & {
|
|
5
5
|
nodeProps: {
|
|
6
6
|
decorations: readonly Decoration[];
|
|
7
7
|
innerDecorations: DecorationSource;
|
|
8
8
|
node: Node;
|
|
9
9
|
getPos: () => number;
|
|
10
|
+
contentDOMRef: Exclude<Ref<any>, null>;
|
|
10
11
|
};
|
|
11
12
|
ref: LegacyRef<any>;
|
|
12
|
-
}
|
|
13
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { Schema } from "prosemirror-model";
|
|
2
2
|
import { EditorState } from "prosemirror-state";
|
|
3
|
-
export declare const EMPTY_SCHEMA: Schema<"
|
|
3
|
+
export declare const EMPTY_SCHEMA: Schema<"doc" | "text", any>;
|
|
4
4
|
export declare const EMPTY_STATE: EditorState;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { MutableRefObject } from "react";
|
|
2
2
|
import { ViewDesc } from "../viewdesc.js";
|
|
3
|
-
export declare const
|
|
3
|
+
export declare const ChildDescriptionsContext: import("react").Context<{
|
|
4
4
|
parentRef: MutableRefObject<ViewDesc | undefined>;
|
|
5
5
|
siblingsRef: MutableRefObject<ViewDesc[]>;
|
|
6
6
|
}>;
|
|
@@ -13,9 +13,5 @@ import type { DependencyList } from "react";
|
|
|
13
13
|
* synchronously after all DOM mutations, but they do so
|
|
14
14
|
* _after_ the EditorView has been updated, even when the
|
|
15
15
|
* EditorView lives in an ancestor component.
|
|
16
|
-
*
|
|
17
|
-
* This hook can only be used in a component that is mounted
|
|
18
|
-
* as a child of the TiptapEditorView component, including
|
|
19
|
-
* React node view components.
|
|
20
16
|
*/
|
|
21
17
|
export declare function useEditorEffect(effect: (editorView: EditorView) => void | (() => void), dependencies?: DependencyList): void;
|
|
@@ -6,8 +6,10 @@ import type { EditorView } from "prosemirror-view";
|
|
|
6
6
|
* The callback will be called with the EditorView instance
|
|
7
7
|
* as its first argument.
|
|
8
8
|
*
|
|
9
|
-
* This hook
|
|
10
|
-
*
|
|
11
|
-
*
|
|
9
|
+
* This hook is dependent on both the
|
|
10
|
+
* `EditorViewContext.Provider` and the
|
|
11
|
+
* `DeferredLayoutEffectProvider`. It can only be used in a
|
|
12
|
+
* component that is mounted as a child of both of these
|
|
13
|
+
* providers.
|
|
12
14
|
*/
|
|
13
|
-
export declare function useEditorEventCallback<
|
|
15
|
+
export declare function useEditorEventCallback<T extends unknown[], R>(callback: (view: EditorView, ...args: T) => R): (...args: T) => R;
|
|
@@ -2,18 +2,15 @@ import { MarkViewConstructor } from "prosemirror-view";
|
|
|
2
2
|
import { MarkViewComponentProps } from "../components/marks/MarkViewComponentProps.js";
|
|
3
3
|
import { DOMNode } from "../dom.js";
|
|
4
4
|
import { MarkViewDesc, ViewDesc } from "../viewdesc.js";
|
|
5
|
-
type Props = MarkViewComponentProps["markProps"]
|
|
6
|
-
export declare function useMarkViewDescription(
|
|
7
|
-
|
|
8
|
-
}, constructor: MarkViewConstructor, props: Props): {
|
|
5
|
+
type Props = Omit<MarkViewComponentProps["markProps"], "contentDOMRef">;
|
|
6
|
+
export declare function useMarkViewDescription(getDOM: () => DOMNode | null, getContentDOM: (markView: {
|
|
7
|
+
contentDOM?: HTMLElement | null;
|
|
8
|
+
} | null) => HTMLElement | null, constructor: MarkViewConstructor, props: Props): {
|
|
9
9
|
childContextValue: {
|
|
10
10
|
parentRef: import("react").MutableRefObject<MarkViewDesc | undefined>;
|
|
11
11
|
siblingsRef: import("react").MutableRefObject<ViewDesc[]>;
|
|
12
12
|
};
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
ref: {
|
|
16
|
-
readonly current: DOMNode | null;
|
|
17
|
-
};
|
|
13
|
+
contentDOM: HTMLElement | undefined;
|
|
14
|
+
refUpdated: () => void;
|
|
18
15
|
};
|
|
19
16
|
export {};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Get this node's current position in the document.
|
|
3
|
+
*
|
|
4
|
+
* Using this hook will subscribe this node to the
|
|
5
|
+
* EditorState, which means that it will be re-rendered
|
|
6
|
+
* on every EditorState update. This may have performance
|
|
7
|
+
* implications for large documents.
|
|
8
|
+
*/
|
|
9
|
+
export declare function useNodePos(): number;
|
|
@@ -2,19 +2,15 @@ import { NodeViewConstructor } from "prosemirror-view";
|
|
|
2
2
|
import { NodeViewComponentProps } from "../components/nodes/NodeViewComponentProps.js";
|
|
3
3
|
import { DOMNode } from "../dom.js";
|
|
4
4
|
import { NodeViewDesc, ViewDesc } from "../viewdesc.js";
|
|
5
|
-
type Props = NodeViewComponentProps["nodeProps"]
|
|
6
|
-
export declare function
|
|
7
|
-
|
|
8
|
-
}, constructor: NodeViewConstructor, props: Props): {
|
|
5
|
+
type Props = Omit<NodeViewComponentProps["nodeProps"], "contentDOMRef">;
|
|
6
|
+
export declare function useNodeViewDescription(getDOM: () => DOMNode | null, getContentDOM: (nodeView: {
|
|
7
|
+
contentDOM?: HTMLElement | null;
|
|
8
|
+
} | null) => HTMLElement | null, constructor: NodeViewConstructor, props: Props): {
|
|
9
9
|
childContextValue: {
|
|
10
10
|
parentRef: import("react").MutableRefObject<NodeViewDesc | undefined>;
|
|
11
11
|
siblingsRef: import("react").MutableRefObject<ViewDesc[]>;
|
|
12
12
|
};
|
|
13
|
-
dom: Node | null;
|
|
14
13
|
contentDOM: HTMLElement | null;
|
|
15
|
-
|
|
16
|
-
ref: {
|
|
17
|
-
readonly current: DOMNode | null;
|
|
18
|
-
};
|
|
14
|
+
refUpdated: () => void;
|
|
19
15
|
};
|
|
20
16
|
export {};
|
package/dist/types/index.d.ts
CHANGED
|
@@ -5,6 +5,7 @@ export { useEditorEffect } from "./hooks/useEditorEffect.js";
|
|
|
5
5
|
export { useEditorEventCallback } from "./hooks/useEditorEventCallback.js";
|
|
6
6
|
export { useEditorEventListener } from "./hooks/useEditorEventListener.js";
|
|
7
7
|
export { useEditorState } from "./hooks/useEditorState.js";
|
|
8
|
+
export { useNodePos } from "./hooks/useNodePos.js";
|
|
8
9
|
export { useStopEvent } from "./hooks/useStopEvent.js";
|
|
9
10
|
export { useSelectNode } from "./hooks/useSelectNode.js";
|
|
10
11
|
export { useIgnoreMutation } from "./hooks/useIgnoreMutation.js";
|
|
@@ -12,6 +13,7 @@ export { useIsEditorStatic } from "./hooks/useIsEditorStatic.js";
|
|
|
12
13
|
export { useIsNodeSelected } from "./hooks/useIsNodeSelected.js";
|
|
13
14
|
export { reactKeys } from "./plugins/reactKeys.js";
|
|
14
15
|
export { widget } from "./decorations/ReactWidgetType.js";
|
|
16
|
+
export { useMergedDOMRefs } from "./refs.js";
|
|
15
17
|
export type { NodeViewComponentProps } from "./components/nodes/NodeViewComponentProps.js";
|
|
16
18
|
export type { MarkViewComponentProps } from "./components/marks/MarkViewComponentProps.js";
|
|
17
19
|
export type { WidgetViewComponentProps } from "./components/WidgetViewComponentProps.js";
|
package/dist/types/props.d.ts
CHANGED
|
@@ -904,19 +904,19 @@ export declare function mergeReactProps(a: HTMLProps<HTMLElement>, b: HTMLProps<
|
|
|
904
904
|
suppressContentEditableWarning?: boolean | undefined;
|
|
905
905
|
suppressHydrationWarning?: boolean | undefined;
|
|
906
906
|
accessKey?: string | undefined;
|
|
907
|
-
autoCapitalize?: "
|
|
907
|
+
autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | (string & {}) | undefined;
|
|
908
908
|
autoFocus?: boolean | undefined;
|
|
909
|
-
contentEditable?: (boolean | "
|
|
909
|
+
contentEditable?: (boolean | "false" | "true") | "inherit" | "plaintext-only" | undefined;
|
|
910
910
|
contextMenu?: string | undefined;
|
|
911
911
|
dir?: string | undefined;
|
|
912
|
-
draggable?: (boolean | "
|
|
913
|
-
enterKeyHint?: "
|
|
912
|
+
draggable?: (boolean | "false" | "true") | undefined;
|
|
913
|
+
enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
|
|
914
914
|
hidden?: boolean | undefined;
|
|
915
915
|
id?: string | undefined;
|
|
916
916
|
lang?: string | undefined;
|
|
917
917
|
nonce?: string | undefined;
|
|
918
918
|
slot?: string | undefined;
|
|
919
|
-
spellCheck?: (boolean | "
|
|
919
|
+
spellCheck?: (boolean | "false" | "true") | undefined;
|
|
920
920
|
tabIndex?: number | undefined;
|
|
921
921
|
title?: string | undefined;
|
|
922
922
|
translate?: "yes" | "no" | undefined;
|
|
@@ -944,57 +944,57 @@ export declare function mergeReactProps(a: HTMLProps<HTMLElement>, b: HTMLProps<
|
|
|
944
944
|
results?: number | undefined;
|
|
945
945
|
security?: string | undefined;
|
|
946
946
|
unselectable?: "off" | "on" | undefined;
|
|
947
|
-
inputMode?: "
|
|
947
|
+
inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
|
|
948
948
|
is?: string | undefined;
|
|
949
949
|
exportparts?: string | undefined;
|
|
950
950
|
part?: string | undefined;
|
|
951
951
|
"aria-activedescendant"?: string | undefined;
|
|
952
|
-
"aria-atomic"?: (boolean | "
|
|
953
|
-
"aria-autocomplete"?: "
|
|
952
|
+
"aria-atomic"?: (boolean | "false" | "true") | undefined;
|
|
953
|
+
"aria-autocomplete"?: "none" | "list" | "inline" | "both" | undefined;
|
|
954
954
|
"aria-braillelabel"?: string | undefined;
|
|
955
955
|
"aria-brailleroledescription"?: string | undefined;
|
|
956
|
-
"aria-busy"?: (boolean | "
|
|
957
|
-
"aria-checked"?: boolean | "
|
|
956
|
+
"aria-busy"?: (boolean | "false" | "true") | undefined;
|
|
957
|
+
"aria-checked"?: boolean | "false" | "true" | "mixed" | undefined;
|
|
958
958
|
"aria-colcount"?: number | undefined;
|
|
959
959
|
"aria-colindex"?: number | undefined;
|
|
960
960
|
"aria-colindextext"?: string | undefined;
|
|
961
961
|
"aria-colspan"?: number | undefined;
|
|
962
962
|
"aria-controls"?: string | undefined;
|
|
963
|
-
"aria-current"?: boolean | "
|
|
963
|
+
"aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
|
|
964
964
|
"aria-describedby"?: string | undefined;
|
|
965
965
|
"aria-description"?: string | undefined;
|
|
966
966
|
"aria-details"?: string | undefined;
|
|
967
|
-
"aria-disabled"?: (boolean | "
|
|
968
|
-
"aria-dropeffect"?: "
|
|
967
|
+
"aria-disabled"?: (boolean | "false" | "true") | undefined;
|
|
968
|
+
"aria-dropeffect"?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
|
|
969
969
|
"aria-errormessage"?: string | undefined;
|
|
970
|
-
"aria-expanded"?: (boolean | "
|
|
970
|
+
"aria-expanded"?: (boolean | "false" | "true") | undefined;
|
|
971
971
|
"aria-flowto"?: string | undefined;
|
|
972
|
-
"aria-grabbed"?: (boolean | "
|
|
973
|
-
"aria-haspopup"?: boolean | "
|
|
974
|
-
"aria-hidden"?: (boolean | "
|
|
975
|
-
"aria-invalid"?: boolean | "
|
|
972
|
+
"aria-grabbed"?: (boolean | "false" | "true") | undefined;
|
|
973
|
+
"aria-haspopup"?: boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
|
|
974
|
+
"aria-hidden"?: (boolean | "false" | "true") | undefined;
|
|
975
|
+
"aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
|
|
976
976
|
"aria-keyshortcuts"?: string | undefined;
|
|
977
977
|
"aria-label"?: string | undefined;
|
|
978
978
|
"aria-labelledby"?: string | undefined;
|
|
979
979
|
"aria-level"?: number | undefined;
|
|
980
980
|
"aria-live"?: "off" | "assertive" | "polite" | undefined;
|
|
981
|
-
"aria-modal"?: (boolean | "
|
|
982
|
-
"aria-multiline"?: (boolean | "
|
|
983
|
-
"aria-multiselectable"?: (boolean | "
|
|
981
|
+
"aria-modal"?: (boolean | "false" | "true") | undefined;
|
|
982
|
+
"aria-multiline"?: (boolean | "false" | "true") | undefined;
|
|
983
|
+
"aria-multiselectable"?: (boolean | "false" | "true") | undefined;
|
|
984
984
|
"aria-orientation"?: "horizontal" | "vertical" | undefined;
|
|
985
985
|
"aria-owns"?: string | undefined;
|
|
986
986
|
"aria-placeholder"?: string | undefined;
|
|
987
987
|
"aria-posinset"?: number | undefined;
|
|
988
|
-
"aria-pressed"?: boolean | "
|
|
989
|
-
"aria-readonly"?: (boolean | "
|
|
990
|
-
"aria-relevant"?: "text" | "
|
|
991
|
-
"aria-required"?: (boolean | "
|
|
988
|
+
"aria-pressed"?: boolean | "false" | "true" | "mixed" | undefined;
|
|
989
|
+
"aria-readonly"?: (boolean | "false" | "true") | undefined;
|
|
990
|
+
"aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
|
|
991
|
+
"aria-required"?: (boolean | "false" | "true") | undefined;
|
|
992
992
|
"aria-roledescription"?: string | undefined;
|
|
993
993
|
"aria-rowcount"?: number | undefined;
|
|
994
994
|
"aria-rowindex"?: number | undefined;
|
|
995
995
|
"aria-rowindextext"?: string | undefined;
|
|
996
996
|
"aria-rowspan"?: number | undefined;
|
|
997
|
-
"aria-selected"?: (boolean | "
|
|
997
|
+
"aria-selected"?: (boolean | "false" | "true") | undefined;
|
|
998
998
|
"aria-setsize"?: number | undefined;
|
|
999
999
|
"aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
|
|
1000
1000
|
"aria-valuemax"?: number | undefined;
|
package/dist/types/viewdesc.d.ts
CHANGED
|
@@ -161,9 +161,13 @@ declare class CustomNodeViewDesc extends NodeViewDesc {
|
|
|
161
161
|
stopEvent(event: Event): boolean;
|
|
162
162
|
ignoreMutation(mutation: ViewMutationRecord): boolean;
|
|
163
163
|
}
|
|
164
|
+
export declare class ReactMarkViewDesc extends MarkViewDesc {
|
|
165
|
+
destroy(): void;
|
|
166
|
+
}
|
|
164
167
|
export declare class ReactNodeViewDesc extends CustomNodeViewDesc {
|
|
165
168
|
updateChildren(_view: EditorView, _pos: number): void;
|
|
166
169
|
updateOuterDeco(outerDeco: readonly Decoration[]): void;
|
|
167
170
|
destroy(): void;
|
|
168
171
|
}
|
|
172
|
+
export declare function sameOuterDeco(a: readonly Decoration[], b: readonly Decoration[]): boolean;
|
|
169
173
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@handlewithcare/react-prosemirror",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.0",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -12,11 +12,6 @@
|
|
|
12
12
|
"import": "./dist/esm/index.js",
|
|
13
13
|
"require": "./dist/cjs/index.js"
|
|
14
14
|
},
|
|
15
|
-
"./tiptap": {
|
|
16
|
-
"types": "./dist/types/tiptap/index.d.ts",
|
|
17
|
-
"import": "./dist/esm/tiptap/index.js",
|
|
18
|
-
"require": "./dist/cjs/tiptap/index.js"
|
|
19
|
-
},
|
|
20
15
|
"./src": "./src/index.ts"
|
|
21
16
|
},
|
|
22
17
|
"files": [
|
|
@@ -99,17 +94,17 @@
|
|
|
99
94
|
"mdast-util-gfm-table": "^2.0.0",
|
|
100
95
|
"micromark-extension-gfm-table": "^2.1.1",
|
|
101
96
|
"prettier": "^2.8.3",
|
|
102
|
-
"prosemirror-commands": "^1.
|
|
103
|
-
"prosemirror-gapcursor": "^1.
|
|
104
|
-
"prosemirror-history": "^1.
|
|
105
|
-
"prosemirror-inputrules": "^1.
|
|
106
|
-
"prosemirror-keymap": "^1.2.
|
|
107
|
-
"prosemirror-model": "^1.25.
|
|
108
|
-
"prosemirror-schema-list": "^1.
|
|
109
|
-
"prosemirror-state": "^1.4.
|
|
110
|
-
"prosemirror-tables": "^1.
|
|
97
|
+
"prosemirror-commands": "^1.5.0",
|
|
98
|
+
"prosemirror-gapcursor": "^1.3.2",
|
|
99
|
+
"prosemirror-history": "^1.4.1",
|
|
100
|
+
"prosemirror-inputrules": "^1.4.0",
|
|
101
|
+
"prosemirror-keymap": "^1.2.1",
|
|
102
|
+
"prosemirror-model": "^1.25.1",
|
|
103
|
+
"prosemirror-schema-list": "^1.2.2",
|
|
104
|
+
"prosemirror-state": "^1.4.3",
|
|
105
|
+
"prosemirror-tables": "^1.3.7",
|
|
111
106
|
"prosemirror-test-builder": "^1.1.1",
|
|
112
|
-
"prosemirror-transform": "^1.
|
|
107
|
+
"prosemirror-transform": "^1.8.0",
|
|
113
108
|
"prosemirror-view": "1.41.4",
|
|
114
109
|
"react": "^18.2.0",
|
|
115
110
|
"react-dom": "^18.2.0",
|
|
@@ -126,7 +121,7 @@
|
|
|
126
121
|
"peerDependencies": {
|
|
127
122
|
"prosemirror-model": "^1.0.0",
|
|
128
123
|
"prosemirror-state": "^1.0.0",
|
|
129
|
-
"prosemirror-view": "1.
|
|
124
|
+
"prosemirror-view": "1.41.4",
|
|
130
125
|
"react": ">=17 <20",
|
|
131
126
|
"react-dom": ">=17 <20",
|
|
132
127
|
"react-reconciler": ">=0.26.1 <=0.33.0"
|
|
@@ -136,9 +131,6 @@
|
|
|
136
131
|
"node": ">=16.9"
|
|
137
132
|
},
|
|
138
133
|
"dependencies": {
|
|
139
|
-
"@tiptap/core": "^3.15.3",
|
|
140
|
-
"@tiptap/pm": "^3.15.3",
|
|
141
|
-
"@tiptap/react": "^3.15.3",
|
|
142
134
|
"classnames": "^2.3.2"
|
|
143
135
|
},
|
|
144
136
|
"publishConfig": {
|
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", {
|
|
3
|
-
value: true
|
|
4
|
-
});
|
|
5
|
-
Object.defineProperty(exports, "CustomNodeView", {
|
|
6
|
-
enumerable: true,
|
|
7
|
-
get: function() {
|
|
8
|
-
return CustomNodeView;
|
|
9
|
-
}
|
|
10
|
-
});
|
|
11
|
-
const _prosemirrormodel = require("prosemirror-model");
|
|
12
|
-
const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
|
|
13
|
-
const _reactdom = require("react-dom");
|
|
14
|
-
const _ChildDescriptorsContext = require("../contexts/ChildDescriptorsContext.js");
|
|
15
|
-
const _useNodeViewDescriptor = require("../hooks/useNodeViewDescriptor.js");
|
|
16
|
-
const _ChildNodeViews = require("./ChildNodeViews.js");
|
|
17
|
-
function _getRequireWildcardCache(nodeInterop) {
|
|
18
|
-
if (typeof WeakMap !== "function") return null;
|
|
19
|
-
var cacheBabelInterop = new WeakMap();
|
|
20
|
-
var cacheNodeInterop = new WeakMap();
|
|
21
|
-
return (_getRequireWildcardCache = function(nodeInterop) {
|
|
22
|
-
return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
|
|
23
|
-
})(nodeInterop);
|
|
24
|
-
}
|
|
25
|
-
function _interop_require_wildcard(obj, nodeInterop) {
|
|
26
|
-
if (!nodeInterop && obj && obj.__esModule) {
|
|
27
|
-
return obj;
|
|
28
|
-
}
|
|
29
|
-
if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
|
|
30
|
-
return {
|
|
31
|
-
default: obj
|
|
32
|
-
};
|
|
33
|
-
}
|
|
34
|
-
var cache = _getRequireWildcardCache(nodeInterop);
|
|
35
|
-
if (cache && cache.has(obj)) {
|
|
36
|
-
return cache.get(obj);
|
|
37
|
-
}
|
|
38
|
-
var newObj = {
|
|
39
|
-
__proto__: null
|
|
40
|
-
};
|
|
41
|
-
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
42
|
-
for(var key in obj){
|
|
43
|
-
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
44
|
-
var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
|
|
45
|
-
if (desc && (desc.get || desc.set)) {
|
|
46
|
-
Object.defineProperty(newObj, key, desc);
|
|
47
|
-
} else {
|
|
48
|
-
newObj[key] = obj[key];
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
newObj.default = obj;
|
|
53
|
-
if (cache) {
|
|
54
|
-
cache.set(obj, newObj);
|
|
55
|
-
}
|
|
56
|
-
return newObj;
|
|
57
|
-
}
|
|
58
|
-
const CustomNodeView = /*#__PURE__*/ (0, _react.memo)(function CustomNodeView(param) {
|
|
59
|
-
let { constructor, node, getPos, innerDeco, outerDeco } = param;
|
|
60
|
-
const ref = (0, _react.useRef)(null);
|
|
61
|
-
const innerRef = (0, _react.useRef)(null);
|
|
62
|
-
const nodeProps = (0, _react.useMemo)(()=>({
|
|
63
|
-
node,
|
|
64
|
-
getPos,
|
|
65
|
-
decorations: outerDeco,
|
|
66
|
-
innerDecorations: innerDeco
|
|
67
|
-
}), [
|
|
68
|
-
node,
|
|
69
|
-
getPos,
|
|
70
|
-
outerDeco,
|
|
71
|
-
innerDeco
|
|
72
|
-
]);
|
|
73
|
-
const createNodeView = function() {
|
|
74
|
-
for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
|
|
75
|
-
args[_key] = arguments[_key];
|
|
76
|
-
}
|
|
77
|
-
const nodeView = constructor(...args);
|
|
78
|
-
if (!nodeView || !nodeView.dom) {
|
|
79
|
-
const spec = node.type.spec.toDOM?.(node);
|
|
80
|
-
if (!spec) {
|
|
81
|
-
throw new Error(`Node spec for ${node.type.name} is missing toDOM`);
|
|
82
|
-
}
|
|
83
|
-
return _prosemirrormodel.DOMSerializer.renderSpec(document, spec, null);
|
|
84
|
-
}
|
|
85
|
-
return nodeView;
|
|
86
|
-
};
|
|
87
|
-
const { childContextValue, contentDOM } = (0, _useNodeViewDescriptor.useNodeViewDescriptor)(ref, function() {
|
|
88
|
-
for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
|
|
89
|
-
args[_key] = arguments[_key];
|
|
90
|
-
}
|
|
91
|
-
const nodeView = createNodeView(...args);
|
|
92
|
-
const contentDOM = nodeView.contentDOM;
|
|
93
|
-
const nodeDOM = nodeView.dom;
|
|
94
|
-
const wrapperDOM = innerRef.current ?? ref.current;
|
|
95
|
-
wrapperDOM.appendChild(nodeDOM);
|
|
96
|
-
if (!contentDOM && nodeDOM instanceof HTMLElement && nodeDOM.tagName !== "BR") {
|
|
97
|
-
if (!nodeDOM.hasAttribute("contenteditable")) {
|
|
98
|
-
nodeDOM.contentEditable = "false";
|
|
99
|
-
}
|
|
100
|
-
if (node.type.spec.draggable) {
|
|
101
|
-
nodeDOM.draggable = true;
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
return {
|
|
105
|
-
...nodeView,
|
|
106
|
-
destroy () {
|
|
107
|
-
if (nodeView.destroy) {
|
|
108
|
-
nodeView.destroy();
|
|
109
|
-
}
|
|
110
|
-
wrapperDOM.removeChild(nodeDOM);
|
|
111
|
-
},
|
|
112
|
-
selectNode: nodeView.selectNode?.bind(nodeView),
|
|
113
|
-
deselectNode: nodeView.deselectNode?.bind(nodeView),
|
|
114
|
-
stopEvent: nodeView.stopEvent?.bind(nodeView),
|
|
115
|
-
ignoreMutation: nodeView.ignoreMutation?.bind(nodeView)
|
|
116
|
-
};
|
|
117
|
-
}, nodeProps);
|
|
118
|
-
const Component = node.isInline ? "span" : "div";
|
|
119
|
-
const props = {
|
|
120
|
-
ref: innerRef
|
|
121
|
-
};
|
|
122
|
-
const children = !node.isLeaf && contentDOM ? /*#__PURE__*/ (0, _reactdom.createPortal)(/*#__PURE__*/ _react.default.createElement(_ChildDescriptorsContext.ChildDescriptorsContext.Provider, {
|
|
123
|
-
value: childContextValue
|
|
124
|
-
}, /*#__PURE__*/ _react.default.createElement(_ChildNodeViews.ChildNodeViews, {
|
|
125
|
-
getPos: getPos,
|
|
126
|
-
node: node,
|
|
127
|
-
innerDecorations: innerDeco
|
|
128
|
-
})), contentDOM) : null;
|
|
129
|
-
return /*#__PURE__*/ (0, _react.cloneElement)(outerDeco.reduce(_ChildNodeViews.wrapInDeco, /*#__PURE__*/ _react.default.createElement(Component, props, children)), {
|
|
130
|
-
ref
|
|
131
|
-
});
|
|
132
|
-
});
|