@atlaskit/editor-core 176.0.3 → 177.0.1

package/dist/esm/plugins/collab-edit/ui/styles.js

@@ -6,9 +6,8 @@ import { css } from '@emotion/react';
 import { gridSize } from '@atlaskit/theme/constants';
 import { N20 } from '@atlaskit/theme/colors';
 import { akEditorSmallZIndex, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
-import { token } from '@atlaskit/tokens';
-export var inviteTeamWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: ", ";\n  border-radius: 50%;\n  min-width: ", "px;\n  margin-left: -", "px;\n"])), token('color.background.neutral', N20), gridSize() * 4, gridSize() / 2);
+export var inviteTeamWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: ", ";\n  border-radius: 50%;\n  min-width: ", "px;\n  margin-left: -", "px;\n"])), "var(--ds-background-neutral, ".concat(N20, ")"), gridSize() * 4, gridSize() / 2);
 export var avatarContainer = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin-right: ", "px;\n  display: flex;\n  align-items: center;\n\n  // ED-13102: This is to override list styles that come from the\n  // .wiki-content class in Confluence that should not apply within\n  // the toolbar. Has to be extra specific to override.\n  && > ul {\n    list-style-type: none;\n  }\n\n  div:last-child button.invite-to-edit {\n    border-radius: 50%;\n    height: 32px;\n    width: 32px;\n    padding: 2px;\n  }\n"])), gridSize());
 export var badge = function badge(color) {
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: block;\n  position: absolute;\n  right: 1px;\n  bottom: 1px;\n  width: 13px;\n  height: 13px;\n  z-index: ", ";\n  border-radius: 3px;\n  background: ", ";\n  color: ", ";\n  font-size: ", ";\n  line-height: 0;\n  padding-top: 7px;\n  text-align: center;\n  box-shadow: 0 0 1px ", ";\n  box-sizing: border-box;\n"])), akEditorSmallZIndex, color, token('color.text.inverse', '#fff'), relativeFontSizeToBase16(9), token('color.border.inverse', '#fff'));
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: block;\n  position: absolute;\n  right: 1px;\n  bottom: 1px;\n  width: 13px;\n  height: 13px;\n  z-index: ", ";\n  border-radius: 3px;\n  background: ", ";\n  color: ", ";\n  font-size: ", ";\n  line-height: 0;\n  padding-top: 7px;\n  text-align: center;\n  box-shadow: 0 0 1px ", ";\n  box-sizing: border-box;\n"])), akEditorSmallZIndex, color, "var(--ds-text-inverse, #fff)", relativeFontSizeToBase16(9), "var(--ds-border-inverse, #fff)");
 };

package/dist/esm/plugins/copy-button/toolbar.js

@@ -22,7 +22,9 @@ export function getCopyButtonConfig(options) {
   var state = options.state,
       formatMessage = options.formatMessage,
       onMouseEnter = options.onMouseEnter,
-      onMouseLeave = options.onMouseLeave;
+      onMouseLeave = options.onMouseLeave,
+      onFocus = options.onFocus,
+      onBlur = options.onBlur;
   var copyButtonState = copyButtonPluginKey.getState(state);
   var buttonActionHandlers;
 
@@ -32,11 +34,11 @@ export function getCopyButtonConfig(options) {
       // Note for future changes: these two handlers should perform
       // the same action.
       onMouseEnter: onMouseEnter || hoverDecoration(options.nodeType, true, 'ak-editor-selected-node'),
-      onFocus: hoverDecoration(options.nodeType, true, 'ak-editor-selected-node'),
+      onFocus: onFocus || hoverDecoration(options.nodeType, true, 'ak-editor-selected-node'),
       // Note for future changes: these two handlers should perform
       // the same action.
       onMouseLeave: resetCopiedState(options.nodeType, onMouseLeave),
-      onBlur: resetCopiedState(options.nodeType)
+      onBlur: resetCopiedState(options.nodeType, onBlur)
     };
   } else {
     buttonActionHandlers = {

package/dist/esm/plugins/date/index.js

@@ -6,7 +6,6 @@ import WithPluginState from '../../ui/WithPluginState';
 import { insertDate, closeDatePicker as _closeDatePicker, closeDatePickerWithAnalytics as _closeDatePickerWithAnalytics, createDate, deleteDate } from './actions';
 import createDatePlugin from './pm-plugins/main';
 import keymap from './pm-plugins/keymap';
-import { getFeatureFlags } from '../feature-flags-context';
 import { pluginKey as editorDisabledPluginKey } from '../editor-disabled';
 import { IconDate } from '../quick-insert/assets';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../analytics';
@@ -55,8 +54,7 @@ var datePlugin = function datePlugin() {
           popupsMountPoint = _ref.popupsMountPoint,
           popupsBoundariesElement = _ref.popupsBoundariesElement,
           popupsScrollableElement = _ref.popupsScrollableElement;
-      var state = editorView.state,
-          dispatch = editorView.dispatch;
+      var dispatch = editorView.dispatch;
       var domAtPos = editorView.domAtPos.bind(editorView);
       return /*#__PURE__*/React.createElement(WithPluginState, {
         plugins: {
@@ -75,14 +73,11 @@ var datePlugin = function datePlugin() {
               isNew = datePlugin.isNew,
               focusDateInput = datePlugin.focusDateInput;
           var element = findDomRefAtPos(showDatePickerAt, domAtPos);
-          var allFlags = getFeatureFlags(state);
-          var keyboardAccessibleDatepicker = allFlags.keyboardAccessibleDatepicker;
           return /*#__PURE__*/React.createElement(DatePicker, {
             mountTo: popupsMountPoint,
             boundariesElement: popupsBoundariesElement,
             scrollableElement: popupsScrollableElement,
             key: showDatePickerAt,
-            showTextField: keyboardAccessibleDatepicker,
             element: element,
             isNew: isNew,
             autoFocus: focusDateInput,

package/dist/esm/plugins/date/styles.js

@@ -4,6 +4,5 @@ var _templateObject;
 
 import { css } from '@emotion/react';
 import { DateSharedCssClassName } from '@atlaskit/editor-common/styles';
-import { token } from '@atlaskit/tokens';
 import { SelectionStyle, getSelectionStyles, akEditorSelectedBorderSize, akEditorDeleteBorder, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
-export var dateStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    .", " {\n      line-height: initial;\n      cursor: pointer;\n    }\n\n    &.", " {\n      .", " > span {\n        ", "\n      }\n    }\n  }\n\n  .danger {\n    .", ".", "\n      .", "\n      > span {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n    }\n  }\n"])), DateSharedCssClassName.DATE_CONTAINER, DateSharedCssClassName.DATE_WRAPPER, akEditorSelectedNodeClassName, DateSharedCssClassName.DATE_WRAPPER, getSelectionStyles([SelectionStyle.BoxShadow]), DateSharedCssClassName.DATE_CONTAINER, akEditorSelectedNodeClassName, DateSharedCssClassName.DATE_WRAPPER, akEditorSelectedBorderSize, token('color.border.danger', akEditorDeleteBorder));
+export var dateStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    .", " {\n      line-height: initial;\n      cursor: pointer;\n    }\n\n    &.", " {\n      .", " > span {\n        ", "\n      }\n    }\n  }\n\n  .danger {\n    .", ".", "\n      .", "\n      > span {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n    }\n  }\n"])), DateSharedCssClassName.DATE_CONTAINER, DateSharedCssClassName.DATE_WRAPPER, akEditorSelectedNodeClassName, DateSharedCssClassName.DATE_WRAPPER, getSelectionStyles([SelectionStyle.BoxShadow]), DateSharedCssClassName.DATE_CONTAINER, akEditorSelectedNodeClassName, DateSharedCssClassName.DATE_WRAPPER, akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"));

package/dist/esm/plugins/date/ui/DatePicker/index.js

@@ -23,13 +23,12 @@ import { akEditorFloatingDialogZIndex } from '@atlaskit/editor-shared-styles';
 import Calendar from '@atlaskit/calendar';
 import { borderRadius } from '@atlaskit/theme/constants';
 import { N60A, N0 } from '@atlaskit/theme/colors';
-import { token } from '@atlaskit/tokens';
 import withOuterListeners from '../../../../ui/with-outer-listeners';
 var PopupWithListeners = withOuterListeners(Popup);
 import { INPUT_METHOD } from '../../../analytics/types/enums';
 import { injectIntl } from 'react-intl-next';
 import DatePickerInput from './date-picker-input';
-var popupContentWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: 2px;\n  border-radius: ", "px;\n  box-shadow: ", ";\n  background-color: ", ";\n"])), borderRadius(), token('elevation.shadow.overlay', "0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A)), token('elevation.surface.overlay', N0));
+var popupContentWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: 2px;\n  border-radius: ", "px;\n  box-shadow: ", ";\n  background-color: ", ";\n"])), borderRadius(), "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A), ")"), "var(--ds-surface-overlay, ".concat(N0, ")"));
 
 var DatePicker = /*#__PURE__*/function (_React$Component) {
   _inherits(DatePicker, _React$Component);
@@ -122,7 +121,6 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
           mountTo = _this$props.mountTo,
           boundariesElement = _this$props.boundariesElement,
           scrollableElement = _this$props.scrollableElement,
-          showTextField = _this$props.showTextField,
           intl = _this$props.intl,
           dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
           isNew = _this$props.isNew,
@@ -160,7 +158,7 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
         scrollableElement: scrollableElement
       }, jsx("div", {
         css: popupContentWrapper
-      }, showTextField === true && jsx(DatePickerInput, {
+      }, jsx(DatePickerInput, {
         date: date,
         onNewDate: this.handleNewDate,
         onSubmitDate: this.handleKeyboardSubmitDate,

package/dist/esm/plugins/emoji/index.js

@@ -16,7 +16,6 @@ import { inputRulePlugin as asciiInputRulePlugin } from './pm-plugins/ascii-inpu
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../analytics';
 import { IconEmoji } from '../quick-insert/assets';
 import { EmojiNodeView } from './nodeviews/emoji';
-import { EmojiContextProvider } from './ui/EmojiContextProvider';
 import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
 import { openTypeAheadAtCursor } from '../type-ahead/transforms/open-typeahead-at-cursor';
 export var emojiToTypeaheadItem = function emojiToTypeaheadItem(emoji, emojiProvider) {
@@ -27,18 +26,13 @@ export var emojiToTypeaheadItem = function emojiToTypeaheadItem(emoji, emojiProv
       var isSelected = _ref.isSelected,
           onClick = _ref.onClick,
           onHover = _ref.onHover;
-      return (
-        /*#__PURE__*/
-        // It's required to pass emojiProvider through the context for custom emojis to work
-        React.createElement(EmojiContextProvider, {
-          emojiProvider: emojiProvider
-        }, /*#__PURE__*/React.createElement(EmojiTypeAheadItem, {
-          emoji: emoji,
-          selected: isSelected,
-          onMouseMove: onHover,
-          onSelection: onClick
-        }))
-      );
+      return /*#__PURE__*/React.createElement(EmojiTypeAheadItem, {
+        emoji: emoji,
+        selected: isSelected,
+        onMouseMove: onHover,
+        onSelection: onClick,
+        emojiProvider: emojiProvider
+      });
     },
     emoji: emoji
   };

package/dist/esm/plugins/expand/pm-plugins/main.js

@@ -6,11 +6,11 @@ import { setExpandRef } from '../commands';
 import { findExpand } from '../utils';
 import { expandClassNames } from '../ui/class-names';
 import { getPluginState, createPluginState, pluginKey } from './plugin-factory';
+export function containsClass(element, className) {
+  var _element$classList;
 
-function containsClass(element, className) {
-  return !!element && element.classList.contains(className);
+  return Boolean(element === null || element === void 0 ? void 0 : (_element$classList = element.classList) === null || _element$classList === void 0 ? void 0 : _element$classList.contains(className));
 }
-
 export var createPlugin = function createPlugin(dispatch, getIntl) {
   var appearance = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'full-page';
   var useLongPressSelection = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;

package/dist/esm/plugins/expand/toolbar.js

@@ -33,6 +33,7 @@ export var getToolbarConfig = function getToolbarConfig(state, _ref) {
         id: 'editor.expand.delete',
         type: 'button',
         appearance: 'danger',
+        focusEditoronEnter: true,
         icon: RemoveIcon,
         onClick: deleteExpand(),
         onMouseEnter: hoverDecoration([nestedExpand, expand], true),

package/dist/esm/plugins/expand/ui/styles.js

@@ -6,41 +6,40 @@ import { css } from '@emotion/react';
 import { themed } from '@atlaskit/theme/components';
 import { gridSize } from '@atlaskit/theme/constants';
 import { R50, R300, N40A, N50A, N80A, DN50, R200 } from '@atlaskit/theme/colors';
-import { token } from '@atlaskit/tokens';
 import { sharedExpandStyles } from '@atlaskit/editor-common/ui';
 import { SelectionStyle, getSelectionStyles, akLayoutGutterOffset, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
 import { BreakoutCssClassName } from '../../breakout/constants';
 import { expandClassNames } from './class-names';
 var EXPAND_SELECTED_BACKGROUND = themed({
-  light: token('color.background.neutral.subtle', 'rgba(255, 255, 255, 0.6)'),
-  dark: token('color.background.neutral.subtle', 'rgba(9, 10, 11, 0.29)')
+  light: "var(--ds-background-neutral-subtle, rgba(255, 255, 255, 0.6))",
+  dark: "var(--ds-background-neutral-subtle, rgba(9, 10, 11, 0.29))"
 });
 
 var EXPAND_ICON_COLOR = function EXPAND_ICON_COLOR(props) {
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: ", ";\n"])), themed({
-    light: token('color.icon.subtle', N80A),
-    dark: token('color.icon.subtle', '#d9dde3')
+    light: "var(--ds-icon-subtle, ".concat(N80A, ")"),
+    dark: "var(--ds-icon-subtle, #d9dde3)"
   })(props));
 };
 
 var ACTIVE_STATE_BACKGROUND_COLOR = themed({
-  dark: token('color.blanket.selected', "#0C294F4B")
+  dark: "var(--ds-blanket-selected, ".concat("#0C294F4B", ")")
 });
 var ACTIVE_STATE_BORDER = themed({
-  dark: "1px solid ".concat(token('color.border.selected', "#4794ff4B"))
+  dark: "1px solid ".concat("var(--ds-border-selected, ".concat("#4794ff4B", ")"))
 });
 var ACTIVE_STATE_BORDER_RADIUS = themed({
   dark: '3px'
 });
 var DANGER_STATE_BACKGROUND_COLOR = themed({
-  light: token('color.background.danger', R50),
-  dark: token('color.background.danger', '#441C13')
+  light: "var(--ds-background-danger, ".concat(R50, ")"),
+  dark: "var(--ds-background-danger, #441C13)"
 });
 var DANGER_STATE_BORDER = themed({
-  dark: "1px solid ".concat(token('color.border.danger', R200))
+  dark: "1px solid ".concat("var(--ds-border-danger, ".concat(R200, ")"))
 });
 var DANGER_STATE_BORDER_COLOR = themed({
-  light: token('color.border.danger', R300)
+  light: "var(--ds-border-danger, ".concat(R300, ")")
 });
 var DANGER_STATE_BORDER_RADIUS = themed({
   dark: '3px'
@@ -53,10 +52,10 @@ export var expandStyles = function expandStyles(props) {
     expanded: false,
     focused: false
   })(props), expandClassNames.titleInput, sharedExpandStyles.titleInputStyles(props), expandClassNames.titleContainer, sharedExpandStyles.titleContainerStyles(props), expandClassNames.expanded, EXPAND_SELECTED_BACKGROUND(props), themed({
-    light: token('color.border', N40A),
-    dark: token('color.border', DN50)
+    light: "var(--ds-border, ".concat(N40A, ")"),
+    dark: "var(--ds-border, ".concat(DN50, ")")
   })(props), expandClassNames.content, gridSize(), expandClassNames.inputContainer, expandClassNames.prefix, expandClassNames.expanded, expandClassNames.prefix, expandClassNames.expanded, expandClassNames.iconContainer, EXPAND_ICON_COLOR(props), akEditorSelectedNodeClassName, themed({
-    light: token('color.border', N50A),
-    dark: token('color.border', DN50)
+    light: "var(--ds-border, ".concat(N50A, ")"),
+    dark: "var(--ds-border, ".concat(DN50, ")")
   })(props), EXPAND_SELECTED_BACKGROUND(props));
 };

package/dist/esm/plugins/extension/commands.js

@@ -7,7 +7,8 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import { removeSelectedNode, removeParentNodeOfType } from 'prosemirror-utils';
 import { applyChange } from '../context-panel/transforms';
 import { createCommand } from './plugin-factory';
-import { getSelectedExtension } from './utils'; // AFP-2532 TODO: Fix automatic suppressions below
+import { getSelectedExtension } from './utils';
+import { removeConnectedNodes } from '@atlaskit/editor-common/utils'; // AFP-2532 TODO: Fix automatic suppressions below
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
 
 export function updateState(state) {
@@ -82,4 +83,14 @@ export var removeExtension = function removeExtension() {
       return removeParentNodeOfType(state.schema.nodes.bodiedExtension)(tr);
     }
   });
+};
+export var removeDescendantNodes = function removeDescendantNodes(sourceNode) {
+  return createCommand({
+    type: 'UPDATE_STATE',
+    data: {
+      element: undefined
+    }
+  }, function (tr, state) {
+    return sourceNode ? removeConnectedNodes(state, sourceNode) : tr;
+  });
 };

package/dist/esm/plugins/extension/pm-plugins/main.js

@@ -282,6 +282,16 @@ var createPlugin = function createPlugin(dispatch, providerFactory, extensionHan
           if (!selectedExtension) {
             if (showContextPanel) {
               clearEditingContext(state, dispatch);
+            } // if an extension is no longer selected, but the plugin has cached the previous selected extension id/ref
+            // then this should clear those values so that if an exention is selected again, then this sees it as a change
+            // and updates the state correctly.
+
+
+            if (!!localId || !!element) {
+              updateState({
+                localId: undefined,
+                element: undefined
+              })(state, dispatch);
             }
 
             return;

package/dist/esm/plugins/extension/toolbar.js

@@ -11,24 +11,34 @@ import { hoverDecoration } from '../base/pm-plugins/decoration';
 import { editExtension } from './actions';
 import { getPluginState } from './pm-plugins/main';
 import { getSelectedExtension } from './utils';
-import { updateExtensionLayout, removeExtension } from './commands';
+import { updateExtensionLayout, removeExtension, removeDescendantNodes } from './commands';
 import { pluginKey as macroPluginKey } from '../macro/plugin-key';
-import { isReferencedSource } from '@atlaskit/editor-common/utils';
+import { isReferencedSource, getChildrenInfo as _getChildrenInfo, getNodeName } from '@atlaskit/editor-common/utils';
 export var messages = defineMessages({
   edit: {
     id: 'fabric.editor.edit',
     defaultMessage: 'Edit',
     description: 'Edit the properties for this extension.'
   },
+  deleteElementTitle: {
+    id: 'fabric.editor.extension.deleteElementTitle',
+    defaultMessage: 'Delete element',
+    description: 'Title text for confirm modal when deleting an extension linked to a data consumer.'
+  },
   confirmDeleteLinkedModalOKButton: {
     id: 'fabric.editor.extension.confirmDeleteLinkedModalOKButton',
-    defaultMessage: 'Remove extension',
+    defaultMessage: 'Delete',
     description: 'Action button label for confirm modal when deleting an extension linked to a data consumer.'
   },
   confirmDeleteLinkedModalMessage: {
     id: 'fabric.editor.extension.confirmDeleteLinkedModalMessage',
-    defaultMessage: 'Removing this extension will break anything connected to it.',
+    defaultMessage: 'Deleting {nodeName} will break anything connected to it.',
     description: 'Message for confirm modal when deleting a extension linked to an data consumer.'
+  },
+  confirmModalCheckboxLabel: {
+    id: 'fabric.editor.floatingToolbar.confirmModalCheckboxLabel',
+    defaultMessage: 'Also delete connected elements',
+    description: 'checkbox label text'
   }
 });
 
@@ -101,7 +111,8 @@ var editButton = function editButton(formatMessage, extensionState) {
       return true;
     },
     title: formatMessage(messages.edit),
-    tabIndex: null
+    tabIndex: null,
+    focusEditoronEnter: true
   }];
 };
 
@@ -120,9 +131,23 @@ export var getToolbarConfig = function getToolbarConfig() {
       var confirmDialog;
 
       if (isReferencedSource(state, extensionObj === null || extensionObj === void 0 ? void 0 : extensionObj.node)) {
-        confirmDialog = {
-          okButtonLabel: formatMessage(messages.confirmDeleteLinkedModalOKButton),
-          message: formatMessage(messages.confirmDeleteLinkedModalMessage)
+        confirmDialog = function confirmDialog() {
+          return {
+            title: formatMessage(messages.deleteElementTitle),
+            okButtonLabel: formatMessage(messages.confirmDeleteLinkedModalOKButton),
+            message: formatMessage(messages.confirmDeleteLinkedModalMessage, {
+              nodeName: getNodeName(state, extensionObj === null || extensionObj === void 0 ? void 0 : extensionObj.node)
+            }),
+            isReferentialityDialog: true,
+            getChildrenInfo: function getChildrenInfo() {
+              return _getChildrenInfo(state, extensionObj === null || extensionObj === void 0 ? void 0 : extensionObj.node);
+            },
+            checkboxLabel: formatMessage(messages.confirmModalCheckboxLabel),
+            onConfirm: function onConfirm() {
+              var isChecked = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+              return clickWithCheckboxHandler(isChecked, extensionObj === null || extensionObj === void 0 ? void 0 : extensionObj.node);
+            }
+          };
         };
       }
 
@@ -157,6 +182,7 @@ export var getToolbarConfig = function getToolbarConfig() {
           onMouseLeave: hoverDecoration(nodeType, false),
           onFocus: hoverDecoration(nodeType, true),
           onBlur: hoverDecoration(nodeType, false),
+          focusEditoronEnter: true,
           title: formatMessage(commonMessages.remove),
           tabIndex: null,
           confirmDialog: confirmDialog
@@ -167,4 +193,20 @@ export var getToolbarConfig = function getToolbarConfig() {
 
     return;
   };
+};
+
+var clickWithCheckboxHandler = function clickWithCheckboxHandler(isChecked, node) {
+  return function (state, dispatch) {
+    if (!node) {
+      return false;
+    }
+
+    if (!isChecked) {
+      removeExtension()(state, dispatch);
+    } else {
+      removeDescendantNodes(node)(state, dispatch);
+    }
+
+    return true;
+  };
 };

package/dist/esm/plugins/extension/ui/Extension/Extension/styles.js

@@ -7,7 +7,6 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import { DN30, DN900, N30 } from '@atlaskit/theme/colors';
 import { wrapperDefault, padding } from '../styles';
-import { token } from '@atlaskit/tokens';
 export var widerLayoutClassName = 'wider-layout';
 export var wrapperStyle = function wrapperStyle(theme) {
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n\n  &.without-frame {\n    background: transparent;\n  }\n  cursor: pointer;\n  width: 100%;\n\n  .extension-overflow-wrapper:not(.with-body) {\n    overflow-x: auto;\n  }\n"])), wrapperDefault(theme));
@@ -15,10 +14,10 @@ export var wrapperStyle = function wrapperStyle(theme) {
 export var header = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: ", "px ", "px 0px;\n  vertical-align: middle;\n\n  &.with-children:not(.without-frame) {\n    padding: 4px 8px 8px;\n  }\n  &.without-frame {\n    padding: 0;\n  }\n"])), padding / 2, padding / 2);
 export var content = function content(theme) {
   return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  padding: ", "px;\n  background: ", ";\n  color: ", ";\n  border: 1px solid ", ";\n  border-radius: ", "px;\n  cursor: initial;\n"])), padding, themed({
-    light: token('elevation.surface', 'white'),
-    dark: token('elevation.surface', DN30)
+    light: "var(--ds-surface, white)",
+    dark: "var(--ds-surface, ".concat(DN30, ")")
   })(theme), themed({
-    dark: token('color.text', DN900)
-  })(theme), token('color.border', N30), borderRadius());
+    dark: "var(--ds-text, ".concat(DN900, ")")
+  })(theme), "var(--ds-border, ".concat(N30, ")"), borderRadius());
 };
 export var contentWrapper = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  padding: 0 ", "px ", "px;\n"])), padding, padding);

package/dist/esm/plugins/extension/ui/Extension/InlineExtension/styles.js

@@ -5,7 +5,6 @@ var _templateObject;
 import { css } from '@emotion/react';
 import { borderRadius } from '@atlaskit/theme/constants';
 import { wrapperDefault } from '../styles';
-import { token } from '@atlaskit/tokens';
 export var wrapperStyle = function wrapperStyle(theme) {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n\n  cursor: pointer;\n  display: inline-flex;\n  margin: 1px 1px 4px;\n\n  > img {\n    border-radius: ", "px;\n  }\n\n  &::after,\n  &::before {\n    vertical-align: text-top;\n    display: inline-block;\n    width: 1px;\n    content: '';\n  }\n\n  &.with-children {\n    padding: 0;\n    background: ", ";\n  }\n"])), wrapperDefault(theme), borderRadius(), token('color.background.neutral.subtle', 'white'));
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n\n  cursor: pointer;\n  display: inline-flex;\n  margin: 1px 1px 4px;\n\n  > img {\n    border-radius: ", "px;\n  }\n\n  &::after,\n  &::before {\n    vertical-align: text-top;\n    display: inline-block;\n    width: 1px;\n    content: '';\n  }\n\n  &.with-children {\n    padding: 0;\n    background: ", ";\n  }\n"])), wrapperDefault(theme), borderRadius(), "var(--ds-background-neutral-subtle, white)");
 };

package/dist/esm/plugins/extension/ui/Extension/styles.js

@@ -6,18 +6,17 @@ import { css } from '@emotion/react';
 import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import { N20, DN50, DN700, B200, N20A, N70 } from '@atlaskit/theme/colors';
-import { token } from '@atlaskit/tokens';
 import { EXTENSION_PADDING, BODIED_EXT_PADDING } from '@atlaskit/editor-common/styles';
 export { EXTENSION_PADDING as padding, BODIED_EXT_PADDING };
 export var wrapperDefault = function wrapperDefault(theme) {
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: ", ";\n  border-radius: ", "px;\n  color: ", ";\n  position: relative;\n  vertical-align: middle;\n\n  .ProseMirror-selectednode > span > & > .extension-overlay {\n    box-shadow: inset 0px 0px 0px 2px ", ";\n    opacity: 1;\n  }\n\n  &.with-overlay {\n    .extension-overlay {\n      background: ", ";\n      color: transparent;\n    }\n\n    &:hover .extension-overlay {\n      opacity: 1;\n    }\n  }\n"])), themed({
-    light: token('color.background.neutral', N20),
-    dark: token('color.background.neutral', DN50)
+    light: "var(--ds-background-neutral, ".concat(N20, ")"),
+    dark: "var(--ds-background-neutral, ".concat(DN50, ")")
   })(theme), borderRadius(), themed({
-    dark: token('color.text', DN700)
-  })(theme), token('color.border.selected', B200), token('color.background.neutral.hovered', N20A));
+    dark: "var(--ds-text, ".concat(DN700, ")")
+  })(theme), "var(--ds-border-selected, ".concat(B200, ")"), "var(--ds-background-neutral-hovered, ".concat(N20A, ")"));
 };
 export var overlay = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border-radius: ", "px;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.3s;\n"])), borderRadius());
 export var placeholderFallback = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: inline-flex;\n  align-items: center;\n\n  & > img {\n    margin: 0 4px;\n  }\n  /* TODO: fix in develop: https://atlassian.slack.com/archives/CFG3PSQ9E/p1647395052443259?thread_ts=1647394572.556029&cid=CFG3PSQ9E */\n  /* stylelint-disable-next-line */\n  label: placeholder-fallback;\n"])));
-export var placeholderFallbackParams = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: inline-block;\n  max-width: 200px;\n  margin-left: 5px;\n  color: ", ";\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n"])), token('color.text.subtlest', N70));
+export var placeholderFallbackParams = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: inline-block;\n  max-width: 200px;\n  margin-left: 5px;\n  color: ", ";\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n"])), "var(--ds-text-subtlest, ".concat(N70, ")"));
 export var styledImage = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  max-height: 16px;\n  max-width: 16px;\n  /* TODO: fix in develop: https://atlassian.slack.com/archives/CFG3PSQ9E/p1647395052443259?thread_ts=1647394572.556029&cid=CFG3PSQ9E */\n  /* stylelint-disable-next-line */\n  label: lozenge-image;\n"])));

package/dist/esm/plugins/extension/ui/SaveIndicator/SaveIndicator.js

@@ -10,12 +10,11 @@ import { G300, N0 } from '@atlaskit/theme/colors';
 import CheckCircleIcon from '@atlaskit/icon/glyph/check-circle';
 import { FormattedMessage } from 'react-intl-next';
 import { messages } from './messages';
-import { token } from '@atlaskit/tokens';
 
 var noop = function noop() {};
 
 var saveIndicatorWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n"])));
-var saveIndicatorContent = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: fixed;\n  width: 256px;\n  bottom: 20px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 6px 12px;\n\n  background: ", ";\n\n  /* E300 */\n  box-shadow: ", ";\n  border-radius: 16px;\n"])), token('elevation.surface.overlay', N0), token('elevation.shadow.overlay', "0px 8px 12px rgba(9, 30, 66, 0.15), 0px 0px 1px rgba(9, 30, 66, 0.31)"));
+var saveIndicatorContent = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: fixed;\n  width: 256px;\n  bottom: 20px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 6px 12px;\n\n  background: ", ";\n\n  /* E300 */\n  box-shadow: ", ";\n  border-radius: 16px;\n"])), "var(--ds-surface-overlay, ".concat(N0, ")"), "var(--ds-shadow-overlay, ".concat("0px 8px 12px rgba(9, 30, 66, 0.15), 0px 0px 1px rgba(9, 30, 66, 0.31)", ")"));
 var saveIndicatorText = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  padding-left: 6px;\n"])));
 export var SaveIndicator = function SaveIndicator(_ref) {
   var children = _ref.children,
@@ -55,7 +54,7 @@ export var SaveIndicator = function SaveIndicator(_ref) {
     "data-testid": "save-indicator-content"
   }, jsx(CheckCircleIcon, {
     label: "Saving",
-    primaryColor: token('color.icon.success', G300),
+    primaryColor: "var(--ds-icon-success, ".concat(G300, ")"),
     size: "small"
   }), jsx("span", {
     css: saveIndicatorText

package/dist/esm/plugins/extension/ui/styles.js

@@ -4,5 +4,4 @@ var _templateObject;
 
 import { css } from '@emotion/react';
 import { blockNodesVerticalMargin, akEditorSelectedBorderSize, akEditorDeleteBorder, akEditorDeleteBackground, SelectionStyle, getSelectionStyles, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
-import { token } from '@atlaskit/tokens';
-export var extensionStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .extensionView-content-wrap,\n  .bodiedExtensionView-content-wrap {\n    margin: ", " 0;\n\n    &:first-of-type {\n      margin-top: 0;\n    }\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &.inline {\n      word-wrap: break-all;\n    }\n  }\n\n  .extensionView-content-wrap .extension-container {\n    overflow: hidden;\n  }\n\n  .bodiedExtensionView-content-wrap\n    .extensionView-content-wrap\n    .extension-container {\n    width: 100%;\n    max-width: 100%; // ensure width can't go over 100%;\n  }\n\n  [data-mark-type='fragment'] {\n    & > .extensionView-content-wrap,\n    & > .bodiedExtensionView-content-wrap {\n      margin: ", " 0;\n    }\n\n    & > [data-mark-type='dataConsumer'] {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin: ", " 0;\n      }\n    }\n\n    &:first-child {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-top: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-top: 0;\n        }\n      }\n    }\n\n    &:nth-last-of-type(-n + 2):not(:first-of-type) {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-bottom: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-bottom: 0;\n        }\n      }\n    }\n  }\n"])), blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedBorderSize, token('color.border.danger', akEditorDeleteBorder), token('color.background.danger', akEditorDeleteBackground), blockNodesVerticalMargin, blockNodesVerticalMargin);
+export var extensionStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .extensionView-content-wrap,\n  .bodiedExtensionView-content-wrap {\n    margin: ", " 0;\n\n    &:first-of-type {\n      margin-top: 0;\n    }\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &.inline {\n      word-wrap: break-all;\n    }\n  }\n\n  .extensionView-content-wrap .extension-container {\n    overflow: hidden;\n  }\n\n  .bodiedExtensionView-content-wrap\n    .extensionView-content-wrap\n    .extension-container {\n    width: 100%;\n    max-width: 100%; // ensure width can't go over 100%;\n  }\n\n  [data-mark-type='fragment'] {\n    & > .extensionView-content-wrap,\n    & > .bodiedExtensionView-content-wrap {\n      margin: ", " 0;\n    }\n\n    & > [data-mark-type='dataConsumer'] {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin: ", " 0;\n      }\n    }\n\n    &:first-child {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-top: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-top: 0;\n        }\n      }\n    }\n\n    &:nth-last-of-type(-n + 2):not(:first-of-type) {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-bottom: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-bottom: 0;\n        }\n      }\n    }\n  }\n"])), blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), blockNodesVerticalMargin, blockNodesVerticalMargin);

package/dist/esm/plugins/fake-text-cursor/styles.js

@@ -4,5 +4,4 @@ var _templateObject;
 
 import { css } from '@emotion/react';
 import { B75 } from '@atlaskit/theme/colors';
-import { token } from '@atlaskit/tokens';
-export var fakeCursorStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ProseMirror {\n    .ProseMirror-fake-text-cursor {\n      display: inline;\n      pointer-events: none;\n      position: relative;\n    }\n\n    .ProseMirror-fake-text-cursor::after {\n      content: '';\n      display: inline;\n      top: 0;\n      position: absolute;\n      border-right: 1px solid ", ";\n    }\n\n    .ProseMirror-fake-text-selection {\n      display: inline;\n      pointer-events: none;\n      position: relative;\n      background-color: ", ";\n    }\n  }\n"])), token('color.border', 'rgba(0, 0, 0, 0.4)'), token('color.background.selected', B75));
+export var fakeCursorStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ProseMirror {\n    .ProseMirror-fake-text-cursor {\n      display: inline;\n      pointer-events: none;\n      position: relative;\n    }\n\n    .ProseMirror-fake-text-cursor::after {\n      content: '';\n      display: inline;\n      top: 0;\n      position: absolute;\n      border-right: 1px solid ", ";\n    }\n\n    .ProseMirror-fake-text-selection {\n      display: inline;\n      pointer-events: none;\n      position: relative;\n      background-color: ", ";\n    }\n  }\n"])), "var(--ds-border, rgba(0, 0, 0, 0.4))", "var(--ds-background-selected, ".concat(B75, ")"));

package/dist/esm/plugins/feature-flags-context/feature-flags-from-props.js

@@ -33,7 +33,7 @@ function getSpellCheck(featureFlags) {
 
 
 export function createFeatureFlagsFromProps(props) {
-  var _props$featureFlags, _props$allowTextColor, _props$allowLayouts, _props$performanceTra, _props$performanceTra2, _props$featureFlags2, _props$featureFlags3, _props$allowTables, _props$featureFlags4, _props$featureFlags5, _props$allowTables2, _props$featureFlags6, _props$featureFlags7, _props$allowTables3, _props$featureFlags8, _props$featureFlags9, _props$allowTables4, _props$allowTables5, _props$featureFlags10, _props$featureFlags11, _props$allowTables6, _props$allowExtension, _props$featureFlags12, _props$featureFlags13, _props$featureFlags14, _props$featureFlags15, _props$featureFlags16, _props$featureFlags17, _props$featureFlags18, _props$featureFlags19, _props$featureFlags20, _props$featureFlags21, _props$featureFlags22, _props$featureFlags23, _props$featureFlags24, _props$featureFlags25, _props$featureFlags26, _props$featureFlags27, _props$collabEdit, _props$collabEdit2, _props$featureFlags28, _props$featureFlags29, _props$featureFlags30, _props$featureFlags31, _props$featureFlags32, _props$featureFlags33, _props$featureFlags34, _props$featureFlags35, _props$featureFlags36, _props$featureFlags37, _props$featureFlags38, _props$featureFlags39;
+  var _props$featureFlags, _props$allowTextColor, _props$allowLayouts, _props$performanceTra, _props$performanceTra2, _props$featureFlags2, _props$featureFlags3, _props$allowTables, _props$featureFlags4, _props$featureFlags5, _props$allowTables2, _props$featureFlags6, _props$featureFlags7, _props$allowTables3, _props$featureFlags8, _props$featureFlags9, _props$allowTables4, _props$allowTables5, _props$featureFlags10, _props$featureFlags11, _props$allowTables6, _props$allowExtension, _props$featureFlags12, _props$featureFlags13, _props$featureFlags14, _props$featureFlags15, _props$featureFlags16, _props$featureFlags17, _props$featureFlags18, _props$featureFlags19, _props$featureFlags20, _props$featureFlags21, _props$featureFlags22, _props$featureFlags23, _props$featureFlags24, _props$featureFlags25, _props$featureFlags26, _props$featureFlags27, _props$collabEdit, _props$collabEdit2, _props$featureFlags28, _props$featureFlags29, _props$featureFlags30, _props$featureFlags31, _props$featureFlags32, _props$featureFlags33, _props$featureFlags34, _props$featureFlags35, _props$featureFlags36, _props$featureFlags37, _props$featureFlags38, _props$featureFlags39, _props$featureFlags40, _props$featureFlags41, _props$featureFlags42;
 
   var normalizedFeatureFlags = normalizeFeatureFlags(props.featureFlags);
   var tableCellOptionsInFloatingToolbar = normalizedFeatureFlags.tableCellOptionsInFloatingToolbar || ((_props$featureFlags = props.featureFlags) === null || _props$featureFlags === void 0 ? void 0 : _props$featureFlags.tableCellOptionsInFloatingToolbar) || undefined;
@@ -41,11 +41,9 @@ export function createFeatureFlagsFromProps(props) {
     newInsertionBehaviour: props.allowNewInsertionBehaviour,
     interactiveExpand: typeof props.allowExpand === 'boolean' ? props.allowExpand : Boolean(props.allowExpand && props.allowExpand.allowInteractiveExpand !== false),
     placeholderBracketHint: !!props.placeholderBracketHint,
-    placeholderHints: Array.isArray(props.placeholderHints) && props.placeholderHints.length > 0,
     moreTextColors: typeof props.allowTextColor === 'boolean' ? false : Boolean(((_props$allowTextColor = props.allowTextColor) === null || _props$allowTextColor === void 0 ? void 0 : _props$allowTextColor.allowMoreTextColors) === true),
     findReplace: !!props.allowFindReplace,
     findReplaceMatchCase: _typeof(props.allowFindReplace) === 'object' && Boolean(props.allowFindReplace.allowMatchCase),
-    keyboardAccessibleDatepicker: typeof props.allowKeyboardAccessibleDatepicker === 'boolean' ? props.allowKeyboardAccessibleDatepicker : false,
     addColumnWithCustomStep: !props.allowTables || typeof props.allowTables === 'boolean' ? false : Boolean(props.allowTables.allowAddColumnWithCustomStep),
     singleLayout: _typeof(props.allowLayouts) === 'object' && !!((_props$allowLayouts = props.allowLayouts) !== null && _props$allowLayouts !== void 0 && _props$allowLayouts.UNSAFE_allowSingleColumnLayout),
     undoRedoButtons: props.allowUndoRedoButtons,
@@ -66,17 +64,19 @@ export function createFeatureFlagsFromProps(props) {
     saferDispatchedTransactions: Boolean(typeof normalizedFeatureFlags.saferDispatchedTransactions === 'boolean' && !!normalizedFeatureFlags.saferDispatchedTransactions || (typeof ((_props$featureFlags26 = props.featureFlags) === null || _props$featureFlags26 === void 0 ? void 0 : _props$featureFlags26.saferDispatchedTransactions) === 'boolean' ? !!((_props$featureFlags27 = props.featureFlags) !== null && _props$featureFlags27 !== void 0 && _props$featureFlags27.saferDispatchedTransactions) : false)),
     useNativeCollabPlugin: Boolean(typeof ((_props$collabEdit = props.collabEdit) === null || _props$collabEdit === void 0 ? void 0 : _props$collabEdit.useNativePlugin) === 'boolean' ? !!((_props$collabEdit2 = props.collabEdit) !== null && _props$collabEdit2 !== void 0 && _props$collabEdit2.useNativePlugin) : false),
     chromeCursorHandlerFixedVersion: typeof ((_props$featureFlags28 = props.featureFlags) === null || _props$featureFlags28 === void 0 ? void 0 : _props$featureFlags28.chromeCursorHandlerFixedVersion) === 'string' ? Number(props.featureFlags.chromeCursorHandlerFixedVersion) || undefined : undefined,
-    viewChangingExperimentToolbarStyle: typeof ((_props$featureFlags29 = props.featureFlags) === null || _props$featureFlags29 === void 0 ? void 0 : _props$featureFlags29['view-changing-experiment-toolbar-style']) === 'string' ? props.featureFlags['view-changing-experiment-toolbar-style'] || undefined : undefined,
     tableCellOptionsInFloatingToolbar: typeof tableCellOptionsInFloatingToolbar === 'boolean' ? tableCellOptionsInFloatingToolbar : false,
-    showHoverPreview: Boolean(typeof ((_props$featureFlags30 = props.featureFlags) === null || _props$featureFlags30 === void 0 ? void 0 : _props$featureFlags30.showHoverPreview) === 'boolean' ? !!((_props$featureFlags31 = props.featureFlags) !== null && _props$featureFlags31 !== void 0 && _props$featureFlags31.showHoverPreview) : false),
-    indentationButtonsInTheToolbar: Boolean(typeof normalizedFeatureFlags.indentationButtonsInTheToolbar === 'boolean' && !!normalizedFeatureFlags.indentationButtonsInTheToolbar || (typeof ((_props$featureFlags32 = props.featureFlags) === null || _props$featureFlags32 === void 0 ? void 0 : _props$featureFlags32.indentationButtonsInTheToolbar) === 'boolean' ? !!((_props$featureFlags33 = props.featureFlags) !== null && _props$featureFlags33 !== void 0 && _props$featureFlags33.indentationButtonsInTheToolbar) : false)),
-    floatingToolbarCopyButton: Boolean(typeof normalizedFeatureFlags.floatingToolbarCopyButton === 'boolean' && !!normalizedFeatureFlags.floatingToolbarCopyButton || (typeof ((_props$featureFlags34 = props.featureFlags) === null || _props$featureFlags34 === void 0 ? void 0 : _props$featureFlags34.floatingToolbarCopyButton) === 'boolean' ? !!((_props$featureFlags35 = props.featureFlags) !== null && _props$featureFlags35 !== void 0 && _props$featureFlags35.floatingToolbarCopyButton) : false)),
-    floatingToolbarLinkSettingsButton: typeof ((_props$featureFlags36 = props.featureFlags) === null || _props$featureFlags36 === void 0 ? void 0 : _props$featureFlags36['floating-toolbar-link-settings-button']) === 'string' ? props.featureFlags['floating-toolbar-link-settings-button'] || undefined : undefined,
+    showHoverPreview: Boolean(typeof ((_props$featureFlags29 = props.featureFlags) === null || _props$featureFlags29 === void 0 ? void 0 : _props$featureFlags29.showHoverPreview) === 'boolean' ? !!((_props$featureFlags30 = props.featureFlags) !== null && _props$featureFlags30 !== void 0 && _props$featureFlags30.showHoverPreview) : false),
+    indentationButtonsInTheToolbar: Boolean(typeof normalizedFeatureFlags.indentationButtonsInTheToolbar === 'boolean' && !!normalizedFeatureFlags.indentationButtonsInTheToolbar || (typeof ((_props$featureFlags31 = props.featureFlags) === null || _props$featureFlags31 === void 0 ? void 0 : _props$featureFlags31.indentationButtonsInTheToolbar) === 'boolean' ? !!((_props$featureFlags32 = props.featureFlags) !== null && _props$featureFlags32 !== void 0 && _props$featureFlags32.indentationButtonsInTheToolbar) : false)),
+    floatingToolbarCopyButton: Boolean(typeof normalizedFeatureFlags.floatingToolbarCopyButton === 'boolean' && !!normalizedFeatureFlags.floatingToolbarCopyButton || (typeof ((_props$featureFlags33 = props.featureFlags) === null || _props$featureFlags33 === void 0 ? void 0 : _props$featureFlags33.floatingToolbarCopyButton) === 'boolean' ? !!((_props$featureFlags34 = props.featureFlags) !== null && _props$featureFlags34 !== void 0 && _props$featureFlags34.floatingToolbarCopyButton) : false)),
+    floatingToolbarLinkSettingsButton: typeof ((_props$featureFlags35 = props.featureFlags) === null || _props$featureFlags35 === void 0 ? void 0 : _props$featureFlags35['floating-toolbar-link-settings-button']) === 'string' ? props.featureFlags['floating-toolbar-link-settings-button'] || undefined : undefined,
     disableSpellcheckByBrowser: getSpellCheck(props.featureFlags),
     // Including fallback to props.featureFlags so that mobile feature flags
     // are included (they are not kebab cased)
-    restartNumberedLists: normalizedFeatureFlags.restartNumberedLists === true || ((_props$featureFlags37 = props.featureFlags) === null || _props$featureFlags37 === void 0 ? void 0 : _props$featureFlags37.restartNumberedLists) === true,
-    listNumberContinuity: normalizedFeatureFlags.listNumberContinuity === true || ((_props$featureFlags38 = props.featureFlags) === null || _props$featureFlags38 === void 0 ? void 0 : _props$featureFlags38.listNumberContinuity) === true,
-    restartNumberedListsToolbar: normalizedFeatureFlags.restartNumberedListsToolbar === true || ((_props$featureFlags39 = props.featureFlags) === null || _props$featureFlags39 === void 0 ? void 0 : _props$featureFlags39.restartNumberedListsToolbar) === true
+    restartNumberedLists: normalizedFeatureFlags.restartNumberedLists === true || ((_props$featureFlags36 = props.featureFlags) === null || _props$featureFlags36 === void 0 ? void 0 : _props$featureFlags36.restartNumberedLists) === true,
+    listNumberContinuity: normalizedFeatureFlags.listNumberContinuity === true || ((_props$featureFlags37 = props.featureFlags) === null || _props$featureFlags37 === void 0 ? void 0 : _props$featureFlags37.listNumberContinuity) === true,
+    restartNumberedListsToolbar: normalizedFeatureFlags.restartNumberedListsToolbar === true || ((_props$featureFlags38 = props.featureFlags) === null || _props$featureFlags38 === void 0 ? void 0 : _props$featureFlags38.restartNumberedListsToolbar) === true,
+    useSomewhatSemanticTextColorNames: Boolean(typeof normalizedFeatureFlags.useSomewhatSemanticTextColorNames === 'boolean' && !!normalizedFeatureFlags.useSomewhatSemanticTextColorNames || (typeof ((_props$featureFlags39 = props.featureFlags) === null || _props$featureFlags39 === void 0 ? void 0 : _props$featureFlags39.useSomewhatSemanticTextColorNames) === 'boolean' ? !!((_props$featureFlags40 = props.featureFlags) !== null && _props$featureFlags40 !== void 0 && _props$featureFlags40.useSomewhatSemanticTextColorNames) : false)),
+    lpLinkPickerFocusTrap: Boolean(normalizedFeatureFlags.lpLinkPickerFocusTrap),
+    preventPopupOverflow: Boolean(typeof ((_props$featureFlags41 = props.featureFlags) === null || _props$featureFlags41 === void 0 ? void 0 : _props$featureFlags41['prevent-popup-overflow']) === 'boolean' ? !!((_props$featureFlags42 = props.featureFlags) !== null && _props$featureFlags42 !== void 0 && _props$featureFlags42['prevent-popup-overflow']) : false)
   });
 }