@atlaskit/editor-core 189.5.1 → 189.5.6

package/dist/esm/ui/ConfigPanel/Fields/Boolean.js

@@ -4,8 +4,9 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _excluded = ["value"],
   _excluded2 = ["id", "value"];
 var _templateObject, _templateObject2;
+/** @jsx jsx */
 import React, { Fragment } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { Checkbox as AKCheckbox } from '@atlaskit/checkbox';
 import { Field } from '@atlaskit/form';
 import AKToggle from '@atlaskit/toggle';
@@ -46,7 +47,7 @@ function Checkbox(_ref) {
     isRequired = _field$isRequired === void 0 ? false : _field$isRequired,
     _field$defaultValue = field.defaultValue,
     defaultValue = _field$defaultValue === void 0 ? false : _field$defaultValue;
-  return /*#__PURE__*/React.createElement(Field, {
+  return jsx(Field, {
     name: name,
     isRequired: isRequired,
     validate: function validate(value) {
@@ -58,13 +59,13 @@ function Checkbox(_ref) {
       error = _ref2.error;
     var isChecked = fieldProps.value,
       restFieldProps = _objectWithoutProperties(fieldProps, _excluded);
-    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(AKCheckbox, _extends({}, restFieldProps, {
+    return jsx(Fragment, null, jsx(AKCheckbox, _extends({}, restFieldProps, {
       label: label,
       onChange: function onChange(event) {
         return handleOnChange(fieldProps.onChange, onFieldChange, event);
       },
       isChecked: parseBoolean(isChecked)
-    })), /*#__PURE__*/React.createElement(FieldMessages, {
+    })), jsx(FieldMessages, {
       error: error,
       description: description
     }));
@@ -80,7 +81,7 @@ function Toggle(_ref3) {
     isRequired = _field$isRequired2 === void 0 ? false : _field$isRequired2,
     _field$defaultValue2 = field.defaultValue,
     defaultValue = _field$defaultValue2 === void 0 ? false : _field$defaultValue2;
-  return /*#__PURE__*/React.createElement(Field, {
+  return jsx(Field, {
     name: name,
     isRequired: isRequired,
     validate: function validate(value) {
@@ -93,21 +94,21 @@ function Toggle(_ref3) {
     var id = fieldProps.id,
       isChecked = fieldProps.value,
       restFieldProps = _objectWithoutProperties(fieldProps, _excluded2);
-    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
+    return jsx(Fragment, null, jsx("div", {
       css: toggleFieldWrapper
-    }, /*#__PURE__*/React.createElement("label", {
+    }, jsx("label", {
       css: toggleLabel,
       id: id,
       htmlFor: id
-    }, label, isRequired ? /*#__PURE__*/React.createElement("span", {
+    }, label, isRequired ? jsx("span", {
       css: requiredIndicator,
       "aria-hidden": "true"
-    }, "*") : null), /*#__PURE__*/React.createElement(AKToggle, _extends({}, restFieldProps, {
+    }, "*") : null), jsx(AKToggle, _extends({}, restFieldProps, {
       onChange: function onChange(event) {
         return handleOnChange(fieldProps.onChange, onFieldChange, event);
       },
       isChecked: parseBoolean(isChecked)
-    }))), /*#__PURE__*/React.createElement(FieldMessages, {
+    }))), jsx(FieldMessages, {
       error: error,
       description: description
     }));
@@ -118,13 +119,13 @@ export default function Boolean(_ref5) {
     field = _ref5.field,
     onFieldChange = _ref5.onFieldChange;
   if (field.style === 'toggle') {
-    return /*#__PURE__*/React.createElement(Toggle, {
+    return jsx(Toggle, {
       name: name,
       field: field,
       onFieldChange: onFieldChange
     });
   }
-  return /*#__PURE__*/React.createElement(Checkbox, {
+  return jsx(Checkbox, {
     name: name,
     field: field,
     onFieldChange: onFieldChange

package/dist/esm/ui/ConfigPanel/Fields/CheckboxGroup.js

@@ -4,8 +4,9 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _excluded = ["onChange", "value"];
 var _templateObject;
+/** @jsx jsx */
 import { Fragment, useCallback } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { Checkbox as AKCheckbox } from '@atlaskit/checkbox';
 import { Field, Fieldset as AKFieldset } from '@atlaskit/form';
 import { ValidationError } from '../types';
@@ -36,7 +37,7 @@ function CheckboxGroupInner(_ref) {
     onChange(_toConsumableArray(active));
     onFieldChange();
   }
-  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(AKFieldset, {
+  return jsx(Fragment, null, jsx(AKFieldset, {
     legend: label
   }, options.map(function (_ref2, i) {
     var optionLabel = _ref2.label,
@@ -45,7 +46,7 @@ function CheckboxGroupInner(_ref) {
     var onOptionChange = function onOptionChange(event) {
       _onChange(optionValue, event.target.checked);
     };
-    return /*#__PURE__*/React.createElement(AKCheckbox, _extends({
+    return jsx(AKCheckbox, _extends({
       key: i
     }, restFieldProps, {
       isRequired: false,
@@ -53,7 +54,7 @@ function CheckboxGroupInner(_ref) {
       isChecked: isChecked,
       onChange: onOptionChange
     }));
-  })), /*#__PURE__*/React.createElement(FieldMessages, {
+  })), jsx(FieldMessages, {
     error: error,
     description: description
   }));
@@ -68,14 +69,14 @@ export default function CheckboxGroup(_ref3) {
     _field$isRequired = field.isRequired,
     isRequired = _field$isRequired === void 0 ? false : _field$isRequired,
     options = field.items;
-  var label = /*#__PURE__*/React.createElement(Fragment, null, labelBase, isRequired ? /*#__PURE__*/React.createElement("span", {
+  var label = jsx(Fragment, null, labelBase, isRequired ? jsx("span", {
     css: requiredIndicator,
     "aria-hidden": "true"
   }, ' ', "*") : null);
   var _onFieldChange = useCallback(function () {
     onFieldChange(name, true);
   }, [name, onFieldChange]);
-  return /*#__PURE__*/React.createElement(Field, {
+  return jsx(Field, {
     name: name,
     isRequired: isRequired,
     defaultValue: defaultValue,
@@ -83,7 +84,7 @@ export default function CheckboxGroup(_ref3) {
       return _validate(value, isRequired);
     }
   }, function (props) {
-    return /*#__PURE__*/React.createElement(CheckboxGroupInner, _extends({
+    return jsx(CheckboxGroupInner, _extends({
       label: label,
       description: description,
       options: options,

package/dist/esm/ui/ConfigPanel/Fields/ColorPicker.js

@@ -3,7 +3,8 @@ 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 { Fragment } from 'react';
 import { Field } from '@atlaskit/form';
 import { DEFAULT_BORDER_COLOR } from '@atlaskit/editor-common/ui-color';
@@ -335,7 +336,7 @@ var ColorPicker = function ColorPicker(props) {
     onChange(colorValue);
     onFieldChange(name, currentColor !== colorValue);
   };
-  return /*#__PURE__*/React.createElement(ColorPickerButton, {
+  return jsx(ColorPickerButton, {
     title: title,
     currentColor: currentColor,
     onChange: onColorChange,
@@ -358,7 +359,7 @@ var ColorPickerField = function ColorPickerField(_ref) {
   var label = field.label,
     defaultValue = field.defaultValue,
     isRequired = field.isRequired;
-  return /*#__PURE__*/React.createElement(Field, {
+  return jsx(Field, {
     name: name,
     isRequired: isRequired,
     defaultValue: defaultValue,
@@ -368,21 +369,21 @@ var ColorPickerField = function ColorPickerField(_ref) {
   }, function (_ref2) {
     var fieldProps = _ref2.fieldProps,
       error = _ref2.error;
-    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
+    return jsx(Fragment, null, jsx("div", {
       css: colorPickerWrapper
-    }, /*#__PURE__*/React.createElement("label", {
+    }, jsx("label", {
       css: colorPickerLabel
-    }, label, isRequired && /*#__PURE__*/React.createElement("span", {
+    }, label, isRequired && jsx("span", {
       css: requiredIndicator,
       "aria-hidden": "true"
-    }, "*")), /*#__PURE__*/React.createElement(ColorPicker, {
+    }, "*")), jsx(ColorPicker, {
       name: name,
       title: label,
       currentColor: fieldProps.value,
       onChange: fieldProps.onChange,
       onFieldChange: onFieldChange,
       featureFlags: featureFlags
-    })), error && /*#__PURE__*/React.createElement(FieldMessages, {
+    })), error && jsx(FieldMessages, {
       error: error,
       description: ""
     }));

package/dist/esm/ui/ConfigPanel/Fields/DateRange.js

@@ -6,8 +6,9 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject, _templateObject2, _templateObject3;
 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 { Fragment, useState, useEffect, useMemo } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import { Field } from '@atlaskit/form';
 import { RadioGroup } from '@atlaskit/radio';
@@ -31,10 +32,10 @@ var DateField = function DateField(_ref) {
     onFieldChange = _ref.onFieldChange,
     intl = _ref.intl,
     isRequired = _ref.isRequired;
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: horizontalFieldWrapper,
     key: fieldName
-  }, /*#__PURE__*/React.createElement(Field, {
+  }, jsx(Field, {
     name: "".concat(scope, ".").concat(fieldName),
     label: intl.formatMessage(messages[fieldName]),
     defaultValue: getFromDefaultValue(parentField, fieldName),
@@ -47,13 +48,13 @@ var DateField = function DateField(_ref) {
   }, function (_ref2) {
     var fieldProps = _ref2.fieldProps,
       error = _ref2.error;
-    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(DatePicker, _extends({}, fieldProps, {
+    return jsx(Fragment, null, jsx(DatePicker, _extends({}, fieldProps, {
       onChange: function onChange(date) {
         fieldProps.onChange(date);
         onFieldChange(parentField.name, true);
       },
       locale: intl.locale
-    })), /*#__PURE__*/React.createElement(FieldMessages, {
+    })), jsx(FieldMessages, {
       error: error
     }));
   }));
@@ -82,17 +83,17 @@ var DateRange = function DateRange(_ref3) {
     // get the most up to date value after the form has been rendered
     onFieldChange(name, true);
   }, [currentValue, onFieldChange, name]);
-  var element = /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
+  var element = jsx(Fragment, null, jsx("div", {
     css: hidden
-  }, /*#__PURE__*/React.createElement(Field, {
+  }, jsx(Field, {
     name: "".concat(name, ".type"),
     defaultValue: 'date-range'
   }, function (_ref4) {
     var fieldProps = _ref4.fieldProps;
-    return /*#__PURE__*/React.createElement(TextField, _extends({}, fieldProps, {
+    return jsx(TextField, _extends({}, fieldProps, {
       type: "hidden"
     }));
-  })), /*#__PURE__*/React.createElement(Field, {
+  })), jsx(Field, {
     name: "".concat(name, ".value"),
     label: field.label,
     defaultValue: currentValue,
@@ -103,42 +104,42 @@ var DateRange = function DateRange(_ref3) {
   }, function (_ref5) {
     var fieldProps = _ref5.fieldProps,
       error = _ref5.error;
-    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(RadioGroup, _extends({}, fieldProps, {
+    return jsx(Fragment, null, jsx(RadioGroup, _extends({}, fieldProps, {
       options: items,
       onChange: function onChange(event) {
         fieldProps.onChange(event.target.value);
         setCurrentValue(event.target.value);
       }
-    })), /*#__PURE__*/React.createElement(FieldMessages, {
+    })), jsx(FieldMessages, {
       error: error
     }));
-  }), currentValue !== 'custom' ? /*#__PURE__*/React.createElement("div", {
+  }), currentValue !== 'custom' ? jsx("div", {
     css: hidden
-  }, /*#__PURE__*/React.createElement(Field, {
+  }, jsx(Field, {
     name: "".concat(name, ".from"),
     defaultValue: currentValue
   }, function (_ref6) {
     var fieldProps = _ref6.fieldProps;
-    return /*#__PURE__*/React.createElement(TextField, _extends({}, fieldProps, {
+    return jsx(TextField, _extends({}, fieldProps, {
       type: "hidden"
     }));
-  })) : /*#__PURE__*/React.createElement("div", {
+  })) : jsx("div", {
     css: horizontalFields
-  }, /*#__PURE__*/React.createElement(DateField, {
+  }, jsx(DateField, {
     scope: name,
     parentField: field,
     fieldName: "from",
     onFieldChange: onFieldChange,
     intl: intl,
     isRequired: field.isRequired
-  }), /*#__PURE__*/React.createElement(DateField, {
+  }), jsx(DateField, {
     scope: name,
     parentField: field,
     fieldName: "to",
     onFieldChange: onFieldChange,
     intl: intl,
     isRequired: field.isRequired
-  })), /*#__PURE__*/React.createElement(FieldMessages, {
+  })), jsx(FieldMessages, {
     description: field.description
   }));
   return element;

package/dist/esm/ui/ConfigPanel/Fields/Expand.js

@@ -1,8 +1,9 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+/** @jsx jsx */
 import React, { useState } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import { N40 } from '@atlaskit/theme/colors';
 import ChevronDownIcon from '@atlaskit/icon/glyph/chevron-down';
@@ -26,26 +27,26 @@ function Expand(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     expanded = _useState2[0],
     setExpanded = _useState2[1];
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     "data-testid": "expand-config-field",
     css: expandContainer
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     css: expandControl
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     css: labelContainer
-  }, field.label), /*#__PURE__*/React.createElement("div", {
+  }, field.label), jsx("div", {
     css: chevronContainer
-  }, /*#__PURE__*/React.createElement(Button, {
+  }, jsx(Button, {
     onClick: function onClick() {
       setExpanded(!expanded);
     },
     testId: "form-expand-toggle",
-    iconBefore: expanded ? /*#__PURE__*/React.createElement(ChevronDownIcon, {
+    iconBefore: expanded ? jsx(ChevronDownIcon, {
       label: intl.formatMessage(messages.collapse)
-    }) : /*#__PURE__*/React.createElement(ChevronRightIcon, {
+    }) : jsx(ChevronRightIcon, {
       label: intl.formatMessage(messages.expand)
     })
-  }))), /*#__PURE__*/React.createElement("div", {
+  }))), jsx("div", {
     "data-testid": "expand-content-container",
     css: expandContentContainer(!expanded)
   }, children));

package/dist/esm/ui/ConfigPanel/Fields/Fieldset.js

@@ -13,8 +13,9 @@ 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 React, { Fragment } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import SectionMessage from '@atlaskit/section-message';
 import Button from '@atlaskit/button/custom-theme-button';
@@ -173,7 +174,7 @@ var FieldsetField = /*#__PURE__*/function (_React$Component) {
       if (selectOptions.length === 0) {
         return null;
       }
-      return /*#__PURE__*/React.createElement(React.Fragment, null, isAdding ? /*#__PURE__*/React.createElement(Select, {
+      return jsx(React.Fragment, null, isAdding ? jsx(Select, {
         testId: "field-picker",
         defaultMenuIsOpen: true,
         autoFocus: true,
@@ -184,10 +185,10 @@ var FieldsetField = /*#__PURE__*/function (_React$Component) {
             _this.onSelectItem(option);
           }
         }
-      }) : /*#__PURE__*/React.createElement(Button, {
+      }) : jsx(Button, {
         testId: "add-more",
         appearance: "subtle",
-        iconBefore: /*#__PURE__*/React.createElement(AddCircleIcon, {
+        iconBefore: jsx(AddCircleIcon, {
           size: "small",
           label: intl.formatMessage(messages.addField)
         }),
@@ -224,9 +225,9 @@ var FieldsetField = /*#__PURE__*/function (_React$Component) {
         currentParameters = _this$state3.currentParameters,
         visibleFields = _this$state3.visibleFields;
       var children = this.renderActions();
-      return /*#__PURE__*/React.createElement(Fragment, null, error && /*#__PURE__*/React.createElement(FieldsetError, {
+      return jsx(Fragment, null, error && jsx(FieldsetError, {
         message: error
-      }), /*#__PURE__*/React.createElement("div", null, options.showTitle && /*#__PURE__*/React.createElement("h5", null, label), /*#__PURE__*/React.createElement(FormComponent, {
+      }), jsx("div", null, options.showTitle && jsx("h5", null, label), jsx(FormComponent, {
         fields: selectedFields,
         parentName: name,
         extensionManifest: extensionManifest,
@@ -235,7 +236,7 @@ var FieldsetField = /*#__PURE__*/function (_React$Component) {
         onClickRemove: this.onClickRemove,
         onFieldChange: onFieldChange,
         firstVisibleFieldName: firstVisibleFieldName
-      }), children && /*#__PURE__*/React.createElement("div", {
+      }), children && jsx("div", {
         css: actionsWrapper,
         "data-testId": "fieldset-actions"
       }, children)));
@@ -245,11 +246,11 @@ var FieldsetField = /*#__PURE__*/function (_React$Component) {
 }(React.Component);
 function FieldsetError(_ref) {
   var message = _ref.message;
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: sectionMessageWrapper
-  }, /*#__PURE__*/React.createElement(SectionMessage, {
+  }, jsx(SectionMessage, {
     appearance: "error"
-  }, /*#__PURE__*/React.createElement("p", null, message)));
+  }, jsx("p", null, message)));
 }
 var sectionMessageWrapper = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin-bottom: 24px;\n"])));
 export default injectIntl(FieldsetField);

package/dist/esm/ui/ConfigPanel/Fields/SelectItem.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 Avatar from '@atlaskit/avatar';
 var itemWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  small {\n    margin: 0;\n    display: block;\n    color: currentColor;\n  }\n"])));
 var iconWrapper = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  line-height: 1;\n"])));
@@ -16,17 +17,17 @@ export var formatOptionLabel = function formatOptionLabel(_ref, _ref2) {
     icon = _ref.icon,
     description = _ref.description;
   var context = _ref2.context;
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: itemWrapper
-  }, /*#__PURE__*/React.createElement("span", {
+  }, jsx("span", {
     css: [iconWrapper, context === 'menu' && iconWrapperMenu]
-  }, typeof icon === 'string' ? /*#__PURE__*/React.createElement(Avatar, {
+  }, typeof icon === 'string' ? jsx(Avatar, {
     src: icon,
     size: getIconSize(context, description),
     appearance: "square"
-  }) : icon), /*#__PURE__*/React.createElement("div", {
+  }) : icon), jsx("div", {
     style: {
       paddingLeft: icon ? "var(--ds-space-100, 8px)" : 0
     }
-  }, /*#__PURE__*/React.createElement("p", null, label, description && context !== 'value' && /*#__PURE__*/React.createElement("small", null, description))));
+  }, jsx("p", null, label, description && context !== 'value' && jsx("small", null, description))));
 };

package/dist/esm/ui/ConfigPanel/Fields/TabGroup.js

@@ -1,8 +1,9 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2;
+/** @jsx jsx */
 import React, { useState } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import Tabs, { Tab, TabList, TabPanel } from '@atlaskit/tabs';
 var tabWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  // increase specificity to make sure the tab style is overridden\n  &&& [role='tabpanel'][tabindex] {\n    padding: 0;\n  }\n\n  &&& [role='tablist']::before {\n    left: 0;\n    right: 0;\n  }\n"])));
@@ -24,22 +25,22 @@ var TabGroupImpl = function TabGroupImpl(props) {
   var onChange = React.useCallback(function (index) {
     setActiveTab(index);
   }, [setActiveTab]);
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: tabWrapper
-  }, /*#__PURE__*/React.createElement(Tabs, {
+  }, jsx(Tabs, {
     id: "configPanelTabs-".concat(field.name),
     onChange: onChange,
     selected: activeTab
-  }, /*#__PURE__*/React.createElement(TabList, null, fields.map(function (_ref) {
+  }, jsx(TabList, null, fields.map(function (_ref) {
     var name = _ref.name,
       label = _ref.label;
-    return /*#__PURE__*/React.createElement(Tab, {
+    return jsx(Tab, {
       key: "tab-".concat(name)
     }, label);
   })), fields.map(function (field) {
-    return /*#__PURE__*/React.createElement(TabPanel, {
+    return jsx(TabPanel, {
       key: "panel-".concat(field.name)
-    }, /*#__PURE__*/React.createElement("div", {
+    }, jsx("div", {
       css: panelWrapper
     }, renderPanel(field)));
   })));

package/dist/esm/ui/ConfigPanel/Header.js

@@ -1,7 +1,8 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+/** @jsx jsx */
 import { Fragment } from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import Loadable from 'react-loadable';
 import Button from '@atlaskit/button/custom-theme-button';
@@ -35,35 +36,35 @@ var Header = function Header(_ref) {
       return null;
     }
   });
-  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
+  return jsx(Fragment, null, jsx("div", {
     css: item
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     css: itemIcon
-  }, /*#__PURE__*/React.createElement(ResolvedIcon, {
+  }, jsx(ResolvedIcon, {
     label: title
-  })), /*#__PURE__*/React.createElement("div", {
+  })), jsx("div", {
     css: itemBody
-  }, summary ? /*#__PURE__*/React.createElement("div", {
+  }, summary ? jsx("div", {
     css: itemText
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     className: "item-title",
     id: "context-panel-title"
-  }, title), /*#__PURE__*/React.createElement("div", {
+  }, title), jsx("div", {
     className: "item-summary"
-  }, summary)) : /*#__PURE__*/React.createElement("div", {
+  }, summary)) : jsx("div", {
     css: centeredItemTitle,
     id: "context-panel-title"
-  }, title)), /*#__PURE__*/React.createElement("div", {
+  }, title)), jsx("div", {
     css: closeButtonWrapper
-  }, /*#__PURE__*/React.createElement(Button, {
+  }, jsx(Button, {
     appearance: "subtle",
-    iconBefore: /*#__PURE__*/React.createElement(CrossIcon, {
+    iconBefore: jsx(CrossIcon, {
       label: intl.formatMessage(messages.close)
     }),
     onClick: onClose
-  }))), (description || documentationUrl) && /*#__PURE__*/React.createElement("p", {
+  }))), (description || documentationUrl) && jsx("p", {
     css: descriptionStyle
-  }, description && /*#__PURE__*/React.createElement(Fragment, null, description.replace(/([^.])$/, '$1.'), " "), documentationUrl && /*#__PURE__*/React.createElement("a", {
+  }, description && jsx(Fragment, null, description.replace(/([^.])$/, '$1.'), " "), documentationUrl && jsx("a", {
     target: "_blank",
     rel: "noopener noreferrer",
     href: documentationUrl

package/dist/esm/ui/ConfigPanel/LoadingState.js

@@ -1,13 +1,14 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject;
-import { css } from '@emotion/react';
+/** @jsx jsx */
+import { css, jsx } from '@emotion/react';
 import Spinner from '@atlaskit/spinner';
 var spinnerWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  margin-top: ", ";\n"])), "var(--ds-space-800, 64px)");
 var LoadingState = function LoadingState() {
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: spinnerWrapper,
     "data-testid": "ConfigPanelLoading"
-  }, /*#__PURE__*/React.createElement(Spinner, {
+  }, jsx(Spinner, {
     size: "small"
   }));
 };

package/dist/esm/ui/ConfigPanel/NestedForms/RemovableField.js

@@ -1,7 +1,8 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3;
+/** @jsx jsx */
 import React from 'react';
-import { css } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import CrossCircleIcon from '@atlaskit/icon/glyph/cross-circle';
 import Tooltip from '@atlaskit/tooltip';
@@ -22,17 +23,17 @@ var RemovableField = function RemovableField(_ref) {
     return onClickRemove && onClickRemove(name);
   }, [name, onClickRemove]);
   var hasMarginBottom = ((_children$props$field = children.props.field) === null || _children$props$field === void 0 ? void 0 : _children$props$field.type) !== 'expand';
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     css: [removableFieldWrapper, hasMarginBottom && wrapperWithMarginBottom],
     className: className
-  }, children, canRemoveField && /*#__PURE__*/React.createElement("div", {
+  }, children, canRemoveField && jsx("div", {
     css: removeButtonWrapper,
     "data-testid": "remove-field-".concat(name),
     onClick: onClickCallback
-  }, /*#__PURE__*/React.createElement(Tooltip, {
+  }, jsx(Tooltip, {
     content: intl.formatMessage(messages.removeField),
     position: "left"
-  }, /*#__PURE__*/React.createElement(CrossCircleIcon, {
+  }, jsx(CrossCircleIcon, {
     size: "small",
     label: intl.formatMessage(messages.removeField)
   }))));

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

@@ -1,7 +1,8 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+/** @jsx jsx */
 import React, { useMemo } from 'react';
-import { css, useTheme } from '@emotion/react';
+import { jsx, css, useTheme } from '@emotion/react';
 import { whitespaceSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, shadowSharedStyle, dateSharedStyle, tasksAndDecisionsStyles, annotationSharedStyles, smartCardSharedStyles, textColorStyles, resizerStyles, gridStyles, smartCardStyles, embedCardStyles, codeBlockInListSafariFix, unsupportedStyles } from '@atlaskit/editor-common/styles';
 import { akEditorSelectedBorderSize, akEditorDeleteBorder, akEditorDeleteBackgroundWithOpacity, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles, SelectionStyle, akEditorLineHeight, akEditorSelectedBorderColor } from '@atlaskit/editor-shared-styles';
 import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
@@ -52,7 +53,7 @@ export var createEditorContentStyle = function createEditorContentStyle(styles)
         featureFlags: featureFlags
       });
     }, [theme, featureFlags]);
-    return /*#__PURE__*/React.createElement("div", {
+    return jsx("div", {
       className: className,
       ref: ref,
       css: [memoizedStyle, styles]