@atlaskit/editor-plugin-undo-redo 3.1.2 → 3.2.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-plugin-undo-redo
 
+## 3.2.0
+
+### Minor Changes
+
+- [`f78a34afab8d4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f78a34afab8d4) -
+  [ux] ED-28961 register undo redo and track changes buttons to new toolbar behind
+  platform_editor_toolbar_aifc. adds ai buttons into comment toolbar.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 3.1.2
 
 ### Patch Changes

package/dist/cjs/ui/ToolbarUndoRedo/RedoButton.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RedoButton = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _hooks = require("@atlaskit/editor-common/hooks");
+var _keymaps = require("@atlaskit/editor-common/keymaps");
+var _messages = require("@atlaskit/editor-common/messages");
+var _toolbar = require("@atlaskit/editor-common/toolbar");
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _commands = require("../../pm-plugins/commands");
+var _utils = require("../../pm-plugins/utils");
+var RedoButton = exports.RedoButton = function RedoButton(_ref) {
+  var api = _ref.api;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
+    editorView = _useEditorToolbar.editorView;
+  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['history'], function (states) {
+      var _states$historyState;
+      return {
+        canRedo: (_states$historyState = states.historyState) === null || _states$historyState === void 0 ? void 0 : _states$historyState.canRedo
+      };
+    }),
+    canRedo = _useSharedPluginState.canRedo;
+  var handleRedo = function handleRedo() {
+    if (editorView) {
+      var _api$analytics;
+      (0, _utils.forceFocus)(editorView, api)((0, _commands.redoFromToolbarWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions));
+    }
+  };
+  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarTooltip, {
+    content: /*#__PURE__*/_react.default.createElement(_keymaps.ToolTipContent, {
+      description: formatMessage(_messages.undoRedoMessages.redo),
+      keymap: _keymaps.redo
+    })
+  }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarButton, {
+    iconBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.RedoIcon, {
+      label: formatMessage(_messages.undoRedoMessages.redo)
+    }),
+    onClick: handleRedo,
+    isDisabled: !canRedo,
+    ariaKeyshortcuts: (0, _keymaps.getAriaKeyshortcuts)(_keymaps.redo),
+    testId: "ak-editor-toolbar-button-redo"
+  }));
+};

package/dist/cjs/ui/ToolbarUndoRedo/UndoButton.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UndoButton = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _hooks = require("@atlaskit/editor-common/hooks");
+var _keymaps = require("@atlaskit/editor-common/keymaps");
+var _messages = require("@atlaskit/editor-common/messages");
+var _toolbar = require("@atlaskit/editor-common/toolbar");
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _commands = require("../../pm-plugins/commands");
+var _utils = require("../../pm-plugins/utils");
+var UndoButton = exports.UndoButton = function UndoButton(_ref) {
+  var api = _ref.api;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
+    editorView = _useEditorToolbar.editorView;
+  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['history'], function (states) {
+      var _states$historyState;
+      return {
+        canUndo: (_states$historyState = states.historyState) === null || _states$historyState === void 0 ? void 0 : _states$historyState.canUndo
+      };
+    }),
+    canUndo = _useSharedPluginState.canUndo;
+  var handleUndo = function handleUndo() {
+    if (editorView) {
+      var _api$analytics;
+      (0, _utils.forceFocus)(editorView, api)((0, _commands.undoFromToolbarWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions));
+    }
+  };
+  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarTooltip, {
+    content: /*#__PURE__*/_react.default.createElement(_keymaps.ToolTipContent, {
+      description: formatMessage(_messages.undoRedoMessages.undo),
+      keymap: _keymaps.undo
+    })
+  }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarButton, {
+    iconBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.UndoIcon, {
+      label: formatMessage(_messages.undoRedoMessages.undo)
+    }),
+    onClick: handleUndo,
+    isDisabled: !canUndo,
+    ariaKeyshortcuts: (0, _keymaps.getAriaKeyshortcuts)(_keymaps.undo),
+    testId: "ak-editor-toolbar-button-undo"
+  }));
+};

package/dist/cjs/ui/ToolbarUndoRedo/toolbar-components.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getToolbarComponents = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _toolbar = require("@atlaskit/editor-common/toolbar");
+var _RedoButton = require("./RedoButton");
+var _UndoButton = require("./UndoButton");
+var getToolbarComponents = exports.getToolbarComponents = function getToolbarComponents(api) {
+  return [{
+    type: _toolbar.UNDO_BUTTON.type,
+    key: _toolbar.UNDO_BUTTON.key,
+    parents: [{
+      type: _toolbar.TRACK_CHANGES_GROUP.type,
+      key: _toolbar.TRACK_CHANGES_GROUP.key,
+      rank: _toolbar.TRACK_CHANGES_GROUP_RANK[_toolbar.UNDO_BUTTON.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/_react.default.createElement(_UndoButton.UndoButton, {
+        api: api
+      });
+    }
+  }, {
+    type: _toolbar.REDO_BUTTON.type,
+    key: _toolbar.REDO_BUTTON.key,
+    parents: [{
+      type: _toolbar.TRACK_CHANGES_GROUP.type,
+      key: _toolbar.TRACK_CHANGES_GROUP.key,
+      rank: _toolbar.TRACK_CHANGES_GROUP_RANK[_toolbar.REDO_BUTTON.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/_react.default.createElement(_RedoButton.RedoButton, {
+        api: api
+      });
+    }
+  }];
+};

package/dist/cjs/undoRedoPlugin.js

@@ -9,6 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _history = require("@atlaskit/editor-prosemirror/history");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _attachInputMeta = require("./pm-plugins/attach-input-meta");
 var _enums = require("./pm-plugins/enums");
@@ -16,11 +17,11 @@ var _keymaps = require("./pm-plugins/keymaps");
 var _main = require("./pm-plugins/main");
 var _utils = require("./pm-plugins/utils");
 var _ToolbarUndoRedo = _interopRequireDefault(require("./ui/ToolbarUndoRedo"));
+var _toolbarComponents = require("./ui/ToolbarUndoRedo/toolbar-components");
 // Ignored via go/ees005
 // eslint-disable-next-line import/no-named-as-default
 
 var undoRedoPlugin = exports.undoRedoPlugin = function undoRedoPlugin(_ref) {
-  var _api$primaryToolbar;
   var api = _ref.api;
   var editorViewRef = {
     current: null
@@ -36,10 +37,16 @@ var undoRedoPlugin = exports.undoRedoPlugin = function undoRedoPlugin(_ref) {
       api: api
     });
   };
-  api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
-    name: 'undoRedoPlugin',
-    component: primaryToolbarComponent
-  });
+  if ((0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc', 'isEnabled', true)) {
+    var _api$toolbar;
+    api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents((0, _toolbarComponents.getToolbarComponents)(api));
+  } else {
+    var _api$primaryToolbar;
+    api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
+      name: 'undoRedoPlugin',
+      component: primaryToolbarComponent
+    });
+  }
   var handleUndo = function handleUndo(inputSource) {
     var _api$analytics;
     if (!editorViewRef.current) {
@@ -93,6 +100,6 @@ var undoRedoPlugin = exports.undoRedoPlugin = function undoRedoPlugin(_ref) {
       }
       return plugins;
     },
-    primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined
+    primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) && !(0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc', 'isEnabled', true) ? primaryToolbarComponent : undefined
   };
 };

package/dist/es2019/ui/ToolbarUndoRedo/RedoButton.js

@@ -0,0 +1,47 @@
+import React from "react";
+import { useIntl } from "react-intl-next";
+import { useSharedPluginStateWithSelector } from "@atlaskit/editor-common/hooks";
+import { getAriaKeyshortcuts, redo as redoKeymap, ToolTipContent } from '@atlaskit/editor-common/keymaps';
+import { undoRedoMessages } from '@atlaskit/editor-common/messages';
+import { useEditorToolbar } from "@atlaskit/editor-common/toolbar";
+import { ToolbarButton, RedoIcon, ToolbarTooltip } from "@atlaskit/editor-toolbar";
+import { redoFromToolbarWithAnalytics } from "../../pm-plugins/commands";
+import { forceFocus } from "../../pm-plugins/utils";
+export const RedoButton = ({
+  api
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  const {
+    editorView
+  } = useEditorToolbar();
+  const {
+    canRedo
+  } = useSharedPluginStateWithSelector(api, ['history'], states => {
+    var _states$historyState;
+    return {
+      canRedo: (_states$historyState = states.historyState) === null || _states$historyState === void 0 ? void 0 : _states$historyState.canRedo
+    };
+  });
+  const handleRedo = () => {
+    if (editorView) {
+      var _api$analytics;
+      forceFocus(editorView, api)(redoFromToolbarWithAnalytics(api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarTooltip, {
+    content: /*#__PURE__*/React.createElement(ToolTipContent, {
+      description: formatMessage(undoRedoMessages.redo),
+      keymap: redoKeymap
+    })
+  }, /*#__PURE__*/React.createElement(ToolbarButton, {
+    iconBefore: /*#__PURE__*/React.createElement(RedoIcon, {
+      label: formatMessage(undoRedoMessages.redo)
+    }),
+    onClick: handleRedo,
+    isDisabled: !canRedo,
+    ariaKeyshortcuts: getAriaKeyshortcuts(redoKeymap),
+    testId: "ak-editor-toolbar-button-redo"
+  }));
+};

package/dist/es2019/ui/ToolbarUndoRedo/UndoButton.js

@@ -0,0 +1,47 @@
+import React from "react";
+import { useIntl } from "react-intl-next";
+import { useSharedPluginStateWithSelector } from "@atlaskit/editor-common/hooks";
+import { getAriaKeyshortcuts, ToolTipContent, undo as undoKeymap } from '@atlaskit/editor-common/keymaps';
+import { undoRedoMessages } from '@atlaskit/editor-common/messages';
+import { useEditorToolbar } from "@atlaskit/editor-common/toolbar";
+import { ToolbarButton, ToolbarTooltip, UndoIcon } from "@atlaskit/editor-toolbar";
+import { undoFromToolbarWithAnalytics } from "../../pm-plugins/commands";
+import { forceFocus } from "../../pm-plugins/utils";
+export const UndoButton = ({
+  api
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  const {
+    editorView
+  } = useEditorToolbar();
+  const {
+    canUndo
+  } = useSharedPluginStateWithSelector(api, ['history'], states => {
+    var _states$historyState;
+    return {
+      canUndo: (_states$historyState = states.historyState) === null || _states$historyState === void 0 ? void 0 : _states$historyState.canUndo
+    };
+  });
+  const handleUndo = () => {
+    if (editorView) {
+      var _api$analytics;
+      forceFocus(editorView, api)(undoFromToolbarWithAnalytics(api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarTooltip, {
+    content: /*#__PURE__*/React.createElement(ToolTipContent, {
+      description: formatMessage(undoRedoMessages.undo),
+      keymap: undoKeymap
+    })
+  }, /*#__PURE__*/React.createElement(ToolbarButton, {
+    iconBefore: /*#__PURE__*/React.createElement(UndoIcon, {
+      label: formatMessage(undoRedoMessages.undo)
+    }),
+    onClick: handleUndo,
+    isDisabled: !canUndo,
+    ariaKeyshortcuts: getAriaKeyshortcuts(undoKeymap),
+    testId: "ak-editor-toolbar-button-undo"
+  }));
+};

package/dist/es2019/ui/ToolbarUndoRedo/toolbar-components.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { UNDO_BUTTON, REDO_BUTTON, TRACK_CHANGES_GROUP_RANK, TRACK_CHANGES_GROUP } from "@atlaskit/editor-common/toolbar";
+import { RedoButton } from './RedoButton';
+import { UndoButton } from "./UndoButton";
+export const getToolbarComponents = api => {
+  return [{
+    type: UNDO_BUTTON.type,
+    key: UNDO_BUTTON.key,
+    parents: [{
+      type: TRACK_CHANGES_GROUP.type,
+      key: TRACK_CHANGES_GROUP.key,
+      rank: TRACK_CHANGES_GROUP_RANK[UNDO_BUTTON.key]
+    }],
+    component: () => /*#__PURE__*/React.createElement(UndoButton, {
+      api: api
+    })
+  }, {
+    type: REDO_BUTTON.type,
+    key: REDO_BUTTON.key,
+    parents: [{
+      type: TRACK_CHANGES_GROUP.type,
+      key: TRACK_CHANGES_GROUP.key,
+      rank: TRACK_CHANGES_GROUP_RANK[REDO_BUTTON.key]
+    }],
+    component: () => /*#__PURE__*/React.createElement(RedoButton, {
+      api: api
+    })
+  }];
+};

package/dist/es2019/undoRedoPlugin.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { ACTION } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { redo, undo } from '@atlaskit/editor-prosemirror/history';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { attachInputMetaWithAnalytics } from './pm-plugins/attach-input-meta';
 import { InputSource } from './pm-plugins/enums';
@@ -11,10 +12,10 @@ import { forceFocus } from './pm-plugins/utils';
 // Ignored via go/ees005
 // eslint-disable-next-line import/no-named-as-default
 import ToolbarUndoRedo from './ui/ToolbarUndoRedo';
+import { getToolbarComponents } from './ui/ToolbarUndoRedo/toolbar-components';
 export const undoRedoPlugin = ({
   api
 }) => {
-  var _api$primaryToolbar;
   const editorViewRef = {
     current: null
   };
@@ -30,10 +31,16 @@ export const undoRedoPlugin = ({
       api: api
     });
   };
-  api === null || api === void 0 ? void 0 : (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 ? void 0 : _api$primaryToolbar.actions.registerComponent({
-    name: 'undoRedoPlugin',
-    component: primaryToolbarComponent
-  });
+  if (expValEquals('platform_editor_toolbar_aifc', 'isEnabled', true)) {
+    var _api$toolbar;
+    api === null || api === void 0 ? void 0 : (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.registerComponents(getToolbarComponents(api));
+  } else {
+    var _api$primaryToolbar;
+    api === null || api === void 0 ? void 0 : (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 ? void 0 : _api$primaryToolbar.actions.registerComponent({
+      name: 'undoRedoPlugin',
+      component: primaryToolbarComponent
+    });
+  }
   const handleUndo = inputSource => {
     var _api$analytics;
     if (!editorViewRef.current) {
@@ -83,6 +90,6 @@ export const undoRedoPlugin = ({
       }
       return plugins;
     },
-    primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined
+    primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) && !expValEquals('platform_editor_toolbar_aifc', 'isEnabled', true) ? primaryToolbarComponent : undefined
   };
 };

package/dist/esm/ui/ToolbarUndoRedo/RedoButton.js

@@ -0,0 +1,43 @@
+import React from "react";
+import { useIntl } from "react-intl-next";
+import { useSharedPluginStateWithSelector } from "@atlaskit/editor-common/hooks";
+import { getAriaKeyshortcuts, redo as redoKeymap, ToolTipContent } from '@atlaskit/editor-common/keymaps';
+import { undoRedoMessages } from '@atlaskit/editor-common/messages';
+import { useEditorToolbar } from "@atlaskit/editor-common/toolbar";
+import { ToolbarButton, RedoIcon, ToolbarTooltip } from "@atlaskit/editor-toolbar";
+import { redoFromToolbarWithAnalytics } from "../../pm-plugins/commands";
+import { forceFocus } from "../../pm-plugins/utils";
+export var RedoButton = function RedoButton(_ref) {
+  var api = _ref.api;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  var _useEditorToolbar = useEditorToolbar(),
+    editorView = _useEditorToolbar.editorView;
+  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['history'], function (states) {
+      var _states$historyState;
+      return {
+        canRedo: (_states$historyState = states.historyState) === null || _states$historyState === void 0 ? void 0 : _states$historyState.canRedo
+      };
+    }),
+    canRedo = _useSharedPluginState.canRedo;
+  var handleRedo = function handleRedo() {
+    if (editorView) {
+      var _api$analytics;
+      forceFocus(editorView, api)(redoFromToolbarWithAnalytics(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarTooltip, {
+    content: /*#__PURE__*/React.createElement(ToolTipContent, {
+      description: formatMessage(undoRedoMessages.redo),
+      keymap: redoKeymap
+    })
+  }, /*#__PURE__*/React.createElement(ToolbarButton, {
+    iconBefore: /*#__PURE__*/React.createElement(RedoIcon, {
+      label: formatMessage(undoRedoMessages.redo)
+    }),
+    onClick: handleRedo,
+    isDisabled: !canRedo,
+    ariaKeyshortcuts: getAriaKeyshortcuts(redoKeymap),
+    testId: "ak-editor-toolbar-button-redo"
+  }));
+};

package/dist/esm/ui/ToolbarUndoRedo/UndoButton.js

@@ -0,0 +1,43 @@
+import React from "react";
+import { useIntl } from "react-intl-next";
+import { useSharedPluginStateWithSelector } from "@atlaskit/editor-common/hooks";
+import { getAriaKeyshortcuts, ToolTipContent, undo as undoKeymap } from '@atlaskit/editor-common/keymaps';
+import { undoRedoMessages } from '@atlaskit/editor-common/messages';
+import { useEditorToolbar } from "@atlaskit/editor-common/toolbar";
+import { ToolbarButton, ToolbarTooltip, UndoIcon } from "@atlaskit/editor-toolbar";
+import { undoFromToolbarWithAnalytics } from "../../pm-plugins/commands";
+import { forceFocus } from "../../pm-plugins/utils";
+export var UndoButton = function UndoButton(_ref) {
+  var api = _ref.api;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  var _useEditorToolbar = useEditorToolbar(),
+    editorView = _useEditorToolbar.editorView;
+  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['history'], function (states) {
+      var _states$historyState;
+      return {
+        canUndo: (_states$historyState = states.historyState) === null || _states$historyState === void 0 ? void 0 : _states$historyState.canUndo
+      };
+    }),
+    canUndo = _useSharedPluginState.canUndo;
+  var handleUndo = function handleUndo() {
+    if (editorView) {
+      var _api$analytics;
+      forceFocus(editorView, api)(undoFromToolbarWithAnalytics(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarTooltip, {
+    content: /*#__PURE__*/React.createElement(ToolTipContent, {
+      description: formatMessage(undoRedoMessages.undo),
+      keymap: undoKeymap
+    })
+  }, /*#__PURE__*/React.createElement(ToolbarButton, {
+    iconBefore: /*#__PURE__*/React.createElement(UndoIcon, {
+      label: formatMessage(undoRedoMessages.undo)
+    }),
+    onClick: handleUndo,
+    isDisabled: !canUndo,
+    ariaKeyshortcuts: getAriaKeyshortcuts(undoKeymap),
+    testId: "ak-editor-toolbar-button-undo"
+  }));
+};

package/dist/esm/ui/ToolbarUndoRedo/toolbar-components.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { UNDO_BUTTON, REDO_BUTTON, TRACK_CHANGES_GROUP_RANK, TRACK_CHANGES_GROUP } from "@atlaskit/editor-common/toolbar";
+import { RedoButton } from './RedoButton';
+import { UndoButton } from "./UndoButton";
+export var getToolbarComponents = function getToolbarComponents(api) {
+  return [{
+    type: UNDO_BUTTON.type,
+    key: UNDO_BUTTON.key,
+    parents: [{
+      type: TRACK_CHANGES_GROUP.type,
+      key: TRACK_CHANGES_GROUP.key,
+      rank: TRACK_CHANGES_GROUP_RANK[UNDO_BUTTON.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/React.createElement(UndoButton, {
+        api: api
+      });
+    }
+  }, {
+    type: REDO_BUTTON.type,
+    key: REDO_BUTTON.key,
+    parents: [{
+      type: TRACK_CHANGES_GROUP.type,
+      key: TRACK_CHANGES_GROUP.key,
+      rank: TRACK_CHANGES_GROUP_RANK[REDO_BUTTON.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/React.createElement(RedoButton, {
+        api: api
+      });
+    }
+  }];
+};

package/dist/esm/undoRedoPlugin.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { ACTION } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { redo, undo } from '@atlaskit/editor-prosemirror/history';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { attachInputMetaWithAnalytics } from './pm-plugins/attach-input-meta';
 import { InputSource } from './pm-plugins/enums';
@@ -11,8 +12,8 @@ import { forceFocus } from './pm-plugins/utils';
 // Ignored via go/ees005
 // eslint-disable-next-line import/no-named-as-default
 import ToolbarUndoRedo from './ui/ToolbarUndoRedo';
+import { getToolbarComponents } from './ui/ToolbarUndoRedo/toolbar-components';
 export var undoRedoPlugin = function undoRedoPlugin(_ref) {
-  var _api$primaryToolbar;
   var api = _ref.api;
   var editorViewRef = {
     current: null
@@ -28,10 +29,16 @@ export var undoRedoPlugin = function undoRedoPlugin(_ref) {
       api: api
     });
   };
-  api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
-    name: 'undoRedoPlugin',
-    component: primaryToolbarComponent
-  });
+  if (expValEquals('platform_editor_toolbar_aifc', 'isEnabled', true)) {
+    var _api$toolbar;
+    api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents(getToolbarComponents(api));
+  } else {
+    var _api$primaryToolbar;
+    api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
+      name: 'undoRedoPlugin',
+      component: primaryToolbarComponent
+    });
+  }
   var handleUndo = function handleUndo(inputSource) {
     var _api$analytics;
     if (!editorViewRef.current) {
@@ -85,6 +92,6 @@ export var undoRedoPlugin = function undoRedoPlugin(_ref) {
       }
       return plugins;
     },
-    primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined
+    primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) && !expValEquals('platform_editor_toolbar_aifc', 'isEnabled', true) ? primaryToolbarComponent : undefined
   };
 };

package/dist/types/ui/ToolbarUndoRedo/RedoButton.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { ExtractInjectionAPI } from "@atlaskit/editor-common/types";
+import type { UndoRedoPlugin } from "../../undoRedoPluginType";
+type RedoButtonProps = {
+    api?: ExtractInjectionAPI<UndoRedoPlugin>;
+};
+export declare const RedoButton: ({ api }: RedoButtonProps) => React.JSX.Element;
+export {};

package/dist/types/ui/ToolbarUndoRedo/UndoButton.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { ExtractInjectionAPI } from "@atlaskit/editor-common/types";
+import type { UndoRedoPlugin } from "../../undoRedoPluginType";
+type UndoButtonProps = {
+    api?: ExtractInjectionAPI<UndoRedoPlugin>;
+};
+export declare const UndoButton: ({ api }: UndoButtonProps) => React.JSX.Element;
+export {};

package/dist/types/ui/ToolbarUndoRedo/toolbar-components.d.ts

@@ -0,0 +1,4 @@
+import type { ExtractInjectionAPI } from "@atlaskit/editor-common/types";
+import type { RegisterComponent } from "@atlaskit/editor-toolbar-model";
+import type { UndoRedoPlugin } from "../../undoRedoPluginType";
+export declare const getToolbarComponents: (api?: ExtractInjectionAPI<UndoRedoPlugin>) => RegisterComponent[];

package/dist/types/undoRedoPluginType.d.ts

@@ -2,6 +2,7 @@ import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/t
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { HistoryPlugin } from '@atlaskit/editor-plugin-history';
 import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugin-primary-toolbar';
+import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
 import { type InputSource } from './pm-plugins/enums';
 export type UndoRedoAction = (inputSource?: InputSource) => boolean;
@@ -10,7 +11,8 @@ export type UndoRedoPlugin = NextEditorPlugin<'undoRedoPlugin', {
         TypeAheadPlugin,
         HistoryPlugin,
         OptionalPlugin<PrimaryToolbarPlugin>,
-        OptionalPlugin<AnalyticsPlugin>
+        OptionalPlugin<AnalyticsPlugin>,
+        OptionalPlugin<ToolbarPlugin>
     ];
     actions: {
         undo: UndoRedoAction;

package/dist/types-ts4.5/ui/ToolbarUndoRedo/RedoButton.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { ExtractInjectionAPI } from "@atlaskit/editor-common/types";
+import type { UndoRedoPlugin } from "../../undoRedoPluginType";
+type RedoButtonProps = {
+    api?: ExtractInjectionAPI<UndoRedoPlugin>;
+};
+export declare const RedoButton: ({ api }: RedoButtonProps) => React.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/ToolbarUndoRedo/UndoButton.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { ExtractInjectionAPI } from "@atlaskit/editor-common/types";
+import type { UndoRedoPlugin } from "../../undoRedoPluginType";
+type UndoButtonProps = {
+    api?: ExtractInjectionAPI<UndoRedoPlugin>;
+};
+export declare const UndoButton: ({ api }: UndoButtonProps) => React.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/ToolbarUndoRedo/toolbar-components.d.ts

@@ -0,0 +1,4 @@
+import type { ExtractInjectionAPI } from "@atlaskit/editor-common/types";
+import type { RegisterComponent } from "@atlaskit/editor-toolbar-model";
+import type { UndoRedoPlugin } from "../../undoRedoPluginType";
+export declare const getToolbarComponents: (api?: ExtractInjectionAPI<UndoRedoPlugin>) => RegisterComponent[];

package/dist/types-ts4.5/undoRedoPluginType.d.ts

@@ -2,6 +2,7 @@ import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/t
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { HistoryPlugin } from '@atlaskit/editor-plugin-history';
 import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugin-primary-toolbar';
+import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
 import { type InputSource } from './pm-plugins/enums';
 export type UndoRedoAction = (inputSource?: InputSource) => boolean;
@@ -10,7 +11,8 @@ export type UndoRedoPlugin = NextEditorPlugin<'undoRedoPlugin', {
         TypeAheadPlugin,
         HistoryPlugin,
         OptionalPlugin<PrimaryToolbarPlugin>,
-        OptionalPlugin<AnalyticsPlugin>
+        OptionalPlugin<AnalyticsPlugin>,
+        OptionalPlugin<ToolbarPlugin>
     ];
     actions: {
         undo: UndoRedoAction;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-undo-redo",
-	"version": "3.1.2",
+	"version": "3.2.0",
 	"description": "Undo redo plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -34,16 +34,19 @@
 	"dependencies": {
 		"@atlaskit/editor-plugin-history": "^3.1.0",
 		"@atlaskit/editor-plugin-primary-toolbar": "^4.1.0",
+		"@atlaskit/editor-plugin-toolbar": "^0.2.0",
 		"@atlaskit/editor-plugin-type-ahead": "^3.1.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
+		"@atlaskit/editor-toolbar": "^0.3.0",
+		"@atlaskit/editor-toolbar-model": "^0.1.0",
 		"@atlaskit/icon": "^27.12.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/tmp-editor-statsig": "^11.0.0",
+		"@atlaskit/tmp-editor-statsig": "^11.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^107.25.0",
+		"@atlaskit/editor-common": "^107.26.0",
 		"react": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},