@contentful/field-editor-rich-text 3.4.22 → 3.6.0

package/dist/cjs/plugins/Marks/components/MarkToolbarButton.js

@@ -0,0 +1,105 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "createMarkToolbarButton", {
+    enumerable: true,
+    get: function() {
+        return createMarkToolbarButton;
+    }
+});
+const _react = _interop_require_wildcard(require("react"));
+const _f36components = require("@contentful/f36-components");
+const _f36tokens = _interop_require_default(require("@contentful/f36-tokens"));
+const _emotion = require("emotion");
+const _ContentfulEditorProvider = require("../../../ContentfulEditorProvider");
+const _editor = require("../../../helpers/editor");
+const _queries = require("../../../internal/queries");
+const _ToolbarButton = require("../../shared/ToolbarButton");
+const _helpers = require("../helpers");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const styles = {
+    isActive: (0, _emotion.css)({
+        backgroundColor: _f36tokens.default.blue100,
+        color: _f36tokens.default.blue600
+    })
+};
+const createMarkToolbarButton = ({ mark , title , icon  })=>{
+    const Mark = ({ isDisabled  })=>{
+        const editor = (0, _ContentfulEditorProvider.useContentfulEditor)();
+        const handleClick = _react.useCallback(()=>{
+            if (!editor?.selection) return;
+            const isActive = (0, _queries.isMarkActive)(editor, mark);
+            editor.tracking.onToolbarAction(isActive ? 'unmark' : 'mark', {
+                markType: mark
+            });
+            (0, _helpers.toggleMarkAndDeactivateConflictingMarks)(editor, mark);
+            (0, _editor.focus)(editor);
+        }, [
+            editor
+        ]);
+        if (!editor) return null;
+        if (!icon) {
+            return _react.createElement(_f36components.Menu.Item, {
+                onClick: handleClick,
+                disabled: isDisabled,
+                className: (0, _emotion.cx)({
+                    [styles.isActive]: (0, _queries.isMarkActive)(editor, mark)
+                }),
+                testId: `${mark}-toolbar-button`
+            }, title);
+        }
+        return _react.createElement(_ToolbarButton.ToolbarButton, {
+            title: title,
+            testId: `${mark}-toolbar-button`,
+            onClick: handleClick,
+            isActive: (0, _queries.isMarkActive)(editor, mark),
+            isDisabled: isDisabled
+        }, icon);
+    };
+    Mark.displayName = mark;
+    return Mark;
+};

package/dist/cjs/plugins/Marks/helpers.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    toggleMarkAndDeactivateConflictingMarks: function() {
+        return toggleMarkAndDeactivateConflictingMarks;
+    },
+    buildMarkEventHandler: function() {
+        return buildMarkEventHandler;
+    }
+});
+const _richtexttypes = require("@contentful/rich-text-types");
+const _ishotkey = _interop_require_default(require("is-hotkey"));
+const _queries = require("../../internal/queries");
+const _transforms = require("../../internal/transforms");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const toggleMarkAndDeactivateConflictingMarks = (editor, mark)=>{
+    const subs = [
+        _richtexttypes.MARKS.SUPERSCRIPT,
+        _richtexttypes.MARKS.SUBSCRIPT
+    ];
+    const clear = subs.includes(mark) ? subs : [];
+    (0, _transforms.toggleMark)(editor, {
+        key: mark,
+        clear
+    });
+};
+const buildMarkEventHandler = (type)=>(editor, { options: { hotkey  }  })=>(event)=>{
+            if (editor.selection && hotkey && (0, _ishotkey.default)(hotkey, event)) {
+                event.preventDefault();
+                const isActive = (0, _queries.isMarkActive)(editor, type);
+                editor.tracking.onShortcutAction(isActive ? 'unmark' : 'mark', {
+                    markType: type
+                });
+                toggleMarkAndDeactivateConflictingMarks(editor, type);
+            }
+        };

package/dist/cjs/plugins/Marks/index.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "createMarksPlugin", {
+    enumerable: true,
+    get: function() {
+        return createMarksPlugin;
+    }
+});
+const _Bold = require("./Bold");
+const _Code = require("./Code");
+const _Italic = require("./Italic");
+const _Subscript = require("./Subscript");
+const _Superscript = require("./Superscript");
+const _Underline = require("./Underline");
+const createMarksPlugin = ()=>({
+        key: 'Marks',
+        plugins: [
+            (0, _Bold.createBoldPlugin)(),
+            (0, _Code.createCodePlugin)(),
+            (0, _Italic.createItalicPlugin)(),
+            (0, _Underline.createUnderlinePlugin)(),
+            (0, _Superscript.createSuperscriptPlugin)(),
+            (0, _Subscript.createSubscriptPlugin)()
+        ]
+    });

package/dist/cjs/plugins/Normalizer/baseRules.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "baseRules", {
+    enumerable: true,
+    get: function() {
+        return baseRules;
+    }
+});
+const _richtexttypes = require("@contentful/rich-text-types");
+const _editor = require("../../helpers/editor");
+const _transformers = require("../../helpers/transformers");
+const _queries = require("../../internal/queries");
+const isInline = (node)=>_editor.INLINE_TYPES.includes(node.type);
+const isTextContainer = (node)=>_richtexttypes.TEXT_CONTAINERS.includes(node.type);
+const baseRules = [
+    {
+        match: _queries.isText,
+        validNode: (editor, [, path])=>{
+            const parent = (0, _queries.getParentNode)(editor, path)?.[0];
+            return !!parent && (isTextContainer(parent) || isInline(parent) || editor.isVoid(parent));
+        },
+        transform: (editor, entry)=>{
+            return (0, _transformers.transformWrapIn)(_richtexttypes.BLOCKS.PARAGRAPH)(editor, entry);
+        }
+    },
+    {
+        match: {
+            type: _editor.INLINE_TYPES
+        },
+        validNode: (editor, [, path])=>{
+            const parent = (0, _queries.getParentNode)(editor, path)?.[0];
+            return !!parent && isTextContainer(parent);
+        },
+        transform: (0, _transformers.transformWrapIn)(_richtexttypes.BLOCKS.PARAGRAPH)
+    }
+];

package/dist/cjs/plugins/Normalizer/createNormalizerPlugin.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "createNormalizerPlugin", {
+    enumerable: true,
+    get: function() {
+        return createNormalizerPlugin;
+    }
+});
+const _withNormalizer = require("./withNormalizer");
+const createNormalizerPlugin = ()=>({
+        key: 'NormalizerPlugin',
+        withOverrides: _withNormalizer.withNormalizer
+    });

package/dist/cjs/plugins/Normalizer/createNormalizerPlugin.test.js

@@ -0,0 +1,117 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _richtexttypes = require("@contentful/rich-text-types");
+const _transformers = require("../../helpers/transformers");
+const _testutils = require("../../test-utils");
+const _createNormalizerPlugin = require("./createNormalizerPlugin");
+describe('Normalizer', ()=>{
+    const rules = [
+        {
+            validChildren: [
+                _richtexttypes.BLOCKS.PARAGRAPH
+            ]
+        }
+    ];
+    let input;
+    beforeEach(()=>{
+        input = (0, _testutils.jsx)("editor", null, (0, _testutils.jsx)("hul", null, (0, _testutils.jsx)("hli", null, (0, _testutils.jsx)("hembed", {
+            type: "Entry",
+            id: "embedded-entry"
+        }), (0, _testutils.jsx)("hp", null, "List item"))));
+    });
+    const expected = (0, _testutils.jsx)("editor", null, (0, _testutils.jsx)("hul", null, (0, _testutils.jsx)("hli", null, (0, _testutils.jsx)("hp", null, "List item"))));
+    describe('rule.match', ()=>{
+        it('matches elements of type "plugin.type" by default', ()=>{
+            const { editor  } = (0, _testutils.createTestEditor)({
+                input,
+                plugins: [
+                    (0, _testutils.mockPlugin)({
+                        isElement: true,
+                        type: _richtexttypes.BLOCKS.LIST_ITEM,
+                        normalizer: rules
+                    }),
+                    (0, _createNormalizerPlugin.createNormalizerPlugin)()
+                ]
+            });
+            (0, _testutils.assertOutput)({
+                editor,
+                expected
+            });
+        });
+        it('rejects rules without "match" in a non-element plugin', ()=>{
+            expect(()=>(0, _testutils.createTestEditor)({
+                    input,
+                    plugins: [
+                        (0, _testutils.mockPlugin)({
+                            normalizer: rules
+                        }),
+                        (0, _createNormalizerPlugin.createNormalizerPlugin)()
+                    ]
+                })).toThrow(/rule.match MUST be defined/);
+        });
+    });
+    describe('rule.transform', ()=>{
+        it('works with conditional transformation', ()=>{
+            const { editor  } = (0, _testutils.createTestEditor)({
+                input: (0, _testutils.jsx)("editor", null, (0, _testutils.jsx)("hul", null, (0, _testutils.jsx)("hli", null, (0, _testutils.jsx)("hembed", {
+                    type: "Entry",
+                    id: "embedded-entry"
+                }), (0, _testutils.jsx)("hinline", {
+                    type: "Entry",
+                    id: "inline-entry"
+                }), (0, _testutils.jsx)("hp", null, "List item")))),
+                plugins: [
+                    (0, _testutils.mockPlugin)({
+                        isElement: true,
+                        type: _richtexttypes.BLOCKS.LIST_ITEM,
+                        normalizer: [
+                            {
+                                validChildren: [
+                                    _richtexttypes.BLOCKS.PARAGRAPH
+                                ],
+                                transform: {
+                                    [_richtexttypes.INLINES.EMBEDDED_ENTRY]: (0, _transformers.transformWrapIn)(_richtexttypes.BLOCKS.PARAGRAPH)
+                                }
+                            }
+                        ]
+                    }),
+                    (0, _createNormalizerPlugin.createNormalizerPlugin)()
+                ]
+            });
+            (0, _testutils.assertOutput)({
+                editor,
+                expected: (0, _testutils.jsx)("editor", null, (0, _testutils.jsx)("hul", null, (0, _testutils.jsx)("hli", null, (0, _testutils.jsx)("hp", null, (0, _testutils.jsx)("hinline", {
+                    type: "Entry",
+                    id: "inline-entry"
+                })), (0, _testutils.jsx)("hp", null, "List item"))))
+            });
+        });
+    });
+    describe('rule.validChildren', ()=>{
+        it('supports custom functions', ()=>{
+            const { editor  } = (0, _testutils.createTestEditor)({
+                input,
+                plugins: [
+                    (0, _testutils.mockPlugin)({
+                        isElement: true,
+                        type: _richtexttypes.BLOCKS.LIST_ITEM,
+                        normalizer: [
+                            {
+                                validChildren: (_, [node])=>{
+                                    return node.type === _richtexttypes.BLOCKS.PARAGRAPH;
+                                }
+                            }
+                        ]
+                    }),
+                    (0, _createNormalizerPlugin.createNormalizerPlugin)()
+                ]
+            });
+            (0, _testutils.assertOutput)({
+                editor,
+                expected
+            });
+        });
+    });
+});

package/dist/cjs/plugins/Normalizer/index.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+_export_star(require("./types"), exports);
+_export_star(require("./createNormalizerPlugin"), exports);
+function _export_star(from, to) {
+    Object.keys(from).forEach(function(k) {
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
+    });
+    return from;
+}

package/dist/cjs/plugins/Normalizer/types.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/dist/cjs/plugins/Normalizer/utils.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    NormalizerError: function() {
+        return NormalizerError;
+    },
+    createValidatorFromTypes: function() {
+        return createValidatorFromTypes;
+    },
+    createTransformerFromObject: function() {
+        return createTransformerFromObject;
+    }
+});
+const _queries = require("../../internal/queries");
+class NormalizerError extends Error {
+}
+const createValidatorFromTypes = (types)=>(_, [node])=>{
+        return (0, _queries.isElement)(node) && types.includes(node.type);
+    };
+const createTransformerFromObject = (transforms)=>{
+    const fallback = transforms['default'];
+    if (!fallback) {
+        throw new NormalizerError('A default transformer MUST be provided');
+    }
+    return (editor, entry)=>{
+        const [node] = entry;
+        const key = (0, _queries.isElement)(node) ? node.type : 'default';
+        const transformer = transforms[key] || fallback;
+        return transformer(editor, entry);
+    };
+};

package/dist/cjs/plugins/Normalizer/withNormalizer.js

@@ -0,0 +1,88 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "withNormalizer", {
+    enumerable: true,
+    get: function() {
+        return withNormalizer;
+    }
+});
+const _isplainobj = _interop_require_default(require("is-plain-obj"));
+const _transformers = require("../../helpers/transformers");
+const _internal = require("../../internal");
+const _queries = require("../../internal/queries");
+const _baseRules = require("./baseRules");
+const _utils = require("./utils");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const withNormalizer = (editor)=>{
+    const rules = _baseRules.baseRules;
+    for (const p of editor.plugins){
+        const { normalizer: _rules  } = p;
+        if (!_rules) {
+            continue;
+        }
+        for (const _rule of _rules){
+            const rule = {
+                ..._rule
+            };
+            if (!rule.match && !p.isElement) {
+                throw new _utils.NormalizerError('rule.match MUST be defined in a non-element plugin');
+            }
+            if (!rule.match) {
+                rule.match = {
+                    type: (0, _queries.getPluginType)(editor, p.key)
+                };
+            }
+            if ((0, _isplainobj.default)(rule.transform)) {
+                if ('validNode' in rule) {
+                    throw new _utils.NormalizerError('conditional transformations are not supported in validNode rules');
+                }
+                rule.transform = (0, _utils.createTransformerFromObject)({
+                    default: _transformers.transformRemove,
+                    ...rule.transform
+                });
+            }
+            if (!rule.transform) {
+                rule.transform = _transformers.transformRemove;
+            }
+            if ('validChildren' in rule && Array.isArray(rule.validChildren)) {
+                rule.validChildren = (0, _utils.createValidatorFromTypes)(rule.validChildren);
+            }
+            rules.push(rule);
+        }
+    }
+    const _transform = (tr, entry)=>{
+        (0, _internal.withoutNormalizing)(editor, ()=>{
+            tr(editor, entry);
+        });
+    };
+    const { normalizeNode  } = editor;
+    editor.normalizeNode = (entry)=>{
+        const [node, path] = entry;
+        const children = (0, _queries.getChildren)(entry);
+        for (const rule of rules){
+            if (!(0, _queries.matchNode)(node, path, rule.match)) {
+                continue;
+            }
+            if ('validNode' in rule && !rule.validNode(editor, entry)) {
+                _transform(rule.transform, entry);
+                return;
+            }
+            if ('validChildren' in rule) {
+                const isValidChild = rule.validChildren;
+                const invalidChildEntry = children.find((entry)=>!isValidChild(editor, entry));
+                if (invalidChildEntry) {
+                    _transform(rule.transform, invalidChildEntry);
+                    return;
+                }
+            }
+        }
+        return normalizeNode(entry);
+    };
+    return editor;
+};

package/dist/cjs/plugins/Paragraph/Paragraph.js

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Paragraph", {
+    enumerable: true,
+    get: function() {
+        return Paragraph;
+    }
+});
+const _react = _interop_require_wildcard(require("react"));
+const _f36tokens = _interop_require_default(require("@contentful/f36-tokens"));
+const _richtexttypes = require("@contentful/rich-text-types");
+const _emotion = require("emotion");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const styles = {
+    [_richtexttypes.BLOCKS.PARAGRAPH]: (0, _emotion.css)`
+    line-height: ${_f36tokens.default.lineHeightDefault};
+    margin-bottom: 1.5em;
+  `
+};
+function Paragraph(props) {
+    return _react.createElement("div", {
+        ...props.attributes,
+        className: styles[_richtexttypes.BLOCKS.PARAGRAPH]
+    }, props.children);
+}