@handlewithcare/react-prosemirror 3.1.0-tiptap.28 → 3.1.0-tiptap.30

package/dist/esm/jsx-ast-utils/__tests__/src/hasProp-test.js

@@ -0,0 +1,350 @@
+/* eslint-env mocha */ import assert from 'assert';
+import { getOpeningElement, setParserName } from '../helper';
+import hasProp, { hasAnyProp, hasEveryProp } from '../../src/hasProp';
+describe('hasProp', ()=>{
+    beforeEach(()=>{
+        setParserName('babel');
+    });
+    it('should export a function', ()=>{
+        const expected = 'function';
+        const actual = typeof hasProp;
+        assert.equal(actual, expected);
+    });
+    it('should return false if no arguments are provided', ()=>{
+        const expected = false;
+        const actual = hasProp();
+        assert.equal(actual, expected);
+    });
+    it('should return false if the prop is absent', ()=>{
+        const code = '<div />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const expected = false;
+        const actual = hasProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return true if the prop exists', ()=>{
+        const code = '<div id="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const expected = true;
+        const actual = hasProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return true if the prop may exist in spread loose mode', ()=>{
+        const code = '<div {...props} />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const options = {
+            spreadStrict: false
+        };
+        const expected = true;
+        const actual = hasProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+    it('should return false if the prop is considered absent in case-sensitive mode', ()=>{
+        const code = '<div ID="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const options = {
+            ignoreCase: false
+        };
+        const expected = false;
+        const actual = hasProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+});
+describe('hasAnyProp tests', ()=>{
+    it('should export a function', ()=>{
+        const expected = 'function';
+        const actual = typeof hasAnyProp;
+        assert.equal(actual, expected);
+    });
+    it('should return false if no arguments are provided', ()=>{
+        const expected = false;
+        const actual = hasAnyProp();
+        assert.equal(actual, expected);
+    });
+    it('should return false if the prop is absent', ()=>{
+        const code = '<div />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const expected = false;
+        const actual = hasAnyProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return false if all props are absent in array', ()=>{
+        const code = '<div />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const propsToCheck = [
+            'id',
+            'className'
+        ];
+        const expected = false;
+        const actual = hasAnyProp(props, propsToCheck);
+        assert.equal(actual, expected);
+    });
+    it('should return false if all props are absent in space delimited string', ()=>{
+        const code = '<div />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const propsToCheck = 'id className';
+        const expected = false;
+        const actual = hasAnyProp(props, propsToCheck);
+        assert.equal(actual, expected);
+    });
+    it('should return true if the prop exists', ()=>{
+        const code = '<div id="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const expected = true;
+        const actual = hasAnyProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return true if any prop exists in array', ()=>{
+        const code = '<div id="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = [
+            'className',
+            'id'
+        ];
+        const expected = true;
+        const actual = hasAnyProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return true if any prop exists in space delimited string', ()=>{
+        const code = '<div id="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'className id';
+        const expected = true;
+        const actual = hasAnyProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return true if the prop may exist in spread loose mode', ()=>{
+        const code = '<div {...props} />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const options = {
+            spreadStrict: false
+        };
+        const expected = true;
+        const actual = hasAnyProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+    it('should return true if any prop may exist in spread loose mode', ()=>{
+        const code = '<div {...props} />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = [
+            'id',
+            'className'
+        ];
+        const options = {
+            spreadStrict: false
+        };
+        const expected = true;
+        const actual = hasAnyProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+    it('should return false if the prop is considered absent in case-sensitive mode', ()=>{
+        const code = '<div ID="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const options = {
+            ignoreCase: false
+        };
+        const expected = false;
+        const actual = hasAnyProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+    it('should return false if all props are considered absent in case-sensitive mode', ()=>{
+        const code = '<div ID="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = [
+            'id',
+            'iD',
+            'className'
+        ];
+        const options = {
+            ignoreCase: false
+        };
+        const expected = false;
+        const actual = hasAnyProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+});
+describe('hasEveryProp tests', ()=>{
+    it('should export a function', ()=>{
+        const expected = 'function';
+        const actual = typeof hasEveryProp;
+        assert.equal(actual, expected);
+    });
+    it('should return true if no arguments are provided', ()=>{
+        const expected = true;
+        const actual = hasEveryProp();
+        assert.equal(actual, expected);
+    });
+    it('should return false if the prop is absent', ()=>{
+        const code = '<div />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const expected = false;
+        const actual = hasEveryProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return false if any props are absent in array', ()=>{
+        const code = '<div id="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const propsToCheck = [
+            'id',
+            'className'
+        ];
+        const expected = false;
+        const actual = hasEveryProp(props, propsToCheck);
+        assert.equal(actual, expected);
+    });
+    it('should return false if all props are absent in array', ()=>{
+        const code = '<div />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const propsToCheck = [
+            'id',
+            'className'
+        ];
+        const expected = false;
+        const actual = hasEveryProp(props, propsToCheck);
+        assert.equal(actual, expected);
+    });
+    it('should return false if any props are absent in space delimited string', ()=>{
+        const code = '<div id="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const propsToCheck = 'id className';
+        const expected = false;
+        const actual = hasEveryProp(props, propsToCheck);
+        assert.equal(actual, expected);
+    });
+    it('should return false if all props are absent in space delimited string', ()=>{
+        const code = '<div />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const propsToCheck = 'id className';
+        const expected = false;
+        const actual = hasEveryProp(props, propsToCheck);
+        assert.equal(actual, expected);
+    });
+    it('should return true if the prop exists', ()=>{
+        const code = '<div id="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const expected = true;
+        const actual = hasEveryProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return true if all props exist in array', ()=>{
+        const code = '<div id="foo" className="box" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = [
+            'className',
+            'id'
+        ];
+        const expected = true;
+        const actual = hasEveryProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return true if all props exist in space delimited string', ()=>{
+        const code = '<div id="foo" className="box" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'className id';
+        const expected = true;
+        const actual = hasEveryProp(props, prop);
+        assert.equal(actual, expected);
+    });
+    it('should return true if the props may exist in spread loose mode', ()=>{
+        const code = '<div {...props} />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const options = {
+            spreadStrict: false
+        };
+        const expected = true;
+        const actual = hasEveryProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+    it('should return true if all props may exist in spread loose mode', ()=>{
+        const code = '<div {...props} />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = [
+            'id',
+            'className'
+        ];
+        const options = {
+            spreadStrict: false
+        };
+        const expected = true;
+        const actual = hasEveryProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+    it('should return false if the prop is considered absent in case-sensitive mode', ()=>{
+        const code = '<div ID="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = 'id';
+        const options = {
+            ignoreCase: false
+        };
+        const expected = false;
+        const actual = hasEveryProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+    it('should return false if all props are considered absent in case-sensitive mode', ()=>{
+        const code = '<div ID="foo" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = [
+            'id',
+            'iD',
+            'className'
+        ];
+        const options = {
+            ignoreCase: false
+        };
+        const expected = false;
+        const actual = hasEveryProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+    it('should return true if all props are considered present in case-sensitive mode', ()=>{
+        const code = '<div ID="foo" className="box" />';
+        const node = getOpeningElement(code);
+        const { attributes: props } = node;
+        const prop = [
+            'ID',
+            'className'
+        ];
+        const options = {
+            ignoreCase: false
+        };
+        const expected = true;
+        const actual = hasEveryProp(props, prop, options);
+        assert.equal(actual, expected);
+    });
+});

package/dist/esm/jsx-ast-utils/__tests__/src/index-test.js

@@ -0,0 +1,24 @@
+/* eslint-env mocha */ import fs from 'fs';
+import path from 'path';
+import assert from 'assert';
+import core from '../../src/index';
+const src = fs.readdirSync(path.resolve(__dirname, '../../src')).filter((f)=>f.indexOf('.js') >= 0).map((f)=>path.basename(f, '.js'));
+describe('main export', ()=>{
+    it('should export an object', ()=>{
+        const expected = 'object';
+        const actual = typeof core;
+        assert.equal(actual, expected);
+    });
+    src.filter((f)=>f !== 'index').forEach((f)=>{
+        it(`should export ${f}`, ()=>{
+            assert.equal(core[f], require(path.join('../../src/', f)).default // eslint-disable-line
+            );
+        });
+        it(`should export ${f} from root`, ()=>{
+            const file = `${f}.js`;
+            const expected = true;
+            const actual = fs.statSync(path.join(path.resolve('.'), file)).isFile();
+            assert.equal(actual, expected);
+        });
+    });
+});

package/dist/esm/jsx-ast-utils/__tests__/src/propName-test.js

@@ -0,0 +1,37 @@
+/* eslint-env mocha */ import assert from 'assert';
+import { extractProp, setParserName } from '../helper';
+import propName from '../../src/propName';
+describe('propName', ()=>{
+    beforeEach(()=>{
+        setParserName('babel');
+    });
+    it('should export a function', ()=>{
+        const expected = 'function';
+        const actual = typeof propName;
+        assert.equal(actual, expected);
+    });
+    it('should throw an error if the argument is missing', ()=>{
+        assert.throws(()=>{
+            propName();
+        }, Error);
+    });
+    it('should throw an error if the argument not a JSX node', ()=>{
+        assert.throws(()=>{
+            propName({
+                a: 'foo'
+            });
+        }, Error);
+    });
+    it('should return correct name for normal prop', ()=>{
+        const prop = extractProp('<div foo="bar" />');
+        const expected = 'foo';
+        const actual = propName(prop);
+        assert.equal(actual, expected);
+    });
+    it('should return correct name for namespaced prop', ()=>{
+        const prop = extractProp('<div foo:bar="baz" />', 'foo:bar');
+        const expected = 'foo:bar';
+        const actual = propName(prop);
+        assert.equal(actual, expected);
+    });
+});

package/dist/esm/plugins/__tests__/reactKeys.test.js

@@ -0,0 +1,77 @@
+/* eslint-disable @typescript-eslint/no-non-null-assertion */ import { Schema } from "prosemirror-model";
+import { EditorState } from "prosemirror-state";
+import { reactKeys, reactKeysPluginKey } from "../reactKeys.js";
+const schema = new Schema({
+    nodes: {
+        doc: {
+            content: "block+"
+        },
+        paragraph: {
+            group: "block",
+            content: "inline*"
+        },
+        list: {
+            group: "block",
+            content: "list_item+"
+        },
+        list_item: {
+            content: "inline*"
+        },
+        text: {
+            group: "inline"
+        }
+    }
+});
+describe("reactNodeViewPlugin", ()=>{
+    it("should create a unique key for each node", ()=>{
+        const editorState = EditorState.create({
+            doc: schema.topNodeType.create(null, [
+                schema.nodes.paragraph.create(),
+                schema.nodes.paragraph.create(),
+                schema.nodes.paragraph.create()
+            ]),
+            plugins: [
+                reactKeys()
+            ]
+        });
+        const pluginState = reactKeysPluginKey.getState(editorState);
+        expect(pluginState.posToKey.size).toBe(3);
+    });
+    it("should maintain key stability when possible", ()=>{
+        const initialEditorState = EditorState.create({
+            doc: schema.topNodeType.create(null, [
+                schema.nodes.paragraph.create({}, schema.text("Hello")),
+                schema.nodes.paragraph.create(),
+                schema.nodes.paragraph.create()
+            ]),
+            plugins: [
+                reactKeys()
+            ]
+        });
+        const initialPluginState = reactKeysPluginKey.getState(initialEditorState);
+        const nextEditorState = initialEditorState.apply(initialEditorState.tr.insertText(", world!", 6));
+        const nextPluginState = reactKeysPluginKey.getState(nextEditorState);
+        expect(Array.from(initialPluginState.keyToPos.keys())).toEqual(Array.from(nextPluginState.keyToPos.keys()));
+    });
+    it("should create unique keys for new nodes", ()=>{
+        const initialEditorState = EditorState.create({
+            doc: schema.topNodeType.create(null, [
+                schema.nodes.paragraph.create(),
+                schema.nodes.paragraph.create(),
+                schema.nodes.paragraph.create()
+            ]),
+            plugins: [
+                reactKeys()
+            ]
+        });
+        const initialPluginState = reactKeysPluginKey.getState(initialEditorState);
+        const nextEditorState = initialEditorState.apply(initialEditorState.tr.insert(0, schema.nodes.list.createAndFill()));
+        const nextPluginState = reactKeysPluginKey.getState(nextEditorState);
+        // Adds new keys for new nodes
+        expect(nextPluginState.keyToPos.size).toBe(5);
+        // Maintains keys for previous nodes that are still there
+        Array.from(initialPluginState.keyToPos.keys()).forEach((key)=>{
+            expect(Array.from(nextPluginState.keyToPos.keys())).toContain(key);
+        });
+    });
+});

package/dist/esm/refs.js

@@ -1,8 +1,9 @@
-export function mergeDomRefs() {
+import { useCallback } from "react";
+export function useMergedDOMRefs() {
     for(var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++){
         refs[_key] = arguments[_key];
     }
-    return (value)=>{
+    return useCallback((value)=>{
         refs.forEach((ref)=>{
             if (typeof ref === "function") {
                 ref(value);
@@ -12,5 +13,6 @@ export function mergeDomRefs() {
                 ref.current = value;
             }
         });
-    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, refs);
 }

package/dist/esm/tiptap/extensions/Commands.js

@@ -0,0 +1,11 @@
+import { Extension, commands as coreCommands } from "@tiptap/core";
+import { updateAttributes } from "./commands/updateAttributes.js";
+export const Commands = Extension.create({
+    name: "commands",
+    addCommands () {
+        return {
+            ...coreCommands,
+            updateAttributes
+        };
+    }
+});

package/dist/esm/tiptap/extensions/ReactProseMirrorCommands.js

@@ -0,0 +1,11 @@
+import { Extension, commands as coreCommands } from "@tiptap/core";
+import { updateAttributes } from "./commands/updateAttributes.js";
+export const ReactProseMirrorCommands = Extension.create({
+    name: "commands",
+    addCommands () {
+        return {
+            ...coreCommands,
+            updateAttributes
+        };
+    }
+});

package/dist/esm/tiptap/extensions/commands/updateAttributes.js

@@ -0,0 +1,96 @@
+import { getMarkType, getNodeType, getSchemaTypeNameByName } from "@tiptap/core";
+// Tiptap's updateAttributes command, but using setNodeAttribute instead of
+// setNodeMarkup to avoid replacing entire leaf nodes
+export const updateAttributes = function(typeOrName) {
+    let attributes = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
+    return (param)=>{
+        let { tr, state, dispatch } = param;
+        let nodeType = null;
+        let markType = null;
+        const schemaType = getSchemaTypeNameByName(typeof typeOrName === "string" ? typeOrName : typeOrName.name, state.schema);
+        if (!schemaType) {
+            return false;
+        }
+        if (schemaType === "node") {
+            nodeType = getNodeType(typeOrName, state.schema);
+        }
+        if (schemaType === "mark") {
+            markType = getMarkType(typeOrName, state.schema);
+        }
+        let canUpdate = false;
+        tr.selection.ranges.forEach((range)=>{
+            const from = range.$from.pos;
+            const to = range.$to.pos;
+            let lastPos;
+            let lastNode;
+            let trimmedFrom;
+            let trimmedTo;
+            if (tr.selection.empty) {
+                state.doc.nodesBetween(from, to, (node, pos)=>{
+                    if (nodeType && nodeType === node.type) {
+                        canUpdate = true;
+                        trimmedFrom = Math.max(pos, from);
+                        trimmedTo = Math.min(pos + node.nodeSize, to);
+                        lastPos = pos;
+                        lastNode = node;
+                    }
+                });
+            } else {
+                state.doc.nodesBetween(from, to, (node, pos)=>{
+                    if (pos < from && nodeType && nodeType === node.type) {
+                        canUpdate = true;
+                        trimmedFrom = Math.max(pos, from);
+                        trimmedTo = Math.min(pos + node.nodeSize, to);
+                        lastPos = pos;
+                        lastNode = node;
+                    }
+                    if (pos >= from && pos <= to) {
+                        if (nodeType && nodeType === node.type) {
+                            canUpdate = true;
+                            if (dispatch) {
+                                Object.entries(attributes).forEach((param)=>{
+                                    let [key, value] = param;
+                                    tr.setNodeAttribute(pos, key, value);
+                                });
+                            }
+                        }
+                        if (markType && node.marks.length) {
+                            node.marks.forEach((mark)=>{
+                                if (markType === mark.type) {
+                                    canUpdate = true;
+                                    if (dispatch) {
+                                        const trimmedFrom2 = Math.max(pos, from);
+                                        const trimmedTo2 = Math.min(pos + node.nodeSize, to);
+                                        tr.addMark(trimmedFrom2, trimmedTo2, markType.create({
+                                            ...mark.attrs,
+                                            ...attributes
+                                        }));
+                                    }
+                                }
+                            });
+                        }
+                    }
+                });
+            }
+            if (lastNode) {
+                if (dispatch) {
+                    Object.entries(attributes).forEach((param)=>{
+                        let [key, value] = param;
+                        if (lastPos !== undefined) tr.setNodeAttribute(lastPos, key, value);
+                    });
+                }
+                if (markType && lastNode.marks.length) {
+                    lastNode.marks.forEach((mark)=>{
+                        if (markType === mark.type && dispatch) {
+                            tr.addMark(trimmedFrom, trimmedTo, markType.create({
+                                ...mark.attrs,
+                                ...attributes
+                            }));
+                        }
+                    });
+                }
+            }
+        });
+        return canUpdate;
+    };
+};

package/dist/esm/tiptap/hooks/useTiptapEditor.js

@@ -1,8 +1,22 @@
 import { useEditor } from "@tiptap/react";
 import { StaticEditorView } from "../../StaticEditorView.js";
+import { ReactProseMirror } from "../extensions/ReactProseMirror.js";
+import { ReactProseMirrorCommands } from "../extensions/ReactProseMirrorCommands.js";
 export function useTiptapEditor(options, deps) {
+    const extensions = [
+        ReactProseMirror,
+        ...options.extensions ?? []
+    ];
+    // If a consumer explicitly disables core extensions (or the Commands core extension)
+    // do not re-add our custom Commands
+    if (options.enableCoreExtensions === false || typeof options.enableCoreExtensions === "object" && options?.enableCoreExtensions?.commands === false) {
+    // Do nothing
+    } else {
+        extensions.push(ReactProseMirrorCommands);
+    }
     const editor = useEditor({
         ...options,
+        extensions,
         element: null
     }, deps);
     // @ts-expect-error private property

package/dist/esm/tsconfig-paths/lib/__tests__/config-loader.test.d.js

@@ -0,0 +1 @@
+export { };