@atlaskit/editor-common 76.24.3 → 76.24.4

package/dist/cjs/ui/UnsupportedInline/index.js

@@ -20,7 +20,6 @@ var _unsupportedContent = require("../../messages/unsupportedContent");
 var _trackUnsupportedContent = require("../../utils/track-unsupported-content");
 var _unsupportedContentHelper = require("../unsupported-content-helper");
 var _templateObject;
-/** @jsx jsx */
 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; }
 var inlineNodeStyle = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background: ", ";\n  border: 1px dashed ", ";\n  border-radius: ", "px;\n  box-sizing: border-box;\n  cursor: default;\n  display: inline-flex;\n  font-size: ", ";\n  margin: 0 ", ";\n  min-height: 24px;\n  padding: 0 10px;\n  vertical-align: middle;\n  white-space: nowrap;\n"])), "var(--ds-background-disabled, ".concat(_colors.N30, ")"), "var(--ds-border-disabled, ".concat(_colors.N50, ")"), (0, _constants.borderRadius)(), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), "var(--ds-space-025, 2px)");
@@ -38,17 +37,17 @@ var UnsupportedInlineNode = function UnsupportedInlineNode(_ref) {
   var tooltipOnShowHandler = (0, _react.useCallback)(function () {
     return dispatchAnalyticsEvent && (0, _trackUnsupportedContent.trackUnsupportedContentTooltipDisplayedFor)(dispatchAnalyticsEvent, _analytics.ACTION_SUBJECT_ID.ON_UNSUPPORTED_INLINE, originalNodeType);
   }, [dispatchAnalyticsEvent, originalNodeType]);
-  return (0, _react2.jsx)("span", {
+  return /*#__PURE__*/_react.default.createElement("span", {
     css: inlineNodeStyle
-  }, message, (0, _react2.jsx)(_tooltip.default, {
+  }, message, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     content: tooltipContent,
     hideTooltipOnClick: false,
     position: "bottom",
     onShow: tooltipOnShowHandler,
     strategy: "absolute"
-  }, (0, _react2.jsx)("span", {
+  }, /*#__PURE__*/_react.default.createElement("span", {
     style: style
-  }, (0, _react2.jsx)(_questionCircle.default, {
+  }, /*#__PURE__*/_react.default.createElement(_questionCircle.default, {
     label: "?",
     size: "small"
   }))));

package/dist/cjs/ui/WidthProvider/index.js

@@ -21,7 +21,7 @@ var _rafSchd = _interopRequireDefault(require("raf-schd"));
 var _widthDetector = require("@atlaskit/width-detector");
 var _templateObject;
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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 */
+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; } }
 var SCROLLBAR_WIDTH = 30;
 function getBreakpoint() {
   var width = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
@@ -71,13 +71,13 @@ var WidthProvider = exports.WidthProvider = /*#__PURE__*/function (_React$Compon
   (0, _createClass2.default)(WidthProvider, [{
     key: "render",
     value: function render() {
-      return (0, _react2.jsx)("div", {
+      return /*#__PURE__*/_react.default.createElement("div", {
         css: (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n          position: relative;\n          width: 100%;\n        "]))),
         className: this.props.className
-      }, (0, _react2.jsx)(_widthDetector.WidthObserver, {
+      }, /*#__PURE__*/_react.default.createElement(_widthDetector.WidthObserver, {
         setWidth: this.setWidth,
         offscreen: true
-      }), (0, _react2.jsx)(Provider, {
+      }), /*#__PURE__*/_react.default.createElement(Provider, {
         value: createWidthContext(this.state.width)
       }, this.props.children));
     }

package/dist/cjs/ui-color/ColorPalette/Color/index.js

@@ -14,7 +14,6 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
-var _react2 = require("@emotion/react");
 var _done = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/done"));
 var _colors = require("@atlaskit/theme/colors");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
@@ -22,7 +21,7 @@ var _styles = require("./styles");
 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; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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 */
+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; } }
 var Color = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Color, _PureComponent);
   var _super = _createSuper(Color);
@@ -60,11 +59,11 @@ var Color = /*#__PURE__*/function (_PureComponent) {
         checkMarkColor = _this$props2$checkMar === void 0 ? _colors.N0 : _this$props2$checkMar,
         hexToPaletteColor = _this$props2.hexToPaletteColor;
       var colorStyle = hexToPaletteColor ? hexToPaletteColor(value) : value;
-      return (0, _react2.jsx)(_tooltip.default, {
+      return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
         content: label
-      }, (0, _react2.jsx)("span", {
+      }, /*#__PURE__*/_react.default.createElement("span", {
         css: _styles.buttonWrapperStyle
-      }, (0, _react2.jsx)("button", {
+      }, /*#__PURE__*/_react.default.createElement("button", {
         css: _styles.buttonStyle,
         "aria-label": label,
         role: "radio",
@@ -78,7 +77,7 @@ var Color = /*#__PURE__*/function (_PureComponent) {
           border: "1px solid ".concat(borderColor)
         },
         autoFocus: autoFocus
-      }, isSelected && (0, _react2.jsx)(_done.default, {
+      }, isSelected && /*#__PURE__*/_react.default.createElement(_done.default, {
         primaryColor: checkMarkColor,
         label: ""
       }))));

package/dist/cjs/ui-color/ColorPalette/index.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
 var _chromatism = _interopRequireDefault(require("chromatism"));
 var _reactIntlNext = require("react-intl-next");
 var _colors = require("@atlaskit/theme/colors");
@@ -15,8 +14,6 @@ var _Color = _interopRequireDefault(require("./Color"));
 var _getColorMessage = _interopRequireDefault(require("./Palettes/getColorMessage"));
 var _styles = require("./styles");
 var _utils = require("./utils");
-/** @jsx jsx */
-
 /**
  * For a given color pick the color from a list of colors with
  * the highest contrast
@@ -60,8 +57,8 @@ var ColorPalette = function ColorPalette(props) {
   var colorsPerRow = _react.default.useMemo(function () {
     return (0, _utils.getColorsPerRowFromPalette)(palette, cols);
   }, [palette, cols]);
-  return (0, _react2.jsx)(_react.default.Fragment, null, colorsPerRow.map(function (row) {
-    return (0, _react2.jsx)("div", {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, colorsPerRow.map(function (row) {
+    return /*#__PURE__*/_react.default.createElement("div", {
       css: _styles.colorPaletteWrapper,
       className: className,
       key: "row-first-color-".concat(row[0].value),
@@ -79,7 +76,7 @@ var ColorPalette = function ColorPalette(props) {
           message = (0, _getColorMessage.default)(paletteColorTooltipMessages.light, value.toUpperCase());
         }
       }
-      return (0, _react2.jsx)(_Color.default, {
+      return /*#__PURE__*/_react.default.createElement(_Color.default, {
         key: value,
         value: value,
         borderColor: border,

package/dist/cjs/ui-menu/ColorPickerButton/index.js

@@ -23,7 +23,6 @@ var _withOuterListeners = _interopRequireDefault(require("../../ui/with-outer-li
 var _ArrowKeyNavigationProvider = require("../ArrowKeyNavigationProvider");
 var _types = require("../ArrowKeyNavigationProvider/types");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-/** @jsx jsx */
 // helps adjusts position of popup
 var colorPickerButtonWrapper = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n"])));
 var colorPickerExpandContainer = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0px ", ";\n"])), "var(--ds-space-negative-050, -4px)");
@@ -123,7 +122,7 @@ var ColorPickerButton = function ColorPickerButton(props) {
     var _getSelectedRowAndCol = (0, _uiColor.getSelectedRowAndColumnFromPalette)(props.colorPalette, selectedColor, props.cols),
       selectedRowIndex = _getSelectedRowAndCol.selectedRowIndex,
       selectedColumnIndex = _getSelectedRowAndCol.selectedColumnIndex;
-    return (0, _react2.jsx)(_Popup.default, {
+    return /*#__PURE__*/_react.default.createElement(_Popup.default, {
       target: buttonRef.current,
       fitHeight: 350,
       fitWidth: 350,
@@ -137,10 +136,10 @@ var ColorPickerButton = function ColorPickerButton(props) {
       zIndex: props.setDisableParentScroll ? 600 : undefined,
       ariaLabel: "Color picker popup",
       onPositionCalculated: onPositionCalculated
-    }, (0, _react2.jsx)("div", {
+    }, /*#__PURE__*/_react.default.createElement("div", {
       css: colorPickerWrapper,
       "data-test-id": "color-picker-menu"
-    }, (0, _react2.jsx)(_ArrowKeyNavigationProvider.ArrowKeyNavigationProvider, {
+    }, /*#__PURE__*/_react.default.createElement(_ArrowKeyNavigationProvider.ArrowKeyNavigationProvider, {
       type: _types.ArrowKeyNavigationType.COLOR,
       selectedRowIndex: selectedRowIndex,
       selectedColumnIndex: selectedColumnIndex,
@@ -150,7 +149,7 @@ var ColorPickerButton = function ColorPickerButton(props) {
       },
       isOpenedByKeyboard: isOpenedByKeyboard,
       isPopupPositioned: isPopupPositioned
-    }, (0, _react2.jsx)(ColorPaletteWithListeners, {
+    }, /*#__PURE__*/_react.default.createElement(ColorPaletteWithListeners, {
       cols: props.cols,
       selectedColor: selectedColor,
       onClick: onColorSelected,
@@ -173,12 +172,12 @@ var ColorPickerButton = function ColorPickerButton(props) {
       dark: "var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N30A, ")")
     })(theme));
   };
-  return (0, _react2.jsx)("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     css: colorPickerButtonWrapper
-  }, (0, _react2.jsx)(_tooltip.default, {
+  }, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     content: title,
     position: "top"
-  }, (0, _react2.jsx)(_button.default, {
+  }, /*#__PURE__*/_react.default.createElement(_button.default, {
     ref: buttonRef,
     "aria-label": title,
     spacing: "compact",
@@ -191,9 +190,9 @@ var ColorPickerButton = function ColorPickerButton(props) {
       }
     },
     css: buttonStyle,
-    iconAfter: (0, _react2.jsx)("span", {
+    iconAfter: /*#__PURE__*/_react.default.createElement("span", {
       css: colorPickerExpandContainer
-    }, (0, _react2.jsx)(_chevronDown.default, {
+    }, /*#__PURE__*/_react.default.createElement(_chevronDown.default, {
       label: ""
     }))
   })), renderPopup());

package/dist/cjs/ui-menu/DropdownContainer/index.js

@@ -9,14 +9,13 @@ exports.DropdownContainer = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
-var _react2 = require("@emotion/react");
 var _types = require("../ArrowKeyNavigationProvider/types");
 var _Dropdown = _interopRequireDefault(require("../Dropdown"));
 var _ToolbarArrowKeyNavigationProvider = require("../ToolbarArrowKeyNavigationProvider");
 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; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /** @jsx jsx */
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DropdownContainer = exports.DropdownContainer = /*#__PURE__*/_react.default.memo(function DropdownContainer(props) {
   var keyDownHandlerContext = (0, _react.useContext)(_ToolbarArrowKeyNavigationProvider.KeyDownHandlerContext);
   var newArrowKeyNavigationProviderOptions = props.arrowKeyNavigationProviderOptions;
@@ -27,9 +26,10 @@ var DropdownContainer = exports.DropdownContainer = /*#__PURE__*/_react.default.
     });
   }
   return (
+    /*#__PURE__*/
     //This context is to handle the tab, Arrow Right/Left key events for dropdown.
     //Default context has the void callbacks for above key events
-    (0, _react2.jsx)(_Dropdown.default, (0, _extends2.default)({}, props, {
+    _react.default.createElement(_Dropdown.default, (0, _extends2.default)({}, props, {
       arrowKeyNavigationProviderOptions: newArrowKeyNavigationProviderOptions
     }))
   );

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

@@ -35,7 +35,6 @@ var _ArrowKeyNavigationProvider = require("../ArrowKeyNavigationProvider");
 var _types = require("../ArrowKeyNavigationProvider/types");
 var _excluded = ["children"];
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-/** @jsx jsx */
 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; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -160,7 +159,7 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
           }
         }
       });
-      return (0, _react2.jsx)(_Popup.default, {
+      return /*#__PURE__*/_react.default.createElement(_Popup.default, {
         target: isOpen ? target : undefined,
         mountTo: mountTo,
         boundariesElement: boundariesElement,
@@ -170,10 +169,10 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
         fitWidth: fitWidth,
         zIndex: zIndex || _editorSharedStyles.akEditorFloatingPanelZIndex,
         offset: offset
-      }, (0, _react2.jsx)(_ArrowKeyNavigationProvider.ArrowKeyNavigationProvider, (0, _extends2.default)({}, navigationProviderProps, {
+      }, /*#__PURE__*/_react.default.createElement(_ArrowKeyNavigationProvider.ArrowKeyNavigationProvider, (0, _extends2.default)({}, navigationProviderProps, {
         handleClose: this.handleCloseAndFocus,
         closeOnTab: true
-      }), (0, _react2.jsx)(DropListWithOutsideListeners, {
+      }), /*#__PURE__*/_react.default.createElement(DropListWithOutsideListeners, {
         isOpen: true,
         appearance: "tall",
         position: popupPlacement.join(' '),
@@ -187,23 +186,23 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
           e.stopPropagation();
         },
         targetRef: this.state.target
-      }, (0, _react2.jsx)("div", {
+      }, /*#__PURE__*/_react.default.createElement("div", {
         style: {
           height: 0,
           minWidth: fitWidth || 0
         }
-      }), (0, _react2.jsx)("div", {
+      }), /*#__PURE__*/_react.default.createElement("div", {
         ref: this.popupRef
-      }, (0, _platformFeatureFlags.getBooleanFF)('platform.editor.menu.group-items') && (0, _react2.jsx)(_menu.MenuGroup, {
+      }, (0, _platformFeatureFlags.getBooleanFF)('platform.editor.menu.group-items') && /*#__PURE__*/_react.default.createElement(_menu.MenuGroup, {
         role: shouldUseDefaultRole ? 'group' : 'menu'
       }, items.map(function (group, index) {
-        return (0, _react2.jsx)(_menu.Section, {
+        return /*#__PURE__*/_react.default.createElement(_menu.Section, {
           hasSeparator: (section === null || section === void 0 ? void 0 : section.hasSeparator) && index > 0,
           title: section === null || section === void 0 ? void 0 : section.title,
           key: index
         }, group.items.map(function (item) {
           var _item$key;
-          return (0, _react2.jsx)(DropdownMenuItem, {
+          return /*#__PURE__*/_react.default.createElement(DropdownMenuItem, {
             key: (_item$key = item.key) !== null && _item$key !== void 0 ? _item$key : String(item.content),
             item: item,
             onItemActivated: _this2.props.onItemActivated,
@@ -213,12 +212,12 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
           });
         }));
       })), !(0, _platformFeatureFlags.getBooleanFF)('platform.editor.menu.group-items') && items.map(function (group, index) {
-        return (0, _react2.jsx)(_menu.MenuGroup, {
+        return /*#__PURE__*/_react.default.createElement(_menu.MenuGroup, {
           key: index,
           role: shouldUseDefaultRole ? 'group' : 'menu'
         }, group.items.map(function (item) {
           var _item$key2;
-          return (0, _react2.jsx)(DropdownMenuItem, {
+          return /*#__PURE__*/_react.default.createElement(DropdownMenuItem, {
             key: (_item$key2 = item.key) !== null && _item$key2 !== void 0 ? _item$key2 : String(item.content),
             item: item,
             onItemActivated: _this2.props.onItemActivated,
@@ -235,9 +234,9 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
       var _this$props2 = this.props,
         children = _this$props2.children,
         isOpen = _this$props2.isOpen;
-      return (0, _react2.jsx)("div", {
+      return /*#__PURE__*/_react.default.createElement("div", {
         css: wrapper
-      }, (0, _react2.jsx)("div", {
+      }, /*#__PURE__*/_react.default.createElement("div", {
         ref: this.handleRef
       }, children), isOpen ? this.renderDropdownMenu() : null);
     }
@@ -262,7 +261,7 @@ var DropdownMenuWrapper = exports.default = /*#__PURE__*/function (_PureComponen
 var DropdownMenuItemCustomComponent = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var children = props.children,
     rest = (0, _objectWithoutProperties2.default)(props, _excluded);
-  return (0, _react2.jsx)("span", (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
     ref: ref
   }, rest, {
     style: {
@@ -291,14 +290,14 @@ function DropdownMenuItem(_ref) {
   // onClick and value.name are the action indicators in the handlers
   // If neither are present, don't wrap in an Item.
   if (!item.onClick && !(item.value && item.value.name)) {
-    return (0, _react2.jsx)("span", {
+    return /*#__PURE__*/_react.default.createElement("span", {
       key: String(item.content)
     }, item.content);
   }
   var _handleSubmenuActive = function _handleSubmenuActive(event) {
     setSubmenuActive(!!event.target.closest(".".concat(_styles.DropdownMenuSharedCssClassName.SUBMENU)));
   };
-  var dropListItem = (0, _react2.jsx)("div", {
+  var dropListItem = /*#__PURE__*/_react.default.createElement("div", {
     css: function css(theme) {
       return buttonStyles(item.isActive, submenuActive)({
         theme: theme
@@ -307,7 +306,7 @@ function DropdownMenuItem(_ref) {
     tabIndex: -1,
     "aria-disabled": item.isDisabled ? 'true' : 'false',
     onMouseDown: _handleSubmenuActive
-  }, (0, _react2.jsx)(_menu.CustomItem, {
+  }, /*#__PURE__*/_react.default.createElement(_menu.CustomItem, {
     item: item,
     key: (_item$key3 = item.key) !== null && _item$key3 !== void 0 ? _item$key3 : String(item.content),
     testId: "dropdown-item__".concat(String(item.content)),
@@ -340,7 +339,7 @@ function DropdownMenuItem(_ref) {
   }, item.content));
   if (item.tooltipDescription) {
     var _item$key4;
-    return (0, _react2.jsx)(_tooltip.default, {
+    return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
       key: (_item$key4 = item.key) !== null && _item$key4 !== void 0 ? _item$key4 : String(item.content),
       content: item.tooltipDescription,
       position: item.tooltipPosition
@@ -353,7 +352,7 @@ var DropdownMenuWithKeyboardNavigation = exports.DropdownMenuWithKeyboardNavigat
   var keyDownHandlerContext = (0, _react.useContext)(_ToolbarArrowKeyNavigationProvider.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 (0, _react2.jsx)(DropdownMenuWrapper, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(DropdownMenuWrapper, (0, _extends2.default)({
     arrowKeyNavigationProviderOptions: _objectSpread(_objectSpread({}, props.arrowKeyNavigationProviderOptions), {}, {
       keyDownHandlerContext: keyDownHandlerContext
     })

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

@@ -12,7 +12,6 @@ var _react2 = require("@emotion/react");
 var _messages = require("../../messages");
 var _ui = require("../../ui");
 var _templateObject;
-/** @jsx jsx */
 /* eslint-disable no-console */
 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; }
@@ -191,14 +190,14 @@ var ToolbarArrowKeyNavigationProvider = exports.ToolbarArrowKeyNavigationProvide
       }
     };
   }, [selectedItemIndex, wrapperRef, editorView, disableArrowKeyNavigation, handleEscape, childComponentSelector, incrementIndex, decrementIndex, isShortcutToFocusToolbar, editorAppearance, useStickyToolbar]);
-  return (0, _react2.jsx)("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     css: editorAppearance === 'comment' && centeredToolbarContainer,
     className: "custom-key-handler-wrapper",
     ref: wrapperRef,
     role: "toolbar",
     "aria-label": intl.formatMessage(_messages.fullPageMessages.toolbarLabel),
     "aria-controls": _ui.EDIT_AREA_ID
-  }, (0, _react2.jsx)(KeyDownHandlerContext.Provider, {
+  }, /*#__PURE__*/_react.default.createElement(KeyDownHandlerContext.Provider, {
     value: submenuKeydownHandleContext
   }, children));
 };

package/dist/cjs/ui-menu/ToolbarButton/index.js

@@ -17,7 +17,6 @@ var _styles = _interopRequireDefault(require("./styles"));
 var _templateObject; // This file is copied to `packages/editor/editor-plugin-ai/src/ui/components/AtlassianIntelligenceToolbarButton/ToolbarButton/index.tsx`
 // If you make any change here, copy it to above file as well
 // and notify about the change in #team-fc-editor-ai-dev channel.
-/** @jsx jsx */
 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; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -72,7 +71,7 @@ var ToolbarButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     }
   }, [disabled, onClick, onItemClick, item, buttonId]);
   var id = buttonId ? "editor-toolbar__".concat(buttonId) : undefined;
-  var button = (0, _react2.jsx)(_styles.default, {
+  var button = /*#__PURE__*/_react.default.createElement(_styles.default, {
     id: id,
     ref: ref,
     appearance: "subtle",
@@ -98,11 +97,11 @@ var ToolbarButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     return button;
   }
   var tooltipContent = !hideTooltip ? title : null;
-  return (0, _react2.jsx)(_tooltip.default, {
+  return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     content: tooltipContent,
     hideTooltipOnClick: true,
     position: titlePosition
-  }, (0, _react2.jsx)("div", {
+  }, /*#__PURE__*/_react.default.createElement("div", {
     css: buttonWrapper
   }, button));
 });

package/dist/cjs/ui-react/with-react-editor-view-outer-listeners.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = withReactEditorViewOuterListeners;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
@@ -110,7 +111,16 @@ function withReactEditorViewOuterListeners(Component) {
       handleEscapeKeydown = _ref.handleEscapeKeydown,
       closeOnTab = _ref.closeOnTab,
       props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-    var isActiveComponent = hasIsOpen(props) ? props.isOpen : true;
+    var isActiveProp = hasIsOpen(props) ? props.isOpen : true;
+    var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      isActiveComponent = _useState2[0],
+      setActiveComponent = _useState2[1];
+    (0, _react.useEffect)(function () {
+      requestAnimationFrame(function () {
+        setActiveComponent(isActiveProp);
+      });
+    }, [isActiveProp]);
     return /*#__PURE__*/_react.default.createElement(_ReactEditorViewContext.default.Consumer, null, function (_ref2) {
       var editorView = _ref2.editorView,
         editorRef = _ref2.editorRef;

package/dist/es2019/card/LinkToolbarButtonGroup.js

@@ -1,6 +1,5 @@
-/** @jsx jsx */
 import React from 'react';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { ButtonGroup } from '@atlaskit/button';
 import { FloatingToolbarButton as Button } from '../ui';
 
@@ -17,7 +16,7 @@ const DisallowedWrapper = ({
   disabled,
   ...props
 }) => {
-  return jsx("div", props);
+  return /*#__PURE__*/React.createElement("div", props);
 };
 
 /**
@@ -33,7 +32,7 @@ const disallowedWrapperStyle = css`
 export const LinkToolbarButtonGroup = ({
   options
 }) => {
-  return jsx(ButtonGroup, null, options.map(({
+  return /*#__PURE__*/React.createElement(ButtonGroup, null, options.map(({
     onClick,
     selected,
     disabled,
@@ -41,14 +40,14 @@ export const LinkToolbarButtonGroup = ({
     tooltipContent,
     title,
     icon: Icon
-  }) => jsx(DisallowedWrapper, {
+  }) => /*#__PURE__*/React.createElement(DisallowedWrapper, {
     css: disabled ? disallowedWrapperStyle : defaultWrapperStyle,
     key: testId,
     disabled: disabled
-  }, jsx(Button, {
+  }, /*#__PURE__*/React.createElement(Button, {
     css: disabled ? buttonStyleNoneEvent : buttonStyle,
     title: title,
-    icon: jsx(Icon, {
+    icon: /*#__PURE__*/React.createElement(Icon, {
       size: "medium",
       label: title
     }),

package/dist/es2019/element-browser/ViewMore.js

@@ -1,6 +1,5 @@
-/** @jsx jsx */
 import { useEffect, useRef } from 'react';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { ButtonItem, Section } from '@atlaskit/menu';
 const itemBefore = css`
   width: 40px;
@@ -21,11 +20,11 @@ export const ViewMore = ({
       ref.current.focus();
     }
   }, [focus]);
-  return jsx(Section, {
+  return /*#__PURE__*/React.createElement(Section, {
     hasSeparator: true
-  }, jsx(ButtonItem, {
+  }, /*#__PURE__*/React.createElement(ButtonItem, {
     onClick: item.action,
-    iconBefore: jsx("div", {
+    iconBefore: /*#__PURE__*/React.createElement("div", {
       css: itemBefore
     }, item.icon()),
     "aria-describedby": item.title,

package/dist/es2019/element-browser/components/CategoryList.js

@@ -1,8 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
-/** @jsx jsx */
-
 import React, { Fragment, memo, useCallback } from 'react';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { withAnalyticsContext } from '@atlaskit/analytics-next';
 import Button from '@atlaskit/button/custom-theme-button';
 import { B400, B50, N800 } from '@atlaskit/theme/colors';
@@ -14,7 +12,7 @@ function CategoryList({
   ...props
 }) {
   const [focusedCategoryIndex, setFocusedCategoryIndex] = React.useState(null);
-  return jsx(Fragment, null, categories.map((category, index) => jsx(CategoryListItem, _extends({
+  return /*#__PURE__*/React.createElement(Fragment, null, categories.map((category, index) => /*#__PURE__*/React.createElement(CategoryListItem, _extends({
     key: category.title,
     index: index,
     category: category,
@@ -77,9 +75,9 @@ function CategoryListItem({
       ...rest
     };
   }, [category.name, selectedCategory]);
-  return jsx("div", {
+  return /*#__PURE__*/React.createElement("div", {
     css: buttonWrapper
-  }, jsx(Button, {
+  }, /*#__PURE__*/React.createElement(Button, {
     appearance: "subtle",
     isSelected: selectedCategory === category.name,
     onClick: onClick,

package/dist/es2019/element-browser/components/ElementBrowserLoader.js

@@ -1,6 +1,5 @@
-/** @jsx jsx */
 import React from 'react';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import Loadable from 'react-loadable';
 import Spinner from '@atlaskit/spinner';
 const spinnerContainer = css`
@@ -12,9 +11,9 @@ const spinnerContainer = css`
 `;
 const ElementBrowserLoader = Loadable({
   loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-element-browser" */'../ElementBrowser').then(module => module.default),
-  loading: () => jsx("div", {
+  loading: () => /*#__PURE__*/React.createElement("div", {
     css: spinnerContainer
-  }, jsx(Spinner, {
+  }, /*#__PURE__*/React.createElement(Spinner, {
     size: "medium"
   }))
 });