@atlaskit/editor-plugin-floating-toolbar 8.2.1 → 8.2.3

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/editor-plugin-floating-toolbar
 
+## 8.2.3
+
+### Patch Changes
+
+- [`ff53e1bfc6c25`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ff53e1bfc6c25) -
+  [ED-29482] clean up references to platform_editor_toolbar_rerender_optimization_exp
+- [`663926469ec70`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/663926469ec70) -
+  Switch to use fg() to check feature gate platform_editor_update_modal_close_button
+- Updated dependencies
+
+## 8.2.2
+
+### Patch Changes
+
+- [`94b21013815ad`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/94b21013815ad) -
+  [ux] ensure confirmation is required when removing a table with an associated chart (fixes bug
+  when platform_editor_controls is set to variant1)
+- Updated dependencies
+
 ## 8.2.1
 
 ### Patch Changes

package/dist/cjs/floatingToolbarPlugin.js

@@ -228,7 +228,7 @@ var floatingToolbarPlugin = exports.floatingToolbarPlugin = function floatingToo
  * @returns JSX element representing the floating toolbar or null if not visible
  */
 function ContentComponent(_ref5) {
-  var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d;
+  var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
   var pluginInjectionApi = _ref5.pluginInjectionApi,
     editorView = _ref5.editorView,
     popupsMountPoint = _ref5.popupsMountPoint,
@@ -389,14 +389,33 @@ function ContentComponent(_ref5) {
   };
 
   // Confirm dialog
-  var _ref7 = floatingToolbarData || {},
-    confirmDialogForItem = _ref7.confirmDialogForItem;
-  var confirmButtonItem = confirmDialogForItem ?
-  // Ignored via go/ees005
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  toolbarItems[confirmDialogForItem] : undefined;
+  var confirmButtonItem;
+  if ((0, _platformFeatureFlags.fg)('platform_editor_fix_confirm_table_removal')) {
+    var _ref7 = floatingToolbarData || {},
+      confirmDialogForItem = _ref7.confirmDialogForItem,
+      confirmDialogForItemOption = _ref7.confirmDialogForItemOption;
+    var matchingItem = confirmDialogForItem ? toolbarItems === null || toolbarItems === void 0 ? void 0 : toolbarItems[confirmDialogForItem] : undefined;
+    if ((matchingItem === null || matchingItem === void 0 ? void 0 : matchingItem.type) === 'button') {
+      confirmButtonItem = matchingItem;
+    }
+    if ((matchingItem === null || matchingItem === void 0 ? void 0 : matchingItem.type) === 'overflow-dropdown' && confirmDialogForItemOption !== undefined) {
+      var matchingItemOption = matchingItem.options[confirmDialogForItemOption];
+
+      // OverflowDropdownOption is the only member of the union that does not have a 'type' property
+      if (!('type' in matchingItemOption)) {
+        confirmButtonItem = matchingItemOption;
+      }
+    }
+  } else {
+    var _ref8 = floatingToolbarData || {},
+      _confirmDialogForItem = _ref8.confirmDialogForItem;
+    confirmButtonItem = _confirmDialogForItem ?
+    // Ignored via go/ees005
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    toolbarItems[_confirmDialogForItem] : undefined;
+  }
   var scrollable = config.scrollable;
-  var confirmDialogOptions = typeof (confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog) === 'function' ? confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog() : confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog;
+  var confirmDialogOptions = typeof ((_confirmButtonItem = confirmButtonItem) === null || _confirmButtonItem === void 0 ? void 0 : _confirmButtonItem.confirmDialog) === 'function' ? (_confirmButtonItem2 = confirmButtonItem) === null || _confirmButtonItem2 === void 0 ? void 0 : _confirmButtonItem2.confirmDialog() : (_confirmButtonItem3 = confirmButtonItem) === null || _confirmButtonItem3 === void 0 ? void 0 : _confirmButtonItem3.confirmDialog;
   return /*#__PURE__*/_react.default.createElement(_errorBoundary.ErrorBoundary, {
     component: _analytics.ACTION_SUBJECT.FLOATING_TOOLBAR_PLUGIN,
     componentId: (0, _camelCase.default)(title),

package/dist/cjs/pm-plugins/toolbar-data/commands.js

@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.showConfirmDialog = exports.hideConfirmDialog = void 0;
 var _pluginFactory = require("./plugin-factory");
-var showConfirmDialog = exports.showConfirmDialog = function showConfirmDialog(buttonIndex) {
+var showConfirmDialog = exports.showConfirmDialog = function showConfirmDialog(buttonIndex, optionIndex) {
   return (0, _pluginFactory.createCommand)({
     type: 'SHOW_CONFIRM_DIALOG',
     data: {
-      buttonIndex: buttonIndex
+      buttonIndex: buttonIndex,
+      optionIndex: optionIndex
     }
   }, function (tr) {
     return tr.setMeta('addToHistory', false);

package/dist/cjs/pm-plugins/toolbar-data/reducer.js

@@ -12,7 +12,8 @@ var reducer = exports.reducer = function reducer(pluginState, action) {
   switch (action.type) {
     case 'SHOW_CONFIRM_DIALOG':
       return _objectSpread(_objectSpread({}, pluginState), {}, {
-        confirmDialogForItem: action.data.buttonIndex
+        confirmDialogForItem: action.data.buttonIndex,
+        confirmDialogForItemOption: action.data.optionIndex
       });
     case 'HIDE_CONFIRM_DIALOG':
       return _objectSpread(_objectSpread({}, pluginState), {}, {

package/dist/cjs/ui/CheckboxModal.js

@@ -13,8 +13,8 @@ var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _checkbox = require("@atlaskit/checkbox");
 var _floatingToolbar = require("@atlaskit/editor-common/floating-toolbar");
 var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var CheckboxModal = exports.CheckboxModal = function CheckboxModal(props) {
   var _options$getChildrenI;
@@ -63,7 +63,7 @@ var CheckboxModal = exports.CheckboxModal = function CheckboxModal(props) {
     onClose: onClose,
     testId: testId
   }, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalHeader, {
-    hasCloseButton: (0, _expValEquals.expValEquals)('platform_editor_update_modal_close_button', 'isEnabled', true)
+    hasCloseButton: (0, _platformFeatureFlags.fg)('platform_editor_update_modal_close_button')
   }, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTitle, {
     appearance: "warning"
   }, heading)), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalBody, null, /*#__PURE__*/_react.default.createElement(_compiled.Text, {

package/dist/cjs/ui/SimpleModal.js

@@ -10,8 +10,8 @@ var _react = _interopRequireDefault(require("react"));
 var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _floatingToolbar = require("@atlaskit/editor-common/floating-toolbar");
 var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var SimpleModal = exports.SimpleModal = function SimpleModal(props) {
   var onConfirm = props.onConfirm,
@@ -26,7 +26,7 @@ var SimpleModal = exports.SimpleModal = function SimpleModal(props) {
     onClose: onClose,
     testId: testId
   }, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalHeader, {
-    hasCloseButton: (0, _expValEquals.expValEquals)('platform_editor_update_modal_close_button', 'isEnabled', true)
+    hasCloseButton: (0, _platformFeatureFlags.fg)('platform_editor_update_modal_close_button')
   }, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTitle, {
     appearance: "warning"
   }, heading)), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalBody, null, /*#__PURE__*/_react.default.createElement(_compiled.Text, {

package/dist/cjs/ui/Toolbar.js

@@ -26,8 +26,8 @@ var _uiColor = require("@atlaskit/editor-common/ui-color");
 var _uiMenu = require("@atlaskit/editor-common/ui-menu");
 var _editorPalette = require("@atlaskit/editor-palette");
 var _showMoreHorizontal = _interopRequireDefault(require("@atlaskit/icon/core/show-more-horizontal"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _forceFocus = require("../pm-plugins/force-focus");
 var _commands = require("../pm-plugins/toolbar-data/commands");
 var _Dropdown = _interopRequireDefault(require("./Dropdown"));
@@ -39,7 +39,9 @@ var _ScrollButtons = require("./ScrollButtons");
 var _Select = _interopRequireDefault(require("./Select"));
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation */ /**
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation */ /**
  * @jsxRuntime classic
  * @jsx jsx
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -200,6 +202,25 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
           return item.render(editorView, idx, dispatchAnalyticsEvent);
         }
       case 'overflow-dropdown':
+        var options;
+        if ((0, _platformFeatureFlags.fg)('platform_editor_fix_confirm_table_removal')) {
+          // if an option has a confirmDialog, we need to replace its onClick handler
+          // to set the state to show the confirm dialog
+
+          // crudely done here to avoid greater coupling with DropdownMenuItem from `floating-toolbar`
+          // which would need knowledge of indexes, showConfirmDialog etc.
+          options = item.options.map(function (option, optionIndex) {
+            if (!('type' in option) && option.confirmDialog) {
+              var onClick = option.confirmDialog ? (0, _commands.showConfirmDialog)(idx, optionIndex) : option.onClick;
+              return _objectSpread(_objectSpread({}, option), {}, {
+                onClick: onClick
+              });
+            }
+            return option;
+          });
+        } else {
+          options = item.options;
+        }
         return (0, _react2.jsx)(_Dropdown.default, {
           alignX: areAnyNewToolbarFlagsEnabled ? 'right' : undefined,
           key: idx,
@@ -209,7 +230,7 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
             spacing: "spacious"
           }),
           dispatchCommand: dispatchCommand,
-          options: item.options,
+          options: options,
           disabled: item.disabled,
           tooltip: item.tooltip,
           hideExpandIcon: true,
@@ -677,16 +698,12 @@ var Toolbar = /*#__PURE__*/function (_Component) {
       var hasSelect = items.find(function (item) {
         return item.type === 'select' && item.selectType === 'list';
       });
-      var isShortcutToFocusToolbar = function isShortcutToFocusToolbar(event) {
-        //Alt + F10 to reach first element in this floating toolbar
-        return event.altKey && (event.key === 'F10' || event.keyCode === 121);
-      };
       return (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_uiMenu.ToolbarArrowKeyNavigationProvider, {
         editorView: this.props.editorView,
         handleEscape: this.handleEscape,
         disableArrowKeyNavigation: !this.shouldHandleArrowKeys(),
         childComponentSelector: "[data-testid='editor-floating-toolbar']",
-        isShortcutToFocusToolbar: (0, _experiments.editorExperiment)('platform_editor_toolbar_rerender_optimization_exp', true) ? this.isShortcutToFocusToolbar : isShortcutToFocusToolbar,
+        isShortcutToFocusToolbar: this.isShortcutToFocusToolbar,
         intl: intl
       }, (0, _react2.jsx)("div", {
         ref: this.toolbarContainerRef,

package/dist/es2019/floatingToolbarPlugin.js

@@ -222,7 +222,7 @@ export function ContentComponent({
   providerFactory,
   dispatchAnalyticsEvent
 }) {
-  var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d;
+  var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
   const {
     floatingToolbarState,
     editorDisabledState,
@@ -373,15 +373,35 @@ export function ContentComponent({
   const dispatchCommand = fn => fn && fn(editorView.state, editorView.dispatch, editorView);
 
   // Confirm dialog
-  const {
-    confirmDialogForItem
-  } = floatingToolbarData || {};
-  const confirmButtonItem = confirmDialogForItem ?
-  // Ignored via go/ees005
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  toolbarItems[confirmDialogForItem] : undefined;
+  let confirmButtonItem;
+  if (fg('platform_editor_fix_confirm_table_removal')) {
+    const {
+      confirmDialogForItem,
+      confirmDialogForItemOption
+    } = floatingToolbarData || {};
+    const matchingItem = confirmDialogForItem ? toolbarItems === null || toolbarItems === void 0 ? void 0 : toolbarItems[confirmDialogForItem] : undefined;
+    if ((matchingItem === null || matchingItem === void 0 ? void 0 : matchingItem.type) === 'button') {
+      confirmButtonItem = matchingItem;
+    }
+    if ((matchingItem === null || matchingItem === void 0 ? void 0 : matchingItem.type) === 'overflow-dropdown' && confirmDialogForItemOption !== undefined) {
+      const matchingItemOption = matchingItem.options[confirmDialogForItemOption];
+
+      // OverflowDropdownOption is the only member of the union that does not have a 'type' property
+      if (!('type' in matchingItemOption)) {
+        confirmButtonItem = matchingItemOption;
+      }
+    }
+  } else {
+    const {
+      confirmDialogForItem
+    } = floatingToolbarData || {};
+    confirmButtonItem = confirmDialogForItem ?
+    // Ignored via go/ees005
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    toolbarItems[confirmDialogForItem] : undefined;
+  }
   const scrollable = config.scrollable;
-  const confirmDialogOptions = typeof (confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog) === 'function' ? confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog() : confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog;
+  const confirmDialogOptions = typeof ((_confirmButtonItem = confirmButtonItem) === null || _confirmButtonItem === void 0 ? void 0 : _confirmButtonItem.confirmDialog) === 'function' ? (_confirmButtonItem2 = confirmButtonItem) === null || _confirmButtonItem2 === void 0 ? void 0 : _confirmButtonItem2.confirmDialog() : (_confirmButtonItem3 = confirmButtonItem) === null || _confirmButtonItem3 === void 0 ? void 0 : _confirmButtonItem3.confirmDialog;
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
     component: ACTION_SUBJECT.FLOATING_TOOLBAR_PLUGIN,
     componentId: camelCase(title),

package/dist/es2019/pm-plugins/toolbar-data/commands.js

@@ -1,8 +1,9 @@
 import { createCommand } from './plugin-factory';
-export const showConfirmDialog = buttonIndex => createCommand({
+export const showConfirmDialog = (buttonIndex, optionIndex) => createCommand({
   type: 'SHOW_CONFIRM_DIALOG',
   data: {
-    buttonIndex
+    buttonIndex,
+    optionIndex
   }
 }, tr => tr.setMeta('addToHistory', false));
 export const hideConfirmDialog = () => createCommand({

package/dist/es2019/pm-plugins/toolbar-data/reducer.js

@@ -3,7 +3,8 @@ export const reducer = (pluginState, action) => {
     case 'SHOW_CONFIRM_DIALOG':
       return {
         ...pluginState,
-        confirmDialogForItem: action.data.buttonIndex
+        confirmDialogForItem: action.data.buttonIndex,
+        confirmDialogForItemOption: action.data.optionIndex
       };
     case 'HIDE_CONFIRM_DIALOG':
       return {

package/dist/es2019/ui/CheckboxModal.js

@@ -4,8 +4,8 @@ import Button from '@atlaskit/button/new';
 import { Checkbox } from '@atlaskit/checkbox';
 import { messages } from '@atlaskit/editor-common/floating-toolbar';
 import Modal, { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text } from '@atlaskit/primitives/compiled';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export const CheckboxModal = props => {
   var _options$getChildrenI;
   const [isChecked, setCheckbox] = useState(false);
@@ -54,7 +54,7 @@ export const CheckboxModal = props => {
     onClose: onClose,
     testId: testId
   }, /*#__PURE__*/React.createElement(ModalHeader, {
-    hasCloseButton: expValEquals('platform_editor_update_modal_close_button', 'isEnabled', true)
+    hasCloseButton: fg('platform_editor_update_modal_close_button')
   }, /*#__PURE__*/React.createElement(ModalTitle, {
     appearance: "warning"
   }, heading)), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Text, {

package/dist/es2019/ui/SimpleModal.js

@@ -2,8 +2,8 @@ import React from 'react';
 import Button from '@atlaskit/button/new';
 import { messages } from '@atlaskit/editor-common/floating-toolbar';
 import Modal, { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text } from '@atlaskit/primitives/compiled';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export const SimpleModal = props => {
   const {
     onConfirm,
@@ -21,7 +21,7 @@ export const SimpleModal = props => {
     onClose: onClose,
     testId: testId
   }, /*#__PURE__*/React.createElement(ModalHeader, {
-    hasCloseButton: expValEquals('platform_editor_update_modal_close_button', 'isEnabled', true)
+    hasCloseButton: fg('platform_editor_update_modal_close_button')
   }, /*#__PURE__*/React.createElement(ModalTitle, {
     appearance: "warning"
   }, heading)), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Text, {

package/dist/es2019/ui/Toolbar.js

@@ -19,8 +19,8 @@ import { backgroundPaletteTooltipMessages } from '@atlaskit/editor-common/ui-col
 import { ColorPickerButton, ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
 import { hexToEditorBackgroundPaletteColor } from '@atlaskit/editor-palette';
 import ShowMoreHorizontalIcon from '@atlaskit/icon/core/show-more-horizontal';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { checkShouldForceFocusAndApply, forceFocusSelector } from '../pm-plugins/force-focus';
 import { showConfirmDialog } from '../pm-plugins/toolbar-data/commands';
 import Dropdown from './Dropdown';
@@ -178,6 +178,26 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
           return item.render(editorView, idx, dispatchAnalyticsEvent);
         }
       case 'overflow-dropdown':
+        let options;
+        if (fg('platform_editor_fix_confirm_table_removal')) {
+          // if an option has a confirmDialog, we need to replace its onClick handler
+          // to set the state to show the confirm dialog
+
+          // crudely done here to avoid greater coupling with DropdownMenuItem from `floating-toolbar`
+          // which would need knowledge of indexes, showConfirmDialog etc.
+          options = item.options.map((option, optionIndex) => {
+            if (!('type' in option) && option.confirmDialog) {
+              const onClick = option.confirmDialog ? showConfirmDialog(idx, optionIndex) : option.onClick;
+              return {
+                ...option,
+                onClick
+              };
+            }
+            return option;
+          });
+        } else {
+          options = item.options;
+        }
         return jsx(Dropdown, {
           alignX: areAnyNewToolbarFlagsEnabled ? 'right' : undefined,
           key: idx,
@@ -187,7 +207,7 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
             spacing: "spacious"
           }),
           dispatchCommand: dispatchCommand,
-          options: item.options,
+          options: options,
           disabled: item.disabled,
           tooltip: item.tooltip,
           hideExpandIcon: true,
@@ -629,16 +649,12 @@ class Toolbar extends Component {
     // Select has left padding of 4px to the border, everything else 8px
     const firstElementIsSelect = items[0].type === 'select';
     const hasSelect = items.find(item => item.type === 'select' && item.selectType === 'list');
-    const isShortcutToFocusToolbar = event => {
-      //Alt + F10 to reach first element in this floating toolbar
-      return event.altKey && (event.key === 'F10' || event.keyCode === 121);
-    };
     return jsx(React.Fragment, null, jsx(ToolbarArrowKeyNavigationProvider, {
       editorView: this.props.editorView,
       handleEscape: this.handleEscape,
       disableArrowKeyNavigation: !this.shouldHandleArrowKeys(),
       childComponentSelector: "[data-testid='editor-floating-toolbar']",
-      isShortcutToFocusToolbar: editorExperiment('platform_editor_toolbar_rerender_optimization_exp', true) ? this.isShortcutToFocusToolbar : isShortcutToFocusToolbar,
+      isShortcutToFocusToolbar: this.isShortcutToFocusToolbar,
       intl: intl
     }, jsx("div", {
       ref: this.toolbarContainerRef,

package/dist/esm/floatingToolbarPlugin.js

@@ -219,7 +219,7 @@ export var floatingToolbarPlugin = function floatingToolbarPlugin(_ref) {
  * @returns JSX element representing the floating toolbar or null if not visible
  */
 export function ContentComponent(_ref5) {
-  var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d;
+  var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
   var pluginInjectionApi = _ref5.pluginInjectionApi,
     editorView = _ref5.editorView,
     popupsMountPoint = _ref5.popupsMountPoint,
@@ -380,14 +380,33 @@ export function ContentComponent(_ref5) {
   };
 
   // Confirm dialog
-  var _ref7 = floatingToolbarData || {},
-    confirmDialogForItem = _ref7.confirmDialogForItem;
-  var confirmButtonItem = confirmDialogForItem ?
-  // Ignored via go/ees005
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  toolbarItems[confirmDialogForItem] : undefined;
+  var confirmButtonItem;
+  if (fg('platform_editor_fix_confirm_table_removal')) {
+    var _ref7 = floatingToolbarData || {},
+      confirmDialogForItem = _ref7.confirmDialogForItem,
+      confirmDialogForItemOption = _ref7.confirmDialogForItemOption;
+    var matchingItem = confirmDialogForItem ? toolbarItems === null || toolbarItems === void 0 ? void 0 : toolbarItems[confirmDialogForItem] : undefined;
+    if ((matchingItem === null || matchingItem === void 0 ? void 0 : matchingItem.type) === 'button') {
+      confirmButtonItem = matchingItem;
+    }
+    if ((matchingItem === null || matchingItem === void 0 ? void 0 : matchingItem.type) === 'overflow-dropdown' && confirmDialogForItemOption !== undefined) {
+      var matchingItemOption = matchingItem.options[confirmDialogForItemOption];
+
+      // OverflowDropdownOption is the only member of the union that does not have a 'type' property
+      if (!('type' in matchingItemOption)) {
+        confirmButtonItem = matchingItemOption;
+      }
+    }
+  } else {
+    var _ref8 = floatingToolbarData || {},
+      _confirmDialogForItem = _ref8.confirmDialogForItem;
+    confirmButtonItem = _confirmDialogForItem ?
+    // Ignored via go/ees005
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    toolbarItems[_confirmDialogForItem] : undefined;
+  }
   var scrollable = config.scrollable;
-  var confirmDialogOptions = typeof (confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog) === 'function' ? confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog() : confirmButtonItem === null || confirmButtonItem === void 0 ? void 0 : confirmButtonItem.confirmDialog;
+  var confirmDialogOptions = typeof ((_confirmButtonItem = confirmButtonItem) === null || _confirmButtonItem === void 0 ? void 0 : _confirmButtonItem.confirmDialog) === 'function' ? (_confirmButtonItem2 = confirmButtonItem) === null || _confirmButtonItem2 === void 0 ? void 0 : _confirmButtonItem2.confirmDialog() : (_confirmButtonItem3 = confirmButtonItem) === null || _confirmButtonItem3 === void 0 ? void 0 : _confirmButtonItem3.confirmDialog;
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
     component: ACTION_SUBJECT.FLOATING_TOOLBAR_PLUGIN,
     componentId: camelCase(title),

package/dist/esm/pm-plugins/toolbar-data/commands.js

@@ -1,9 +1,10 @@
 import { createCommand } from './plugin-factory';
-export var showConfirmDialog = function showConfirmDialog(buttonIndex) {
+export var showConfirmDialog = function showConfirmDialog(buttonIndex, optionIndex) {
   return createCommand({
     type: 'SHOW_CONFIRM_DIALOG',
     data: {
-      buttonIndex: buttonIndex
+      buttonIndex: buttonIndex,
+      optionIndex: optionIndex
     }
   }, function (tr) {
     return tr.setMeta('addToHistory', false);

package/dist/esm/pm-plugins/toolbar-data/reducer.js

@@ -5,7 +5,8 @@ export var reducer = function reducer(pluginState, action) {
   switch (action.type) {
     case 'SHOW_CONFIRM_DIALOG':
       return _objectSpread(_objectSpread({}, pluginState), {}, {
-        confirmDialogForItem: action.data.buttonIndex
+        confirmDialogForItem: action.data.buttonIndex,
+        confirmDialogForItemOption: action.data.optionIndex
       });
     case 'HIDE_CONFIRM_DIALOG':
       return _objectSpread(_objectSpread({}, pluginState), {}, {

package/dist/esm/ui/CheckboxModal.js

@@ -5,8 +5,8 @@ import Button from '@atlaskit/button/new';
 import { Checkbox } from '@atlaskit/checkbox';
 import { messages } from '@atlaskit/editor-common/floating-toolbar';
 import Modal, { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text } from '@atlaskit/primitives/compiled';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export var CheckboxModal = function CheckboxModal(props) {
   var _options$getChildrenI;
   var _useState = useState(false),
@@ -54,7 +54,7 @@ export var CheckboxModal = function CheckboxModal(props) {
     onClose: onClose,
     testId: testId
   }, /*#__PURE__*/React.createElement(ModalHeader, {
-    hasCloseButton: expValEquals('platform_editor_update_modal_close_button', 'isEnabled', true)
+    hasCloseButton: fg('platform_editor_update_modal_close_button')
   }, /*#__PURE__*/React.createElement(ModalTitle, {
     appearance: "warning"
   }, heading)), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Text, {

package/dist/esm/ui/SimpleModal.js

@@ -2,8 +2,8 @@ import React from 'react';
 import Button from '@atlaskit/button/new';
 import { messages } from '@atlaskit/editor-common/floating-toolbar';
 import Modal, { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text } from '@atlaskit/primitives/compiled';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export var SimpleModal = function SimpleModal(props) {
   var onConfirm = props.onConfirm,
     onClose = props.onClose,
@@ -17,7 +17,7 @@ export var SimpleModal = function SimpleModal(props) {
     onClose: onClose,
     testId: testId
   }, /*#__PURE__*/React.createElement(ModalHeader, {
-    hasCloseButton: expValEquals('platform_editor_update_modal_close_button', 'isEnabled', true)
+    hasCloseButton: fg('platform_editor_update_modal_close_button')
   }, /*#__PURE__*/React.createElement(ModalTitle, {
     appearance: "warning"
   }, heading)), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Text, {

package/dist/esm/ui/Toolbar.js

@@ -7,6 +7,8 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation */
 /**
  * @jsxRuntime classic
@@ -26,8 +28,8 @@ import { backgroundPaletteTooltipMessages } from '@atlaskit/editor-common/ui-col
 import { ColorPickerButton, ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
 import { hexToEditorBackgroundPaletteColor } from '@atlaskit/editor-palette';
 import ShowMoreHorizontalIcon from '@atlaskit/icon/core/show-more-horizontal';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { checkShouldForceFocusAndApply, forceFocusSelector } from '../pm-plugins/force-focus';
 import { showConfirmDialog } from '../pm-plugins/toolbar-data/commands';
 import Dropdown from './Dropdown';
@@ -194,6 +196,25 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
           return item.render(editorView, idx, dispatchAnalyticsEvent);
         }
       case 'overflow-dropdown':
+        var options;
+        if (fg('platform_editor_fix_confirm_table_removal')) {
+          // if an option has a confirmDialog, we need to replace its onClick handler
+          // to set the state to show the confirm dialog
+
+          // crudely done here to avoid greater coupling with DropdownMenuItem from `floating-toolbar`
+          // which would need knowledge of indexes, showConfirmDialog etc.
+          options = item.options.map(function (option, optionIndex) {
+            if (!('type' in option) && option.confirmDialog) {
+              var onClick = option.confirmDialog ? showConfirmDialog(idx, optionIndex) : option.onClick;
+              return _objectSpread(_objectSpread({}, option), {}, {
+                onClick: onClick
+              });
+            }
+            return option;
+          });
+        } else {
+          options = item.options;
+        }
         return jsx(Dropdown, {
           alignX: areAnyNewToolbarFlagsEnabled ? 'right' : undefined,
           key: idx,
@@ -203,7 +224,7 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
             spacing: "spacious"
           }),
           dispatchCommand: dispatchCommand,
-          options: item.options,
+          options: options,
           disabled: item.disabled,
           tooltip: item.tooltip,
           hideExpandIcon: true,
@@ -671,16 +692,12 @@ var Toolbar = /*#__PURE__*/function (_Component) {
       var hasSelect = items.find(function (item) {
         return item.type === 'select' && item.selectType === 'list';
       });
-      var isShortcutToFocusToolbar = function isShortcutToFocusToolbar(event) {
-        //Alt + F10 to reach first element in this floating toolbar
-        return event.altKey && (event.key === 'F10' || event.keyCode === 121);
-      };
       return jsx(React.Fragment, null, jsx(ToolbarArrowKeyNavigationProvider, {
         editorView: this.props.editorView,
         handleEscape: this.handleEscape,
         disableArrowKeyNavigation: !this.shouldHandleArrowKeys(),
         childComponentSelector: "[data-testid='editor-floating-toolbar']",
-        isShortcutToFocusToolbar: editorExperiment('platform_editor_toolbar_rerender_optimization_exp', true) ? this.isShortcutToFocusToolbar : isShortcutToFocusToolbar,
+        isShortcutToFocusToolbar: this.isShortcutToFocusToolbar,
         intl: intl
       }, jsx("div", {
         ref: this.toolbarContainerRef,

package/dist/types/floatingToolbarPluginType.d.ts

@@ -24,6 +24,7 @@ export type FloatingToolbarPluginState = {
 };
 export type FloatingToolbarPluginData = {
     confirmDialogForItem?: number;
+    confirmDialogForItemOption?: number;
 };
 export type ForceFocusSelector = (selector: string | null) => (tr: Transaction) => Transaction;
 /**

package/dist/types/pm-plugins/toolbar-data/commands.d.ts

@@ -1,3 +1,3 @@
 import type { Command } from '@atlaskit/editor-common/types';
-export declare const showConfirmDialog: (buttonIndex: number) => Command;
+export declare const showConfirmDialog: (buttonIndex: number, optionIndex?: number) => Command;
 export declare const hideConfirmDialog: () => Command;

package/dist/types/pm-plugins/toolbar-data/types.d.ts

@@ -1,6 +1,7 @@
 export type FloatingToolbarPluginAction = {
     data: {
         buttonIndex: number;
+        optionIndex?: number;
     };
     type: 'SHOW_CONFIRM_DIALOG';
 } | {

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

@@ -24,6 +24,7 @@ export type FloatingToolbarPluginState = {
 };
 export type FloatingToolbarPluginData = {
     confirmDialogForItem?: number;
+    confirmDialogForItemOption?: number;
 };
 export type ForceFocusSelector = (selector: string | null) => (tr: Transaction) => Transaction;
 /**

package/dist/types-ts4.5/pm-plugins/toolbar-data/commands.d.ts

@@ -1,3 +1,3 @@
 import type { Command } from '@atlaskit/editor-common/types';
-export declare const showConfirmDialog: (buttonIndex: number) => Command;
+export declare const showConfirmDialog: (buttonIndex: number, optionIndex?: number) => Command;
 export declare const hideConfirmDialog: () => Command;

package/dist/types-ts4.5/pm-plugins/toolbar-data/types.d.ts

@@ -1,6 +1,7 @@
 export type FloatingToolbarPluginAction = {
     data: {
         buttonIndex: number;
+        optionIndex?: number;
     };
     type: 'SHOW_CONFIRM_DIALOG';
 } | {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-floating-toolbar",
-	"version": "8.2.1",
+	"version": "8.2.3",
 	"description": "Floating toolbar plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -38,14 +38,14 @@
 		"@atlaskit/editor-plugin-user-intent": "^4.0.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/emoji": "^69.5.0",
-		"@atlaskit/icon": "^28.3.0",
+		"@atlaskit/icon": "^28.5.0",
 		"@atlaskit/menu": "^8.4.0",
 		"@atlaskit/modal-dialog": "^14.4.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^14.15.0",
 		"@atlaskit/select": "^21.3.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^13.1.0",
+		"@atlaskit/tmp-editor-statsig": "^13.5.0",
 		"@atlaskit/tokens": "^6.4.0",
 		"@atlaskit/tooltip": "^20.5.0",
 		"@babel/runtime": "^7.0.0",
@@ -57,7 +57,7 @@
 		"react-loadable": "^5.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^110.4.0",
+		"@atlaskit/editor-common": "^110.7.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0"
 	},
@@ -121,6 +121,12 @@
 		},
 		"platform_editor_block_menu_hide_floating_toolbar": {
 			"type": "boolean"
+		},
+		"platform_editor_fix_confirm_table_removal": {
+			"type": "boolean"
+		},
+		"platform_editor_update_modal_close_button": {
+			"type": "boolean"
 		}
 	}
 }