@atlaskit/editor-core 187.44.4 → 187.44.6

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-core
 
+## 187.44.6
+
+### Patch Changes
+
+- [`21305ee6254`](https://bitbucket.org/atlassian/atlassian-frontend/commits/21305ee6254) - ED-19874 Align the dropdown with the floating toolbar if there is a single button in the toolbar
+- [`f7f51be4eac`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f7f51be4eac) - [ux] ED-19784: Adjust logic in onCreateSelectionBetween logic to prevent premature selections on multi-line selections inside block nodes.
+- Updated dependencies
+
 ## 187.44.4
 
 ### Patch Changes

package/dist/cjs/plugins/floating-toolbar/ui/Dropdown.js

@@ -28,7 +28,7 @@ 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) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var dropdownExpandContainer = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0px -4px;\n"])));
+var dropdownExpandContainer = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0px ", ";\n"])), "var(--ds-space-negative-050, -4px)");
 var iconGroup = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
 var CompositeIcon = function CompositeIcon(_ref) {
   var icon = _ref.icon;
@@ -121,7 +121,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
         buttonTestId = _this$props2.buttonTestId,
         dropdownWidth = _this$props2.dropdownWidth,
         editorView = _this$props2.editorView,
-        dropdownListId = _this$props2.dropdownListId;
+        dropdownListId = _this$props2.dropdownListId,
+        alignDropdownWithToolbar = _this$props2.alignDropdownWithToolbar;
       var trigger;
       if (icon) {
         var TriggerIcon = hideExpandIcon ? icon : (0, _react2.jsx)(CompositeIcon, {
@@ -175,7 +176,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
         fitHeight: fitHeight + fitTolerance,
         trigger: trigger,
         editorView: editorView,
-        dropdownListId: dropdownListId
+        dropdownListId: dropdownListId,
+        alignDropdownWithParentElement: alignDropdownWithToolbar
       }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
         hide: this.hide,
         dispatchCommand: dispatchCommand

package/dist/cjs/plugins/floating-toolbar/ui/Toolbar.js

@@ -149,7 +149,8 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
           buttonTestId: item.testId,
           editorView: editorView,
           setDisableParentScroll: scrollable ? setDisableScroll : undefined,
-          dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && "".concat(item.id, "-dropdownList")
+          dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && "".concat(item.id, "-dropdownList"),
+          alignDropdownWithToolbar: items.length === 1
         });
       case 'select':
         if (item.selectType === 'list') {

package/dist/cjs/plugins/selection/pm-plugins/events/create-selection-between.js

@@ -5,6 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.onCreateSelectionBetween = void 0;
 var _state = require("@atlaskit/editor-prosemirror/state");
+function isNodeContentEmpty(maybeNode) {
+  return (maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.content.size) === 0 || (maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.textContent) === '';
+}
 function findEmptySelectableParentNodePosition($pos, isValidPosition) {
   var doc = $pos.doc;
   if ($pos.pos + 1 > doc.content.size) {
@@ -42,8 +45,7 @@ var checkPositionNode = function checkPositionNode($pos) {
   if (maybeNode.isAtom) {
     return true;
   }
-  var isParentEmpty = maybeNode.content.size === 0 || maybeNode.textContent === '';
-  return isParentEmpty && _state.NodeSelection.isSelectable(maybeNode);
+  return isNodeContentEmpty(maybeNode) && _state.NodeSelection.isSelectable(maybeNode);
 };
 function findNextSelectionPosition(_ref) {
   var $targetHead = _ref.$targetHead,
@@ -60,7 +62,7 @@ function findNextSelectionPosition(_ref) {
   return null;
 }
 var onCreateSelectionBetween = function onCreateSelectionBetween(view, $anchor, $head) {
-  var _$head$parent;
+  var _$head$parent, _$head$parent2;
   if ($anchor.pos === $head.pos) {
     return null;
   }
@@ -72,6 +74,11 @@ var onCreateSelectionBetween = function onCreateSelectionBetween(view, $anchor,
   if ($head.depth === 1 && ((_$head$parent = $head.parent) === null || _$head$parent === void 0 ? void 0 : _$head$parent.type.name) === 'paragraph') {
     return null;
   }
+
+  // If head is at the beginning of a non-empty textblock, let ProseMirror handle the text selection
+  if ((_$head$parent2 = $head.parent) !== null && _$head$parent2 !== void 0 && _$head$parent2.isTextblock && !isNodeContentEmpty($head.parent) && $head.parentOffset === 0) {
+    return null;
+  }
   var $nextHeadPosition = findNextSelectionPosition({
     $targetHead: $head,
     $anchor: $anchor,

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "187.44.4";
+var version = "187.44.6";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/es2019/plugins/floating-toolbar/ui/Dropdown.js

@@ -8,7 +8,7 @@ import UiDropdown from '../../../ui/Dropdown';
 import { FloatingToolbarButton as Button } from '@atlaskit/editor-common/ui';
 import DropdownMenu, { itemSpacing, menuItemDimensions } from './DropdownMenu';
 const dropdownExpandContainer = css`
-  margin: 0px -4px;
+  margin: 0px ${"var(--ds-space-negative-050, -4px)"};
 `;
 const iconGroup = css`
   display: flex;
@@ -97,7 +97,8 @@ export default class Dropdown extends Component {
       buttonTestId,
       dropdownWidth,
       editorView,
-      dropdownListId
+      dropdownListId,
+      alignDropdownWithToolbar
     } = this.props;
     let trigger;
     if (icon) {
@@ -152,7 +153,8 @@ export default class Dropdown extends Component {
       fitHeight: fitHeight + fitTolerance,
       trigger: trigger,
       editorView: editorView,
-      dropdownListId: dropdownListId
+      dropdownListId: dropdownListId,
+      alignDropdownWithParentElement: alignDropdownWithToolbar
     }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
       hide: this.hide,
       dispatchCommand

package/dist/es2019/plugins/floating-toolbar/ui/Toolbar.js

@@ -116,7 +116,8 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
           buttonTestId: item.testId,
           editorView: editorView,
           setDisableParentScroll: scrollable ? setDisableScroll : undefined,
-          dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && `${item.id}-dropdownList`
+          dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && `${item.id}-dropdownList`,
+          alignDropdownWithToolbar: items.length === 1
         });
       case 'select':
         if (item.selectType === 'list') {

package/dist/es2019/plugins/selection/pm-plugins/events/create-selection-between.js

@@ -1,4 +1,7 @@
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
+function isNodeContentEmpty(maybeNode) {
+  return (maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.content.size) === 0 || (maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.textContent) === '';
+}
 function findEmptySelectableParentNodePosition($pos, isValidPosition) {
   const {
     doc
@@ -38,8 +41,7 @@ const checkPositionNode = $pos => {
   if (maybeNode.isAtom) {
     return true;
   }
-  const isParentEmpty = maybeNode.content.size === 0 || maybeNode.textContent === '';
-  return isParentEmpty && NodeSelection.isSelectable(maybeNode);
+  return isNodeContentEmpty(maybeNode) && NodeSelection.isSelectable(maybeNode);
 };
 function findNextSelectionPosition({
   $targetHead,
@@ -57,7 +59,7 @@ function findNextSelectionPosition({
   return null;
 }
 export const onCreateSelectionBetween = (view, $anchor, $head) => {
-  var _$head$parent;
+  var _$head$parent, _$head$parent2;
   if ($anchor.pos === $head.pos) {
     return null;
   }
@@ -69,6 +71,11 @@ export const onCreateSelectionBetween = (view, $anchor, $head) => {
   if ($head.depth === 1 && ((_$head$parent = $head.parent) === null || _$head$parent === void 0 ? void 0 : _$head$parent.type.name) === 'paragraph') {
     return null;
   }
+
+  // If head is at the beginning of a non-empty textblock, let ProseMirror handle the text selection
+  if ((_$head$parent2 = $head.parent) !== null && _$head$parent2 !== void 0 && _$head$parent2.isTextblock && !isNodeContentEmpty($head.parent) && $head.parentOffset === 0) {
+    return null;
+  }
   const $nextHeadPosition = findNextSelectionPosition({
     $targetHead: $head,
     $anchor,

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "187.44.4";
+export const version = "187.44.6";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/plugins/floating-toolbar/ui/Dropdown.js

@@ -19,7 +19,7 @@ import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
 import UiDropdown from '../../../ui/Dropdown';
 import { FloatingToolbarButton as Button } from '@atlaskit/editor-common/ui';
 import DropdownMenu, { itemSpacing, menuItemDimensions } from './DropdownMenu';
-var dropdownExpandContainer = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin: 0px -4px;\n"])));
+var dropdownExpandContainer = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin: 0px ", ";\n"])), "var(--ds-space-negative-050, -4px)");
 var iconGroup = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n"])));
 var CompositeIcon = function CompositeIcon(_ref) {
   var icon = _ref.icon;
@@ -112,7 +112,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
         buttonTestId = _this$props2.buttonTestId,
         dropdownWidth = _this$props2.dropdownWidth,
         editorView = _this$props2.editorView,
-        dropdownListId = _this$props2.dropdownListId;
+        dropdownListId = _this$props2.dropdownListId,
+        alignDropdownWithToolbar = _this$props2.alignDropdownWithToolbar;
       var trigger;
       if (icon) {
         var TriggerIcon = hideExpandIcon ? icon : jsx(CompositeIcon, {
@@ -166,7 +167,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
         fitHeight: fitHeight + fitTolerance,
         trigger: trigger,
         editorView: editorView,
-        dropdownListId: dropdownListId
+        dropdownListId: dropdownListId,
+        alignDropdownWithParentElement: alignDropdownWithToolbar
       }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
         hide: this.hide,
         dispatchCommand: dispatchCommand

package/dist/esm/plugins/floating-toolbar/ui/Toolbar.js

@@ -139,7 +139,8 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
           buttonTestId: item.testId,
           editorView: editorView,
           setDisableParentScroll: scrollable ? setDisableScroll : undefined,
-          dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && "".concat(item.id, "-dropdownList")
+          dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && "".concat(item.id, "-dropdownList"),
+          alignDropdownWithToolbar: items.length === 1
         });
       case 'select':
         if (item.selectType === 'list') {

package/dist/esm/plugins/selection/pm-plugins/events/create-selection-between.js

@@ -1,4 +1,7 @@
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
+function isNodeContentEmpty(maybeNode) {
+  return (maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.content.size) === 0 || (maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.textContent) === '';
+}
 function findEmptySelectableParentNodePosition($pos, isValidPosition) {
   var doc = $pos.doc;
   if ($pos.pos + 1 > doc.content.size) {
@@ -36,8 +39,7 @@ var checkPositionNode = function checkPositionNode($pos) {
   if (maybeNode.isAtom) {
     return true;
   }
-  var isParentEmpty = maybeNode.content.size === 0 || maybeNode.textContent === '';
-  return isParentEmpty && NodeSelection.isSelectable(maybeNode);
+  return isNodeContentEmpty(maybeNode) && NodeSelection.isSelectable(maybeNode);
 };
 function findNextSelectionPosition(_ref) {
   var $targetHead = _ref.$targetHead,
@@ -54,7 +56,7 @@ function findNextSelectionPosition(_ref) {
   return null;
 }
 export var onCreateSelectionBetween = function onCreateSelectionBetween(view, $anchor, $head) {
-  var _$head$parent;
+  var _$head$parent, _$head$parent2;
   if ($anchor.pos === $head.pos) {
     return null;
   }
@@ -66,6 +68,11 @@ export var onCreateSelectionBetween = function onCreateSelectionBetween(view, $a
   if ($head.depth === 1 && ((_$head$parent = $head.parent) === null || _$head$parent === void 0 ? void 0 : _$head$parent.type.name) === 'paragraph') {
     return null;
   }
+
+  // If head is at the beginning of a non-empty textblock, let ProseMirror handle the text selection
+  if ((_$head$parent2 = $head.parent) !== null && _$head$parent2 !== void 0 && _$head$parent2.isTextblock && !isNodeContentEmpty($head.parent) && $head.parentOffset === 0) {
+    return null;
+  }
   var $nextHeadPosition = findNextSelectionPosition({
     $targetHead: $head,
     $anchor: $anchor,

package/dist/esm/version-wrapper.js

@@ -1,5 +1,5 @@
 export var name = "@atlaskit/editor-core";
-export var version = "187.44.4";
+export var version = "187.44.6";
 export var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/types/plugins/floating-toolbar/ui/Dropdown.d.ts

@@ -21,6 +21,7 @@ export interface Props {
     setDisableParentScroll?: (disable: boolean) => void;
     editorView?: EditorView;
     dropdownListId?: string;
+    alignDropdownWithToolbar?: boolean;
 }
 export interface State {
     isOpen: boolean;

package/dist/types-ts4.5/plugins/floating-toolbar/ui/Dropdown.d.ts

@@ -21,6 +21,7 @@ export interface Props {
     setDisableParentScroll?: (disable: boolean) => void;
     editorView?: EditorView;
     dropdownListId?: string;
+    alignDropdownWithToolbar?: boolean;
 }
 export interface State {
     isOpen: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-core",
-  "version": "187.44.4",
+  "version": "187.44.6",
   "description": "A package contains Atlassian editor core functionality",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -55,7 +55,7 @@
     "@atlaskit/code": "^14.6.0",
     "@atlaskit/date": "^0.10.0",
     "@atlaskit/datetime-picker": "^12.10.0",
-    "@atlaskit/editor-common": "^75.3.0",
+    "@atlaskit/editor-common": "^75.4.0",
     "@atlaskit/editor-json-transformer": "^8.10.0",
     "@atlaskit/editor-markdown-transformer": "^5.2.5",
     "@atlaskit/editor-palette": "1.5.1",