@atlaskit/editor-common 74.29.2 → 74.30.0

package/dist/esm/mark/commands.js

@@ -0,0 +1,190 @@
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+// eslint-disable-next-line no-duplicate-imports
+
+import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
+var SMART_TO_ASCII = {
+  '…': '...',
+  '→': '->',
+  '←': '<-',
+  '–': '--',
+  '“': '"',
+  '”': '"',
+  '‘': "'",
+  '’': "'"
+};
+var FIND_SMART_CHAR = new RegExp("[".concat(Object.keys(SMART_TO_ASCII).join(''), "]"), 'g');
+var isNodeTextBlock = function isNodeTextBlock(schema) {
+  var _schema$nodes = schema.nodes,
+    mention = _schema$nodes.mention,
+    text = _schema$nodes.text,
+    emoji = _schema$nodes.emoji;
+  return function (node, _, parent) {
+    if (node.type === mention || node.type === emoji || node.type === text) {
+      return parent === null || parent === void 0 ? void 0 : parent.isTextblock;
+    }
+    return;
+  };
+};
+var replaceSmartCharsToAscii = function replaceSmartCharsToAscii(position, textContent, tr) {
+  var schema = tr.doc.type.schema;
+  var match;
+  while (match = FIND_SMART_CHAR.exec(textContent)) {
+    var _match = match,
+      smartChar = _match[0],
+      offset = _match.index;
+    var replacePos = tr.mapping.map(position + offset);
+    var replacementText = schema.text(SMART_TO_ASCII[smartChar]);
+    tr.replaceWith(replacePos, replacePos + smartChar.length, replacementText);
+  }
+};
+var replaceMentionOrEmojiForTextContent = function replaceMentionOrEmojiForTextContent(position, nodeSize, textContent, tr) {
+  var currentPos = tr.mapping.map(position);
+  var schema = tr.doc.type.schema;
+  tr.replaceWith(currentPos, currentPos + nodeSize, schema.text(textContent));
+};
+export function filterChildrenBetween(doc, from, to, predicate) {
+  var results = [];
+  doc.nodesBetween(from, to, function (node, pos, parent) {
+    if (predicate(node, pos, parent)) {
+      results.push({
+        node: node,
+        pos: pos
+      });
+    }
+  });
+  return results;
+}
+export var transformSmartCharsMentionsAndEmojis = function transformSmartCharsMentionsAndEmojis(from, to, tr) {
+  var schema = tr.doc.type.schema;
+  var _schema$nodes2 = schema.nodes,
+    mention = _schema$nodes2.mention,
+    text = _schema$nodes2.text,
+    emoji = _schema$nodes2.emoji;
+  // Traverse through all the nodes within the range and replace them with their plaintext counterpart
+  var children = filterChildrenBetween(tr.doc, from, to, isNodeTextBlock(schema));
+  children.forEach(function (_ref) {
+    var node = _ref.node,
+      pos = _ref.pos;
+    if (node.type === mention || node.type === emoji) {
+      // Convert gracefully when no text found, ProseMirror will blow up if you try to create a node with an empty string or undefined
+      var replacementText = node.attrs.text;
+      if (typeof replacementText === 'undefined' || replacementText === '') {
+        replacementText = "".concat(node.type.name, " text missing");
+      }
+      replaceMentionOrEmojiForTextContent(pos, node.nodeSize, replacementText, tr);
+    } else if (node.type === text && node.text) {
+      var replacePosition = pos > from ? pos : from;
+      var textToReplace = pos > from ? node.text : node.text.substr(from - pos);
+      replaceSmartCharsToAscii(replacePosition, textToReplace, tr);
+    }
+  });
+};
+export var applyMarkOnRange = function applyMarkOnRange(from, to, removeMark, mark, tr) {
+  var schema = tr.doc.type.schema;
+  var code = schema.marks.code;
+  if (mark.type === code) {
+    transformSmartCharsMentionsAndEmojis(from, to, tr);
+  }
+  tr.doc.nodesBetween(tr.mapping.map(from), tr.mapping.map(to), function (node, pos) {
+    if (!node.isText) {
+      return true;
+    }
+
+    // This is an issue when the user selects some text.
+    // We need to check if the current node position is less than the range selection from.
+    // If it’s true, that means we should apply the mark using the range selection,
+    // not the current node position.
+    var nodeBetweenFrom = Math.max(pos, tr.mapping.map(from));
+    var nodeBetweenTo = Math.min(pos + node.nodeSize, tr.mapping.map(to));
+    if (removeMark) {
+      tr.removeMark(nodeBetweenFrom, nodeBetweenTo, mark);
+    } else {
+      tr.addMark(nodeBetweenFrom, nodeBetweenTo, mark);
+    }
+    return true;
+  });
+  return tr;
+};
+var entireSelectionContainsMark = function entireSelectionContainsMark(mark, doc, fromPos, toPos) {
+  var onlyContainsMark = true;
+  doc.nodesBetween(fromPos, toPos, function (node) {
+    // Skip recursion once we've found text which doesn't include the mark
+    if (!onlyContainsMark) {
+      return false;
+    }
+    if (node.isText) {
+      onlyContainsMark && (onlyContainsMark = mark.isInSet(node.marks));
+    }
+  });
+  return onlyContainsMark;
+};
+var toggleMarkInRange = function toggleMarkInRange(mark) {
+  return function (state, dispatch) {
+    var tr = state.tr;
+    if (state.selection instanceof CellSelection) {
+      var removeMark = true;
+      var cells = [];
+      state.selection.forEachCell(function (cell, cellPos) {
+        cells.push({
+          node: cell,
+          pos: cellPos
+        });
+        var from = cellPos;
+        var to = cellPos + cell.nodeSize;
+        removeMark && (removeMark = entireSelectionContainsMark(mark, state.doc, from, to));
+      });
+      for (var i = cells.length - 1; i >= 0; i--) {
+        var cell = cells[i];
+        var from = cell.pos;
+        var to = from + cell.node.nodeSize;
+        applyMarkOnRange(from, to, removeMark, mark, tr);
+      }
+    } else {
+      var _state$selection = state.selection,
+        $from = _state$selection.$from,
+        $to = _state$selection.$to;
+      // We decide to remove the mark only if the entire selection contains the mark
+      // Examples with *bold* text
+      // Scenario 1: Selection contains both bold and non-bold text -> bold entire selection
+      // Scenario 2: Selection contains only bold text -> un-bold entire selection
+      // Scenario 3: Selection contains no bold text -> bold entire selection
+      var _removeMark = entireSelectionContainsMark(mark, state.doc, $from.pos, $to.pos);
+      applyMarkOnRange($from.pos, $to.pos, _removeMark, mark, tr);
+    }
+    if (tr.docChanged) {
+      if (dispatch) {
+        dispatch(tr);
+      }
+      return true;
+    }
+    return false;
+  };
+};
+
+/**
+ * A wrapper over the default toggleMark, except when we have a selection
+ * we only toggle marks on text nodes rather than inline nodes.
+ * @param markType
+ * @param attrs
+ */
+export var toggleMark = function toggleMark(markType, attrs) {
+  return function (state, dispatch) {
+    var mark = markType.create(attrs);
+
+    // For cursor selections we can use the default behaviour.
+    if (state.selection instanceof TextSelection && state.selection.$cursor) {
+      var tr = state.tr;
+      if (mark.isInSet(state.storedMarks || state.selection.$cursor.marks())) {
+        tr.removeStoredMark(mark);
+      } else {
+        tr.addStoredMark(mark);
+      }
+      if (dispatch) {
+        dispatch(tr);
+        return true;
+      }
+      return false;
+    }
+    return toggleMarkInRange(mark)(state, dispatch);
+  };
+};

package/dist/esm/mark/index.js

@@ -0,0 +1 @@
+export { transformSmartCharsMentionsAndEmojis, applyMarkOnRange, toggleMark, filterChildrenBetween } from './commands';

package/dist/esm/messages/full-page.js

@@ -0,0 +1,18 @@
+import { defineMessages } from 'react-intl-next';
+export var messages = defineMessages({
+  toolbarLabel: {
+    id: 'fabric.editor.toolbarLabel',
+    defaultMessage: 'Editor toolbar',
+    description: 'Label for the ARIA region landmark'
+  },
+  pageActionsLabel: {
+    id: 'fabric.editor.pageActionsLabel',
+    defaultMessage: 'Page actions',
+    description: 'Label for the ARIA region landmark'
+  },
+  editableContentLabel: {
+    id: 'fabric.editor.editableContentLabel',
+    defaultMessage: 'Editable content',
+    description: 'Label for the ARIA region landmark'
+  }
+});

package/dist/esm/messages/index.js

@@ -7,6 +7,7 @@ export { codeBlockButtonMessages } from './codeBlockButton';
 export { toolbarInsertBlockMessages } from './insert-block';
 export { toolbarMessages as mediaAndEmbedToolbarMessages } from './media-and-embed-toolbar';
 export { messages as cardMessages } from './card';
+export { messages as fullPageMessages } from './full-page';
 export default defineMessages({
   layoutFixedWidth: {
     id: 'fabric.editor.layoutFixedWidth',

package/dist/esm/monitoring/error.js

@@ -6,7 +6,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "74.29.2";
+var packageVersion = "74.30.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/esm/ui/DropList/index.js

@@ -18,7 +18,7 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "74.29.2";
+var packageVersion = "74.30.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/esm/ui/Toolbar/index.js

@@ -0,0 +1 @@
+export var EDIT_AREA_ID = 'ak-editor-textarea';

package/dist/esm/ui/index.js

@@ -25,4 +25,5 @@ export { snapTo, handleSides, imageAlignmentMap } from './ResizerLegacy/utils';
 export { wrapperStyle } from './ResizerLegacy/styled';
 export { panelTextInput } from './PanelTextInput/styles';
 export { default as PanelTextInput } from './PanelTextInput';
-export { default as Announcer } from './Announcer/announcer';
+export { default as Announcer } from './Announcer/announcer';
+export { EDIT_AREA_ID } from './Toolbar';

package/dist/esm/ui-menu/DropdownMenu/index.js

@@ -1,3 +1,4 @@
+import _objectDestructuringEmpty from "@babel/runtime/helpers/objectDestructuringEmpty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _extends from "@babel/runtime/helpers/extends";
@@ -16,7 +17,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 /** @jsx jsx */
-import React, { PureComponent } from 'react';
+import React, { PureComponent, useContext } from 'react';
 import { css, jsx } from '@emotion/react';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { CustomItem, MenuGroup } from '@atlaskit/menu';
@@ -25,6 +26,7 @@ import { B100, DN600, DN80, N70, N900 } from '@atlaskit/theme/colors';
 import { themed } from '@atlaskit/theme/components';
 import Tooltip from '@atlaskit/tooltip';
 import { DropdownMenuSharedCssClassName } from '../../styles';
+import { KeyDownHandlerContext } from '../../ui-menu/ToolbarArrowKeyNavigationProvider';
 import { withReactEditorViewOuterListeners } from '../../ui-react';
 import DropList from '../../ui/DropList';
 import Popup from '../../ui/Popup';
@@ -317,4 +319,15 @@ function DropdownMenuItem(_ref) {
     }, dropListItem);
   }
   return dropListItem;
-}
+}
+export var DropdownMenuWithKeyboardNavigation = /*#__PURE__*/React.memo(function (_ref2) {
+  var props = _extends({}, (_objectDestructuringEmpty(_ref2), _ref2));
+  var keyDownHandlerContext = useContext(KeyDownHandlerContext);
+  //This context is to handle the tab, Arrow Right/Left key events for dropdown.
+  //Default context has the void callbacks for above key events
+  return jsx(DropdownMenuWrapper, _extends({
+    arrowKeyNavigationProviderOptions: _objectSpread(_objectSpread({}, props.arrowKeyNavigationProviderOptions), {}, {
+      keyDownHandlerContext: keyDownHandlerContext
+    })
+  }, props));
+});

package/dist/esm/ui-menu/ToolbarArrowKeyNavigationProvider/index.js

@@ -0,0 +1,207 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+var _templateObject;
+/** @jsx jsx */
+/* eslint-disable no-console */
+import React, { useCallback, useLayoutEffect, useRef } from 'react';
+import { css, jsx } from '@emotion/react';
+import { fullPageMessages as messages } from '../../messages';
+import { EDIT_AREA_ID } from '../../ui';
+/*
+ **  The context is used to handle the keydown events of submenus.
+ **  Because the keyboard navigation is explicitly managed for main toolbar items
+ **  Few key presses such as Tab,Arrow Right/Left need ot be handled here via context
+ */
+export var KeyDownHandlerContext = /*#__PURE__*/React.createContext({
+  handleArrowLeft: function handleArrowLeft() {},
+  handleArrowRight: function handleArrowRight() {},
+  handleTab: function handleTab() {}
+});
+var centeredToolbarContainer = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  align-items: center;\n"])));
+
+/**
+ * This component is a wrapper of main toolbar which listens to keydown events of children
+ * and handles left/right arrow key navigation for all focusable elements
+ * @param
+ * @returns
+ */
+export var ToolbarArrowKeyNavigationProvider = function ToolbarArrowKeyNavigationProvider(_ref) {
+  var children = _ref.children,
+    editorView = _ref.editorView,
+    childComponentSelector = _ref.childComponentSelector,
+    handleEscape = _ref.handleEscape,
+    disableArrowKeyNavigation = _ref.disableArrowKeyNavigation,
+    isShortcutToFocusToolbar = _ref.isShortcutToFocusToolbar,
+    editorAppearance = _ref.editorAppearance,
+    useStickyToolbar = _ref.useStickyToolbar,
+    intl = _ref.intl;
+  var wrapperRef = useRef(null);
+  var selectedItemIndex = useRef(0);
+  var incrementIndex = useCallback(function (list) {
+    var index = 0;
+    if (document.activeElement) {
+      index = list.indexOf(document.activeElement);
+      index = (index + 1) % list.length;
+    }
+    selectedItemIndex.current = index;
+  }, []);
+  var decrementIndex = useCallback(function (list) {
+    var index = 0;
+    if (document.activeElement) {
+      index = list.indexOf(document.activeElement);
+      index = (list.length + index - 1) % list.length;
+    }
+    selectedItemIndex.current = index;
+  }, []);
+  var handleArrowRight = function handleArrowRight() {
+    var _filteredFocusableEle;
+    var filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+    incrementIndex(filteredFocusableElements);
+    (_filteredFocusableEle = filteredFocusableElements[selectedItemIndex.current]) === null || _filteredFocusableEle === void 0 ? void 0 : _filteredFocusableEle.focus();
+  };
+  var handleArrowLeft = function handleArrowLeft() {
+    var _filteredFocusableEle2;
+    var filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+    decrementIndex(filteredFocusableElements);
+    (_filteredFocusableEle2 = filteredFocusableElements[selectedItemIndex.current]) === null || _filteredFocusableEle2 === void 0 ? void 0 : _filteredFocusableEle2.focus();
+  };
+  var handleTab = function handleTab() {
+    var _filteredFocusableEle3;
+    var filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+    (_filteredFocusableEle3 = filteredFocusableElements[selectedItemIndex.current]) === null || _filteredFocusableEle3 === void 0 ? void 0 : _filteredFocusableEle3.focus();
+  };
+  var handleTabLocal = function handleTabLocal() {
+    var filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+    filteredFocusableElements.forEach(function (element) {
+      element.setAttribute('tabindex', '-1');
+    });
+    filteredFocusableElements[selectedItemIndex.current].setAttribute('tabindex', '0');
+  };
+  var focusAndScrollToElement = function focusAndScrollToElement(element) {
+    var scrollToElement = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+    if (scrollToElement) {
+      element === null || element === void 0 ? void 0 : element.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center',
+        inline: 'nearest'
+      });
+    }
+    element.focus();
+  };
+  var submenuKeydownHandleContext = {
+    handleArrowLeft: handleArrowLeft,
+    handleArrowRight: handleArrowRight,
+    handleTab: handleTab
+  };
+  useLayoutEffect(function () {
+    if (!wrapperRef.current || disableArrowKeyNavigation) {
+      return;
+    }
+    var element = wrapperRef.current;
+
+    /**
+     * To handle the key events on the list
+     * @param event
+     */
+    var handleKeyDown = function handleKeyDown(event) {
+      var _document$querySelect, _document$querySelect2, _wrapperRef$current;
+      //To trap the focus inside the horizontal toolbar for left and right arrow keys
+      var targetElement = event.target;
+
+      //To filter out the events outside the child component
+      if (!targetElement.closest("".concat(childComponentSelector))) {
+        return;
+      }
+
+      //The key events are from child components such as dropdown menus / popups are ignored
+      if ((_document$querySelect = document.querySelector('[data-role="droplistContent"], [data-test-id="color-picker-menu"], [data-emoji-picker-container="true"]')) !== null && _document$querySelect !== void 0 && _document$querySelect.contains(targetElement) || (_document$querySelect2 = document.querySelector('[data-test-id="color-picker-menu"]')) !== null && _document$querySelect2 !== void 0 && _document$querySelect2.contains(targetElement) || event.key === 'ArrowUp' || event.key === 'ArrowDown' || disableArrowKeyNavigation) {
+        return;
+      }
+      var menuWrapper = document.querySelector('.menu-key-handler-wrapper');
+      if (menuWrapper) {
+        // if menu wrapper exists, then a menu is open and arrow keys will be handled by MenuArrowKeyNavigationProvider
+        return;
+      }
+      var filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+      if (!filteredFocusableElements || (filteredFocusableElements === null || filteredFocusableElements === void 0 ? void 0 : filteredFocusableElements.length) === 0) {
+        return;
+      }
+
+      //This is kind of hack to reset the current focused toolbar item
+      //to handle some use cases such as Tab in/out of main toolbar
+      if (!((_wrapperRef$current = wrapperRef.current) !== null && _wrapperRef$current !== void 0 && _wrapperRef$current.contains(targetElement))) {
+        selectedItemIndex.current = -1;
+      } else {
+        selectedItemIndex.current = filteredFocusableElements.indexOf(targetElement) > -1 ? filteredFocusableElements.indexOf(targetElement) : selectedItemIndex.current;
+      }
+
+      //do not scroll to focused element for sticky toolbar when navigating with arrows to avoid unnesessary scroll jump
+      var allowScrollToElement = !(editorAppearance === 'comment' && !!useStickyToolbar);
+      switch (event.key) {
+        case 'ArrowRight':
+          incrementIndex(filteredFocusableElements);
+          focusAndScrollToElement(filteredFocusableElements[selectedItemIndex.current], allowScrollToElement);
+          event.preventDefault();
+          break;
+        case 'ArrowLeft':
+          decrementIndex(filteredFocusableElements);
+          focusAndScrollToElement(filteredFocusableElements[selectedItemIndex.current], allowScrollToElement);
+          event.preventDefault();
+          break;
+        case 'Tab':
+          handleTabLocal();
+          break;
+        case 'Escape':
+          handleEscape(event);
+          break;
+        default:
+      }
+    };
+    var globalKeyDownHandler = function globalKeyDownHandler(event) {
+      //To focus the first element in the toolbar
+      if (isShortcutToFocusToolbar(event)) {
+        var _filteredFocusableEle4, _filteredFocusableEle5;
+        var filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+        (_filteredFocusableEle4 = filteredFocusableElements[0]) === null || _filteredFocusableEle4 === void 0 ? void 0 : _filteredFocusableEle4.focus();
+        (_filteredFocusableEle5 = filteredFocusableElements[0]) === null || _filteredFocusableEle5 === void 0 ? void 0 : _filteredFocusableEle5.scrollIntoView({
+          behavior: 'smooth',
+          block: 'center',
+          inline: 'nearest'
+        });
+      }
+    };
+    element === null || element === void 0 ? void 0 : element.addEventListener('keydown', handleKeyDown);
+    var editorViewDom = editorView === null || editorView === void 0 ? void 0 : editorView.dom;
+    if (isShortcutToFocusToolbar) {
+      editorViewDom === null || editorViewDom === void 0 ? void 0 : editorViewDom.addEventListener('keydown', globalKeyDownHandler);
+    }
+    return function () {
+      element === null || element === void 0 ? void 0 : element.removeEventListener('keydown', handleKeyDown);
+      if (isShortcutToFocusToolbar) {
+        editorViewDom === null || editorViewDom === void 0 ? void 0 : editorViewDom.removeEventListener('keydown', globalKeyDownHandler);
+      }
+    };
+  }, [selectedItemIndex, wrapperRef, editorView, disableArrowKeyNavigation, handleEscape, childComponentSelector, incrementIndex, decrementIndex, isShortcutToFocusToolbar, editorAppearance, useStickyToolbar]);
+  return jsx("div", {
+    css: editorAppearance === 'comment' && centeredToolbarContainer,
+    className: "custom-key-handler-wrapper",
+    ref: wrapperRef,
+    role: "toolbar",
+    "aria-label": intl.formatMessage(messages.toolbarLabel),
+    "aria-controls": EDIT_AREA_ID
+  }, jsx(KeyDownHandlerContext.Provider, {
+    value: submenuKeydownHandleContext
+  }, children));
+};
+function getFocusableElements(rootNode) {
+  if (!rootNode) {
+    return [];
+  }
+  var focusableModalElements = rootNode.querySelectorAll('a[href], button:not([disabled]), textarea, input, select, div[tabindex="-1"], div[tabindex="0"]') || [];
+  return Array.from(focusableModalElements);
+}
+function getFilteredFocusableElements(rootNode) {
+  //The focusable elements from child components such as dropdown menus / popups are ignored
+  return getFocusableElements(rootNode).filter(function (elm) {
+    return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons');
+  });
+}

package/dist/esm/ui-menu/index.js

@@ -1,6 +1,7 @@
-export { default as DropdownMenu } from '../ui-menu/DropdownMenu';
-export { default as ToolbarButton, TOOLBAR_BUTTON } from '../ui-menu/ToolbarButton';
-export { ArrowKeyNavigationProvider } from '../ui-menu/ArrowKeyNavigationProvider';
-export { ArrowKeyNavigationType } from '../ui-menu/ArrowKeyNavigationProvider/types';
+export { default as DropdownMenu, DropdownMenuWithKeyboardNavigation } from './DropdownMenu';
+export { default as ToolbarButton, TOOLBAR_BUTTON } from './ToolbarButton';
+export { ArrowKeyNavigationProvider } from './ArrowKeyNavigationProvider';
+export { ToolbarArrowKeyNavigationProvider, KeyDownHandlerContext } from './ToolbarArrowKeyNavigationProvider';
+export { ArrowKeyNavigationType } from './ArrowKeyNavigationProvider/types';
 export { ColorPaletteArrowKeyNavigationProvider } from './ArrowKeyNavigationProvider/ColorPaletteArrowKeyNavigationProvider';
 export { default as Dropdown } from './Dropdown';

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.29.2",
+	"version": "74.30.0",
 	"sideEffects": false
 }

package/dist/types/i18n/cs.d.ts

@@ -15,9 +15,12 @@ declare const _default: {
     'fabric.editor.blockDescription': string;
     'fabric.editor.blockTitle': string;
     'fabric.editor.blockquote': string;
+    'fabric.editor.bug': string;
     'fabric.editor.cancelButton': string;
     'fabric.editor.captionPlaceholder': string;
     'fabric.editor.cardFloatingControls': string;
+    'fabric.editor.clearLink': string;
+    'fabric.editor.clearLinkText': string;
     'fabric.editor.codeBidiWarningLabel': string;
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
@@ -32,11 +35,13 @@ declare const _default: {
     'fabric.editor.date.description': string;
     'fabric.editor.decision': string;
     'fabric.editor.decision.description': string;
+    'fabric.editor.defaultAltText': string;
     'fabric.editor.displayBlock': string;
     'fabric.editor.displayEmbed': string;
     'fabric.editor.displayInline': string;
     'fabric.editor.displayLink': string;
     'fabric.editor.displayOptionUnavailableInParentNode': string;
+    'fabric.editor.displayText': string;
     'fabric.editor.ecombedDescription': string;
     'fabric.editor.edit.datasource': string;
     'fabric.editor.editLink': string;
@@ -45,6 +50,7 @@ declare const _default: {
     'fabric.editor.emoji': string;
     'fabric.editor.emoji.description': string;
     'fabric.editor.emptyLink': string;
+    'fabric.editor.epic': string;
     'fabric.editor.expand': string;
     'fabric.editor.expand.description': string;
     'fabric.editor.expandDefaultTitle': string;
@@ -52,12 +58,22 @@ declare const _default: {
     'fabric.editor.expandPlaceholder': string;
     'fabric.editor.feedbackDialog': string;
     'fabric.editor.feedbackDialog.description': string;
+    'fabric.editor.headingLink.hyperlinkIconBlogLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconBugLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconIssueLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconPageLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconStoryLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconTaskLabel': string;
     'fabric.editor.help': string;
     'fabric.editor.help.description': string;
     'fabric.editor.horizontalRule': string;
     'fabric.editor.horizontalRule.description': string;
+    'fabric.editor.hyperlink.linkAriaLabel': string;
+    'fabric.editor.hyperlink.searchLinkAriaDescription': string;
+    'fabric.editor.hyperlink.searchLinkResults': string;
     'fabric.editor.hyperlinkToolbarPlaceholder': string;
     'fabric.editor.image': string;
+    'fabric.editor.improvement': string;
     'fabric.editor.inlineDescription': string;
     'fabric.editor.inlineTitle': string;
     'fabric.editor.insertMenu': string;
@@ -83,8 +99,11 @@ declare const _default: {
     'fabric.editor.settingsLinks': string;
     'fabric.editor.status': string;
     'fabric.editor.status.description': string;
+    'fabric.editor.story': string;
+    'fabric.editor.subTask': string;
     'fabric.editor.table': string;
     'fabric.editor.table.description': string;
+    'fabric.editor.task': string;
     'fabric.editor.time.ago': string;
     'fabric.editor.time.updated': string;
     'fabric.editor.time.viewed': string;

package/dist/types/i18n/da.d.ts

@@ -15,9 +15,12 @@ declare const _default: {
     'fabric.editor.blockDescription': string;
     'fabric.editor.blockTitle': string;
     'fabric.editor.blockquote': string;
+    'fabric.editor.bug': string;
     'fabric.editor.cancelButton': string;
     'fabric.editor.captionPlaceholder': string;
     'fabric.editor.cardFloatingControls': string;
+    'fabric.editor.clearLink': string;
+    'fabric.editor.clearLinkText': string;
     'fabric.editor.codeBidiWarningLabel': string;
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
@@ -32,11 +35,13 @@ declare const _default: {
     'fabric.editor.date.description': string;
     'fabric.editor.decision': string;
     'fabric.editor.decision.description': string;
+    'fabric.editor.defaultAltText': string;
     'fabric.editor.displayBlock': string;
     'fabric.editor.displayEmbed': string;
     'fabric.editor.displayInline': string;
     'fabric.editor.displayLink': string;
     'fabric.editor.displayOptionUnavailableInParentNode': string;
+    'fabric.editor.displayText': string;
     'fabric.editor.ecombedDescription': string;
     'fabric.editor.edit.datasource': string;
     'fabric.editor.editLink': string;
@@ -45,6 +50,7 @@ declare const _default: {
     'fabric.editor.emoji': string;
     'fabric.editor.emoji.description': string;
     'fabric.editor.emptyLink': string;
+    'fabric.editor.epic': string;
     'fabric.editor.expand': string;
     'fabric.editor.expand.description': string;
     'fabric.editor.expandDefaultTitle': string;
@@ -52,12 +58,22 @@ declare const _default: {
     'fabric.editor.expandPlaceholder': string;
     'fabric.editor.feedbackDialog': string;
     'fabric.editor.feedbackDialog.description': string;
+    'fabric.editor.headingLink.hyperlinkIconBlogLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconBugLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconIssueLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconPageLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconStoryLabel': string;
+    'fabric.editor.headingLink.hyperlinkIconTaskLabel': string;
     'fabric.editor.help': string;
     'fabric.editor.help.description': string;
     'fabric.editor.horizontalRule': string;
     'fabric.editor.horizontalRule.description': string;
+    'fabric.editor.hyperlink.linkAriaLabel': string;
+    'fabric.editor.hyperlink.searchLinkAriaDescription': string;
+    'fabric.editor.hyperlink.searchLinkResults': string;
     'fabric.editor.hyperlinkToolbarPlaceholder': string;
     'fabric.editor.image': string;
+    'fabric.editor.improvement': string;
     'fabric.editor.inlineDescription': string;
     'fabric.editor.inlineTitle': string;
     'fabric.editor.insertMenu': string;
@@ -83,8 +99,11 @@ declare const _default: {
     'fabric.editor.settingsLinks': string;
     'fabric.editor.status': string;
     'fabric.editor.status.description': string;
+    'fabric.editor.story': string;
+    'fabric.editor.subTask': string;
     'fabric.editor.table': string;
     'fabric.editor.table.description': string;
+    'fabric.editor.task': string;
     'fabric.editor.time.ago': string;
     'fabric.editor.time.updated': string;
     'fabric.editor.time.viewed': string;