@atlaskit/editor-core 162.0.2 → 164.0.1

package/dist/cjs/plugins/hyperlink/ui/HyperlinkAddToolbar/HyperlinkAddToolbar.js

@@ -35,6 +35,8 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _react2 = require("@emotion/react");
+
 var _adfSchema = require("@atlaskit/adf-schema");
 
 var _crossCircle = _interopRequireDefault(require("@atlaskit/icon/glyph/cross-circle"));
@@ -51,8 +53,6 @@ var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 
 var _reactIntlNext = require("react-intl-next");
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _analyticsNext = require("@atlaskit/analytics-next");
 
 var _messages = require("../../../../messages");
@@ -97,13 +97,9 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 var RECENT_SEARCH_LIST_SIZE = 5;
 exports.RECENT_SEARCH_LIST_SIZE = RECENT_SEARCH_LIST_SIZE;
-
-var ClearText = _styledComponents.default.button(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  cursor: pointer;\n  padding: 0;\n  margin-right: 8px;\n  color: ", ";\n  background: transparent;\n  border: none;\n"])), _colors.N90);
-
-var TextInputWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", ";\n  border-top: 1px solid ", ";\n  border-bottom: 1px solid ", ";\n"])), _ToolbarComponents.InputWrapper, _colors.N30, _colors.N30);
-
-var IconWrapper = _styledComponents.default.span(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  padding: 4px 8px;\n  width: 18px;\n"])), _colors.N80);
-
+var clearText = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  cursor: pointer;\n  padding: 0;\n  margin-right: 8px;\n  color: ", ";\n  background: transparent;\n  border: none;\n"])), _colors.N90);
+var textInputWrapper = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", ";\n  border-top: 1px solid ", ";\n  border-bottom: 1px solid ", ";\n"])), _ToolbarComponents.inputWrapper, _colors.N30, _colors.N30);
+var iconWrapper = (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  padding: 4px 8px;\n  width: 18px;\n"])), _colors.N80);
 var messages = (0, _reactIntlNext.defineMessages)({
   displayText: {
     id: 'fabric.editor.displayText',
@@ -137,8 +133,7 @@ var messages = (0, _reactIntlNext.defineMessages)({
   }
 });
 exports.messages = messages;
-
-var defaultIcon = /*#__PURE__*/_react.default.createElement(_.default, {
+var defaultIcon = (0, _react2.jsx)(_.default, {
   label: 'page'
 });
 
@@ -484,11 +479,11 @@ var HyperlinkLinkAddToolbar = /*#__PURE__*/function (_PureComponent) {
       if (items.length && selectedIndex > -1) {
         var _items$selectedIndex = items[selectedIndex],
             name = _items$selectedIndex.name,
-            container = _items$selectedIndex.container,
+            _container = _items$selectedIndex.container,
             lastUpdatedDate = _items$selectedIndex.lastUpdatedDate,
             lastViewedDate = _items$selectedIndex.lastViewedDate;
         var date = (0, _transformTimeStamp.transformTimeStamp)(intl, lastViewedDate, lastUpdatedDate);
-        return "".concat(name, ", ").concat(container, ", ").concat(date === null || date === void 0 ? void 0 : date.pageAction, " ").concat(date === null || date === void 0 ? void 0 : date.dateString, " ").concat((date === null || date === void 0 ? void 0 : date.timeSince) || '');
+        return "".concat(name, ", ").concat(_container, ", ").concat(date === null || date === void 0 ? void 0 : date.pageAction, " ").concat(date === null || date === void 0 ? void 0 : date.dateString, " ").concat((date === null || date === void 0 ? void 0 : date.timeSince) || '');
       }
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isUrlPopulatedWithSelectedItem", function () {
@@ -965,24 +960,29 @@ var HyperlinkLinkAddToolbar = /*#__PURE__*/function (_PureComponent) {
       // for details: https://a11y-internal.atlassian.net/browse/AK-740
 
       var screenReaderText = _utils3.browser.safari && this.getScreenReaderText();
-      return /*#__PURE__*/_react.default.createElement("div", {
+      return (0, _react2.jsx)("div", {
         className: "recent-list"
-      }, /*#__PURE__*/_react.default.createElement(_ToolbarComponents.Container, {
-        provider: !!activityProvider,
-        innerRef: this.wrapperRef
-      }, /*#__PURE__*/_react.default.createElement(_ToolbarComponents.UrlInputWrapper, null, /*#__PURE__*/_react.default.createElement(IconWrapper, null, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+      }, (0, _react2.jsx)("div", {
+        css: [_ToolbarComponents.container, !!activityProvider && _ToolbarComponents.containerWithProvider],
+        ref: this.wrapperRef
+      }, (0, _react2.jsx)("div", {
+        css: _ToolbarComponents.inputWrapper
+      }, (0, _react2.jsx)("span", {
+        css: iconWrapper
+      }, (0, _react2.jsx)(_tooltip.default, {
         content: formatLinkAddressText
-      }, /*#__PURE__*/_react.default.createElement(_link.default, {
+      }, (0, _react2.jsx)(_link.default, {
         label: formatLinkAddressText
-      }))), screenReaderText && /*#__PURE__*/_react.default.createElement(_announcer.default, {
+      }))), screenReaderText && (0, _react2.jsx)(_announcer.default, {
         ariaLive: "assertive",
         text: screenReaderText,
         ariaRelevant: "additions",
         delay: 250
-      }), /*#__PURE__*/_react.default.createElement(_styles.ScreenReaderText, {
+      }), (0, _react2.jsx)("div", {
+        css: _styles.visuallyHiddenStyles,
         "aria-hidden": "true",
         id: screenReaderDescriptionId
-      }, formatMessage(messages.searchLinkAriaDescription)), /*#__PURE__*/_react.default.createElement(_PanelTextInput.default, {
+      }, formatMessage(messages.searchLinkAriaDescription)), (0, _react2.jsx)(_PanelTextInput.default, {
         role: "combobox",
         ariaExpanded: true,
         ariaActiveDescendant: ariaActiveDescendant,
@@ -1002,17 +1002,22 @@ var HyperlinkLinkAddToolbar = /*#__PURE__*/function (_PureComponent) {
         onCancel: this.handleCancel,
         defaultValue: displayUrl,
         onKeyDown: this.handleKeyDown
-      }), displayUrl && /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+      }), displayUrl && (0, _react2.jsx)(_tooltip.default, {
         content: formatClearLinkText
-      }, /*#__PURE__*/_react.default.createElement(ClearText, {
+      }, (0, _react2.jsx)("button", {
+        css: clearText,
         onClick: this.handleClearText
-      }, /*#__PURE__*/_react.default.createElement(_crossCircle.default, {
+      }, (0, _react2.jsx)(_crossCircle.default, {
         label: formatClearLinkText
-      })))), /*#__PURE__*/_react.default.createElement(TextInputWrapper, null, /*#__PURE__*/_react.default.createElement(IconWrapper, null, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+      })))), (0, _react2.jsx)("div", {
+        css: textInputWrapper
+      }, (0, _react2.jsx)("span", {
+        css: iconWrapper
+      }, (0, _react2.jsx)(_tooltip.default, {
         content: formatDisplayText
-      }, /*#__PURE__*/_react.default.createElement(_alignLeft.default, {
+      }, (0, _react2.jsx)(_alignLeft.default, {
         label: formatDisplayText
-      }))), /*#__PURE__*/_react.default.createElement(_PanelTextInput.default, {
+      }))), (0, _react2.jsx)(_PanelTextInput.default, {
         ref: function ref(ele) {
           return _this2.displayTextInputContainer = ele;
         },
@@ -1024,20 +1029,22 @@ var HyperlinkLinkAddToolbar = /*#__PURE__*/function (_PureComponent) {
         defaultValue: displayText,
         onSubmit: this.handleSubmit,
         onKeyDown: this.handleKeyDown
-      }), displayText && /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+      }), displayText && (0, _react2.jsx)(_tooltip.default, {
         content: formatMessage(messages.clearText)
-      }, /*#__PURE__*/_react.default.createElement(ClearText, {
+      }, (0, _react2.jsx)("button", {
+        css: clearText,
         onClick: this.handleClearDisplayText,
         onKeyDown: this.handleClearTextKeyDown
-      }, /*#__PURE__*/_react.default.createElement(_crossCircle.default, {
+      }, (0, _react2.jsx)(_crossCircle.default, {
         label: formatMessage(messages.clearText)
-      })))), /*#__PURE__*/_react.default.createElement(_styles.ScreenReaderText, {
+      })))), (0, _react2.jsx)("div", {
+        css: _styles.visuallyHiddenStyles,
         "aria-live": "polite",
         "aria-atomic": "true",
         id: "fabric.editor.hyperlink.suggested.results"
       }, displayUrl && formatMessage(messages.searchLinkResults, {
         count: items.length
-      })), /*#__PURE__*/_react.default.createElement(_LinkSearchList.default, {
+      })), (0, _react2.jsx)(_LinkSearchList.default, {
         ariaControls: "fabric.editor.hyperlink.suggested.results",
         id: linkSearchListId,
         role: "listbox",

package/dist/cjs/plugins/insert-block/ui/ToolbarInsertBlock/dropdown-button.js

@@ -9,6 +9,8 @@ exports.DropDownButton = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
+var _react2 = require("@emotion/react");
+
 var _add = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/add"));
 
 var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
@@ -21,16 +23,21 @@ var _styles = require("../../../../ui/styles");
 
 var _styles2 = require("./styles");
 
+/** @jsx jsx */
 var DropDownButtonIcon = /*#__PURE__*/_react.default.memo(function (props) {
-  return /*#__PURE__*/_react.default.createElement(_styles2.TriggerWrapper, null, /*#__PURE__*/_react.default.createElement(_add.default, {
+  return (0, _react2.jsx)("span", {
+    css: _styles2.triggerWrapper
+  }, (0, _react2.jsx)(_add.default, {
     label: props.label
-  }), /*#__PURE__*/_react.default.createElement(_styles.ExpandIconWrapper, null, /*#__PURE__*/_react.default.createElement(_chevronDown.default, {
+  }), (0, _react2.jsx)("span", {
+    css: _styles.expandIconWrapperStyle
+  }, (0, _react2.jsx)(_chevronDown.default, {
     label: ""
   })));
 });
 
 var DropDownButton = /*#__PURE__*/_react.default.memo(function (props) {
-  return /*#__PURE__*/_react.default.createElement(_ToolbarButton.default, {
+  return (0, _react2.jsx)(_ToolbarButton.default, {
     ref: props.handleRef,
     selected: props.selected,
     disabled: props.disabled,
@@ -39,10 +46,10 @@ var DropDownButton = /*#__PURE__*/_react.default.memo(function (props) {
     "aria-expanded": props['aria-expanded'],
     "aria-haspopup": props['aria-haspopup'],
     "aria-label": props.label,
-    iconBefore: /*#__PURE__*/_react.default.createElement(DropDownButtonIcon, {
+    iconBefore: (0, _react2.jsx)(DropDownButtonIcon, {
       label: ""
     }),
-    title: /*#__PURE__*/_react.default.createElement(_keymaps.ToolTipContent, {
+    title: (0, _react2.jsx)(_keymaps.ToolTipContent, {
       description: props.label,
       shortcutOverride: "/"
     })

package/dist/cjs/plugins/insert-block/ui/ToolbarInsertBlock/index.js

@@ -25,6 +25,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = _interopRequireDefault(require("react"));
 
+var _react2 = require("@emotion/react");
+
 var _reactDom = _interopRequireDefault(require("react-dom"));
 
 var _reactIntlNext = require("react-intl-next");
@@ -282,27 +284,23 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "insertTaskDecision", function (name, inputMethod) {
       return function () {
-        var editorView = _this.props.editorView;
-
-        if (!editorView) {
-          return false;
-        }
-
+        var _this$props$editorVie = _this.props.editorView,
+            state = _this$props$editorVie.state,
+            dispatch = _this$props$editorVie.dispatch;
         var listType = name === 'action' ? 'taskList' : 'decisionList';
-        (0, _commands3.insertTaskDecision)(editorView, listType, inputMethod)(editorView.state, editorView.dispatch);
-        return true;
+        return (0, _commands3.insertTaskDecisionCommand)(listType, inputMethod)(state, dispatch);
       };
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "insertHorizontalRule", function (inputMethod) {
-      var _this$props$editorVie = _this.props.editorView,
-          state = _this$props$editorVie.state,
-          dispatch = _this$props$editorVie.dispatch;
-      return (0, _commands6.insertHorizontalRule)(inputMethod)(state, dispatch);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "insertExpand", function () {
       var _this$props$editorVie2 = _this.props.editorView,
           state = _this$props$editorVie2.state,
           dispatch = _this$props$editorVie2.dispatch;
+      return (0, _commands6.insertHorizontalRule)(inputMethod)(state, dispatch);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "insertExpand", function () {
+      var _this$props$editorVie3 = _this.props.editorView,
+          state = _this$props$editorVie3.state,
+          dispatch = _this$props$editorVie3.dispatch;
       return (0, _commands4.insertExpand)(state, dispatch);
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "insertBlockType", function (itemName) {
@@ -489,7 +487,7 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
         return null;
       }
 
-      return /*#__PURE__*/_react.default.createElement(_ui.Popup, {
+      return (0, _react2.jsx)(_ui.Popup, {
         target: ref,
         fitHeight: 350,
         fitWidth: 350,
@@ -497,7 +495,7 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
         mountTo: popupsMountPoint,
         boundariesElement: popupsBoundariesElement,
         scrollableElement: popupsScrollableElement
-      }, /*#__PURE__*/_react.default.createElement(EmojiPickerWithListeners, {
+      }, (0, _react2.jsx)(EmojiPickerWithListeners, {
         emojiProvider: emojiProvider,
         onSelection: this.handleSelectedEmoji,
         handleClickOutside: this.handleEmojiClickOutside,
@@ -522,10 +520,10 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
         return null;
       }
 
-      return /*#__PURE__*/_react.default.createElement(_styles.ButtonGroup, {
-        width: isReducedSpacing ? 'small' : 'large'
+      return (0, _react2.jsx)("span", {
+        css: _styles.buttonGroupStyle
       }, buttons.map(function (btn) {
-        return /*#__PURE__*/_react.default.createElement(_ToolbarButton.default, {
+        return (0, _react2.jsx)(_ToolbarButton.default, {
           item: btn,
           ref: btn.value.name === 'emoji' ? _this2.handleEmojiButtonRef : noop,
           key: btn.value.name,
@@ -538,7 +536,9 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
           "aria-haspopup": btn['aria-haspopup'],
           onItemClick: _this2.insertToolbarMenuItem
         });
-      }), /*#__PURE__*/_react.default.createElement(_styles.Wrapper, null, this.renderPopup(), /*#__PURE__*/_react.default.createElement(_blockInsertMenu.BlockInsertMenu, {
+      }), (0, _react2.jsx)("span", {
+        css: _styles.wrapperStyle
+      }, this.renderPopup(), (0, _react2.jsx)(_blockInsertMenu.BlockInsertMenu, {
         popupsMountPoint: this.props.popupsMountPoint,
         popupsBoundariesElement: this.props.popupsBoundariesElement,
         popupsScrollableElement: this.props.popupsScrollableElement,
@@ -557,7 +557,9 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
         onOpenChange: this.onOpenChange,
         togglePlusMenuVisibility: this.togglePlusMenuVisibility,
         replacePlusMenuWithElementBrowser: (_this$props$replacePl = this.props.replacePlusMenuWithElementBrowser) !== null && _this$props$replacePl !== void 0 ? _this$props$replacePl : false
-      })), this.props.showSeparator && /*#__PURE__*/_react.default.createElement(_styles.Separator, null));
+      })), this.props.showSeparator && (0, _react2.jsx)("span", {
+        css: _styles.separatorStyles
+      }));
     }
   }], [{
     key: "getDerivedStateFromProps",

package/dist/cjs/plugins/insert-block/ui/ToolbarInsertBlock/item.js

@@ -9,6 +9,8 @@ exports.table = exports.status = exports.placeholder = exports.panel = exports.m
 
 var _react = _interopRequireDefault(require("react"));
 
+var _react2 = require("@emotion/react");
+
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
 
 var _decision = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/decision"));
@@ -51,6 +53,7 @@ var _keymaps = require("../../../../keymaps");
 
 var _shallowEquals = require("./shallow-equals");
 
+/** @jsx jsx */
 var from = function from(init) {
   return {
     content: init.content,
@@ -58,10 +61,12 @@ var from = function from(init) {
     value: {
       name: init.name
     },
-    elemBefore: /*#__PURE__*/_react.default.createElement(init.Icon, {
+    elemBefore: (0, _react2.jsx)(init.Icon, {
       label: init.content
     }),
-    elemAfter: init.shortcut ? /*#__PURE__*/_react.default.createElement(_styles.Shortcut, null, init.shortcut) : undefined,
+    elemAfter: init.shortcut ? (0, _react2.jsx)("div", {
+      css: _styles.shortcutStyle
+    }, init.shortcut) : undefined,
     'aria-label': init.content,
     'aria-haspopup': init['aria-haspopup'],
     shortcut: init.shortcut,
@@ -244,7 +249,7 @@ var placeholder = mem(function (init) {
     disabled: init.disabled,
     name: 'placeholder text',
     Icon: function Icon() {
-      return /*#__PURE__*/_react.default.createElement(_text.default, {
+      return (0, _react2.jsx)(_text.default, {
         label: ""
       });
     }
@@ -268,7 +273,7 @@ var more = mem(function (init) {
     disabled: init.disabled,
     name: 'macro',
     Icon: function Icon() {
-      return /*#__PURE__*/_react.default.createElement(_more.default, {
+      return (0, _react2.jsx)(_more.default, {
         label: ""
       });
     }

package/dist/cjs/plugins/insert-block/ui/ToolbarInsertBlock/styles.js

@@ -5,14 +5,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TriggerWrapper = void 0;
+exports.triggerWrapper = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _react = require("@emotion/react");
 
 var _templateObject;
 
-var TriggerWrapper = _styledComponents.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 42px;\n\n  display: flex;\n  align-items: center;\n\n  > div,\n  > span {\n    display: flex;\n  }\n\n  > div > div {\n    display: flex;\n  }\n"])));
-
-exports.TriggerWrapper = TriggerWrapper;
+var triggerWrapper = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 42px;\n\n  display: flex;\n  align-items: center;\n\n  > div,\n  > span {\n    display: flex;\n  }\n\n  > div > div {\n    display: flex;\n  }\n"])));
+exports.triggerWrapper = triggerWrapper;

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

@@ -9,9 +9,7 @@ exports.default = JIRAIssueNode;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
-var _react = _interopRequireDefault(require("react"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _react = require("@emotion/react");
 
 var _jiraIcon = require("@atlaskit/logo/jira-icon");
 
@@ -23,15 +21,20 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
 var _templateObject, _templateObject2, _templateObject3;
 
-var WrapperNode = _styledComponents.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: ", "px;\n  box-sizing: border-box;\n  cursor: default;\n  display: inline-flex;\n  font-size: ", ";\n  margin: 0 2px;\n  min-height: 24px;\n  padding: 0 4px;\n  user-select: none;\n  vertical-align: middle;\n  white-space: nowrap;\n\n  .ProseMirror-selectednode & {\n    background: ", ";\n    outline: none;\n  }\n"])), _colors.N30, _colors.N50, (0, _constants.borderRadius)(), (0, _editorSharedStyles.relativeFontSizeToBase16)(13), _colors.N50);
-
-var JiraChildNode = _styledComponents.default.span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n  color: #707070;\n  line-height: 24px;\n  vertical-align: top;\n\n  &::before {\n    color: black;\n    content: 'JIRA | ';\n  }\n"])));
-
-var SvgChildNode = _styledComponents.default.span(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\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"])));
+var wrapperNode = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: ", "px;\n  box-sizing: border-box;\n  cursor: default;\n  display: inline-flex;\n  font-size: ", ";\n  margin: 0 2px;\n  min-height: 24px;\n  padding: 0 4px;\n  user-select: none;\n  vertical-align: middle;\n  white-space: nowrap;\n\n  .ProseMirror-selectednode & {\n    background: ", ";\n    outline: none;\n  }\n"])), _colors.N30, _colors.N50, (0, _constants.borderRadius)(), (0, _editorSharedStyles.relativeFontSizeToBase16)(13), _colors.N50);
+var jiraChildNode = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n  color: #707070;\n  line-height: 24px;\n  vertical-align: top;\n\n  &::before {\n    color: black;\n    content: 'JIRA | ';\n  }\n"])));
+var svgChildNode = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\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"])));
 
 function JIRAIssueNode(props) {
   var issueKey = props.node.attrs.issueKey;
-  return /*#__PURE__*/_react.default.createElement(WrapperNode, null, /*#__PURE__*/_react.default.createElement(SvgChildNode, null, /*#__PURE__*/_react.default.createElement(_jiraIcon.JiraIcon, {
+  return (0, _react.jsx)("span", {
+    css: wrapperNode,
+    "data-testid": "jira-issue-node"
+  }, (0, _react.jsx)("span", {
+    css: svgChildNode
+  }, (0, _react.jsx)(_jiraIcon.JiraIcon, {
     size: "small"
-  })), /*#__PURE__*/_react.default.createElement(JiraChildNode, null, issueKey));
+  })), (0, _react.jsx)("span", {
+    css: jiraChildNode
+  }, issueKey));
 }

package/dist/cjs/plugins/list/actions/wrap-and-join-lists.js

@@ -3,7 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.autoJoin = autoJoin;
 exports.wrapInList = wrapInList;
 exports.wrapInListAndJoin = wrapInListAndJoin;
 
@@ -11,13 +10,15 @@ var _prosemirrorModel = require("prosemirror-model");
 
 var _prosemirrorTransform = require("prosemirror-transform");
 
+var _autojoin = require("../../../utils/prosemirror/autojoin");
+
 /**
  * Wraps the selection in a list with the given type. If this results in
  * two adjacent lists of the same type, those will be joined together.
  */
 function wrapInListAndJoin(nodeType, tr) {
   wrapInList(nodeType)(tr);
-  autoJoin(tr, function (before, after) {
+  (0, _autojoin.autoJoinTr)(tr, function (before, after) {
     return before.type === after.type && before.type === nodeType;
   });
 }
@@ -106,75 +107,4 @@ function doWrapInList(tr, range, wrappers, joinBefore, listType) {
   }
 
   return tr;
-}
-/**
- * Checks whether two adjacent nodes can be joined. If so, the document
- * will be updated to join those nodes. If not, the original transaction
- * remains untouched.
- *
- * Nodes are considered joinable if the `isJoinable` predicate returns true.
- *
- * Adapted from https://github.com/ProseMirror/prosemirror-commands/blob/master/src/commands.js#L597-L610
- */
-
-
-function autoJoin(tr, isJoinable) {
-  if (!tr.isGeneric) {
-    return;
-  }
-
-  var ranges = [];
-
-  for (var i = 0; i < tr.mapping.maps.length; i++) {
-    var map = tr.mapping.maps[i];
-
-    for (var j = 0; j < ranges.length; j++) {
-      ranges[j] = map.map(ranges[j]);
-    }
-
-    map.forEach(function (_s, _e, from, to) {
-      return ranges.push(from, to);
-    });
-  } // Figure out which joinable points exist inside those ranges,
-  // by checking all node boundaries in their parent nodes.
-
-
-  var joinable = [];
-
-  for (var _i3 = 0; _i3 < ranges.length; _i3 += 2) {
-    var from = ranges[_i3];
-    var to = ranges[_i3 + 1];
-    var $from = tr.doc.resolve(from);
-    var depth = $from.sharedDepth(to);
-    var parent = $from.node(depth);
-
-    for (var index = $from.indexAfter(depth), pos = $from.after(depth + 1); pos <= to; ++index) {
-      var _after = parent.maybeChild(index);
-
-      if (!_after) {
-        break;
-      }
-
-      if (index && joinable.indexOf(pos) === -1) {
-        var _before = parent.child(index - 1);
-
-        if (_before.type === _after.type && isJoinable(_before, _after)) {
-          joinable.push(pos);
-        }
-      }
-
-      pos += _after.nodeSize;
-    }
-  } // Join the joinable points
-
-
-  joinable.sort(function (a, b) {
-    return a - b;
-  });
-
-  for (var _i4 = joinable.length - 1; _i4 >= 0; _i4--) {
-    if ((0, _prosemirrorTransform.canJoin)(tr.doc, joinable[_i4])) {
-      tr.join(joinable[_i4]);
-    }
-  }
 }

package/dist/cjs/plugins/list/commands/index.js

@@ -29,6 +29,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _prosemirrorModel = require("prosemirror-model");
 
+var _prosemirrorState = require("prosemirror-state");
+
 var baseCommand = _interopRequireWildcard(require("prosemirror-commands"));
 
 var _prosemirrorUtils = require("prosemirror-utils");
@@ -387,6 +389,12 @@ var joinToPreviousListItem = function joinToPreviousListItem(state, dispatch) {
       }
 
       if (dispatch) {
+        var _tr$doc$resolve$nodeB;
+
+        if (!((_tr$doc$resolve$nodeB = tr.doc.resolve($lastNode.pos).nodeBefore) !== null && _tr$doc$resolve$nodeB !== void 0 && _tr$doc$resolve$nodeB.isBlock) || tr.doc.resolve($lastNode.pos).nodeBefore === null) {
+          tr = tr.setSelection(_prosemirrorState.TextSelection.near(tr.doc.resolve(tr.mapping.map($cut.pos)), -1));
+        }
+
         dispatch(tr.scrollIntoView());
       }
 

package/dist/cjs/plugins/list/pm-plugins/main.js

@@ -69,6 +69,12 @@ var getDecorations = function getDecorations(doc) {
       decorations.push(_prosemirrorView.Decoration.node(from, to, {
         'data-indent-level': "".concat(depth)
       }));
+
+      if (node.childCount >= 100) {
+        decorations.push(_prosemirrorView.Decoration.node(from, to, {
+          'data-child-count': '100+'
+        }));
+      }
     }
   });
   return _prosemirrorView.DecorationSet.empty.add(doc, decorations);

package/dist/cjs/plugins/list/styles.js

@@ -9,9 +9,9 @@ exports.listsStyles = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
-var _styledComponents = require("styled-components");
+var _react = require("@emotion/react");
 
 var _templateObject;
 
-var listsStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .ProseMirror li {\n    position: relative;\n\n    > p:not(:first-child) {\n      margin: 4px 0 0 0;\n    }\n  }\n"])));
+var listsStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .ProseMirror li {\n    position: relative;\n\n    > p:not(:first-child) {\n      margin: 4px 0 0 0;\n    }\n  }\n"])));
 exports.listsStyles = listsStyles;