@atlaskit/editor-core 161.0.0 → 163.0.0

package/dist/cjs/plugins/type-ahead/api.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.createTypeAheadTools = void 0;
+exports.createTypeAheadTools = exports.createInternalTypeAheadTools = void 0;
 
 var _typeAhead = require("@atlaskit/editor-common/type-ahead");
 
@@ -220,6 +220,37 @@ var currentQuery = function currentQuery(_ref8) {
   };
 };
 
+var find = function find(_ref9) {
+  var editorView = _ref9.editorView;
+  return function (trigger) {
+    var editorState = editorView.state;
+    var handler = (0, _utils.findHandlerByTrigger)({
+      trigger: trigger,
+      editorState: editorState
+    });
+
+    if (!handler) {
+      return null;
+    }
+
+    return handler;
+  };
+}; // This is an internal tool to be used inside of others Editor Plugins
+// We shouldn't public export this method.
+
+
+var createInternalTypeAheadTools = function createInternalTypeAheadTools(editorView) {
+  var props = {
+    editorView: editorView
+  };
+  return {
+    findTypeAheadHandler: find(props),
+    openTypeAheadHandler: _openTypeaheadAtCursor.openTypeAhead
+  };
+};
+
+exports.createInternalTypeAheadTools = createInternalTypeAheadTools;
+
 var createTypeAheadTools = function createTypeAheadTools(editorView) {
   var props = {
     editorView: editorView

package/dist/cjs/plugins/type-ahead/constants.js

@@ -3,11 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TYPE_AHEAD_DECORATION_KEY = exports.TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE = exports.NavigationDirection = exports.CloseSelectionOptions = void 0;
+exports.TYPE_AHEAD_POPUP_CONTENT_CLASS = exports.TYPE_AHEAD_DECORATION_KEY = exports.TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE = exports.NavigationDirection = exports.CloseSelectionOptions = void 0;
 var TYPE_AHEAD_DECORATION_KEY = 'typeahead_decoration_key';
 exports.TYPE_AHEAD_DECORATION_KEY = TYPE_AHEAD_DECORATION_KEY;
 var TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE = 'typeaheadDecoration';
 exports.TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE = TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE;
+var TYPE_AHEAD_POPUP_CONTENT_CLASS = 'fabric-editor-typeahead';
+exports.TYPE_AHEAD_POPUP_CONTENT_CLASS = TYPE_AHEAD_POPUP_CONTENT_CLASS;
 var NavigationDirection;
 exports.NavigationDirection = NavigationDirection;
 

package/dist/cjs/plugins/type-ahead/transforms/open-typeahead-at-cursor.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.openTypeAheadAtCursor = void 0;
+exports.openTypeAheadAtCursor = exports.openTypeAhead = void 0;
 
 var _prosemirrorState = require("prosemirror-state");
 
@@ -11,11 +11,11 @@ var _key = require("../pm-plugins/key");
 
 var _actions = require("../pm-plugins/actions");
 
-var openTypeAheadAtCursor = function openTypeAheadAtCursor(_ref) {
-  var triggerHandler = _ref.triggerHandler,
-      inputMethod = _ref.inputMethod,
-      query = _ref.query;
+var openTypeAhead = function openTypeAhead(props) {
   return function (tr) {
+    var triggerHandler = props.triggerHandler,
+        inputMethod = props.inputMethod,
+        query = props.query;
     tr.setMeta(_key.pluginKey, {
       action: _actions.ACTIONS.OPEN_TYPEAHEAD_AT_CURSOR,
       params: {
@@ -24,6 +24,21 @@ var openTypeAheadAtCursor = function openTypeAheadAtCursor(_ref) {
         query: query
       }
     });
+  };
+};
+
+exports.openTypeAhead = openTypeAhead;
+
+var openTypeAheadAtCursor = function openTypeAheadAtCursor(_ref) {
+  var triggerHandler = _ref.triggerHandler,
+      inputMethod = _ref.inputMethod,
+      query = _ref.query;
+  return function (tr) {
+    openTypeAhead({
+      triggerHandler: triggerHandler,
+      inputMethod: inputMethod,
+      query: query
+    })(tr);
     var selection = tr.selection;
 
     if (!(selection instanceof _prosemirrorState.TextSelection)) {

package/dist/cjs/plugins/type-ahead/ui/InputQuery.js

@@ -201,6 +201,14 @@ var InputQuery = /*#__PURE__*/_react.default.memo(function (_ref) {
     };
 
     var onFocusOut = function onFocusOut(event) {
+      var relatedTarget = event.relatedTarget; // Given the user is changing the focus
+      // When the target is inside the TypeAhead Popup
+      // Then the popup should stay open
+
+      if (relatedTarget instanceof HTMLElement && relatedTarget.closest && relatedTarget.closest(".".concat(_constants.TYPE_AHEAD_POPUP_CONTENT_CLASS))) {
+        return;
+      }
+
       cancel({
         addPrefixTrigger: true,
         text: cleanedInputContent(),

package/dist/cjs/plugins/type-ahead/ui/TypeAheadList.js

@@ -9,18 +9,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TypeAheadList = void 0;
 
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _colors = require("@atlaskit/theme/colors");
+var _react2 = require("@emotion/react");
 
 var _item = require("@atlaskit/item");
 
-var _components = require("@atlaskit/theme/components");
-
-var _styledComponents = require("styled-components");
-
 var _TypeAheadListItem = require("./TypeAheadListItem");
 
 var _reactWindow = require("react-window");
@@ -35,52 +31,15 @@ var _reactIntlNext = require("react-intl-next");
 
 var _messages = require("../messages");
 
+var _templateObject;
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-var ITEM_PADDING = 12;
-var LIST_ITEM_ESTIMATED_HEIGHT = _TypeAheadListItem.ICON_HEIGHT + ITEM_PADDING * 2;
+var LIST_ITEM_ESTIMATED_HEIGHT = _TypeAheadListItem.ICON_HEIGHT + _TypeAheadListItem.ITEM_PADDING * 2;
 var LIST_MAX_HEIGHT = 380;
 var LIST_WIDTH = 320;
-var itemTheme = (0, _defineProperty2.default)({}, _item.itemThemeNamespace, {
-  padding: {
-    default: {
-      bottom: ITEM_PADDING,
-      left: ITEM_PADDING,
-      right: ITEM_PADDING,
-      top: ITEM_PADDING
-    }
-  },
-  beforeItemSpacing: {
-    default: function _default() {
-      return ITEM_PADDING;
-    }
-  },
-  borderRadius: function borderRadius() {
-    return 0;
-  },
-  hover: {
-    // background: colors.transparent, transparent is not a thing
-    text: _colors.text,
-    secondaryText: _colors.N200
-  },
-  selected: {
-    background: (0, _components.themed)({
-      light: _colors.N20,
-      dark: _colors.DN70
-    }),
-    text: (0, _components.themed)({
-      light: _colors.N800,
-      dark: _colors.DN600
-    }),
-    secondaryText: (0, _components.themed)({
-      light: _colors.N200,
-      dark: _colors.DN300
-    })
-  }
-});
 
 var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref) {
   var items = _ref.items,
@@ -169,20 +128,19 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref) {
 
   var estimatedHeight = items.length * LIST_ITEM_ESTIMATED_HEIGHT;
   var height = Math.min(typeof renderedListHeight === 'number' ? renderedListHeight : estimatedHeight, LIST_MAX_HEIGHT);
-  return /*#__PURE__*/_react.default.createElement(_styledComponents.ThemeProvider, {
-    theme: itemTheme
-  }, /*#__PURE__*/_react.default.createElement(_item.ItemGroup, {
+  return (0, _react2.jsx)(_item.ItemGroup, {
     role: "listbox",
     "aria-live": "polite",
     "aria-label": intl.formatMessage(_messages.typeAheadListMessages.typeAheadResultLabel),
-    "aria-relevant": "additions removals"
-  }, /*#__PURE__*/_react.default.createElement(_useResizeObserver.ResizeObserverProvider, null, /*#__PURE__*/_react.default.createElement(_DynamicHeightListItem.UpdateListItemHeightContext.Provider, {
+    "aria-relevant": "additions removals",
+    theme: _TypeAheadListItem.itemTheme
+  }, (0, _react2.jsx)(_useResizeObserver.ResizeObserverProvider, null, (0, _react2.jsx)(_DynamicHeightListItem.UpdateListItemHeightContext.Provider, {
     value: setListItemHeight
-  }, /*#__PURE__*/_react.default.createElement(_DynamicHeightListItem.ListItemActionsContext.Provider, {
+  }, (0, _react2.jsx)(_DynamicHeightListItem.ListItemActionsContext.Provider, {
     value: actions
-  }, /*#__PURE__*/_react.default.createElement(_DynamicHeightListItem.SelectedIndexContext.Provider, {
+  }, (0, _react2.jsx)(_DynamicHeightListItem.SelectedIndexContext.Provider, {
     value: selectedIndex
-  }, /*#__PURE__*/_react.default.createElement(_reactWindow.VariableSizeList, {
+  }, (0, _react2.jsx)(_reactWindow.VariableSizeList, {
     useIsScrolling: true,
     ref: listRef,
     itemData: items,
@@ -193,8 +151,9 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref) {
     itemSize: getListItemHeight,
     width: LIST_WIDTH,
     height: height,
-    overscanCount: 3
-  }, _DynamicHeightListItem.DynamicHeightListItem)))))));
+    overscanCount: 3,
+    css: (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n                    // temporary solution before we migrated off dst/item\n                    & span[class^='ItemParts__Before'] {\n                      margin-right: 12px;\n                    }\n                  "])))
+  }, _DynamicHeightListItem.DynamicHeightListItem))))));
 });
 
 var TypeAheadList = (0, _reactIntlNext.injectIntl)(TypeAheadListComponent);

package/dist/cjs/plugins/type-ahead/ui/TypeAheadListItem.js

@@ -7,17 +7,21 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TypeAheadListItem = exports.ItemIcon = exports.ICON_WIDTH = exports.ICON_HEIGHT = void 0;
+exports.itemTheme = exports.TypeAheadListItem = exports.ItemIcon = exports.ITEM_PADDING = exports.ICON_WIDTH = exports.ICON_HEIGHT = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _colors = require("@atlaskit/theme/colors");
 
+var _components = require("@atlaskit/theme/components");
+
 var _constants = require("@atlaskit/theme/constants");
 
-var _item = _interopRequireDefault(require("@atlaskit/item"));
+var _item = _interopRequireWildcard(require("@atlaskit/item"));
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -39,6 +43,46 @@ var ICON_HEIGHT = 40;
 exports.ICON_HEIGHT = ICON_HEIGHT;
 var ICON_WIDTH = 40;
 exports.ICON_WIDTH = ICON_WIDTH;
+var ITEM_PADDING = 12;
+exports.ITEM_PADDING = ITEM_PADDING;
+var itemTheme = (0, _defineProperty2.default)({}, _item.itemThemeNamespace, {
+  padding: {
+    default: {
+      bottom: ITEM_PADDING,
+      left: ITEM_PADDING,
+      right: ITEM_PADDING,
+      top: ITEM_PADDING
+    }
+  },
+  beforeItemSpacing: {
+    default: function _default() {
+      return ITEM_PADDING;
+    }
+  },
+  borderRadius: function borderRadius() {
+    return 0;
+  },
+  hover: {
+    // background: colors.transparent, transparent is not a thing
+    text: _colors.text,
+    secondaryText: _colors.N200
+  },
+  selected: {
+    background: (0, _components.themed)({
+      light: _colors.N20,
+      dark: _colors.DN70
+    }),
+    text: (0, _components.themed)({
+      light: _colors.N800,
+      dark: _colors.DN600
+    }),
+    secondaryText: (0, _components.themed)({
+      light: _colors.N200,
+      dark: _colors.DN300
+    })
+  }
+});
+exports.itemTheme = itemTheme;
 
 var ItemIcon = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", "px;\n  height: ", "px;\n  overflow: hidden;\n  border: 1px solid rgba(223, 225, 229, 0.5); /* N60 at 50% */\n  border-radius: ", "px;\n  box-sizing: border-box;\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  div {\n    width: ", "px;\n    height: ", "px;\n  }\n"])), ICON_WIDTH, ICON_HEIGHT, (0, _constants.borderRadius)(), ICON_WIDTH, ICON_HEIGHT);
 
@@ -130,7 +174,8 @@ var TypeAheadListItem = function TypeAheadListItem(_ref2) {
     isSelected: isSelected,
     "aria-selected": isSelected,
     "aria-label": item.title,
-    role: "option"
+    role: "option",
+    theme: itemTheme
   }, /*#__PURE__*/_react.default.createElement(ItemBody, null, /*#__PURE__*/_react.default.createElement(ItemText, null, /*#__PURE__*/_react.default.createElement("div", {
     className: "item-title"
   }, item.title), item.description && /*#__PURE__*/_react.default.createElement("div", {

package/dist/cjs/plugins/type-ahead/ui/TypeAheadPopup.js

@@ -25,6 +25,8 @@ var _colors = require("@atlaskit/theme/colors");
 
 var _analytics = require("../../analytics");
 
+var _constants2 = require("../constants");
+
 var _TypeAheadList = require("./TypeAheadList");
 
 var _templateObject;
@@ -123,7 +125,8 @@ var TypeAheadPopup = /*#__PURE__*/_react.default.memo(function (props) {
     fitWidth: 340,
     offset: OFFSET
   }, /*#__PURE__*/_react.default.createElement(TypeAheadContent, {
-    className: "fabric-editor-typeahead"
+    tabIndex: 0,
+    className: _constants2.TYPE_AHEAD_POPUP_CONTENT_CLASS
   }, /*#__PURE__*/_react.default.createElement(Highlight, {
     state: editorView.state,
     triggerHandler: triggerHandler

package/dist/cjs/plugins/type-ahead/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.moveSelectedIndex = exports.isTypeAheadOpen = exports.isTypeAheadHandler = exports.isTypeAheadAllowed = exports.getTypeAheadQuery = exports.getTypeAheadHandler = exports.getPluginState = exports.findTypeAheadDecorations = exports.findHandler = void 0;
+exports.moveSelectedIndex = exports.isTypeAheadOpen = exports.isTypeAheadHandler = exports.isTypeAheadAllowed = exports.getTypeAheadQuery = exports.getTypeAheadHandler = exports.getPluginState = exports.findTypeAheadDecorations = exports.findHandlerByTrigger = exports.findHandler = void 0;
 
 var _prosemirrorState = require("prosemirror-state");
 
@@ -97,9 +97,27 @@ var findHandler = function findHandler(id, state) {
 
 exports.findHandler = findHandler;
 
-var moveSelectedIndex = function moveSelectedIndex(_ref) {
-  var editorView = _ref.editorView,
-      direction = _ref.direction;
+var findHandlerByTrigger = function findHandlerByTrigger(_ref) {
+  var trigger = _ref.trigger,
+      editorState = _ref.editorState;
+
+  var pluginState = _key.pluginKey.getState(editorState);
+
+  if (!pluginState || !pluginState.typeAheadHandlers || pluginState.typeAheadHandlers.length === 0) {
+    return null;
+  }
+
+  var typeAheadHandlers = pluginState.typeAheadHandlers;
+  return typeAheadHandlers.find(function (h) {
+    return h.trigger === trigger;
+  }) || null;
+};
+
+exports.findHandlerByTrigger = findHandlerByTrigger;
+
+var moveSelectedIndex = function moveSelectedIndex(_ref2) {
+  var editorView = _ref2.editorView,
+      direction = _ref2.direction;
   return function () {
     var typeAheadState = getPluginState(editorView.state);
 

package/dist/cjs/plugins/unsupported-content/styles.js

@@ -9,7 +9,7 @@ exports.unsupportedStyles = exports.UnsupportedSharedCssClassName = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
-var _styledComponents = require("styled-components");
+var _react = require("@emotion/react");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -22,5 +22,5 @@ var UnsupportedSharedCssClassName = {
 exports.UnsupportedSharedCssClassName = UnsupportedSharedCssClassName;
 var inlineUnsupportedSelector = ".".concat(UnsupportedSharedCssClassName.INLINE_CONTAINER, " > span");
 var blockUnsupportedSelector = ".".concat(UnsupportedSharedCssClassName.BLOCK_CONTAINER, " > div");
-var unsupportedStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", ", ", " {\n    cursor: pointer;\n  }\n\n  .", "", ",\n    .", "", " {\n    ", "\n  }\n\n  .danger {\n    .", "", ",\n      .", "", " {\n      border: ", "px solid ", ";\n      background-color: ", ";\n    }\n  }\n"])), blockUnsupportedSelector, inlineUnsupportedSelector, _editorSharedStyles.akEditorSelectedNodeClassName, blockUnsupportedSelector, _editorSharedStyles.akEditorSelectedNodeClassName, inlineUnsupportedSelector, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Background, _editorSharedStyles.SelectionStyle.Border]), _editorSharedStyles.akEditorSelectedNodeClassName, blockUnsupportedSelector, _editorSharedStyles.akEditorSelectedNodeClassName, inlineUnsupportedSelector, _editorSharedStyles.akEditorSelectedBorderSize, _editorSharedStyles.akEditorDeleteBorder, _editorSharedStyles.akEditorDeleteBackgroundWithOpacity);
+var unsupportedStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", ", ", " {\n    cursor: pointer;\n  }\n\n  .", "", ",\n    .", "", " {\n    ", "\n  }\n\n  .danger {\n    .", "", ",\n      .", "", " {\n      border: ", "px solid ", ";\n      background-color: ", ";\n    }\n  }\n"])), blockUnsupportedSelector, inlineUnsupportedSelector, _editorSharedStyles.akEditorSelectedNodeClassName, blockUnsupportedSelector, _editorSharedStyles.akEditorSelectedNodeClassName, inlineUnsupportedSelector, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Background, _editorSharedStyles.SelectionStyle.Border]), _editorSharedStyles.akEditorSelectedNodeClassName, blockUnsupportedSelector, _editorSharedStyles.akEditorSelectedNodeClassName, inlineUnsupportedSelector, _editorSharedStyles.akEditorSelectedBorderSize, _editorSharedStyles.akEditorDeleteBorder, _editorSharedStyles.akEditorDeleteBackgroundWithOpacity);
 exports.unsupportedStyles = unsupportedStyles;

package/dist/cjs/profiler/render-count.js

@@ -13,8 +13,6 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _uuid = _interopRequireDefault(require("uuid"));
 
-var _useComponentRendererTracking = require("../utils/react-hooks/use-component-renderer-tracking");
-
 var _utils = require("@atlaskit/editor-common/utils");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -53,7 +51,7 @@ var CoreRenderCountProfiler = function CoreRenderCountProfiler(_ref) {
     });
   };
 
-  (0, _useComponentRendererTracking.useComponentRenderTracking)({
+  (0, _utils.useComponentRenderTracking)({
     onRender: onRender,
     propsDiffingOptions: {
       enabled: false

package/dist/cjs/ui/Appearance/Comment/Comment.js

@@ -49,7 +49,7 @@ var _pluginKey = require("../../../plugins/media/pm-plugins/plugin-key");
 
 var _Addon = require("../../Addon");
 
-var _commonStyles = require("../../../plugins/table/ui/common-styles.css");
+var _commonStyles = require("../../../plugins/table/ui/common-styles");
 
 var _WithFlash = _interopRequireDefault(require("../../WithFlash"));
 
@@ -83,7 +83,7 @@ var CommentEditor = _styledComponents.default.div(_templateObject || (_templateO
 CommentEditor.displayName = 'CommentEditor';
 var ContentArea = (0, _styledComponents.default)(_ContentStyles.default)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  flex-grow: 1;\n  overflow-x: hidden;\n  overflow-y: auto;\n  line-height: 24px;\n  ", ";\n\n  /** Hack for Bitbucket to ensure entire editorView gets drop event; see ED-3294 **/\n  /** Hack for tables controlls. Otherwise marging collapse and controlls are misplaced. **/\n  .ProseMirror {\n    margin: 12px ", "px ", "px;\n  }\n\n  .gridParent {\n    margin-left: ", "px;\n    margin-right: ", "px;\n    width: calc(100% + ", "px);\n  }\n\n  padding: ", "px;\n\n  ", ";\n"])), function (props) {
   return props.maxHeight ? 'max-height: ' + props.maxHeight + 'px;' : '';
-}, CommentEditorMargin, CommentEditorMargin, CommentEditorMargin - _grid.GRID_GUTTER, CommentEditorMargin - _grid.GRID_GUTTER, CommentEditorMargin - _grid.GRID_GUTTER, _Toolbar2.TableControlsPadding, _commonStyles.tableCommentEditorStyles);
+}, CommentEditorMargin, CommentEditorMargin, CommentEditorMargin - _grid.GRID_GUTTER, CommentEditorMargin - _grid.GRID_GUTTER, CommentEditorMargin - _grid.GRID_GUTTER, _Toolbar2.TableControlsPadding, _commonStyles.deprecatedTableCommentEditorStyles);
 ContentArea.displayName = 'ContentArea';
 
 var SecondaryToolbar = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  box-sizing: border-box;\n  justify-content: flex-end;\n  align-items: center;\n  display: flex;\n  padding: 12px 1px;\n"])));

package/dist/cjs/ui/Appearance/Comment/Toolbar.js

@@ -36,7 +36,7 @@ var MainToolbarWrapper = _styledComponents.default.div(_templateObject || (_temp
 
 exports.MainToolbarWrapper = MainToolbarWrapper;
 MainToolbarWrapper.displayName = 'MainToolbar';
-var StickyToolbarWrapper = (0, _styledComponents.default)(MainToolbarWrapper)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  position: sticky;\n  top: ", ";\n  padding-bottom: ", "px;\n  z-index: ", ";\n  transition: box-shadow ease-in-out 0.2s;\n  &.show-keyline {\n    box-shadow: 0 ", "px 0 0 ", ";\n  }\n"])), function (props) {
+var StickyToolbarWrapper = (0, _styledComponents.default)(MainToolbarWrapper)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  /* stylelint-disable declaration-block-no-duplicate-properties */\n  position: relative;\n  position: sticky;\n  /* stylelint-enable declaration-block-no-duplicate-properties */\n  top: ", ";\n  padding-bottom: ", "px;\n  z-index: ", ";\n  transition: box-shadow ease-in-out 0.2s;\n  &.show-keyline {\n    box-shadow: 0 ", "px 0 0 ", ";\n  }\n"])), function (props) {
   return "".concat(props.top, "px");
 }, (0, _constants.gridSize)(), _editorSharedStyles.akEditorGridLineZIndex + _editorSharedStyles.akEditorMenuZIndex, _editorSharedStyles.akEditorToolbarKeylineHeight, _colors.N30);
 StickyToolbarWrapper.displayName = 'MainToolbarSticky';

package/dist/cjs/ui/Appearance/FullPage/FullPage.js

@@ -142,7 +142,6 @@ var FullPageEditor = /*#__PURE__*/function (_React$Component) {
         showKeyline: showKeyline,
         featureFlags: featureFlags
       }), /*#__PURE__*/_react.default.createElement(_FullPageContentArea.FullPageContentArea, {
-        allowAnnotation: props.allowAnnotation,
         appearance: props.appearance,
         contentArea: this.contentArea,
         contentAreaRef: this.contentAreaRef,

package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js

@@ -40,7 +40,6 @@ var Content = /*#__PURE__*/_react.default.memo(function (props) {
         positionedOverEditor: positionedOverEditor
       }, /*#__PURE__*/_react.default.createElement(_StyledComponents.ScrollContainer, {
         innerRef: props.scrollContainerRef,
-        allowAnnotation: props.allowAnnotation,
         className: "fabric-editor-popup-scroll-parent"
       }, /*#__PURE__*/_react.default.createElement(_Addon.ClickAreaBlock, {
         editorView: props.editorView

package/dist/cjs/ui/Appearance/FullPage/StyledComponents.js

@@ -17,7 +17,7 @@ var _adfSchema = require("@atlaskit/adf-schema");
 
 var _ContentStyles = _interopRequireDefault(require("../../ContentStyles"));
 
-var _commonStyles = require("../../../plugins/table/ui/common-styles.css");
+var _commonStyles = require("../../../plugins/table/ui/common-styles");
 
 var _consts = require("../../../plugins/table/ui/consts");
 
@@ -54,7 +54,7 @@ var EditorContentArea = _styledComponents.default.div(_templateObject5 || (_temp
   var theme = _ref.theme,
       fullWidthMode = _ref.fullWidthMode;
   return (fullWidthMode ? _editorSharedStyles.akEditorFullWidthLayoutWidth : theme.layoutMaxWidth) + TOTAL_PADDING;
-}, SWOOP_ANIMATION, _adfSchema.taskListSelector, _adfSchema.decisionListSelector, _commonStyles.tableFullPageEditorStyles, function (_ref2) {
+}, SWOOP_ANIMATION, _adfSchema.taskListSelector, _adfSchema.decisionListSelector, _commonStyles.deprecatedTableFullPageEditorStyles, function (_ref2) {
   var containerWidth = _ref2.containerWidth;
 
   if (!containerWidth) {

package/dist/cjs/ui/Appearance/FullPage/messages.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _reactIntl = require("react-intl");
+var _reactIntlNext = require("react-intl-next");
 
-var _default = (0, _reactIntl.defineMessages)({
+var _default = (0, _reactIntlNext.defineMessages)({
   toolbarLabel: {
     id: 'fabric.editor.toolbarLabel',
     defaultMessage: 'Editor toolbar',

package/dist/cjs/ui/ConfigPanel/ErrorMessage/ErrorImage.js

@@ -11,66 +11,68 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _react = _interopRequireDefault(require("react"));
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _react2 = require("@emotion/react");
 
 var _constants = require("@atlaskit/theme/constants");
 
 var _templateObject;
 
-var ImageContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0 auto ", "px;\n  height: 80px;\n"])), (0, _constants.gridSize)() * 3);
+var imageContainer = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0 auto ", "px;\n  height: 80px;\n"])), (0, _constants.gridSize)() * 3);
 
 var ErrorImage = function ErrorImage() {
-  return /*#__PURE__*/_react.default.createElement(ImageContainer, null, /*#__PURE__*/_react.default.createElement("svg", {
+  return (0, _react2.jsx)("div", {
+    css: imageContainer
+  }, (0, _react2.jsx)("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 163.28 218",
     height: "80"
-  }, /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("linearGradient", {
+  }, (0, _react2.jsx)("defs", null, (0, _react2.jsx)("linearGradient", {
     id: "linear-gradient",
     x1: "133.86",
     x2: "-2.79",
     y1: "136.43",
     y2: "200.15",
     gradientUnits: "userSpaceOnUse"
-  }, /*#__PURE__*/_react.default.createElement("stop", {
+  }, (0, _react2.jsx)("stop", {
     offset: "0",
     stopColor: "#ffd740"
-  }), /*#__PURE__*/_react.default.createElement("stop", {
+  }), (0, _react2.jsx)("stop", {
     offset: "1",
     stopColor: "#ffab00"
-  })), /*#__PURE__*/_react.default.createElement("clipPath", {
+  })), (0, _react2.jsx)("clipPath", {
     id: "clip-path"
-  }, /*#__PURE__*/_react.default.createElement("path", {
+  }, (0, _react2.jsx)("path", {
     id: "_Polygon_",
     d: "M94.78 80.16l66.44 115.08A15.17 15.17 0 01148.08 218H15.2a15.17 15.17 0 01-13.14-22.76L68.5 80.16a15.17 15.17 0 0126.28 0z",
     className: "cls-1",
     "data-name": "<Polygon>"
-  })), /*#__PURE__*/_react.default.createElement("style", null, ".cls-1{fill:url(#linear-gradient)}.cls-2{fill:#253858}.cls-6{fill:none;stroke-linecap:round;stroke-miterlimit:10;stroke-width:2px;stroke:#5e6c84}")), /*#__PURE__*/_react.default.createElement("g", {
+  })), (0, _react2.jsx)("style", null, ".cls-1{fill:url(#linear-gradient)}.cls-2{fill:#253858}.cls-6{fill:none;stroke-linecap:round;stroke-miterlimit:10;stroke-width:2px;stroke:#5e6c84}")), (0, _react2.jsx)("g", {
     id: "Layer_2",
     "data-name": "Layer 2"
-  }, /*#__PURE__*/_react.default.createElement("g", {
+  }, (0, _react2.jsx)("g", {
     id: "Software"
-  }, /*#__PURE__*/_react.default.createElement("path", {
+  }, (0, _react2.jsx)("path", {
     id: "_Polygon_2",
     d: "M94.78 80.16l66.44 115.08A15.17 15.17 0 01148.08 218H15.2a15.17 15.17 0 01-13.14-22.76L68.5 80.16a15.17 15.17 0 0126.28 0z",
     className: "cls-1",
     "data-name": "<Polygon>"
-  }), /*#__PURE__*/_react.default.createElement("path", {
+  }), (0, _react2.jsx)("path", {
     d: "M87.22 163.71l2.88-44.35a9.18 9.18 0 00-9.16-9.78 9.18 9.18 0 00-9.16 9.78l2.88 44.35a6.3 6.3 0 006.28 5.89 6.3 6.3 0 006.28-5.89zM71.38 187.25a9.53 9.53 0 0010.39 9.58 9.68 9.68 0 00-.9-19.32 9.64 9.64 0 00-9.49 9.74z",
     className: "cls-2"
-  }), /*#__PURE__*/_react.default.createElement("path", {
+  }), (0, _react2.jsx)("path", {
     fill: "#ffc400",
     d: "M91.7 27.17L84.29.45A.61.61 0 0083.1.5l-4.66 25.1-5.8-1.08a.61.61 0 00-.7.76L79.35 52a.61.61 0 001.19 0l4.66-25.1 5.8 1.03a.61.61 0 00.7-.76z"
-  }), /*#__PURE__*/_react.default.createElement("path", {
+  }), (0, _react2.jsx)("path", {
     fill: "#ffab00",
     d: "M65.12 41.81l-10.88-8.55a.27.27 0 00-.41.33L59.36 45l-2.66 1.31a.27.27 0 000 .45l10.87 8.55a.27.27 0 00.41-.33l-5.57-11.43 2.66-1.29a.27.27 0 00.05-.45z"
-  }), /*#__PURE__*/_react.default.createElement("path", {
+  }), (0, _react2.jsx)("path", {
     fill: "none",
     stroke: "#344563",
     strokeLinecap: "round",
     strokeMiterlimit: "10",
     strokeWidth: "2",
     d: "M115.15 36.6c-1.17 1.59-11-5.6-12.16-4s8.66 8.79 7.5 10.39-11-5.6-12.17-4 8.66 8.79 7.49 10.39-11-5.6-12.17-4 8.66 8.79 7.49 10.39"
-  }), /*#__PURE__*/_react.default.createElement("path", {
+  }), (0, _react2.jsx)("path", {
     d: "M119.92 64.19c-1.46 1.33-7.05-4.78-8.51-3.44s4.13 7.45 2.67 8.78-7.05-4.78-8.51-3.44c-.68.62.16 2.27 1.11 4M44.8 64c1.82.77 5-6.87 6.86-6.1s-1.39 8.4.43 9.17 5-6.87 6.86-6.1c.85.36.61 2.19.29 4.13",
     className: "cls-6"
   })))));