@atlaskit/editor-plugin-block-menu 0.0.5 → 0.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-block-menu
2
2
 
3
+ ## 0.0.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [`353075175e7ff`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/353075175e7ff) -
8
+ [ux] ED-28584 Register move up and down options in block menu
9
+ - Updated dependencies
10
+
3
11
  ## 0.0.5
4
12
 
5
13
  ### Patch Changes
@@ -32,6 +32,9 @@
32
32
  {
33
33
  "path": "../../editor-shared-styles/afm-cc/tsconfig.json"
34
34
  },
35
+ {
36
+ "path": "../../editor-tables/afm-cc/tsconfig.json"
37
+ },
35
38
  {
36
39
  "path": "../../editor-toolbar/afm-cc/tsconfig.json"
37
40
  },
@@ -32,6 +32,9 @@
32
32
  {
33
33
  "path": "../../editor-shared-styles/afm-dev-agents/tsconfig.json"
34
34
  },
35
+ {
36
+ "path": "../../editor-tables/afm-dev-agents/tsconfig.json"
37
+ },
35
38
  {
36
39
  "path": "../../editor-toolbar/afm-dev-agents/tsconfig.json"
37
40
  },
@@ -32,6 +32,9 @@
32
32
  {
33
33
  "path": "../../editor-shared-styles/afm-jira/tsconfig.json"
34
34
  },
35
+ {
36
+ "path": "../../editor-tables/afm-jira/tsconfig.json"
37
+ },
35
38
  {
36
39
  "path": "../../editor-toolbar/afm-jira/tsconfig.json"
37
40
  },
@@ -32,6 +32,9 @@
32
32
  {
33
33
  "path": "../../editor-shared-styles/afm-passionfruit/tsconfig.json"
34
34
  },
35
+ {
36
+ "path": "../../editor-tables/afm-passionfruit/tsconfig.json"
37
+ },
35
38
  {
36
39
  "path": "../../editor-toolbar/afm-passionfruit/tsconfig.json"
37
40
  },
@@ -32,6 +32,9 @@
32
32
  {
33
33
  "path": "../../editor-shared-styles/afm-post-office/tsconfig.json"
34
34
  },
35
+ {
36
+ "path": "../../editor-tables/afm-post-office/tsconfig.json"
37
+ },
35
38
  {
36
39
  "path": "../../editor-toolbar/afm-post-office/tsconfig.json"
37
40
  },
@@ -32,6 +32,9 @@
32
32
  {
33
33
  "path": "../../editor-shared-styles/afm-rovo-extension/tsconfig.json"
34
34
  },
35
+ {
36
+ "path": "../../editor-tables/afm-rovo-extension/tsconfig.json"
37
+ },
35
38
  {
36
39
  "path": "../../editor-toolbar/afm-rovo-extension/tsconfig.json"
37
40
  },
@@ -32,6 +32,9 @@
32
32
  {
33
33
  "path": "../../editor-shared-styles/afm-townsquare/tsconfig.json"
34
34
  },
35
+ {
36
+ "path": "../../editor-tables/afm-townsquare/tsconfig.json"
37
+ },
35
38
  {
36
39
  "path": "../../editor-toolbar/afm-townsquare/tsconfig.json"
37
40
  },
@@ -13,7 +13,7 @@ var _blockMenuComponents = require("./ui/block-menu-components");
13
13
  var blockMenuPlugin = exports.blockMenuPlugin = function blockMenuPlugin(_ref) {
14
14
  var api = _ref.api;
15
15
  var registry = (0, _editorActions.createBlockMenuRegistry)();
16
- registry.register((0, _blockMenuComponents.getBlockMenuComponents)());
16
+ registry.register((0, _blockMenuComponents.getBlockMenuComponents)(api));
17
17
  return {
18
18
  name: 'blockMenu',
19
19
  pmPlugins: function pmPlugins() {
@@ -5,17 +5,51 @@ Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
7
  exports.getBlockMenuComponents = void 0;
8
+ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
8
9
  var _react = _interopRequireDefault(require("react"));
9
10
  var _editorToolbar = require("@atlaskit/editor-toolbar");
10
11
  var _jira = _interopRequireDefault(require("@atlaskit/icon-lab/core/jira"));
11
- var _arrowDown = _interopRequireDefault(require("@atlaskit/icon/core/arrow-down"));
12
- var _arrowUp = _interopRequireDefault(require("@atlaskit/icon/core/arrow-up"));
13
12
  var _changes = _interopRequireDefault(require("@atlaskit/icon/core/changes"));
14
13
  var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/core/chevron-right"));
15
14
  var _delete = _interopRequireDefault(require("@atlaskit/icon/core/delete"));
16
15
  var _listBulleted = _interopRequireDefault(require("@atlaskit/icon/core/list-bulleted"));
17
16
  var _task = _interopRequireDefault(require("@atlaskit/icon/core/task"));
18
- var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockMenuComponents() {
17
+ var _moveDown = require("./move-down");
18
+ var _moveUp = require("./move-up");
19
+ var getMoveUpMoveDownMenuComponents = function getMoveUpMoveDownMenuComponents(api) {
20
+ var _api$blockControls;
21
+ if (!(api !== null && api !== void 0 && (_api$blockControls = api.blockControls) !== null && _api$blockControls !== void 0 && _api$blockControls.commands.moveNode)) {
22
+ return [];
23
+ }
24
+ return [{
25
+ type: 'block-menu-item',
26
+ key: 'block-menu-item-move-up',
27
+ parent: {
28
+ type: 'block-menu-section',
29
+ key: 'block-menu-section-move-up-down',
30
+ rank: 100
31
+ },
32
+ component: function component() {
33
+ return /*#__PURE__*/_react.default.createElement(_moveUp.MoveUpDropdownItem, {
34
+ api: api
35
+ });
36
+ }
37
+ }, {
38
+ type: 'block-menu-item',
39
+ key: 'block-menu-item-move-down',
40
+ parent: {
41
+ type: 'block-menu-section',
42
+ key: 'block-menu-section-move-up-down',
43
+ rank: 200
44
+ },
45
+ component: function component() {
46
+ return /*#__PURE__*/_react.default.createElement(_moveDown.MoveDownDropdownItem, {
47
+ api: api
48
+ });
49
+ }
50
+ }];
51
+ };
52
+ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockMenuComponents(api) {
19
53
  return [{
20
54
  type: 'block-menu-section',
21
55
  key: 'block-menu-section-format',
@@ -86,37 +120,7 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
86
120
  })
87
121
  }, "Create Jira work item");
88
122
  }
89
- }, {
90
- type: 'block-menu-item',
91
- key: 'block-menu-item-move-up',
92
- parent: {
93
- type: 'block-menu-section',
94
- key: 'block-menu-section-move-up-down',
95
- rank: 100
96
- },
97
- component: function component() {
98
- return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
99
- elemBefore: /*#__PURE__*/_react.default.createElement(_arrowUp.default, {
100
- label: ""
101
- })
102
- }, "Move up");
103
- }
104
- }, {
105
- type: 'block-menu-item',
106
- key: 'block-menu-item-move-down',
107
- parent: {
108
- type: 'block-menu-section',
109
- key: 'block-menu-section-move-up-down',
110
- rank: 200
111
- },
112
- component: function component() {
113
- return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
114
- elemBefore: /*#__PURE__*/_react.default.createElement(_arrowDown.default, {
115
- label: ""
116
- })
117
- }, "Move down");
118
- }
119
- }, {
123
+ }].concat((0, _toConsumableArray2.default)(getMoveUpMoveDownMenuComponents(api)), [{
120
124
  type: 'block-menu-item',
121
125
  key: 'block-menu-item-delete',
122
126
  parent: {
@@ -131,5 +135,5 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
131
135
  })
132
136
  }, "Delete");
133
137
  }
134
- }];
138
+ }]);
135
139
  };
@@ -12,6 +12,7 @@ var _react = _interopRequireWildcard(require("react"));
12
12
  var _reactIntlNext = require("react-intl-next");
13
13
  var _css = require("@atlaskit/css");
14
14
  var _hooks = require("@atlaskit/editor-common/hooks");
15
+ var _styles = require("@atlaskit/editor-common/styles");
15
16
  var _ui = require("@atlaskit/editor-common/ui");
16
17
  var _uiReact = require("@atlaskit/editor-common/ui-react");
17
18
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
@@ -22,9 +23,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
22
23
  var styles = {
23
24
  base: "_2rkoglpi _bfhk1bhr _16qs1cd0"
24
25
  };
25
- var DRAG_HANDLE_SELECTOR = '[data-editor-block-ctrl-drag-handle=true]';
26
- var DRAG_HANDLE_WIDTH = 12;
27
- var DRAG_HANDLE_PADDING = 5;
26
+ var DRAG_HANDLE_OFFSET_PADDING = 5;
28
27
  var PopupWithListeners = (0, _uiReact.withReactEditorViewOuterListeners)(_ui.Popup);
29
28
  var BlockMenuContent = function BlockMenuContent(_ref) {
30
29
  var _api$blockMenu;
@@ -75,20 +74,36 @@ var BlockMenu = function BlockMenu(_ref2) {
75
74
  currentUserIntent = _useSharedPluginState.currentUserIntent;
76
75
  var hasFocus = (_editorView$hasFocus = editorView === null || editorView === void 0 ? void 0 : editorView.hasFocus()) !== null && _editorView$hasFocus !== void 0 ? _editorView$hasFocus : false;
77
76
  var hasSelection = !!editorView && !editorView.state.selection.empty;
77
+ (0, _react.useEffect)(function () {
78
+ var _api$userIntent;
79
+ if (!isMenuOpen || !menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
80
+ return;
81
+ }
82
+ api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('blockMenuOpen'));
83
+ }, [api, isMenuOpen, menuTriggerBy, isSelectedViaDragHandle, hasFocus, hasSelection, currentUserIntent]);
78
84
  if (!isMenuOpen) {
79
85
  return null;
80
86
  }
81
87
  var closeMenu = function closeMenu() {
82
- var _api$blockControls;
83
- api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.commands.toggleBlockMenu({
84
- closeMenu: true
85
- }));
88
+ api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
89
+ var _api$blockControls, _api$userIntent2;
90
+ var tr = _ref3.tr;
91
+ api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || _api$blockControls.commands.toggleBlockMenu({
92
+ closeMenu: true
93
+ })({
94
+ tr: tr
95
+ });
96
+ api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 || _api$userIntent2.commands.setCurrentUserIntent(currentUserIntent === 'blockMenuOpen' ? 'default' : currentUserIntent || 'default')({
97
+ tr: tr
98
+ });
99
+ return tr;
100
+ });
86
101
  };
87
- if (!menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || currentUserIntent === 'dragging') {
102
+ if (!menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
88
103
  closeMenu();
89
104
  return null;
90
105
  }
91
- var targetHandleRef = (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
106
+ var targetHandleRef = editorView === null || editorView === void 0 || (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(_styles.DRAG_HANDLE_SELECTOR);
92
107
  if (targetHandleRef instanceof HTMLElement) {
93
108
  return /*#__PURE__*/_react.default.createElement(PopupWithListeners, {
94
109
  alignX: 'left',
@@ -102,7 +117,7 @@ var BlockMenu = function BlockMenu(_ref2) {
102
117
  zIndex: _editorSharedStyles.akEditorFloatingOverlapPanelZIndex,
103
118
  forcePlacement: true,
104
119
  stick: true,
105
- offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_PADDING, 0]
120
+ offset: [_styles.DRAG_HANDLE_WIDTH + DRAG_HANDLE_OFFSET_PADDING, 0]
106
121
  }, /*#__PURE__*/_react.default.createElement(BlockMenuContent, {
107
122
  api: api
108
123
  }));
@@ -0,0 +1,50 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.MoveDownDropdownItem = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _reactIntlNext = require("react-intl-next");
10
+ var _hooks = require("@atlaskit/editor-common/hooks");
11
+ var _messages = require("@atlaskit/editor-common/messages");
12
+ var _types = require("@atlaskit/editor-common/types");
13
+ var _editorToolbar = require("@atlaskit/editor-toolbar");
14
+ var _arrowDown = _interopRequireDefault(require("@atlaskit/icon/core/arrow-down"));
15
+ var MoveDownDropdownItemContent = function MoveDownDropdownItemContent(_ref) {
16
+ var api = _ref.api;
17
+ var _useIntl = (0, _reactIntlNext.useIntl)(),
18
+ formatMessage = _useIntl.formatMessage;
19
+ var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['blockControls'], function (_ref2) {
20
+ var _blockControlsState$b;
21
+ var blockControlsState = _ref2.blockControlsState;
22
+ return {
23
+ canMoveDown: blockControlsState === null || blockControlsState === void 0 || (_blockControlsState$b = blockControlsState.blockMenuOptions) === null || _blockControlsState$b === void 0 ? void 0 : _blockControlsState$b.canMoveDown
24
+ };
25
+ }),
26
+ canMoveDown = _useSharedPluginState.canMoveDown;
27
+ var handleClick = function handleClick() {
28
+ api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
29
+ var _api$blockControls, _api$blockControls2;
30
+ var tr = _ref3.tr;
31
+ api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.commands) === null || _api$blockControls === void 0 || _api$blockControls.moveNodeWithBlockMenu(_types.DIRECTION.DOWN)({
32
+ tr: tr
33
+ });
34
+ api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 || _api$blockControls2.toggleBlockMenu({
35
+ closeMenu: true
36
+ })({
37
+ tr: tr
38
+ });
39
+ return tr;
40
+ });
41
+ };
42
+ return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
43
+ onClick: handleClick,
44
+ elemBefore: /*#__PURE__*/_react.default.createElement(_arrowDown.default, {
45
+ label: ""
46
+ }),
47
+ isDisabled: !canMoveDown
48
+ }, formatMessage(_messages.blockMenuMessages.moveDownBlock));
49
+ };
50
+ var MoveDownDropdownItem = exports.MoveDownDropdownItem = (0, _reactIntlNext.injectIntl)(MoveDownDropdownItemContent);
@@ -0,0 +1,50 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.MoveUpDropdownItem = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _reactIntlNext = require("react-intl-next");
10
+ var _hooks = require("@atlaskit/editor-common/hooks");
11
+ var _messages = require("@atlaskit/editor-common/messages");
12
+ var _types = require("@atlaskit/editor-common/types");
13
+ var _editorToolbar = require("@atlaskit/editor-toolbar");
14
+ var _arrowUp = _interopRequireDefault(require("@atlaskit/icon/core/arrow-up"));
15
+ var MoveUpDropdownItemContent = function MoveUpDropdownItemContent(_ref) {
16
+ var api = _ref.api;
17
+ var _useIntl = (0, _reactIntlNext.useIntl)(),
18
+ formatMessage = _useIntl.formatMessage;
19
+ var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['blockControls'], function (_ref2) {
20
+ var _blockControlsState$b;
21
+ var blockControlsState = _ref2.blockControlsState;
22
+ return {
23
+ canMoveUp: blockControlsState === null || blockControlsState === void 0 || (_blockControlsState$b = blockControlsState.blockMenuOptions) === null || _blockControlsState$b === void 0 ? void 0 : _blockControlsState$b.canMoveUp
24
+ };
25
+ }),
26
+ canMoveUp = _useSharedPluginState.canMoveUp;
27
+ var handleClick = function handleClick() {
28
+ api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
29
+ var _api$blockControls, _api$blockControls2;
30
+ var tr = _ref3.tr;
31
+ api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.commands) === null || _api$blockControls === void 0 || _api$blockControls.moveNodeWithBlockMenu(_types.DIRECTION.UP)({
32
+ tr: tr
33
+ });
34
+ api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 || _api$blockControls2.toggleBlockMenu({
35
+ closeMenu: true
36
+ })({
37
+ tr: tr
38
+ });
39
+ return tr;
40
+ });
41
+ };
42
+ return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
43
+ onClick: handleClick,
44
+ elemBefore: /*#__PURE__*/_react.default.createElement(_arrowUp.default, {
45
+ label: ""
46
+ }),
47
+ isDisabled: !canMoveUp
48
+ }, formatMessage(_messages.blockMenuMessages.moveUpBlock));
49
+ };
50
+ var MoveUpDropdownItem = exports.MoveUpDropdownItem = (0, _reactIntlNext.injectIntl)(MoveUpDropdownItemContent);
@@ -7,7 +7,7 @@ export const blockMenuPlugin = ({
7
7
  api
8
8
  }) => {
9
9
  const registry = createBlockMenuRegistry();
10
- registry.register(getBlockMenuComponents());
10
+ registry.register(getBlockMenuComponents(api));
11
11
  return {
12
12
  name: 'blockMenu',
13
13
  pmPlugins() {
@@ -1,14 +1,43 @@
1
1
  import React from 'react';
2
2
  import { ToolbarDropdownItem, ToolbarDropdownItemSection, ToolbarNestedDropdownMenu } from '@atlaskit/editor-toolbar';
3
3
  import JiraIcon from '@atlaskit/icon-lab/core/jira';
4
- import ArrowDownIcon from '@atlaskit/icon/core/arrow-down';
5
- import ArrowUpIcon from '@atlaskit/icon/core/arrow-up';
6
4
  import ChangesIcon from '@atlaskit/icon/core/changes';
7
5
  import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
8
6
  import DeleteIcon from '@atlaskit/icon/core/delete';
9
7
  import ListBulletedIcon from '@atlaskit/icon/core/list-bulleted';
10
8
  import TaskIcon from '@atlaskit/icon/core/task';
11
- export const getBlockMenuComponents = () => {
9
+ import { MoveDownDropdownItem } from './move-down';
10
+ import { MoveUpDropdownItem } from './move-up';
11
+ const getMoveUpMoveDownMenuComponents = api => {
12
+ var _api$blockControls;
13
+ if (!(api !== null && api !== void 0 && (_api$blockControls = api.blockControls) !== null && _api$blockControls !== void 0 && _api$blockControls.commands.moveNode)) {
14
+ return [];
15
+ }
16
+ return [{
17
+ type: 'block-menu-item',
18
+ key: 'block-menu-item-move-up',
19
+ parent: {
20
+ type: 'block-menu-section',
21
+ key: 'block-menu-section-move-up-down',
22
+ rank: 100
23
+ },
24
+ component: () => /*#__PURE__*/React.createElement(MoveUpDropdownItem, {
25
+ api: api
26
+ })
27
+ }, {
28
+ type: 'block-menu-item',
29
+ key: 'block-menu-item-move-down',
30
+ parent: {
31
+ type: 'block-menu-section',
32
+ key: 'block-menu-section-move-up-down',
33
+ rank: 200
34
+ },
35
+ component: () => /*#__PURE__*/React.createElement(MoveDownDropdownItem, {
36
+ api: api
37
+ })
38
+ }];
39
+ };
40
+ export const getBlockMenuComponents = api => {
12
41
  return [{
13
42
  type: 'block-menu-section',
14
43
  key: 'block-menu-section-format',
@@ -82,37 +111,7 @@ export const getBlockMenuComponents = () => {
82
111
  })
83
112
  }, "Create Jira work item");
84
113
  }
85
- }, {
86
- type: 'block-menu-item',
87
- key: 'block-menu-item-move-up',
88
- parent: {
89
- type: 'block-menu-section',
90
- key: 'block-menu-section-move-up-down',
91
- rank: 100
92
- },
93
- component: () => {
94
- return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
95
- elemBefore: /*#__PURE__*/React.createElement(ArrowUpIcon, {
96
- label: ""
97
- })
98
- }, "Move up");
99
- }
100
- }, {
101
- type: 'block-menu-item',
102
- key: 'block-menu-item-move-down',
103
- parent: {
104
- type: 'block-menu-section',
105
- key: 'block-menu-section-move-up-down',
106
- rank: 200
107
- },
108
- component: () => {
109
- return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
110
- elemBefore: /*#__PURE__*/React.createElement(ArrowDownIcon, {
111
- label: ""
112
- })
113
- }, "Move down");
114
- }
115
- }, {
114
+ }, ...getMoveUpMoveDownMenuComponents(api), {
116
115
  type: 'block-menu-item',
117
116
  key: 'block-menu-item-delete',
118
117
  parent: {
@@ -1,10 +1,11 @@
1
1
  /* block-menu.tsx generated by @compiled/babel-plugin v0.36.1 */
2
2
  import "./block-menu.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
- import React, { useContext } from 'react';
4
+ import React, { useContext, useEffect } from 'react';
5
5
  import { injectIntl } from 'react-intl-next';
6
6
  import { cx } from '@atlaskit/css';
7
7
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
8
+ import { DRAG_HANDLE_SELECTOR, DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
8
9
  import { Popup } from '@atlaskit/editor-common/ui';
9
10
  import { OutsideClickTargetRefContext, withReactEditorViewOuterListeners } from '@atlaskit/editor-common/ui-react';
10
11
  import { akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
@@ -14,9 +15,7 @@ import { BlockMenuRenderer } from './block-menu-renderer';
14
15
  const styles = {
15
16
  base: "_2rkoglpi _bfhk1bhr _16qs1cd0"
16
17
  };
17
- const DRAG_HANDLE_SELECTOR = '[data-editor-block-ctrl-drag-handle=true]';
18
- const DRAG_HANDLE_WIDTH = 12;
19
- const DRAG_HANDLE_PADDING = 5;
18
+ const DRAG_HANDLE_OFFSET_PADDING = 5;
20
19
  const PopupWithListeners = withReactEditorViewOuterListeners(Popup);
21
20
  const BlockMenuContent = ({
22
21
  api
@@ -64,20 +63,37 @@ const BlockMenu = ({
64
63
  });
65
64
  const hasFocus = (_editorView$hasFocus = editorView === null || editorView === void 0 ? void 0 : editorView.hasFocus()) !== null && _editorView$hasFocus !== void 0 ? _editorView$hasFocus : false;
66
65
  const hasSelection = !!editorView && !editorView.state.selection.empty;
66
+ useEffect(() => {
67
+ var _api$userIntent;
68
+ if (!isMenuOpen || !menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
69
+ return;
70
+ }
71
+ api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('blockMenuOpen'));
72
+ }, [api, isMenuOpen, menuTriggerBy, isSelectedViaDragHandle, hasFocus, hasSelection, currentUserIntent]);
67
73
  if (!isMenuOpen) {
68
74
  return null;
69
75
  }
70
76
  const closeMenu = () => {
71
- var _api$blockControls;
72
- api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.commands.toggleBlockMenu({
73
- closeMenu: true
74
- }));
77
+ api === null || api === void 0 ? void 0 : api.core.actions.execute(({
78
+ tr
79
+ }) => {
80
+ var _api$blockControls, _api$userIntent2;
81
+ api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.commands.toggleBlockMenu({
82
+ closeMenu: true
83
+ })({
84
+ tr
85
+ });
86
+ api === null || api === void 0 ? void 0 : (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 ? void 0 : _api$userIntent2.commands.setCurrentUserIntent(currentUserIntent === 'blockMenuOpen' ? 'default' : currentUserIntent || 'default')({
87
+ tr
88
+ });
89
+ return tr;
90
+ });
75
91
  };
76
- if (!menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || currentUserIntent === 'dragging') {
92
+ if (!menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
77
93
  closeMenu();
78
94
  return null;
79
95
  }
80
- const targetHandleRef = (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
96
+ const targetHandleRef = editorView === null || editorView === void 0 ? void 0 : (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
81
97
  if (targetHandleRef instanceof HTMLElement) {
82
98
  return /*#__PURE__*/React.createElement(PopupWithListeners, {
83
99
  alignX: 'left',
@@ -91,7 +107,7 @@ const BlockMenu = ({
91
107
  zIndex: akEditorFloatingOverlapPanelZIndex,
92
108
  forcePlacement: true,
93
109
  stick: true,
94
- offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_PADDING, 0]
110
+ offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_OFFSET_PADDING, 0]
95
111
  }, /*#__PURE__*/React.createElement(BlockMenuContent, {
96
112
  api: api
97
113
  }));
@@ -0,0 +1,48 @@
1
+ import React from 'react';
2
+ import { useIntl, injectIntl } from 'react-intl-next';
3
+ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
4
+ import { blockMenuMessages as messages } from '@atlaskit/editor-common/messages';
5
+ import { DIRECTION } from '@atlaskit/editor-common/types';
6
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
7
+ import ArrowDownIcon from '@atlaskit/icon/core/arrow-down';
8
+ const MoveDownDropdownItemContent = ({
9
+ api
10
+ }) => {
11
+ const {
12
+ formatMessage
13
+ } = useIntl();
14
+ const {
15
+ canMoveDown
16
+ } = useSharedPluginStateWithSelector(api, ['blockControls'], ({
17
+ blockControlsState
18
+ }) => {
19
+ var _blockControlsState$b;
20
+ return {
21
+ canMoveDown: blockControlsState === null || blockControlsState === void 0 ? void 0 : (_blockControlsState$b = blockControlsState.blockMenuOptions) === null || _blockControlsState$b === void 0 ? void 0 : _blockControlsState$b.canMoveDown
22
+ };
23
+ });
24
+ const handleClick = () => {
25
+ api === null || api === void 0 ? void 0 : api.core.actions.execute(({
26
+ tr
27
+ }) => {
28
+ var _api$blockControls, _api$blockControls$co, _api$blockControls2, _api$blockControls2$c;
29
+ api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : (_api$blockControls$co = _api$blockControls.commands) === null || _api$blockControls$co === void 0 ? void 0 : _api$blockControls$co.moveNodeWithBlockMenu(DIRECTION.DOWN)({
30
+ tr
31
+ });
32
+ api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$c = _api$blockControls2.commands) === null || _api$blockControls2$c === void 0 ? void 0 : _api$blockControls2$c.toggleBlockMenu({
33
+ closeMenu: true
34
+ })({
35
+ tr
36
+ });
37
+ return tr;
38
+ });
39
+ };
40
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
41
+ onClick: handleClick,
42
+ elemBefore: /*#__PURE__*/React.createElement(ArrowDownIcon, {
43
+ label: ""
44
+ }),
45
+ isDisabled: !canMoveDown
46
+ }, formatMessage(messages.moveDownBlock));
47
+ };
48
+ export const MoveDownDropdownItem = injectIntl(MoveDownDropdownItemContent);
@@ -0,0 +1,48 @@
1
+ import React from 'react';
2
+ import { useIntl, injectIntl } from 'react-intl-next';
3
+ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
4
+ import { blockMenuMessages as messages } from '@atlaskit/editor-common/messages';
5
+ import { DIRECTION } from '@atlaskit/editor-common/types';
6
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
7
+ import ArrowUpIcon from '@atlaskit/icon/core/arrow-up';
8
+ const MoveUpDropdownItemContent = ({
9
+ api
10
+ }) => {
11
+ const {
12
+ formatMessage
13
+ } = useIntl();
14
+ const {
15
+ canMoveUp
16
+ } = useSharedPluginStateWithSelector(api, ['blockControls'], ({
17
+ blockControlsState
18
+ }) => {
19
+ var _blockControlsState$b;
20
+ return {
21
+ canMoveUp: blockControlsState === null || blockControlsState === void 0 ? void 0 : (_blockControlsState$b = blockControlsState.blockMenuOptions) === null || _blockControlsState$b === void 0 ? void 0 : _blockControlsState$b.canMoveUp
22
+ };
23
+ });
24
+ const handleClick = () => {
25
+ api === null || api === void 0 ? void 0 : api.core.actions.execute(({
26
+ tr
27
+ }) => {
28
+ var _api$blockControls, _api$blockControls$co, _api$blockControls2, _api$blockControls2$c;
29
+ api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : (_api$blockControls$co = _api$blockControls.commands) === null || _api$blockControls$co === void 0 ? void 0 : _api$blockControls$co.moveNodeWithBlockMenu(DIRECTION.UP)({
30
+ tr
31
+ });
32
+ api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$c = _api$blockControls2.commands) === null || _api$blockControls2$c === void 0 ? void 0 : _api$blockControls2$c.toggleBlockMenu({
33
+ closeMenu: true
34
+ })({
35
+ tr
36
+ });
37
+ return tr;
38
+ });
39
+ };
40
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
41
+ onClick: handleClick,
42
+ elemBefore: /*#__PURE__*/React.createElement(ArrowUpIcon, {
43
+ label: ""
44
+ }),
45
+ isDisabled: !canMoveUp
46
+ }, formatMessage(messages.moveUpBlock));
47
+ };
48
+ export const MoveUpDropdownItem = injectIntl(MoveUpDropdownItemContent);
@@ -6,7 +6,7 @@ import { getBlockMenuComponents } from './ui/block-menu-components';
6
6
  export var blockMenuPlugin = function blockMenuPlugin(_ref) {
7
7
  var api = _ref.api;
8
8
  var registry = createBlockMenuRegistry();
9
- registry.register(getBlockMenuComponents());
9
+ registry.register(getBlockMenuComponents(api));
10
10
  return {
11
11
  name: 'blockMenu',
12
12
  pmPlugins: function pmPlugins() {
@@ -1,14 +1,48 @@
1
+ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
1
2
  import React from 'react';
2
3
  import { ToolbarDropdownItem, ToolbarDropdownItemSection, ToolbarNestedDropdownMenu } from '@atlaskit/editor-toolbar';
3
4
  import JiraIcon from '@atlaskit/icon-lab/core/jira';
4
- import ArrowDownIcon from '@atlaskit/icon/core/arrow-down';
5
- import ArrowUpIcon from '@atlaskit/icon/core/arrow-up';
6
5
  import ChangesIcon from '@atlaskit/icon/core/changes';
7
6
  import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
8
7
  import DeleteIcon from '@atlaskit/icon/core/delete';
9
8
  import ListBulletedIcon from '@atlaskit/icon/core/list-bulleted';
10
9
  import TaskIcon from '@atlaskit/icon/core/task';
11
- export var getBlockMenuComponents = function getBlockMenuComponents() {
10
+ import { MoveDownDropdownItem } from './move-down';
11
+ import { MoveUpDropdownItem } from './move-up';
12
+ var getMoveUpMoveDownMenuComponents = function getMoveUpMoveDownMenuComponents(api) {
13
+ var _api$blockControls;
14
+ if (!(api !== null && api !== void 0 && (_api$blockControls = api.blockControls) !== null && _api$blockControls !== void 0 && _api$blockControls.commands.moveNode)) {
15
+ return [];
16
+ }
17
+ return [{
18
+ type: 'block-menu-item',
19
+ key: 'block-menu-item-move-up',
20
+ parent: {
21
+ type: 'block-menu-section',
22
+ key: 'block-menu-section-move-up-down',
23
+ rank: 100
24
+ },
25
+ component: function component() {
26
+ return /*#__PURE__*/React.createElement(MoveUpDropdownItem, {
27
+ api: api
28
+ });
29
+ }
30
+ }, {
31
+ type: 'block-menu-item',
32
+ key: 'block-menu-item-move-down',
33
+ parent: {
34
+ type: 'block-menu-section',
35
+ key: 'block-menu-section-move-up-down',
36
+ rank: 200
37
+ },
38
+ component: function component() {
39
+ return /*#__PURE__*/React.createElement(MoveDownDropdownItem, {
40
+ api: api
41
+ });
42
+ }
43
+ }];
44
+ };
45
+ export var getBlockMenuComponents = function getBlockMenuComponents(api) {
12
46
  return [{
13
47
  type: 'block-menu-section',
14
48
  key: 'block-menu-section-format',
@@ -79,37 +113,7 @@ export var getBlockMenuComponents = function getBlockMenuComponents() {
79
113
  })
80
114
  }, "Create Jira work item");
81
115
  }
82
- }, {
83
- type: 'block-menu-item',
84
- key: 'block-menu-item-move-up',
85
- parent: {
86
- type: 'block-menu-section',
87
- key: 'block-menu-section-move-up-down',
88
- rank: 100
89
- },
90
- component: function component() {
91
- return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
92
- elemBefore: /*#__PURE__*/React.createElement(ArrowUpIcon, {
93
- label: ""
94
- })
95
- }, "Move up");
96
- }
97
- }, {
98
- type: 'block-menu-item',
99
- key: 'block-menu-item-move-down',
100
- parent: {
101
- type: 'block-menu-section',
102
- key: 'block-menu-section-move-up-down',
103
- rank: 200
104
- },
105
- component: function component() {
106
- return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
107
- elemBefore: /*#__PURE__*/React.createElement(ArrowDownIcon, {
108
- label: ""
109
- })
110
- }, "Move down");
111
- }
112
- }, {
116
+ }].concat(_toConsumableArray(getMoveUpMoveDownMenuComponents(api)), [{
113
117
  type: 'block-menu-item',
114
118
  key: 'block-menu-item-delete',
115
119
  parent: {
@@ -124,5 +128,5 @@ export var getBlockMenuComponents = function getBlockMenuComponents() {
124
128
  })
125
129
  }, "Delete");
126
130
  }
127
- }];
131
+ }]);
128
132
  };
@@ -1,10 +1,11 @@
1
1
  /* block-menu.tsx generated by @compiled/babel-plugin v0.36.1 */
2
2
  import "./block-menu.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
- import React, { useContext } from 'react';
4
+ import React, { useContext, useEffect } from 'react';
5
5
  import { injectIntl } from 'react-intl-next';
6
6
  import { cx } from '@atlaskit/css';
7
7
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
8
+ import { DRAG_HANDLE_SELECTOR, DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
8
9
  import { Popup } from '@atlaskit/editor-common/ui';
9
10
  import { OutsideClickTargetRefContext, withReactEditorViewOuterListeners } from '@atlaskit/editor-common/ui-react';
10
11
  import { akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
@@ -14,9 +15,7 @@ import { BlockMenuRenderer } from './block-menu-renderer';
14
15
  var styles = {
15
16
  base: "_2rkoglpi _bfhk1bhr _16qs1cd0"
16
17
  };
17
- var DRAG_HANDLE_SELECTOR = '[data-editor-block-ctrl-drag-handle=true]';
18
- var DRAG_HANDLE_WIDTH = 12;
19
- var DRAG_HANDLE_PADDING = 5;
18
+ var DRAG_HANDLE_OFFSET_PADDING = 5;
20
19
  var PopupWithListeners = withReactEditorViewOuterListeners(Popup);
21
20
  var BlockMenuContent = function BlockMenuContent(_ref) {
22
21
  var _api$blockMenu;
@@ -67,20 +66,36 @@ var BlockMenu = function BlockMenu(_ref2) {
67
66
  currentUserIntent = _useSharedPluginState.currentUserIntent;
68
67
  var hasFocus = (_editorView$hasFocus = editorView === null || editorView === void 0 ? void 0 : editorView.hasFocus()) !== null && _editorView$hasFocus !== void 0 ? _editorView$hasFocus : false;
69
68
  var hasSelection = !!editorView && !editorView.state.selection.empty;
69
+ useEffect(function () {
70
+ var _api$userIntent;
71
+ if (!isMenuOpen || !menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
72
+ return;
73
+ }
74
+ api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('blockMenuOpen'));
75
+ }, [api, isMenuOpen, menuTriggerBy, isSelectedViaDragHandle, hasFocus, hasSelection, currentUserIntent]);
70
76
  if (!isMenuOpen) {
71
77
  return null;
72
78
  }
73
79
  var closeMenu = function closeMenu() {
74
- var _api$blockControls;
75
- api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.commands.toggleBlockMenu({
76
- closeMenu: true
77
- }));
80
+ api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
81
+ var _api$blockControls, _api$userIntent2;
82
+ var tr = _ref3.tr;
83
+ api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || _api$blockControls.commands.toggleBlockMenu({
84
+ closeMenu: true
85
+ })({
86
+ tr: tr
87
+ });
88
+ api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 || _api$userIntent2.commands.setCurrentUserIntent(currentUserIntent === 'blockMenuOpen' ? 'default' : currentUserIntent || 'default')({
89
+ tr: tr
90
+ });
91
+ return tr;
92
+ });
78
93
  };
79
- if (!menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || currentUserIntent === 'dragging') {
94
+ if (!menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
80
95
  closeMenu();
81
96
  return null;
82
97
  }
83
- var targetHandleRef = (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
98
+ var targetHandleRef = editorView === null || editorView === void 0 || (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
84
99
  if (targetHandleRef instanceof HTMLElement) {
85
100
  return /*#__PURE__*/React.createElement(PopupWithListeners, {
86
101
  alignX: 'left',
@@ -94,7 +109,7 @@ var BlockMenu = function BlockMenu(_ref2) {
94
109
  zIndex: akEditorFloatingOverlapPanelZIndex,
95
110
  forcePlacement: true,
96
111
  stick: true,
97
- offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_PADDING, 0]
112
+ offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_OFFSET_PADDING, 0]
98
113
  }, /*#__PURE__*/React.createElement(BlockMenuContent, {
99
114
  api: api
100
115
  }));
@@ -0,0 +1,43 @@
1
+ import React from 'react';
2
+ import { useIntl, injectIntl } from 'react-intl-next';
3
+ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
4
+ import { blockMenuMessages as messages } from '@atlaskit/editor-common/messages';
5
+ import { DIRECTION } from '@atlaskit/editor-common/types';
6
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
7
+ import ArrowDownIcon from '@atlaskit/icon/core/arrow-down';
8
+ var MoveDownDropdownItemContent = function MoveDownDropdownItemContent(_ref) {
9
+ var api = _ref.api;
10
+ var _useIntl = useIntl(),
11
+ formatMessage = _useIntl.formatMessage;
12
+ var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['blockControls'], function (_ref2) {
13
+ var _blockControlsState$b;
14
+ var blockControlsState = _ref2.blockControlsState;
15
+ return {
16
+ canMoveDown: blockControlsState === null || blockControlsState === void 0 || (_blockControlsState$b = blockControlsState.blockMenuOptions) === null || _blockControlsState$b === void 0 ? void 0 : _blockControlsState$b.canMoveDown
17
+ };
18
+ }),
19
+ canMoveDown = _useSharedPluginState.canMoveDown;
20
+ var handleClick = function handleClick() {
21
+ api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
22
+ var _api$blockControls, _api$blockControls2;
23
+ var tr = _ref3.tr;
24
+ api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.commands) === null || _api$blockControls === void 0 || _api$blockControls.moveNodeWithBlockMenu(DIRECTION.DOWN)({
25
+ tr: tr
26
+ });
27
+ api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 || _api$blockControls2.toggleBlockMenu({
28
+ closeMenu: true
29
+ })({
30
+ tr: tr
31
+ });
32
+ return tr;
33
+ });
34
+ };
35
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
36
+ onClick: handleClick,
37
+ elemBefore: /*#__PURE__*/React.createElement(ArrowDownIcon, {
38
+ label: ""
39
+ }),
40
+ isDisabled: !canMoveDown
41
+ }, formatMessage(messages.moveDownBlock));
42
+ };
43
+ export var MoveDownDropdownItem = injectIntl(MoveDownDropdownItemContent);
@@ -0,0 +1,43 @@
1
+ import React from 'react';
2
+ import { useIntl, injectIntl } from 'react-intl-next';
3
+ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
4
+ import { blockMenuMessages as messages } from '@atlaskit/editor-common/messages';
5
+ import { DIRECTION } from '@atlaskit/editor-common/types';
6
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
7
+ import ArrowUpIcon from '@atlaskit/icon/core/arrow-up';
8
+ var MoveUpDropdownItemContent = function MoveUpDropdownItemContent(_ref) {
9
+ var api = _ref.api;
10
+ var _useIntl = useIntl(),
11
+ formatMessage = _useIntl.formatMessage;
12
+ var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['blockControls'], function (_ref2) {
13
+ var _blockControlsState$b;
14
+ var blockControlsState = _ref2.blockControlsState;
15
+ return {
16
+ canMoveUp: blockControlsState === null || blockControlsState === void 0 || (_blockControlsState$b = blockControlsState.blockMenuOptions) === null || _blockControlsState$b === void 0 ? void 0 : _blockControlsState$b.canMoveUp
17
+ };
18
+ }),
19
+ canMoveUp = _useSharedPluginState.canMoveUp;
20
+ var handleClick = function handleClick() {
21
+ api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
22
+ var _api$blockControls, _api$blockControls2;
23
+ var tr = _ref3.tr;
24
+ api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.commands) === null || _api$blockControls === void 0 || _api$blockControls.moveNodeWithBlockMenu(DIRECTION.UP)({
25
+ tr: tr
26
+ });
27
+ api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 || _api$blockControls2.toggleBlockMenu({
28
+ closeMenu: true
29
+ })({
30
+ tr: tr
31
+ });
32
+ return tr;
33
+ });
34
+ };
35
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
36
+ onClick: handleClick,
37
+ elemBefore: /*#__PURE__*/React.createElement(ArrowUpIcon, {
38
+ label: ""
39
+ }),
40
+ isDisabled: !canMoveUp
41
+ }, formatMessage(messages.moveUpBlock));
42
+ };
43
+ export var MoveUpDropdownItem = injectIntl(MoveUpDropdownItemContent);
@@ -1,2 +1,4 @@
1
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
2
+ import type { BlockMenuPlugin } from '../blockMenuPluginType';
1
3
  import { type RegisterBlockMenuComponent } from '../blockMenuPluginType';
2
- export declare const getBlockMenuComponents: () => RegisterBlockMenuComponent[];
4
+ export declare const getBlockMenuComponents: (api: ExtractInjectionAPI<BlockMenuPlugin> | undefined) => RegisterBlockMenuComponent[];
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import type { WrappedComponentProps } from 'react-intl-next';
3
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
+ import type { BlockMenuPlugin } from '../blockMenuPluginType';
5
+ type Props = {
6
+ api: ExtractInjectionAPI<BlockMenuPlugin>;
7
+ };
8
+ export declare const MoveDownDropdownItem: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
9
+ WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
10
+ };
11
+ export {};
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import type { WrappedComponentProps } from 'react-intl-next';
3
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
+ import type { BlockMenuPlugin } from '../blockMenuPluginType';
5
+ type Props = {
6
+ api: ExtractInjectionAPI<BlockMenuPlugin>;
7
+ };
8
+ export declare const MoveUpDropdownItem: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
9
+ WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
10
+ };
11
+ export {};
@@ -1,2 +1,4 @@
1
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
2
+ import type { BlockMenuPlugin } from '../blockMenuPluginType';
1
3
  import { type RegisterBlockMenuComponent } from '../blockMenuPluginType';
2
- export declare const getBlockMenuComponents: () => RegisterBlockMenuComponent[];
4
+ export declare const getBlockMenuComponents: (api: ExtractInjectionAPI<BlockMenuPlugin> | undefined) => RegisterBlockMenuComponent[];
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import type { WrappedComponentProps } from 'react-intl-next';
3
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
+ import type { BlockMenuPlugin } from '../blockMenuPluginType';
5
+ type Props = {
6
+ api: ExtractInjectionAPI<BlockMenuPlugin>;
7
+ };
8
+ export declare const MoveDownDropdownItem: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
9
+ WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
10
+ };
11
+ export {};
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import type { WrappedComponentProps } from 'react-intl-next';
3
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
4
+ import type { BlockMenuPlugin } from '../blockMenuPluginType';
5
+ type Props = {
6
+ api: ExtractInjectionAPI<BlockMenuPlugin>;
7
+ };
8
+ export declare const MoveUpDropdownItem: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
9
+ WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
10
+ };
11
+ export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-menu",
3
- "version": "0.0.5",
3
+ "version": "0.0.6",
4
4
  "description": "BlockMenu plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -33,10 +33,11 @@
33
33
  "dependencies": {
34
34
  "@atlaskit/css": "^0.12.0",
35
35
  "@atlaskit/dropdown-menu": "^16.3.0",
36
- "@atlaskit/editor-plugin-block-controls": "^4.1.0",
36
+ "@atlaskit/editor-plugin-block-controls": "^4.2.0",
37
37
  "@atlaskit/editor-plugin-user-intent": "^1.1.0",
38
38
  "@atlaskit/editor-prosemirror": "7.0.0",
39
39
  "@atlaskit/editor-shared-styles": "^3.6.0",
40
+ "@atlaskit/editor-tables": "^2.9.0",
40
41
  "@atlaskit/editor-toolbar": "^0.3.0",
41
42
  "@atlaskit/icon": "^27.12.0",
42
43
  "@atlaskit/icon-lab": "^5.6.0",
@@ -45,7 +46,7 @@
45
46
  "@babel/runtime": "^7.0.0"
46
47
  },
47
48
  "peerDependencies": {
48
- "@atlaskit/editor-common": "^107.24.0",
49
+ "@atlaskit/editor-common": "^107.26.0",
49
50
  "react": "^18.2.0",
50
51
  "react-intl-next": "npm:react-intl@^5.18.1"
51
52
  },