@contentful/field-editor-rich-text 3.17.6 → 3.18.0

package/dist/cjs/Toolbar/components/ButtonRedo.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "ButtonRedo", {
+    enumerable: true,
+    get: function() {
+        return ButtonRedo;
+    }
+});
+const _react = _interop_require_default(require("react"));
+const _f36components = require("@contentful/f36-components");
+const _ContentfulEditorProvider = require("../../ContentfulEditorProvider");
+const _ToolbarButton = require("../../plugins/shared/ToolbarButton");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const ButtonRedo = ()=>{
+    const editor = (0, _ContentfulEditorProvider.useContentfulEditor)();
+    return _react.default.createElement(_ToolbarButton.ToolbarButton, {
+        title: "Redo",
+        testId: "redo-toolbar-button",
+        onClick: editor.redo,
+        isActive: false,
+        isDisabled: editor.history.redos.length === 0
+    }, _react.default.createElement(_f36components.Icon, {
+        variant: "secondary"
+    }, _react.default.createElement("path", {
+        d: "M18.4,10.6C16.55,9 14.15,8 11.5,8C6.85,8 2.92,11.03 1.54,15.22L3.9,16C4.95,12.81 7.95,10.5 11.5,10.5C13.45,10.5 15.23,11.22 16.62,12.38L13,16H22V7L18.4,10.6Z"
+    })));
+};

package/dist/cjs/Toolbar/components/ButtonUndo.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "ButtonUndo", {
+    enumerable: true,
+    get: function() {
+        return ButtonUndo;
+    }
+});
+const _react = _interop_require_default(require("react"));
+const _f36components = require("@contentful/f36-components");
+const _ContentfulEditorProvider = require("../../ContentfulEditorProvider");
+const _ToolbarButton = require("../../plugins/shared/ToolbarButton");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const ButtonUndo = ()=>{
+    const editor = (0, _ContentfulEditorProvider.useContentfulEditor)();
+    return _react.default.createElement(_ToolbarButton.ToolbarButton, {
+        title: "Undo",
+        testId: "undo-toolbar-button",
+        onClick: editor.undo,
+        isActive: false,
+        isDisabled: editor.history.undos.length === 0
+    }, _react.default.createElement(_f36components.Icon, {
+        variant: "secondary"
+    }, _react.default.createElement("path", {
+        d: "M12.5,8C9.85,8 7.45,9 5.6,10.6L2,7V16H11L7.38,12.38C8.77,11.22 10.54,10.5 12.5,10.5C16.04,10.5 19.05,12.81 20.1,16L22.47,15.22C21.08,11.03 17.15,8 12.5,8Z"
+    })));
+};

package/dist/cjs/Toolbar/index.js

@@ -31,6 +31,8 @@ const _Underline = require("../plugins/Marks/Underline");
 const _Quote = require("../plugins/Quote");
 const _Table = require("../plugins/Table");
 const _SdkProvider = require("../SdkProvider");
+const _ButtonRedo = require("./components/ButtonRedo");
+const _ButtonUndo = require("./components/ButtonUndo");
 const _EmbedEntityWidget = require("./components/EmbedEntityWidget");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
@@ -106,8 +108,7 @@ const styles = {
         ],
         webkitAlignSelf: 'flex-start',
         alignSelf: 'flex-start',
-        msFlexItemAlign: 'start',
-        marginLeft: 'auto'
+        msFlexItemAlign: 'start'
     }),
     formattingOptionsWrapper: (0, _emotion.css)({
         display: [
@@ -156,14 +157,19 @@ const Toolbar = ({ isDisabled })=>{
     const dropdownItemsAvailable = (0, _validations.isMarkEnabled)(sdk.field, _richtexttypes.MARKS.SUPERSCRIPT) || (0, _validations.isMarkEnabled)(sdk.field, _richtexttypes.MARKS.SUBSCRIPT) || (0, _validations.isMarkEnabled)(sdk.field, _richtexttypes.MARKS.CODE);
     const shouldShowDropdown = boldItalicUnderlineAvailable && dropdownItemsAvailable;
     return _react.createElement(_f36components.Flex, {
+        gap: "spacingS",
+        flexWrap: "wrap",
+        flexDirection: "row",
         testId: "toolbar",
         className: styles.toolbar,
-        alignItems: "center"
+        justifyContent: "space-between"
     }, _react.createElement("div", {
         className: styles.formattingOptionsWrapper
     }, _react.createElement(_Heading.ToolbarHeadingButton, {
         isDisabled: isDisabled || !canInsertBlocks
-    }), validationInfo.isAnyMarkEnabled && _react.createElement("span", {
+    }), _react.createElement("span", {
+        className: styles.divider
+    }), _react.createElement(_ButtonUndo.ButtonUndo, null), _react.createElement(_ButtonRedo.ButtonRedo, null), validationInfo.isAnyMarkEnabled && _react.createElement("span", {
         className: styles.divider
     }), (0, _validations.isMarkEnabled)(sdk.field, _richtexttypes.MARKS.BOLD) && _react.createElement(_Bold.ToolbarBoldButton, {
         isDisabled: isDisabled

package/dist/esm/Toolbar/components/ButtonRedo.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Icon } from '@contentful/f36-components';
+import { useContentfulEditor } from '../../ContentfulEditorProvider';
+import { ToolbarButton } from '../../plugins/shared/ToolbarButton';
+export const ButtonRedo = ()=>{
+    const editor = useContentfulEditor();
+    return React.createElement(ToolbarButton, {
+        title: "Redo",
+        testId: "redo-toolbar-button",
+        onClick: editor.redo,
+        isActive: false,
+        isDisabled: editor.history.redos.length === 0
+    }, React.createElement(Icon, {
+        variant: "secondary"
+    }, React.createElement("path", {
+        d: "M18.4,10.6C16.55,9 14.15,8 11.5,8C6.85,8 2.92,11.03 1.54,15.22L3.9,16C4.95,12.81 7.95,10.5 11.5,10.5C13.45,10.5 15.23,11.22 16.62,12.38L13,16H22V7L18.4,10.6Z"
+    })));
+};

package/dist/esm/Toolbar/components/ButtonUndo.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Icon } from '@contentful/f36-components';
+import { useContentfulEditor } from '../../ContentfulEditorProvider';
+import { ToolbarButton } from '../../plugins/shared/ToolbarButton';
+export const ButtonUndo = ()=>{
+    const editor = useContentfulEditor();
+    return React.createElement(ToolbarButton, {
+        title: "Undo",
+        testId: "undo-toolbar-button",
+        onClick: editor.undo,
+        isActive: false,
+        isDisabled: editor.history.undos.length === 0
+    }, React.createElement(Icon, {
+        variant: "secondary"
+    }, React.createElement("path", {
+        d: "M12.5,8C9.85,8 7.45,9 5.6,10.6L2,7V16H11L7.38,12.38C8.77,11.22 10.54,10.5 12.5,10.5C16.04,10.5 19.05,12.81 20.1,16L22.47,15.22C21.08,11.03 17.15,8 12.5,8Z"
+    })));
+};

package/dist/esm/Toolbar/index.js

@@ -21,6 +21,8 @@ import { ToolbarUnderlineButton } from '../plugins/Marks/Underline';
 import { ToolbarQuoteButton } from '../plugins/Quote';
 import { ToolbarTableButton } from '../plugins/Table';
 import { useSdkContext } from '../SdkProvider';
+import { ButtonRedo } from './components/ButtonRedo';
+import { ButtonUndo } from './components/ButtonUndo';
 import { EmbedEntityWidget } from './components/EmbedEntityWidget';
 const styles = {
     toolbar: css({
@@ -50,8 +52,7 @@ const styles = {
         ],
         webkitAlignSelf: 'flex-start',
         alignSelf: 'flex-start',
-        msFlexItemAlign: 'start',
-        marginLeft: 'auto'
+        msFlexItemAlign: 'start'
     }),
     formattingOptionsWrapper: css({
         display: [
@@ -100,14 +101,19 @@ const Toolbar = ({ isDisabled })=>{
     const dropdownItemsAvailable = isMarkEnabled(sdk.field, MARKS.SUPERSCRIPT) || isMarkEnabled(sdk.field, MARKS.SUBSCRIPT) || isMarkEnabled(sdk.field, MARKS.CODE);
     const shouldShowDropdown = boldItalicUnderlineAvailable && dropdownItemsAvailable;
     return React.createElement(Flex, {
+        gap: "spacingS",
+        flexWrap: "wrap",
+        flexDirection: "row",
         testId: "toolbar",
         className: styles.toolbar,
-        alignItems: "center"
+        justifyContent: "space-between"
     }, React.createElement("div", {
         className: styles.formattingOptionsWrapper
     }, React.createElement(ToolbarHeadingButton, {
         isDisabled: isDisabled || !canInsertBlocks
-    }), validationInfo.isAnyMarkEnabled && React.createElement("span", {
+    }), React.createElement("span", {
+        className: styles.divider
+    }), React.createElement(ButtonUndo, null), React.createElement(ButtonRedo, null), validationInfo.isAnyMarkEnabled && React.createElement("span", {
         className: styles.divider
     }), isMarkEnabled(sdk.field, MARKS.BOLD) && React.createElement(ToolbarBoldButton, {
         isDisabled: isDisabled

package/dist/types/Toolbar/components/ButtonRedo.d.ts

@@ -0,0 +1 @@
+export declare const ButtonRedo: () => JSX.Element;

package/dist/types/Toolbar/components/ButtonUndo.d.ts

@@ -0,0 +1 @@
+export declare const ButtonUndo: () => JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/field-editor-rich-text",
-  "version": "3.17.6",
+  "version": "3.18.0",
   "source": "./src/index.tsx",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -44,7 +44,7 @@
     "@contentful/f36-icons": "^4.1.1",
     "@contentful/f36-tokens": "^4.0.0",
     "@contentful/f36-utils": "^4.19.0",
-    "@contentful/field-editor-reference": "^5.22.5",
+    "@contentful/field-editor-reference": "^5.22.6",
     "@contentful/field-editor-shared": "^1.4.6",
     "@contentful/rich-text-plain-text-renderer": "^16.0.4",
     "@contentful/rich-text-types": "16.3.0",
@@ -86,5 +86,5 @@
   "publishConfig": {
     "registry": "https://npm.pkg.github.com/"
   },
-  "gitHead": "10e398314c1fae1ec2b5a8552dd34bba410faf48"
+  "gitHead": "07c583c9bd150caf992c18cdbccc536e8f3a6467"
 }