@atlaskit/editor-core 189.5.0 → 189.5.3

package/dist/esm/plugins/avatar-group/ui/AvatarGroupPluginWrapper.js

@@ -1,7 +1,8 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2;
+/** @jsx jsx */
 import { useEffect } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import AvatarsWithPluginState from '../../collab-edit/ui/avatars-with-plugin-state';
 import { useIntl } from 'react-intl-next';
 import { avatarGroupMessages } from '../messages';
@@ -23,11 +24,11 @@ var AvatarGroupPluginWrapper = function AvatarGroupPluginWrapper(props) {
       eventType: EVENT_TYPE.UI
     });
   }, [dispatchAnalyticsEvent]);
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     "aria-label": intl.formatMessage(avatarGroupMessages.editors),
     "data-testid": 'avatar-group-in-plugin',
     css: props.takeFullWidth ? toolbarButtonWrapperFullWidth : toolbarButtonWrapper
-  }, /*#__PURE__*/React.createElement(AvatarsWithPluginState, {
+  }, jsx(AvatarsWithPluginState, {
     editorView: props.editorView,
     eventDispatcher: props.eventDispatcher,
     inviteToEditComponent: props.collabEdit && props.collabEdit.inviteToEditComponent,

package/dist/esm/plugins/before-primaryToolbar/ui/BeforePrimaryToolbarWrapper.js

@@ -1,9 +1,10 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject;
-import { css } from '@emotion/react';
+/** @jsx jsx */
+import { css, jsx } from '@emotion/react';
 var beforePrimaryToolbarPluginWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  margin-right: 8px;\n  flex-grow: 1;\n  justify-content: flex-end;\n  align-items: center;\n"])));
 export var BeforePrimaryToolbarWrapper = function BeforePrimaryToolbarWrapper(props) {
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: beforePrimaryToolbarPluginWrapper,
     "data-testid": 'before-primary-toolbar-components-plugin'
   }, props.beforePrimaryToolbarComponents);

package/dist/esm/plugins/breakout/ui/LayoutButton.js

@@ -9,8 +9,9 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject;
 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 from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { B300, N300, N20A } from '@atlaskit/theme/colors';
 import { injectIntl } from 'react-intl-next';
 import { findParentDomRefOfType, findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
@@ -93,7 +94,7 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
       if (closestEl && closestEl.firstChild) {
         element = closestEl.firstChild;
       }
-      return /*#__PURE__*/React.createElement(Popup, {
+      return jsx(Popup, {
         ariaLabel: title,
         target: element,
         offset: [5, 0],
@@ -105,15 +106,15 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
         stick: true,
         forcePlacement: true,
         zIndex: belowOtherPopupsZIndex
-      }, /*#__PURE__*/React.createElement("div", {
+      }, jsx("div", {
         css: toolbarButtonWrapper
-      }, /*#__PURE__*/React.createElement(ToolbarButton, {
+      }, jsx(ToolbarButton, {
         title: title,
         testId: titleMessage.id,
         onClick: this.handleClick(nextBreakoutMode),
-        iconBefore: breakoutMode === 'full-width' ? /*#__PURE__*/React.createElement(CollapseIcon, {
+        iconBefore: breakoutMode === 'full-width' ? jsx(CollapseIcon, {
           label: title
-        }) : /*#__PURE__*/React.createElement(ExpandIcon, {
+        }) : jsx(ExpandIcon, {
           label: title
         })
       })));

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

@@ -1,4 +1,6 @@
+/** @jsx jsx */
 import React from 'react';
+import { jsx } from '@emotion/react';
 import AvatarGroup from '@atlaskit/avatar-group';
 import { avatarContainer } from './styles';
 import toAvatar from './to-avatar';
@@ -14,9 +16,9 @@ export var Avatars = /*#__PURE__*/React.memo(function (props) {
   if (!avatars.length) {
     return null;
   }
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: avatarContainer
-  }, /*#__PURE__*/React.createElement(AvatarGroup, {
+  }, jsx(AvatarGroup, {
     appearance: "stack",
     size: "medium",
     data: avatars,

package/dist/esm/plugins/collab-edit/ui/colored-avatar-item.js

@@ -1,9 +1,11 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
 import { getAvatarColor } from '../utils';
 import { badge } from './styles';
 export var ColoredAvatarItem = function ColoredAvatarItem(props) {
   var color = getAvatarColor(props.sessionId).color.solid;
   var avatar = props.name.substr(0, 1).toUpperCase();
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: badge(color),
     "data-testid": "editor-collab-badge"
   }, avatar);

package/dist/esm/plugins/collab-edit/ui/invite-to-edit.js

@@ -1,9 +1,11 @@
+/** @jsx jsx */
 import React, { Fragment } from 'react';
+import { jsx } from '@emotion/react';
 import InviteTeamIcon from '@atlaskit/icon/glyph/editor/add';
 import ToolbarButton from '../../../ui/ToolbarButton';
 import { inviteTeamWrapper } from './styles';
 var ID = function ID(props) {
-  return /*#__PURE__*/React.createElement(Fragment, null, props.children);
+  return jsx(Fragment, null, props.children);
 };
 export var InviteToEditButton = function InviteToEditButton(props) {
   var Component = props.Component,
@@ -11,7 +13,7 @@ export var InviteToEditButton = function InviteToEditButton(props) {
     selected = props.selected,
     title = props.title;
   var iconBefore = React.useMemo(function () {
-    return /*#__PURE__*/React.createElement(InviteTeamIcon, {
+    return jsx(InviteTeamIcon, {
       label: title
     });
   }, [title]);
@@ -19,9 +21,9 @@ export var InviteToEditButton = function InviteToEditButton(props) {
     return null;
   }
   var Wrapper = Component ? Component : ID;
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: inviteTeamWrapper
-  }, /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(ToolbarButton, {
+  }, jsx(Wrapper, null, jsx(ToolbarButton, {
     className: "invite-to-edit",
     onClick: onClick,
     selected: selected,

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

@@ -4,7 +4,10 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["type"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+/** @jsx jsx */
+
 import React from 'react';
+import { jsx } from '@emotion/react';
 import { overflowShadow } from '@atlaskit/editor-common/ui';
 import { calculateBreakoutStyles } from '@atlaskit/editor-common/utils';
 import { wrapperStyle, header, content, contentWrapper, widerLayoutClassName } from './styles';
@@ -66,26 +69,26 @@ function ExtensionWithPluginState(props) {
     customContainerStyles = breakoutStyles;
   }
   newContentStyles = _objectSpread(_objectSpread({}, newContentStyles), contentWrapper);
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     ref: handleRef,
     "data-layout": node.attrs.layout,
     className: classNames,
     css: wrapperStyle,
     style: customContainerStyles
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     className: "extension-overflow-wrapper ".concat(hasBody ? 'with-body' : '')
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     css: overlay,
     className: "extension-overlay"
-  }), /*#__PURE__*/React.createElement("div", {
+  }), jsx("div", {
     css: header,
     contentEditable: false,
     className: headerClassNames
-  }, !removeBorder && /*#__PURE__*/React.createElement(ExtensionLozenge, {
+  }, !removeBorder && jsx(ExtensionLozenge, {
     node: node
-  }), children), hasBody && /*#__PURE__*/React.createElement("div", {
+  }), children), hasBody && jsx("div", {
     css: newContentStyles
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     css: content,
     ref: handleContentDOMRef,
     className: "extension-content block"
@@ -97,13 +100,13 @@ var Extension = function Extension(props) {
   // which cannot access the `pluginInjectionApi`. When we move
   // Confluence to using presets we can remove this workaround.
   var pluginInjectionApi = props.pluginInjectionApi;
-  return pluginInjectionApi === undefined ? /*#__PURE__*/React.createElement(ExtensionDeprecated, props) : /*#__PURE__*/React.createElement(ExtensionWithSharedState, props);
+  return pluginInjectionApi === undefined ? jsx(ExtensionDeprecated, props) : jsx(ExtensionWithSharedState, props);
 };
 var ExtensionWithSharedState = function ExtensionWithSharedState(props) {
   var pluginInjectionApi = props.pluginInjectionApi;
   var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['width']),
     widthState = _useSharedPluginState.widthState;
-  return /*#__PURE__*/React.createElement(ExtensionWithPluginState, _extends({
+  return jsx(ExtensionWithPluginState, _extends({
     widthState: widthState
   }, props));
 };
@@ -120,14 +123,14 @@ var widthPluginKey = {
   }
 };
 var ExtensionDeprecated = function ExtensionDeprecated(props) {
-  return /*#__PURE__*/React.createElement(WithPluginState, {
+  return jsx(WithPluginState, {
     editorView: props.view,
     plugins: {
       widthState: widthPluginKey
     },
     render: function render(_ref) {
       var widthState = _ref.widthState;
-      return /*#__PURE__*/React.createElement(ExtensionWithPluginState, _extends({
+      return jsx(ExtensionWithPluginState, _extends({
         widthState: widthState
       }, props));
     }

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

@@ -5,7 +5,9 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 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 from 'react';
+import { jsx } from '@emotion/react';
 import { Component } from 'react';
 import { overlay } from '../styles';
 import ExtensionLozenge from '../Lozenge';
@@ -25,13 +27,13 @@ var InlineExtension = /*#__PURE__*/function (_Component) {
         children = _this$props.children;
       var hasChildren = !!children;
       var className = hasChildren ? 'with-overlay with-children' : 'with-overlay';
-      return /*#__PURE__*/React.createElement("div", {
+      return jsx("div", {
         css: wrapperStyle,
         className: "extension-container inline ".concat(className)
-      }, /*#__PURE__*/React.createElement("div", {
+      }, jsx("div", {
         css: overlay,
         className: "extension-overlay"
-      }), children ? children : /*#__PURE__*/React.createElement(ExtensionLozenge, {
+      }), children ? children : jsx(ExtensionLozenge, {
         node: node
       }));
     }

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

@@ -11,6 +11,8 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 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 { jsx } from '@emotion/react';
 import { Component } from 'react';
 import EditorFileIcon from '@atlaskit/icon/glyph/editor/file';
 import { getExtensionLozengeData } from '@atlaskit/editor-common/utils';
@@ -49,7 +51,7 @@ var ExtensionLozenge = /*#__PURE__*/function (_Component) {
       var extensionKey = this.props.node.attrs.extensionKey;
       var url = lozengeData.url,
         rest = _objectWithoutProperties(lozengeData, _excluded);
-      return /*#__PURE__*/React.createElement("img", _extends({
+      return jsx("img", _extends({
         css: styledImage,
         src: url
       }, rest, {
@@ -66,17 +68,17 @@ var ExtensionLozenge = /*#__PURE__*/function (_Component) {
       var params = parameters && parameters.macroParams;
       var title = parameters && parameters.extensionTitle || parameters && parameters.macroMetadata && parameters.macroMetadata.title || extensionKey;
       var isBlockExtension = name === 'extension';
-      return /*#__PURE__*/React.createElement("div", {
+      return jsx("div", {
         "data-testid": "lozenge-fallback",
         css: placeholderFallback
       }, lozengeData && !isBlockExtension ? this.renderImage(_objectSpread({
         height: ICON_SIZE,
         width: ICON_SIZE
-      }, lozengeData)) : /*#__PURE__*/React.createElement(EditorFileIcon, {
+      }, lozengeData)) : jsx(EditorFileIcon, {
         label: title
-      }), /*#__PURE__*/React.createElement("span", {
+      }), jsx("span", {
         className: "extension-title"
-      }, capitalizeFirstLetter(title)), params && !isBlockExtension && /*#__PURE__*/React.createElement("span", {
+      }, capitalizeFirstLetter(title)), params && !isBlockExtension && jsx("span", {
         css: placeholderFallbackParams
       }, Object.keys(params).map(function (key) {
         return key && " | ".concat(key, " = ").concat(params[key].value);

package/dist/esm/plugins/extension/ui/Extension/MultiBodiedExtension/index.js

@@ -4,7 +4,9 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _templateObject, _templateObject2;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-import { css } from '@emotion/react';
+/** @jsx jsx */
+
+import { jsx, css } from '@emotion/react';
 import { N30 } from '@atlaskit/theme/colors';
 import React, { useState } from 'react';
 var useMultiBodiedExtensionActions = function useMultiBodiedExtensionActions(_ref) {
@@ -128,16 +130,16 @@ var MultiBodiedExtension = function MultiBodiedExtension(_ref2) {
     return handleContentDOMRef(node);
   }, [handleContentDOMRef]);
   var containerCSS = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    border: 1px solid ", ";\n    padding: ", ";\n    .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'] {\n      display: none;\n    }\n\n    .multiBodiedExtension-content-dom-wrapper\n      > [data-extension-frame='true']:nth-of-type(", ") {\n      display: block;\n    }\n  "])), "var(--ds-border, ".concat(N30, ")"), "var(--ds-space-050, 4px)", activeChildIndex + 1);
-  return /*#__PURE__*/React.createElement("section", {
+  return jsx("section", {
     className: "multiBodiedExtension--container",
     css: containerCSS,
     "data-testid": "multiBodiedExtension--container",
     "data-active-child-index": activeChildIndex
-  }, /*#__PURE__*/React.createElement("nav", {
+  }, jsx("nav", {
     className: "multiBodiedExtension-navigation",
     css: navigationCSS,
     "data-testid": "multiBodiedExtension-navigation"
-  }, extensionHandlerResult), /*#__PURE__*/React.createElement("article", {
+  }, extensionHandlerResult), jsx("article", {
     className: "multiBodiedExtension--frames",
     "data-testid": "multiBodiedExtension--frames",
     ref: articleRef

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

@@ -1,8 +1,9 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3;
+/** @jsx jsx */
 import { Fragment, useCallback, useEffect, useRef, useState } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { G300, N0 } from '@atlaskit/theme/colors';
 import CheckCircleIcon from '@atlaskit/icon/glyph/check-circle';
 import { FormattedMessage } from 'react-intl-next';
@@ -37,19 +38,19 @@ export var SaveIndicator = function SaveIndicator(_ref) {
       };
     }
   }, [saving, duration]);
-  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, children({
+  return jsx(Fragment, null, jsx("div", null, children({
     onSaveStarted: onSaveStarted,
     onSaveEnded: noop
-  })), visible && saving && /*#__PURE__*/React.createElement("div", {
+  })), visible && saving && jsx("div", {
     css: saveIndicatorWrapper
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     css: saveIndicatorContent,
     "data-testid": "save-indicator-content"
-  }, /*#__PURE__*/React.createElement(CheckCircleIcon, {
+  }, jsx(CheckCircleIcon, {
     label: "Saving",
     primaryColor: "var(--ds-icon-success, ".concat(G300, ")"),
     size: "small"
-  }), /*#__PURE__*/React.createElement("span", {
+  }), jsx("span", {
     css: saveIndicatorText
-  }, /*#__PURE__*/React.createElement(FormattedMessage, messages.saveIndicator)))));
+  }, jsx(FormattedMessage, messages.saveIndicator)))));
 };

package/dist/esm/plugins/find-replace/ui/Find.js

@@ -7,7 +7,9 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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 from 'react';
+import { jsx } from '@emotion/react';
 import { defineMessages, injectIntl } from 'react-intl-next';
 import debounce from 'lodash/debounce';
 import EditorCloseIcon from '@atlaskit/icon/glyph/editor/close';
@@ -172,16 +174,16 @@ var Find = /*#__PURE__*/function (_React$Component) {
     _this.findNext = formatMessage(messages.findNext);
     _this.findPrevious = formatMessage(messages.findPrevious);
     _this.matchCase = formatMessage(messages.matchCase);
-    _this.matchCaseIcon = /*#__PURE__*/React.createElement(MatchCaseIcon, {
+    _this.matchCaseIcon = jsx(MatchCaseIcon, {
       label: _this.matchCase
     });
-    _this.findNextIcon = /*#__PURE__*/React.createElement(ChevronDownIcon, {
+    _this.findNextIcon = jsx(ChevronDownIcon, {
       label: _this.findNext
     });
-    _this.findPrevIcon = /*#__PURE__*/React.createElement(ChevronUpIcon, {
+    _this.findPrevIcon = jsx(ChevronUpIcon, {
       label: _this.findPrevious
     });
-    _this.closeIcon = /*#__PURE__*/React.createElement(EditorCloseIcon, {
+    _this.closeIcon = jsx(EditorCloseIcon, {
       label: _this.closeFindReplaceDialog
     });
 
@@ -249,9 +251,9 @@ var Find = /*#__PURE__*/function (_React$Component) {
         selectedMatchPosition: count.index + 1,
         totalResultsCount: count.total
       });
-      return /*#__PURE__*/React.createElement("div", {
+      return jsx("div", {
         css: sectionWrapperStyles
-      }, /*#__PURE__*/React.createElement(Textfield, {
+      }, jsx(Textfield, {
         name: "find",
         appearance: "none",
         placeholder: this.find,
@@ -264,30 +266,30 @@ var Find = /*#__PURE__*/function (_React$Component) {
         onBlur: this.props.onFindBlur,
         onCompositionStart: this.handleCompositionStart,
         onCompositionEnd: this.handleCompositionEnd
-      }), /*#__PURE__*/React.createElement("div", {
+      }), jsx("div", {
         css: countWrapperStyles,
         "aria-live": "polite"
-      }, findText && /*#__PURE__*/React.createElement("span", {
+      }, findText && jsx("span", {
         "data-testid": "textfield-count",
         css: countStyles
-      }, count.total === 0 ? this.noResultsFound : resultsCount)), allowMatchCase && /*#__PURE__*/React.createElement(FindReplaceTooltipButton, {
+      }, count.total === 0 ? this.noResultsFound : resultsCount)), allowMatchCase && jsx(FindReplaceTooltipButton, {
         title: this.matchCase,
         icon: this.matchCaseIcon,
         onClick: this.handleMatchCaseClick,
         isPressed: shouldMatchCase
-      }), /*#__PURE__*/React.createElement(FindReplaceTooltipButton, {
+      }), jsx(FindReplaceTooltipButton, {
         title: this.findNext,
         icon: this.findNextIcon,
         keymapDescription: 'Enter',
         onClick: this.handleFindNextClick,
         disabled: count.total <= 1
-      }), /*#__PURE__*/React.createElement(FindReplaceTooltipButton, {
+      }), jsx(FindReplaceTooltipButton, {
         title: this.findPrevious,
         icon: this.findPrevIcon,
         keymapDescription: 'Shift Enter',
         onClick: this.handleFindPrevClick,
         disabled: count.total <= 1
-      }), /*#__PURE__*/React.createElement(FindReplaceTooltipButton, {
+      }), jsx(FindReplaceTooltipButton, {
         title: this.closeFindReplaceDialog,
         icon: this.closeIcon,
         keymapDescription: 'Escape',

package/dist/esm/plugins/find-replace/ui/FindReplace.js

@@ -7,7 +7,9 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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 from 'react';
+import { jsx } from '@emotion/react';
 import Find from './Find';
 import Replace from './Replace';
 import { ruleStyles, wrapperStyles } from './styles';
@@ -60,9 +62,9 @@ var FindReplace = /*#__PURE__*/function (_React$PureComponent) {
         allowMatchCase = _this$props.allowMatchCase,
         shouldMatchCase = _this$props.shouldMatchCase,
         onToggleMatchCase = _this$props.onToggleMatchCase;
-      return /*#__PURE__*/React.createElement("div", {
+      return jsx("div", {
         css: wrapperStyles
-      }, /*#__PURE__*/React.createElement(Find, {
+      }, jsx(Find, {
         allowMatchCase: allowMatchCase,
         shouldMatchCase: shouldMatchCase,
         onToggleMatchCase: onToggleMatchCase,
@@ -76,10 +78,10 @@ var FindReplace = /*#__PURE__*/function (_React$PureComponent) {
         onFindTextfieldRefSet: this.setFindTextfieldRef,
         onCancel: onCancel,
         onArrowDown: this.setFocusToReplace
-      }), /*#__PURE__*/React.createElement("hr", {
+      }), jsx("hr", {
         css: ruleStyles,
         id: "replace-hr-element"
-      }), /*#__PURE__*/React.createElement(Replace, {
+      }), jsx(Replace, {
         canReplace: count.total > 0,
         replaceText: replaceText,
         onReplace: onReplace,

package/dist/esm/plugins/find-replace/ui/FindReplaceToolbarButton.js

@@ -10,8 +10,9 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject, _templateObject2, _templateObject3;
 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 from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { defineMessages, injectIntl } from 'react-intl-next';
 import { akEditorFloatingPanelZIndex, akEditorMobileMaxWidth } from '@atlaskit/editor-shared-styles';
 import ToolbarButton, { TOOLBAR_BUTTON } from '../../../ui/ToolbarButton';
@@ -71,9 +72,9 @@ var FindReplaceToolbarButton = /*#__PURE__*/function (_React$PureComponent) {
       var title = formatMessage(messages.findReplaceToolbarButton);
       var stackBelowOtherEditorFloatingPanels = akEditorFloatingPanelZIndex - 1;
       var keymap = findKeymapByDescription('Find');
-      return /*#__PURE__*/React.createElement("div", {
+      return jsx("div", {
         css: [toolbarButtonWrapper, takeFullWidth && toolbarButtonWrapperFullWith]
-      }, /*#__PURE__*/React.createElement(Dropdown, {
+      }, jsx(Dropdown, {
         mountTo: popupsMountPoint,
         boundariesElement: popupsBoundariesElement,
         scrollableElement: popupsScrollableElement,
@@ -91,15 +92,15 @@ var FindReplaceToolbarButton = /*#__PURE__*/function (_React$PureComponent) {
           type: ArrowKeyNavigationType.MENU,
           disableArrowKeyNavigation: true
         },
-        trigger: /*#__PURE__*/React.createElement(ToolbarButton, {
+        trigger: jsx(ToolbarButton, {
           buttonId: TOOLBAR_BUTTON.FIND_REPLACE,
           spacing: isReducedSpacing ? 'none' : 'default',
           selected: isActive,
-          title: /*#__PURE__*/React.createElement(ToolTipContent, {
+          title: jsx(ToolTipContent, {
             description: title,
             keymap: keymap
           }),
-          iconBefore: /*#__PURE__*/React.createElement(EditorSearchIcon, {
+          iconBefore: jsx(EditorSearchIcon, {
             label: title
           }),
           onClick: this.toggleOpen,
@@ -108,9 +109,9 @@ var FindReplaceToolbarButton = /*#__PURE__*/function (_React$PureComponent) {
           "aria-label": keymap ? tooltip(keymap, title) : title,
           "aria-keyshortcuts": getAriaKeyshortcuts(keymap)
         })
-      }, /*#__PURE__*/React.createElement("div", {
+      }, jsx("div", {
         css: wrapper
-      }, /*#__PURE__*/React.createElement(FindReplace, _extends({
+      }, jsx(FindReplace, _extends({
         findText: findText,
         replaceText: replaceText,
         count: {

package/dist/esm/plugins/find-replace/ui/Replace.js

@@ -7,7 +7,9 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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 from 'react';
+import { jsx } from '@emotion/react';
 import Button from '@atlaskit/button/standard-button';
 import { defineMessages, injectIntl } from 'react-intl-next';
 import Textfield from '@atlaskit/textfield';
@@ -135,9 +137,9 @@ var Replace = /*#__PURE__*/function (_React$PureComponent) {
     value: function render() {
       var replaceText = this.state.replaceText;
       var canReplace = this.props.canReplace;
-      return /*#__PURE__*/React.createElement("div", {
+      return jsx("div", {
         css: sectionWrapperStyles
-      }, /*#__PURE__*/React.createElement(Textfield, {
+      }, jsx(Textfield, {
         name: "replace",
         appearance: "none",
         placeholder: this.replaceWith,
@@ -148,12 +150,12 @@ var Replace = /*#__PURE__*/function (_React$PureComponent) {
         onKeyDown: this.handleReplaceKeyDown,
         onCompositionStart: this.handleCompositionStart,
         onCompositionEnd: this.handleCompositionEnd
-      }), /*#__PURE__*/React.createElement(Button, {
+      }), jsx(Button, {
         css: replaceSectionButtonStyles,
         testId: this.replace,
         onClick: this.handleReplaceClick,
         isDisabled: !canReplace
-      }, this.replace), /*#__PURE__*/React.createElement(Button, {
+      }, this.replace), jsx(Button, {
         css: replaceSectionButtonStyles,
         testId: this.replaceAll,
         onClick: this.handleReplaceAllClick,

package/dist/esm/plugins/find-replace/ui/styles.js

@@ -1,5 +1,6 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject;
+/** @jsx jsx */
 import { css } from '@emotion/react';
 import { N60, N30A } from '@atlaskit/theme/colors';
 import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';

package/dist/esm/plugins/jira-issue/nodeviews/jira-issue.js

@@ -1,6 +1,7 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3;
-import { css } from '@emotion/react';
+/** @jsx jsx */
+import { css, jsx } from '@emotion/react';
 import { JiraIcon } from '@atlaskit/logo/jira-icon';
 import { borderRadius } from '@atlaskit/theme/constants';
 import { N30, N50 } from '@atlaskit/theme/colors';
@@ -10,14 +11,14 @@ var jiraChildNode = css(_templateObject2 || (_templateObject2 = _taggedTemplateL
 var svgChildNode = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: inline-block;\n  height: 24px;\n  vertical-align: top;\n  width: 24px;\n\n  & > div {\n    height: 24px;\n    width: 24px;\n  }\n"])));
 export default function JIRAIssueNode(props) {
   var issueKey = props.node.attrs.issueKey;
-  return /*#__PURE__*/React.createElement("span", {
+  return jsx("span", {
     css: wrapperNode,
     "data-testid": "jira-issue-node"
-  }, /*#__PURE__*/React.createElement("span", {
+  }, jsx("span", {
     css: svgChildNode
-  }, /*#__PURE__*/React.createElement(JiraIcon, {
+  }, jsx(JiraIcon, {
     size: "small"
-  })), /*#__PURE__*/React.createElement("span", {
+  })), jsx("span", {
     css: jiraChildNode
   }, issueKey));
 }