@atlaskit/editor-core 189.5.1 → 189.5.3

package/dist/es2019/composable-editor/editor.js

@@ -1,4 +1,6 @@
+/** @jsx jsx */
 import { useRef, useCallback, useMemo } from 'react';
+import { jsx } from '@emotion/react';
 import uuid from 'uuid/v4';
 import { FabricEditorAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
 import { ACTION, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
@@ -68,7 +70,7 @@ function Editor(passedProps) {
   };
   useMeasureEditorMountTime(props, getExperienceStore, createAnalyticsEvent);
   const providerFactory = useProviderFactory(props, editorActions.current, createAnalyticsEvent);
-  return /*#__PURE__*/React.createElement(EditorInternal, {
+  return jsx(EditorInternal, {
     props: props,
     handleAnalyticsEvent: handleAnalyticsEvent,
     createAnalyticsEvent: createAnalyticsEvent,
@@ -262,7 +264,7 @@ function EditorButBetter(passedProps) {
       onSaveFromProps(view);
     }
   }, [onSaveFromProps]);
-  return /*#__PURE__*/React.createElement(EditorInternal, {
+  return jsx(EditorInternal, {
     props: props,
     handleAnalyticsEvent: handleAnalyticsEvent,
     createAnalyticsEvent: createAnalyticsEvent,
@@ -286,17 +288,17 @@ export function ComposableEditor(props) {
     };
   }, [props.appearance]);
   if (getBooleanFF('platform.editor.less-editor-props-rerendering')) {
-    return /*#__PURE__*/React.createElement(FabricEditorAnalyticsContext
+    return jsx(FabricEditorAnalyticsContext
     // @ts-expect-error Type 'string' is not assignable to type '"editorCore" | "renderer"'.
     , {
       data: data
-    }, /*#__PURE__*/React.createElement(EditorButBetter, props));
+    }, jsx(EditorButBetter, props));
   }
-  return /*#__PURE__*/React.createElement(FabricEditorAnalyticsContext
+  return jsx(FabricEditorAnalyticsContext
   // @ts-expect-error Type 'string' is not assignable to type '"editorCore" | "renderer"'.
   , {
     data: data
-  }, /*#__PURE__*/React.createElement(Editor, props));
+  }, jsx(Editor, props));
 }
 ComposableEditor.propTypes = {
   minHeight: ({

package/dist/es2019/composable-editor/hooks/useEditorMeasuresConstructor.js

@@ -1,3 +1,5 @@
+/** @jsx jsx */
+
 import { useConstructor } from '@atlaskit/editor-common/hooks';
 import { measureTTI, startMeasure } from '@atlaskit/editor-common/utils';
 import measurements from '../../utils/performance/measure-enum';

package/dist/es2019/composable-editor/hooks/useMeasureEditorMountTime.js

@@ -1,3 +1,4 @@
+/** @jsx jsx */
 import { useEffect } from 'react';
 import { ACTION } from '@atlaskit/editor-common/analytics';
 import { clearMeasure, stopMeasure } from '@atlaskit/editor-common/utils';

package/dist/es2019/editor.js

@@ -1,6 +1,8 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _extends from "@babel/runtime/helpers/extends";
+/** @jsx jsx */
 import React from 'react';
+import { jsx } from '@emotion/react';
 import editorDeprecationWarnings from './utils/editorDeprecationWarnings';
 import { ComposableEditor } from './composable-editor';
 import useUniversalPreset from './presets/useUniversalPreset';
@@ -10,7 +12,7 @@ const ComposableEditorWrapper = ({
   const preset = useUniversalPreset({
     props
   });
-  return /*#__PURE__*/React.createElement(ComposableEditor, _extends({
+  return jsx(ComposableEditor, _extends({
     preset: preset
   }, props));
 };
@@ -20,7 +22,7 @@ export default class Editor extends React.Component {
     editorDeprecationWarnings(props);
   }
   render() {
-    return /*#__PURE__*/React.createElement(ComposableEditorWrapper, {
+    return jsx(ComposableEditorWrapper, {
       props: this.props
     });
   }

package/dist/es2019/plugins/alignment/ui/ToolbarAlignment/index.js

@@ -1,5 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+/** @jsx jsx */
 import React from 'react';
+import { jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
 import ToolbarButton from '../../../../ui/ToolbarButton';
@@ -66,9 +68,9 @@ export class AlignmentToolbar extends React.Component {
       intl
     } = this.props;
     const title = intl.formatMessage(messages.alignment);
-    return /*#__PURE__*/React.createElement("span", {
+    return jsx("span", {
       css: wrapper
-    }, /*#__PURE__*/React.createElement(Dropdown, {
+    }, jsx(Dropdown, {
       mountTo: popupsMountPoint,
       boundariesElement: popupsBoundariesElement,
       scrollableElement: popupsScrollableElement,
@@ -95,7 +97,7 @@ export class AlignmentToolbar extends React.Component {
       fitWidth: 112,
       fitHeight: 80,
       closeOnTab: true,
-      trigger: /*#__PURE__*/React.createElement(ToolbarButton, {
+      trigger: jsx(ToolbarButton, {
         spacing: isReducedSpacing ? 'none' : 'default',
         disabled: disabled,
         selected: isOpen,
@@ -106,21 +108,21 @@ export class AlignmentToolbar extends React.Component {
         "aria-haspopup": true,
         onClick: this.toggleOpen,
         onKeyDown: this.toggleOpenByKeyboard,
-        iconBefore: /*#__PURE__*/React.createElement("div", {
+        iconBefore: jsx("div", {
           css: triggerWrapper
-        }, /*#__PURE__*/React.createElement(IconMap, {
+        }, jsx(IconMap, {
           alignment: pluginState.align
-        }), /*#__PURE__*/React.createElement("span", {
+        }), jsx("span", {
           css: expandIconWrapper
-        }, /*#__PURE__*/React.createElement(ExpandIcon, {
+        }, jsx(ExpandIcon, {
           label: ""
         }))),
         ref: this.toolbarItemRef
       })
-    }, /*#__PURE__*/React.createElement(Alignment, {
+    }, jsx(Alignment, {
       onClick: align => this.changeAlignment(align, false),
       selectedAlignment: pluginState.align
-    })), /*#__PURE__*/React.createElement("span", {
+    })), jsx("span", {
       css: separatorStyles
     }));
   }

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

@@ -1,5 +1,6 @@
+/** @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';
@@ -34,11 +35,11 @@ const 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/es2019/plugins/before-primaryToolbar/ui/BeforePrimaryToolbarWrapper.js

@@ -1,4 +1,5 @@
-import { css } from '@emotion/react';
+/** @jsx jsx */
+import { css, jsx } from '@emotion/react';
 const beforePrimaryToolbarPluginWrapper = css`
   display: flex;
   margin-right: 8px;
@@ -6,7 +7,7 @@ const beforePrimaryToolbarPluginWrapper = css`
   justify-content: flex-end;
   align-items: center;
 `;
-export const BeforePrimaryToolbarWrapper = props => /*#__PURE__*/React.createElement("div", {
+export const BeforePrimaryToolbarWrapper = props => jsx("div", {
   css: beforePrimaryToolbarPluginWrapper,
   "data-testid": 'before-primary-toolbar-components-plugin'
 }, props.beforePrimaryToolbarComponents);

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

@@ -1,6 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+/** @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';
@@ -86,7 +87,7 @@ class LayoutButton extends React.Component {
     if (closestEl && closestEl.firstChild) {
       element = closestEl.firstChild;
     }
-    return /*#__PURE__*/React.createElement(Popup, {
+    return jsx(Popup, {
       ariaLabel: title,
       target: element,
       offset: [5, 0],
@@ -98,15 +99,15 @@ class LayoutButton extends 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/es2019/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 const Avatars = /*#__PURE__*/React.memo(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/es2019/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 const ColoredAvatarItem = props => {
   const color = getAvatarColor(props.sessionId).color.solid;
   const 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/es2019/plugins/collab-edit/ui/invite-to-edit.js

@@ -1,8 +1,10 @@
+/** @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';
-const ID = props => /*#__PURE__*/React.createElement(Fragment, null, props.children);
+const ID = props => jsx(Fragment, null, props.children);
 export const InviteToEditButton = props => {
   const {
     Component,
@@ -10,16 +12,16 @@ export const InviteToEditButton = props => {
     selected,
     title
   } = props;
-  const iconBefore = React.useMemo(() => /*#__PURE__*/React.createElement(InviteTeamIcon, {
+  const iconBefore = React.useMemo(() => jsx(InviteTeamIcon, {
     label: title
   }), [title]);
   if (!Component && !onClick) {
     return null;
   }
   const 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/es2019/plugins/extension/ui/Extension/Extension/index.js

@@ -1,5 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
+/** @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';
@@ -71,26 +74,26 @@ function ExtensionWithPluginState(props) {
     ...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 ${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"
@@ -104,7 +107,7 @@ const Extension = props => {
   const {
     pluginInjectionApi
   } = props;
-  return pluginInjectionApi === undefined ? /*#__PURE__*/React.createElement(ExtensionDeprecated, props) : /*#__PURE__*/React.createElement(ExtensionWithSharedState, props);
+  return pluginInjectionApi === undefined ? jsx(ExtensionDeprecated, props) : jsx(ExtensionWithSharedState, props);
 };
 const ExtensionWithSharedState = props => {
   const {
@@ -113,7 +116,7 @@ const ExtensionWithSharedState = props => {
   const {
     widthState
   } = useSharedPluginState(pluginInjectionApi, ['width']);
-  return /*#__PURE__*/React.createElement(ExtensionWithPluginState, _extends({
+  return jsx(ExtensionWithPluginState, _extends({
     widthState: widthState
   }, props));
 };
@@ -130,14 +133,14 @@ const widthPluginKey = {
   }
 };
 const ExtensionDeprecated = props => {
-  return /*#__PURE__*/React.createElement(WithPluginState, {
+  return jsx(WithPluginState, {
     editorView: props.view,
     plugins: {
       widthState: widthPluginKey
     },
     render: ({
       widthState
-    }) => /*#__PURE__*/React.createElement(ExtensionWithPluginState, _extends({
+    }) => jsx(ExtensionWithPluginState, _extends({
       widthState: widthState
     }, props))
   });

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

@@ -1,4 +1,6 @@
+/** @jsx jsx */
 import React from 'react';
+import { jsx } from '@emotion/react';
 import { Component } from 'react';
 import { overlay } from '../styles';
 import ExtensionLozenge from '../Lozenge';
@@ -11,13 +13,13 @@ export default class InlineExtension extends Component {
     } = this.props;
     const hasChildren = !!children;
     const className = hasChildren ? 'with-overlay with-children' : 'with-overlay';
-    return /*#__PURE__*/React.createElement("div", {
+    return jsx("div", {
       css: wrapperStyle,
       className: `extension-container inline ${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/es2019/plugins/extension/ui/Extension/Lozenge.js

@@ -1,4 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
+/** @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';
@@ -33,7 +35,7 @@ export default class ExtensionLozenge extends Component {
       url,
       ...rest
     } = lozengeData;
-    return /*#__PURE__*/React.createElement("img", _extends({
+    return jsx("img", _extends({
       css: styledImage,
       src: url
     }, rest, {
@@ -51,18 +53,18 @@ export default class ExtensionLozenge extends Component {
     const params = parameters && parameters.macroParams;
     const title = parameters && parameters.extensionTitle || parameters && parameters.macroMetadata && parameters.macroMetadata.title || extensionKey;
     const isBlockExtension = name === 'extension';
-    return /*#__PURE__*/React.createElement("div", {
+    return jsx("div", {
       "data-testid": "lozenge-fallback",
       css: placeholderFallback
     }, lozengeData && !isBlockExtension ? this.renderImage({
       height: ICON_SIZE,
       width: ICON_SIZE,
       ...lozengeData
-    }) : /*#__PURE__*/React.createElement(EditorFileIcon, {
+    }) : 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(key => key && ` | ${key} = ${params[key].value}`)));
   }

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

@@ -1,4 +1,6 @@
-import { css } from '@emotion/react';
+/** @jsx jsx */
+
+import { jsx, css } from '@emotion/react';
 import { N30 } from '@atlaskit/theme/colors';
 import React, { useState } from 'react';
 const useMultiBodiedExtensionActions = ({
@@ -146,16 +148,16 @@ const MultiBodiedExtension = ({
       display: block;
     }
   `;
-  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/es2019/plugins/extension/ui/SaveIndicator/SaveIndicator.js

@@ -1,5 +1,6 @@
+/** @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';
@@ -48,19 +49,19 @@ export const SaveIndicator = ({
       return () => clearTimeout(handleId);
     }
   }, [saving, duration]);
-  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, children({
+  return jsx(Fragment, null, jsx("div", null, children({
     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, ${G300})`,
     size: "small"
-  }), /*#__PURE__*/React.createElement("span", {
+  }), jsx("span", {
     css: saveIndicatorText
-  }, /*#__PURE__*/React.createElement(FormattedMessage, messages.saveIndicator)))));
+  }, jsx(FormattedMessage, messages.saveIndicator)))));
 };

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

@@ -1,5 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+/** @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';
@@ -164,16 +166,16 @@ class Find extends 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
     });
 
@@ -233,9 +235,9 @@ class Find extends 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,
@@ -248,30 +250,30 @@ class Find extends 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/es2019/plugins/find-replace/ui/FindReplace.js

@@ -1,5 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+/** @jsx jsx */
 import React from 'react';
+import { jsx } from '@emotion/react';
 import Find from './Find';
 import Replace from './Replace';
 import { ruleStyles, wrapperStyles } from './styles';
@@ -43,9 +45,9 @@ class FindReplace extends React.PureComponent {
       shouldMatchCase,
       onToggleMatchCase
     } = this.props;
-    return /*#__PURE__*/React.createElement("div", {
+    return jsx("div", {
       css: wrapperStyles
-    }, /*#__PURE__*/React.createElement(Find, {
+    }, jsx(Find, {
       allowMatchCase: allowMatchCase,
       shouldMatchCase: shouldMatchCase,
       onToggleMatchCase: onToggleMatchCase,
@@ -59,10 +61,10 @@ class FindReplace extends 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/es2019/plugins/find-replace/ui/FindReplaceToolbarButton.js

@@ -1,7 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+/** @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';
@@ -69,9 +70,9 @@ class FindReplaceToolbarButton extends React.PureComponent {
     const title = formatMessage(messages.findReplaceToolbarButton);
     const stackBelowOtherEditorFloatingPanels = akEditorFloatingPanelZIndex - 1;
     const 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,
@@ -89,15 +90,15 @@ class FindReplaceToolbarButton extends 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,
@@ -106,9 +107,9 @@ class FindReplaceToolbarButton extends 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: {