@atlaskit/editor-plugin-block-controls 1.4.18 → 1.4.19

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.
Files changed (10) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/cjs/pm-plugins/main.js +56 -24
  3. package/dist/cjs/ui/mouse-move-wrapper.js +41 -29
  4. package/dist/es2019/pm-plugins/main.js +47 -16
  5. package/dist/es2019/ui/mouse-move-wrapper.js +42 -29
  6. package/dist/esm/pm-plugins/main.js +56 -24
  7. package/dist/esm/ui/mouse-move-wrapper.js +42 -30
  8. package/dist/types/types.d.ts +2 -0
  9. package/dist/types-ts4.5/types.d.ts +2 -0
  10. package/package.json +77 -94
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 1.4.19
4
+
5
+ ### Patch Changes
6
+
7
+ - [#111390](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111390)
8
+ [`bf010fb12e305`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/bf010fb12e305) -
9
+ ED-23630 Call getPos in callbacks to fix node splitting and attach event listener when component
10
+ loads to show wrapper
11
+ - [#111385](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111385)
12
+ [`181c5854ec25f`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/181c5854ec25f) -
13
+ remove sharedstate onchange handler from mousemovewrapper
14
+ - [#111045](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111045)
15
+ [`2f693993423ec`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2f693993423ec) -
16
+ improve input latency of drag and drop experience and hide drag handle during resizing
17
+ - [#111418](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111418)
18
+ [`b351451c2ccb1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b351451c2ccb1) -
19
+ add docsize limit for dnd
20
+ - Updated dependencies
21
+
3
22
  ## 1.4.18
4
23
 
5
24
  ### Patch Changes
package/dist/cjs/pm-plugins/main.js CHANGED
@@ -11,6 +11,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
11
11
  var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
12
12
  var _state = require("@atlaskit/editor-prosemirror/state");
13
13
  var _view = require("@atlaskit/editor-prosemirror/view");
14
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
14
15
  var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
15
16
  var _decorations = require("./decorations");
16
17
  var key = exports.key = new _state.PluginKey('blockControls');
@@ -49,34 +50,63 @@ var destroyFn = function destroyFn(api) {
49
50
  }
50
51
  });
51
52
  };
53
+ var initialState = {
54
+ decorations: _view.DecorationSet.empty,
55
+ decorationState: [],
56
+ activeNode: null,
57
+ isDragging: false,
58
+ isMenuOpen: false,
59
+ start: null,
60
+ end: null,
61
+ editorHeight: 0,
62
+ isResizerResizing: false,
63
+ isDocSizeLimitEnabled: false
64
+ };
65
+ if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.elements.drag-and-drop-doc-size-limit_7k4vq')) {
66
+ initialState.isDocSizeLimitEnabled = true;
67
+ }
68
+ var DRAG_AND_DROP_DOC_SIZE_LIMIT = 20000;
52
69
  var createPlugin = exports.createPlugin = function createPlugin(api) {
53
70
  return new _safePlugin.SafePlugin({
54
71
  key: key,
55
72
  state: {
56
73
  init: function init() {
57
- return {
58
- decorations: _view.DecorationSet.empty,
59
- decorationState: [],
60
- activeNode: null,
61
- isDragging: false,
62
- isMenuOpen: false,
63
- start: null,
64
- end: null,
65
- editorHeight: 0
66
- };
74
+ return initialState;
67
75
  },
68
76
  apply: function apply(tr, currentState, oldState, newState) {
69
- var _decorationState, _meta$activeNode, _meta$isDragging, _meta$editorHeight;
77
+ var _decorationState, _meta$activeNode, _meta$isDragging, _meta$editorHeight, _isResizerResizing;
78
+ if (initialState.isDocSizeLimitEnabled && newState.doc.nodeSize > DRAG_AND_DROP_DOC_SIZE_LIMIT) {
79
+ return initialState;
80
+ }
70
81
  var activeNode = currentState.activeNode,
71
82
  decorations = currentState.decorations,
72
83
  isMenuOpen = currentState.isMenuOpen,
73
84
  decorationState = currentState.decorationState,
74
- editorHeight = currentState.editorHeight;
85
+ editorHeight = currentState.editorHeight,
86
+ isResizerResizing = currentState.isResizerResizing;
75
87
  var meta = tr.getMeta(key);
76
88
 
89
+ // If tables or media are being resized, we want to hide the drag handle
90
+ var resizerMeta = tr.getMeta('is-resizer-resizing');
91
+ isResizerResizing = resizerMeta !== null && resizerMeta !== void 0 ? resizerMeta : isResizerResizing;
92
+ var isEmptyDoc = newState.doc.childCount === 1 && newState.doc.nodeSize <= 4;
93
+
94
+ // This is not targeted enough - it's trying to catch events like expand being set to breakout
95
+ var maybeWidthUpdated = tr.docChanged && oldState.doc.nodeSize === newState.doc.nodeSize && oldState.doc.childCount === newState.doc.childCount;
96
+ var nodeCountChanged = oldState.doc.childCount !== newState.doc.childCount;
97
+
98
+ // During resize, remove the drag handle widget
99
+ if (isResizerResizing || nodeCountChanged) {
100
+ var oldHandle = decorations.find().filter(function (_ref5) {
101
+ var spec = _ref5.spec;
102
+ return spec.id === 'drag-handle';
103
+ });
104
+ decorations = decorations.remove(oldHandle);
105
+ }
106
+
77
107
  // Draw node and mouseWrapper decorations at top level node if decorations is empty, editor height changes or node is moved
78
- var redrawDecorations = decorations === _view.DecorationSet.empty || (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== undefined && (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== editorHeight || tr.docChanged && tr.doc.childCount === newState.doc.childCount || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved) && tr.docChanged;
79
- if (redrawDecorations && api) {
108
+ var redrawDecorations = decorations === _view.DecorationSet.empty || (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== undefined && (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== editorHeight || maybeWidthUpdated || nodeCountChanged || resizerMeta === false || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved) && tr.docChanged;
109
+ if (redrawDecorations && isResizerResizing === false && api) {
80
110
  decorations = _view.DecorationSet.create(newState.doc, []);
81
111
  var nodeDecs = (0, _decorations.nodeDecorations)(newState);
82
112
  var mouseWrapperDecs = (0, _decorations.mouseMoveWrapperDecorations)(newState, api);
@@ -96,11 +126,11 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
96
126
 
97
127
  // Remove previous drag handle widget and draw new drag handle widget when activeNode changes
98
128
  if (meta !== null && meta !== void 0 && meta.activeNode && (meta === null || meta === void 0 ? void 0 : meta.activeNode.pos) !== (activeNode === null || activeNode === void 0 ? void 0 : activeNode.pos) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.anchorName) !== (activeNode === null || activeNode === void 0 ? void 0 : activeNode.anchorName) && api) {
99
- var oldHandle = decorations.find().filter(function (_ref5) {
100
- var spec = _ref5.spec;
129
+ var _oldHandle = decorations.find().filter(function (_ref6) {
130
+ var spec = _ref6.spec;
101
131
  return spec.id === 'drag-handle';
102
132
  });
103
- decorations = decorations.remove(oldHandle);
133
+ decorations = decorations.remove(_oldHandle);
104
134
  var decs = (0, _decorations.dragHandleDecoration)(meta.activeNode.pos, meta.activeNode.anchorName, meta.activeNode.nodeType, api);
105
135
  decorations = decorations.add(newState.doc, [decs]);
106
136
  }
@@ -116,8 +146,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
116
146
 
117
147
  // Remove drop target decoration when dragging stops
118
148
  if ((meta === null || meta === void 0 ? void 0 : meta.isDragging) === false && !tr.docChanged) {
119
- var dropTargetDecs = decorations.find().filter(function (_ref6) {
120
- var spec = _ref6.spec;
149
+ var dropTargetDecs = decorations.find().filter(function (_ref7) {
150
+ var spec = _ref7.spec;
121
151
  return spec.type === 'drop-target-decoration';
122
152
  });
123
153
  decorations = decorations.remove(dropTargetDecs);
@@ -125,9 +155,9 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
125
155
 
126
156
  // Map drop target decoration positions when the document changes
127
157
  if (tr.docChanged && currentState.isDragging) {
128
- decorationState = decorationState.map(function (_ref7) {
129
- var index = _ref7.index,
130
- pos = _ref7.pos;
158
+ decorationState = decorationState.map(function (_ref8) {
159
+ var index = _ref8.index,
160
+ pos = _ref8.pos;
131
161
  return {
132
162
  index: index,
133
163
  pos: tr.mapping.map(pos)
@@ -149,10 +179,12 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
149
179
  return {
150
180
  decorations: decorations,
151
181
  decorationState: (_decorationState = decorationState) !== null && _decorationState !== void 0 ? _decorationState : currentState.decorationState,
152
- activeNode: (_meta$activeNode = meta === null || meta === void 0 ? void 0 : meta.activeNode) !== null && _meta$activeNode !== void 0 ? _meta$activeNode : mappedActiveNodePos,
182
+ activeNode: isEmptyDoc ? null : (_meta$activeNode = meta === null || meta === void 0 ? void 0 : meta.activeNode) !== null && _meta$activeNode !== void 0 ? _meta$activeNode : mappedActiveNodePos,
153
183
  isDragging: (_meta$isDragging = meta === null || meta === void 0 ? void 0 : meta.isDragging) !== null && _meta$isDragging !== void 0 ? _meta$isDragging : currentState.isDragging,
154
184
  isMenuOpen: meta !== null && meta !== void 0 && meta.toggleMenu ? !isMenuOpen : isMenuOpen,
155
- editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : currentState.editorHeight
185
+ editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : currentState.editorHeight,
186
+ isResizerResizing: (_isResizerResizing = isResizerResizing) !== null && _isResizerResizing !== void 0 ? _isResizerResizing : isResizerResizing,
187
+ isDocSizeLimitEnabled: initialState.isDocSizeLimitEnabled
156
188
  };
157
189
  }
158
190
  },
package/dist/cjs/ui/mouse-move-wrapper.js CHANGED
@@ -8,6 +8,7 @@ exports.MouseMoveWrapper = void 0;
8
8
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
9
9
  var _react = require("react");
10
10
  var _react2 = require("@emotion/react");
11
+ var _bindEventListener = require("bind-event-listener");
11
12
  var _hooks = require("@atlaskit/editor-common/hooks");
12
13
  var _dragHandlePositions = require("../utils/drag-handle-positions");
13
14
  /** @jsx jsx */
@@ -23,63 +24,73 @@ var mouseMoveWrapperStyles = (0, _react2.css)({
23
24
  zIndex: 1
24
25
  });
25
26
  var MouseMoveWrapper = exports.MouseMoveWrapper = function MouseMoveWrapper(_ref) {
26
- var _blockControlsState$a;
27
27
  var view = _ref.view,
28
28
  api = _ref.api,
29
29
  anchorName = _ref.anchorName,
30
30
  nodeType = _ref.nodeType,
31
31
  getPos = _ref.getPos;
32
- var nodePos = (0, _react.useMemo)(function () {
33
- return getPos();
34
- }, [getPos]);
35
32
  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['blockControls']),
36
33
  blockControlsState = _useSharedPluginState.blockControlsState;
37
34
  var _useState = (0, _react.useState)(false),
38
35
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
39
36
  isDragging = _useState2[0],
40
37
  setIsDragging = _useState2[1];
41
- var _useState3 = (0, _react.useState)((blockControlsState === null || blockControlsState === void 0 || (_blockControlsState$a = blockControlsState.activeNode) === null || _blockControlsState$a === void 0 ? void 0 : _blockControlsState$a.pos) === nodePos),
38
+ var _useState3 = (0, _react.useState)(false),
42
39
  _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
43
40
  hideWrapper = _useState4[0],
44
41
  setHideWrapper = _useState4[1];
42
+ var ref = (0, _react.useRef)(null);
45
43
  var _useState5 = (0, _react.useState)(),
46
44
  _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
47
45
  pos = _useState6[0],
48
46
  setPos = _useState6[1];
47
+ (0, _react.useEffect)(function () {
48
+ // Adding this event listener to fix issue where wrapper isn't hidden if user navigates to node before page finishes loading
49
+ // This will be removed when we refactor to remove this component
50
+ var unbind;
51
+ if (ref.current) {
52
+ unbind = (0, _bindEventListener.bind)(ref.current, {
53
+ type: 'mousemove',
54
+ listener: function listener() {
55
+ setHideWrapper(true);
56
+ unbind();
57
+ }
58
+ });
59
+ }
60
+ return function () {
61
+ var _unbind;
62
+ return (_unbind = unbind) === null || _unbind === void 0 ? void 0 : _unbind();
63
+ };
64
+ }, []);
49
65
  var onMouseEnter = (0, _react.useCallback)(function () {
50
66
  if (!isDragging) {
51
67
  setHideWrapper(true);
52
68
  }
53
- if (nodePos === undefined) {
69
+ var pos = getPos();
70
+ if (pos === undefined) {
54
71
  return;
55
72
  }
56
73
  if (api && api.blockControls && !isDragging) {
57
74
  var _api$core;
58
- api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api.blockControls.commands.showDragHandleAt(nodePos, anchorName, nodeType));
75
+ api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api.blockControls.commands.showDragHandleAt(pos, anchorName, nodeType));
59
76
  }
60
- }, [setHideWrapper, isDragging, api, nodePos, anchorName, nodeType]);
77
+ }, [setHideWrapper, getPos, isDragging, api, anchorName, nodeType]);
61
78
  (0, _react.useEffect)(function () {
62
- var _api$blockControls;
63
- var unbind = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.onChange(function (_ref2) {
64
- var _nextSharedState$acti;
65
- var nextSharedState = _ref2.nextSharedState;
66
- setIsDragging(Boolean(nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.isDragging));
67
- if (!(nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.activeNode)) {
68
- return;
69
- }
70
- if ((nextSharedState === null || nextSharedState === void 0 || (_nextSharedState$acti = nextSharedState.activeNode) === null || _nextSharedState$acti === void 0 ? void 0 : _nextSharedState$acti.pos) !== nodePos && !(nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.isDragging)) {
71
- setHideWrapper(false);
72
- return;
73
- }
74
- if (nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.isDragging) {
75
- setHideWrapper(true);
76
- return;
77
- }
78
- });
79
- return function () {
80
- unbind === null || unbind === void 0 || unbind();
81
- };
82
- }, [nodePos, api]);
79
+ var _blockControlsState$a;
80
+ setIsDragging(Boolean(blockControlsState === null || blockControlsState === void 0 ? void 0 : blockControlsState.isDragging));
81
+ var pos = getPos();
82
+ if (!(blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.activeNode)) {
83
+ return;
84
+ }
85
+ if ((blockControlsState === null || blockControlsState === void 0 || (_blockControlsState$a = blockControlsState.activeNode) === null || _blockControlsState$a === void 0 ? void 0 : _blockControlsState$a.pos) !== pos && !(blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.isDragging)) {
86
+ setHideWrapper(false);
87
+ return;
88
+ }
89
+ if (blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.isDragging) {
90
+ setHideWrapper(true);
91
+ return;
92
+ }
93
+ }, [getPos, blockControlsState]);
83
94
  (0, _react.useLayoutEffect)(function () {
84
95
  var supportsAnchor = CSS.supports('height', "anchor-size(".concat(anchorName, " height)")) && CSS.supports('top', "anchor(".concat(anchorName, " start)"));
85
96
  if (supportsAnchor) {
@@ -104,6 +115,7 @@ var MouseMoveWrapper = exports.MouseMoveWrapper = function MouseMoveWrapper(_ref
104
115
  };
105
116
  }, [view, anchorName]);
106
117
  return (0, _react2.jsx)("div", {
118
+ ref: ref,
107
119
  onMouseEnter: onMouseEnter,
108
120
  css: [basicStyles, !hideWrapper && mouseMoveWrapperStyles]
109
121
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
package/dist/es2019/pm-plugins/main.js CHANGED
@@ -3,6 +3,7 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit
3
3
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
4
4
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
5
5
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
6
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
6
7
  import { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
7
8
  import { dragHandleDecoration, dropTargetDecorations, mouseMoveWrapperDecorations, nodeDecorations } from './decorations';
8
9
  export const key = new PluginKey('blockControls');
@@ -43,36 +44,64 @@ const destroyFn = api => {
43
44
  }
44
45
  });
45
46
  };
47
+ const initialState = {
48
+ decorations: DecorationSet.empty,
49
+ decorationState: [],
50
+ activeNode: null,
51
+ isDragging: false,
52
+ isMenuOpen: false,
53
+ start: null,
54
+ end: null,
55
+ editorHeight: 0,
56
+ isResizerResizing: false,
57
+ isDocSizeLimitEnabled: false
58
+ };
59
+ if (getBooleanFF('platform.editor.elements.drag-and-drop-doc-size-limit_7k4vq')) {
60
+ initialState.isDocSizeLimitEnabled = true;
61
+ }
62
+ const DRAG_AND_DROP_DOC_SIZE_LIMIT = 20000;
46
63
  export const createPlugin = api => {
47
64
  return new SafePlugin({
48
65
  key,
49
66
  state: {
50
67
  init() {
51
- return {
52
- decorations: DecorationSet.empty,
53
- decorationState: [],
54
- activeNode: null,
55
- isDragging: false,
56
- isMenuOpen: false,
57
- start: null,
58
- end: null,
59
- editorHeight: 0
60
- };
68
+ return initialState;
61
69
  },
62
70
  apply(tr, currentState, oldState, newState) {
63
- var _decorationState, _meta$activeNode, _meta$isDragging, _meta$editorHeight;
71
+ var _decorationState, _meta$activeNode, _meta$isDragging, _meta$editorHeight, _isResizerResizing;
72
+ if (initialState.isDocSizeLimitEnabled && newState.doc.nodeSize > DRAG_AND_DROP_DOC_SIZE_LIMIT) {
73
+ return initialState;
74
+ }
64
75
  let {
65
76
  activeNode,
66
77
  decorations,
67
78
  isMenuOpen,
68
79
  decorationState,
69
- editorHeight
80
+ editorHeight,
81
+ isResizerResizing
70
82
  } = currentState;
71
83
  const meta = tr.getMeta(key);
72
84
 
85
+ // If tables or media are being resized, we want to hide the drag handle
86
+ const resizerMeta = tr.getMeta('is-resizer-resizing');
87
+ isResizerResizing = resizerMeta !== null && resizerMeta !== void 0 ? resizerMeta : isResizerResizing;
88
+ const isEmptyDoc = newState.doc.childCount === 1 && newState.doc.nodeSize <= 4;
89
+
90
+ // This is not targeted enough - it's trying to catch events like expand being set to breakout
91
+ const maybeWidthUpdated = tr.docChanged && oldState.doc.nodeSize === newState.doc.nodeSize && oldState.doc.childCount === newState.doc.childCount;
92
+ const nodeCountChanged = oldState.doc.childCount !== newState.doc.childCount;
93
+
94
+ // During resize, remove the drag handle widget
95
+ if (isResizerResizing || nodeCountChanged) {
96
+ const oldHandle = decorations.find().filter(({
97
+ spec
98
+ }) => spec.id === 'drag-handle');
99
+ decorations = decorations.remove(oldHandle);
100
+ }
101
+
73
102
  // Draw node and mouseWrapper decorations at top level node if decorations is empty, editor height changes or node is moved
74
- const redrawDecorations = decorations === DecorationSet.empty || (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== undefined && (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== editorHeight || tr.docChanged && tr.doc.childCount === newState.doc.childCount || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved) && tr.docChanged;
75
- if (redrawDecorations && api) {
103
+ const redrawDecorations = decorations === DecorationSet.empty || (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== undefined && (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== editorHeight || maybeWidthUpdated || nodeCountChanged || resizerMeta === false || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved) && tr.docChanged;
104
+ if (redrawDecorations && isResizerResizing === false && api) {
76
105
  decorations = DecorationSet.create(newState.doc, []);
77
106
  const nodeDecs = nodeDecorations(newState);
78
107
  const mouseWrapperDecs = mouseMoveWrapperDecorations(newState, api);
@@ -145,10 +174,12 @@ export const createPlugin = api => {
145
174
  return {
146
175
  decorations,
147
176
  decorationState: (_decorationState = decorationState) !== null && _decorationState !== void 0 ? _decorationState : currentState.decorationState,
148
- activeNode: (_meta$activeNode = meta === null || meta === void 0 ? void 0 : meta.activeNode) !== null && _meta$activeNode !== void 0 ? _meta$activeNode : mappedActiveNodePos,
177
+ activeNode: isEmptyDoc ? null : (_meta$activeNode = meta === null || meta === void 0 ? void 0 : meta.activeNode) !== null && _meta$activeNode !== void 0 ? _meta$activeNode : mappedActiveNodePos,
149
178
  isDragging: (_meta$isDragging = meta === null || meta === void 0 ? void 0 : meta.isDragging) !== null && _meta$isDragging !== void 0 ? _meta$isDragging : currentState.isDragging,
150
179
  isMenuOpen: meta !== null && meta !== void 0 && meta.toggleMenu ? !isMenuOpen : isMenuOpen,
151
- editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : currentState.editorHeight
180
+ editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : currentState.editorHeight,
181
+ isResizerResizing: (_isResizerResizing = isResizerResizing) !== null && _isResizerResizing !== void 0 ? _isResizerResizing : isResizerResizing,
182
+ isDocSizeLimitEnabled: initialState.isDocSizeLimitEnabled
152
183
  };
153
184
  }
154
185
  },
package/dist/es2019/ui/mouse-move-wrapper.js CHANGED
@@ -1,6 +1,7 @@
1
1
  /** @jsx jsx */
2
- import { useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react';
2
+ import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
3
3
  import { css, jsx } from '@emotion/react';
4
+ import { bind } from 'bind-event-listener';
4
5
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
5
6
  import { getTopPosition } from '../utils/drag-handle-positions';
6
7
  const basicStyles = css({
@@ -20,49 +21,60 @@ export const MouseMoveWrapper = ({
20
21
  nodeType,
21
22
  getPos
22
23
  }) => {
23
- var _blockControlsState$a;
24
- const nodePos = useMemo(() => getPos(), [getPos]);
25
24
  const {
26
25
  blockControlsState
27
26
  } = useSharedPluginState(api, ['blockControls']);
28
27
  const [isDragging, setIsDragging] = useState(false);
29
- const [hideWrapper, setHideWrapper] = useState((blockControlsState === null || blockControlsState === void 0 ? void 0 : (_blockControlsState$a = blockControlsState.activeNode) === null || _blockControlsState$a === void 0 ? void 0 : _blockControlsState$a.pos) === nodePos);
28
+ const [hideWrapper, setHideWrapper] = useState(false);
29
+ const ref = useRef(null);
30
30
  const [pos, setPos] = useState();
31
+ useEffect(() => {
32
+ // Adding this event listener to fix issue where wrapper isn't hidden if user navigates to node before page finishes loading
33
+ // This will be removed when we refactor to remove this component
34
+ let unbind;
35
+ if (ref.current) {
36
+ unbind = bind(ref.current, {
37
+ type: 'mousemove',
38
+ listener: () => {
39
+ setHideWrapper(true);
40
+ unbind();
41
+ }
42
+ });
43
+ }
44
+ return () => {
45
+ var _unbind;
46
+ return (_unbind = unbind) === null || _unbind === void 0 ? void 0 : _unbind();
47
+ };
48
+ }, []);
31
49
  const onMouseEnter = useCallback(() => {
32
50
  if (!isDragging) {
33
51
  setHideWrapper(true);
34
52
  }
35
- if (nodePos === undefined) {
53
+ const pos = getPos();
54
+ if (pos === undefined) {
36
55
  return;
37
56
  }
38
57
  if (api && api.blockControls && !isDragging) {
39
58
  var _api$core;
40
- api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(api.blockControls.commands.showDragHandleAt(nodePos, anchorName, nodeType));
59
+ api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(api.blockControls.commands.showDragHandleAt(pos, anchorName, nodeType));
41
60
  }
42
- }, [setHideWrapper, isDragging, api, nodePos, anchorName, nodeType]);
61
+ }, [setHideWrapper, getPos, isDragging, api, anchorName, nodeType]);
43
62
  useEffect(() => {
44
- var _api$blockControls;
45
- const unbind = api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.onChange(({
46
- nextSharedState
47
- }) => {
48
- var _nextSharedState$acti;
49
- setIsDragging(Boolean(nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.isDragging));
50
- if (!(nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.activeNode)) {
51
- return;
52
- }
53
- if ((nextSharedState === null || nextSharedState === void 0 ? void 0 : (_nextSharedState$acti = nextSharedState.activeNode) === null || _nextSharedState$acti === void 0 ? void 0 : _nextSharedState$acti.pos) !== nodePos && !(nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.isDragging)) {
54
- setHideWrapper(false);
55
- return;
56
- }
57
- if (nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.isDragging) {
58
- setHideWrapper(true);
59
- return;
60
- }
61
- });
62
- return () => {
63
- unbind === null || unbind === void 0 ? void 0 : unbind();
64
- };
65
- }, [nodePos, api]);
63
+ var _blockControlsState$a;
64
+ setIsDragging(Boolean(blockControlsState === null || blockControlsState === void 0 ? void 0 : blockControlsState.isDragging));
65
+ const pos = getPos();
66
+ if (!(blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.activeNode)) {
67
+ return;
68
+ }
69
+ if ((blockControlsState === null || blockControlsState === void 0 ? void 0 : (_blockControlsState$a = blockControlsState.activeNode) === null || _blockControlsState$a === void 0 ? void 0 : _blockControlsState$a.pos) !== pos && !(blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.isDragging)) {
70
+ setHideWrapper(false);
71
+ return;
72
+ }
73
+ if (blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.isDragging) {
74
+ setHideWrapper(true);
75
+ return;
76
+ }
77
+ }, [getPos, blockControlsState]);
66
78
  useLayoutEffect(() => {
67
79
  const supportsAnchor = CSS.supports('height', `anchor-size(${anchorName} height)`) && CSS.supports('top', `anchor(${anchorName} start)`);
68
80
  if (supportsAnchor) {
@@ -85,6 +97,7 @@ export const MouseMoveWrapper = ({
85
97
  return () => cancelAnimationFrame(calcPos);
86
98
  }, [view, anchorName]);
87
99
  return jsx("div", {
100
+ ref: ref,
88
101
  onMouseEnter: onMouseEnter,
89
102
  css: [basicStyles, !hideWrapper && mouseMoveWrapperStyles]
90
103
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
package/dist/esm/pm-plugins/main.js CHANGED
@@ -4,6 +4,7 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit
4
4
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
5
5
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
6
6
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
7
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
7
8
  import { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
8
9
  import { dragHandleDecoration, dropTargetDecorations, mouseMoveWrapperDecorations, nodeDecorations } from './decorations';
9
10
  export var key = new PluginKey('blockControls');
@@ -42,34 +43,63 @@ var destroyFn = function destroyFn(api) {
42
43
  }
43
44
  });
44
45
  };
46
+ var initialState = {
47
+ decorations: DecorationSet.empty,
48
+ decorationState: [],
49
+ activeNode: null,
50
+ isDragging: false,
51
+ isMenuOpen: false,
52
+ start: null,
53
+ end: null,
54
+ editorHeight: 0,
55
+ isResizerResizing: false,
56
+ isDocSizeLimitEnabled: false
57
+ };
58
+ if (getBooleanFF('platform.editor.elements.drag-and-drop-doc-size-limit_7k4vq')) {
59
+ initialState.isDocSizeLimitEnabled = true;
60
+ }
61
+ var DRAG_AND_DROP_DOC_SIZE_LIMIT = 20000;
45
62
  export var createPlugin = function createPlugin(api) {
46
63
  return new SafePlugin({
47
64
  key: key,
48
65
  state: {
49
66
  init: function init() {
50
- return {
51
- decorations: DecorationSet.empty,
52
- decorationState: [],
53
- activeNode: null,
54
- isDragging: false,
55
- isMenuOpen: false,
56
- start: null,
57
- end: null,
58
- editorHeight: 0
59
- };
67
+ return initialState;
60
68
  },
61
69
  apply: function apply(tr, currentState, oldState, newState) {
62
- var _decorationState, _meta$activeNode, _meta$isDragging, _meta$editorHeight;
70
+ var _decorationState, _meta$activeNode, _meta$isDragging, _meta$editorHeight, _isResizerResizing;
71
+ if (initialState.isDocSizeLimitEnabled && newState.doc.nodeSize > DRAG_AND_DROP_DOC_SIZE_LIMIT) {
72
+ return initialState;
73
+ }
63
74
  var activeNode = currentState.activeNode,
64
75
  decorations = currentState.decorations,
65
76
  isMenuOpen = currentState.isMenuOpen,
66
77
  decorationState = currentState.decorationState,
67
- editorHeight = currentState.editorHeight;
78
+ editorHeight = currentState.editorHeight,
79
+ isResizerResizing = currentState.isResizerResizing;
68
80
  var meta = tr.getMeta(key);
69
81
 
82
+ // If tables or media are being resized, we want to hide the drag handle
83
+ var resizerMeta = tr.getMeta('is-resizer-resizing');
84
+ isResizerResizing = resizerMeta !== null && resizerMeta !== void 0 ? resizerMeta : isResizerResizing;
85
+ var isEmptyDoc = newState.doc.childCount === 1 && newState.doc.nodeSize <= 4;
86
+
87
+ // This is not targeted enough - it's trying to catch events like expand being set to breakout
88
+ var maybeWidthUpdated = tr.docChanged && oldState.doc.nodeSize === newState.doc.nodeSize && oldState.doc.childCount === newState.doc.childCount;
89
+ var nodeCountChanged = oldState.doc.childCount !== newState.doc.childCount;
90
+
91
+ // During resize, remove the drag handle widget
92
+ if (isResizerResizing || nodeCountChanged) {
93
+ var oldHandle = decorations.find().filter(function (_ref5) {
94
+ var spec = _ref5.spec;
95
+ return spec.id === 'drag-handle';
96
+ });
97
+ decorations = decorations.remove(oldHandle);
98
+ }
99
+
70
100
  // Draw node and mouseWrapper decorations at top level node if decorations is empty, editor height changes or node is moved
71
- var redrawDecorations = decorations === DecorationSet.empty || (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== undefined && (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== editorHeight || tr.docChanged && tr.doc.childCount === newState.doc.childCount || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved) && tr.docChanged;
72
- if (redrawDecorations && api) {
101
+ var redrawDecorations = decorations === DecorationSet.empty || (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== undefined && (meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== editorHeight || maybeWidthUpdated || nodeCountChanged || resizerMeta === false || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved) && tr.docChanged;
102
+ if (redrawDecorations && isResizerResizing === false && api) {
73
103
  decorations = DecorationSet.create(newState.doc, []);
74
104
  var nodeDecs = nodeDecorations(newState);
75
105
  var mouseWrapperDecs = mouseMoveWrapperDecorations(newState, api);
@@ -89,11 +119,11 @@ export var createPlugin = function createPlugin(api) {
89
119
 
90
120
  // Remove previous drag handle widget and draw new drag handle widget when activeNode changes
91
121
  if (meta !== null && meta !== void 0 && meta.activeNode && (meta === null || meta === void 0 ? void 0 : meta.activeNode.pos) !== (activeNode === null || activeNode === void 0 ? void 0 : activeNode.pos) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.anchorName) !== (activeNode === null || activeNode === void 0 ? void 0 : activeNode.anchorName) && api) {
92
- var oldHandle = decorations.find().filter(function (_ref5) {
93
- var spec = _ref5.spec;
122
+ var _oldHandle = decorations.find().filter(function (_ref6) {
123
+ var spec = _ref6.spec;
94
124
  return spec.id === 'drag-handle';
95
125
  });
96
- decorations = decorations.remove(oldHandle);
126
+ decorations = decorations.remove(_oldHandle);
97
127
  var decs = dragHandleDecoration(meta.activeNode.pos, meta.activeNode.anchorName, meta.activeNode.nodeType, api);
98
128
  decorations = decorations.add(newState.doc, [decs]);
99
129
  }
@@ -109,8 +139,8 @@ export var createPlugin = function createPlugin(api) {
109
139
 
110
140
  // Remove drop target decoration when dragging stops
111
141
  if ((meta === null || meta === void 0 ? void 0 : meta.isDragging) === false && !tr.docChanged) {
112
- var dropTargetDecs = decorations.find().filter(function (_ref6) {
113
- var spec = _ref6.spec;
142
+ var dropTargetDecs = decorations.find().filter(function (_ref7) {
143
+ var spec = _ref7.spec;
114
144
  return spec.type === 'drop-target-decoration';
115
145
  });
116
146
  decorations = decorations.remove(dropTargetDecs);
@@ -118,9 +148,9 @@ export var createPlugin = function createPlugin(api) {
118
148
 
119
149
  // Map drop target decoration positions when the document changes
120
150
  if (tr.docChanged && currentState.isDragging) {
121
- decorationState = decorationState.map(function (_ref7) {
122
- var index = _ref7.index,
123
- pos = _ref7.pos;
151
+ decorationState = decorationState.map(function (_ref8) {
152
+ var index = _ref8.index,
153
+ pos = _ref8.pos;
124
154
  return {
125
155
  index: index,
126
156
  pos: tr.mapping.map(pos)
@@ -142,10 +172,12 @@ export var createPlugin = function createPlugin(api) {
142
172
  return {
143
173
  decorations: decorations,
144
174
  decorationState: (_decorationState = decorationState) !== null && _decorationState !== void 0 ? _decorationState : currentState.decorationState,
145
- activeNode: (_meta$activeNode = meta === null || meta === void 0 ? void 0 : meta.activeNode) !== null && _meta$activeNode !== void 0 ? _meta$activeNode : mappedActiveNodePos,
175
+ activeNode: isEmptyDoc ? null : (_meta$activeNode = meta === null || meta === void 0 ? void 0 : meta.activeNode) !== null && _meta$activeNode !== void 0 ? _meta$activeNode : mappedActiveNodePos,
146
176
  isDragging: (_meta$isDragging = meta === null || meta === void 0 ? void 0 : meta.isDragging) !== null && _meta$isDragging !== void 0 ? _meta$isDragging : currentState.isDragging,
147
177
  isMenuOpen: meta !== null && meta !== void 0 && meta.toggleMenu ? !isMenuOpen : isMenuOpen,
148
- editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : currentState.editorHeight
178
+ editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : currentState.editorHeight,
179
+ isResizerResizing: (_isResizerResizing = isResizerResizing) !== null && _isResizerResizing !== void 0 ? _isResizerResizing : isResizerResizing,
180
+ isDocSizeLimitEnabled: initialState.isDocSizeLimitEnabled
149
181
  };
150
182
  }
151
183
  },
package/dist/esm/ui/mouse-move-wrapper.js CHANGED
@@ -1,7 +1,8 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  /** @jsx jsx */
3
- import { useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react';
3
+ import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
4
4
  import { css, jsx } from '@emotion/react';
5
+ import { bind } from 'bind-event-listener';
5
6
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
6
7
  import { getTopPosition } from '../utils/drag-handle-positions';
7
8
  var basicStyles = css({
@@ -15,63 +16,73 @@ var mouseMoveWrapperStyles = css({
15
16
  zIndex: 1
16
17
  });
17
18
  export var MouseMoveWrapper = function MouseMoveWrapper(_ref) {
18
- var _blockControlsState$a;
19
19
  var view = _ref.view,
20
20
  api = _ref.api,
21
21
  anchorName = _ref.anchorName,
22
22
  nodeType = _ref.nodeType,
23
23
  getPos = _ref.getPos;
24
- var nodePos = useMemo(function () {
25
- return getPos();
26
- }, [getPos]);
27
24
  var _useSharedPluginState = useSharedPluginState(api, ['blockControls']),
28
25
  blockControlsState = _useSharedPluginState.blockControlsState;
29
26
  var _useState = useState(false),
30
27
  _useState2 = _slicedToArray(_useState, 2),
31
28
  isDragging = _useState2[0],
32
29
  setIsDragging = _useState2[1];
33
- var _useState3 = useState((blockControlsState === null || blockControlsState === void 0 || (_blockControlsState$a = blockControlsState.activeNode) === null || _blockControlsState$a === void 0 ? void 0 : _blockControlsState$a.pos) === nodePos),
30
+ var _useState3 = useState(false),
34
31
  _useState4 = _slicedToArray(_useState3, 2),
35
32
  hideWrapper = _useState4[0],
36
33
  setHideWrapper = _useState4[1];
34
+ var ref = useRef(null);
37
35
  var _useState5 = useState(),
38
36
  _useState6 = _slicedToArray(_useState5, 2),
39
37
  pos = _useState6[0],
40
38
  setPos = _useState6[1];
39
+ useEffect(function () {
40
+ // Adding this event listener to fix issue where wrapper isn't hidden if user navigates to node before page finishes loading
41
+ // This will be removed when we refactor to remove this component
42
+ var unbind;
43
+ if (ref.current) {
44
+ unbind = bind(ref.current, {
45
+ type: 'mousemove',
46
+ listener: function listener() {
47
+ setHideWrapper(true);
48
+ unbind();
49
+ }
50
+ });
51
+ }
52
+ return function () {
53
+ var _unbind;
54
+ return (_unbind = unbind) === null || _unbind === void 0 ? void 0 : _unbind();
55
+ };
56
+ }, []);
41
57
  var onMouseEnter = useCallback(function () {
42
58
  if (!isDragging) {
43
59
  setHideWrapper(true);
44
60
  }
45
- if (nodePos === undefined) {
61
+ var pos = getPos();
62
+ if (pos === undefined) {
46
63
  return;
47
64
  }
48
65
  if (api && api.blockControls && !isDragging) {
49
66
  var _api$core;
50
- api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api.blockControls.commands.showDragHandleAt(nodePos, anchorName, nodeType));
67
+ api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api.blockControls.commands.showDragHandleAt(pos, anchorName, nodeType));
51
68
  }
52
- }, [setHideWrapper, isDragging, api, nodePos, anchorName, nodeType]);
69
+ }, [setHideWrapper, getPos, isDragging, api, anchorName, nodeType]);
53
70
  useEffect(function () {
54
- var _api$blockControls;
55
- var unbind = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.onChange(function (_ref2) {
56
- var _nextSharedState$acti;
57
- var nextSharedState = _ref2.nextSharedState;
58
- setIsDragging(Boolean(nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.isDragging));
59
- if (!(nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.activeNode)) {
60
- return;
61
- }
62
- if ((nextSharedState === null || nextSharedState === void 0 || (_nextSharedState$acti = nextSharedState.activeNode) === null || _nextSharedState$acti === void 0 ? void 0 : _nextSharedState$acti.pos) !== nodePos && !(nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.isDragging)) {
63
- setHideWrapper(false);
64
- return;
65
- }
66
- if (nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.isDragging) {
67
- setHideWrapper(true);
68
- return;
69
- }
70
- });
71
- return function () {
72
- unbind === null || unbind === void 0 || unbind();
73
- };
74
- }, [nodePos, api]);
71
+ var _blockControlsState$a;
72
+ setIsDragging(Boolean(blockControlsState === null || blockControlsState === void 0 ? void 0 : blockControlsState.isDragging));
73
+ var pos = getPos();
74
+ if (!(blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.activeNode)) {
75
+ return;
76
+ }
77
+ if ((blockControlsState === null || blockControlsState === void 0 || (_blockControlsState$a = blockControlsState.activeNode) === null || _blockControlsState$a === void 0 ? void 0 : _blockControlsState$a.pos) !== pos && !(blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.isDragging)) {
78
+ setHideWrapper(false);
79
+ return;
80
+ }
81
+ if (blockControlsState !== null && blockControlsState !== void 0 && blockControlsState.isDragging) {
82
+ setHideWrapper(true);
83
+ return;
84
+ }
85
+ }, [getPos, blockControlsState]);
75
86
  useLayoutEffect(function () {
76
87
  var supportsAnchor = CSS.supports('height', "anchor-size(".concat(anchorName, " height)")) && CSS.supports('top', "anchor(".concat(anchorName, " start)"));
77
88
  if (supportsAnchor) {
@@ -96,6 +107,7 @@ export var MouseMoveWrapper = function MouseMoveWrapper(_ref) {
96
107
  };
97
108
  }, [view, anchorName]);
98
109
  return jsx("div", {
110
+ ref: ref,
99
111
  onMouseEnter: onMouseEnter,
100
112
  css: [basicStyles, !hideWrapper && mouseMoveWrapperStyles]
101
113
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
package/dist/types/types.d.ts CHANGED
@@ -15,6 +15,8 @@ export interface PluginState {
15
15
  anchorName: string;
16
16
  nodeType: string;
17
17
  } | null;
18
+ isResizerResizing: boolean;
19
+ isDocSizeLimitEnabled: boolean;
18
20
  }
19
21
  export type ReleaseHiddenDecoration = () => boolean | undefined;
20
22
  export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
package/dist/types-ts4.5/types.d.ts CHANGED
@@ -15,6 +15,8 @@ export interface PluginState {
15
15
  anchorName: string;
16
16
  nodeType: string;
17
17
  } | null;
18
+ isResizerResizing: boolean;
19
+ isDocSizeLimitEnabled: boolean;
18
20
  }
19
21
  export type ReleaseHiddenDecoration = () => boolean | undefined;
20
22
  export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
package/package.json CHANGED
@@ -1,95 +1,78 @@
1
1
  {
2
- "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "1.4.18",
4
- "description": "Block controls plugin for @atlaskit/editor-core",
5
- "author": "Atlassian Pty Ltd",
6
- "license": "Apache-2.0",
7
- "publishConfig": {
8
- "registry": "https://registry.npmjs.org/"
9
- },
10
- "atlassian": {
11
- "team": "Editor: Jenga",
12
- "inPublicMirror": false,
13
- "releaseModel": "continuous"
14
- },
15
- "repository": "https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo",
16
- "main": "dist/cjs/index.js",
17
- "module": "dist/esm/index.js",
18
- "module:es2019": "dist/es2019/index.js",
19
- "types": "dist/types/index.d.ts",
20
- "typesVersions": {
21
- ">=4.5 <4.9": {
22
- "*": [
23
- "dist/types-ts4.5/*",
24
- "dist/types-ts4.5/index.d.ts"
25
- ]
26
- }
27
- },
28
- "sideEffects": false,
29
- "atlaskit:src": "src/index.ts",
30
- "af:exports": {
31
- ".": "./src/index.ts"
32
- },
33
- "dependencies": {
34
- "@atlaskit/editor-common": "^82.5.0",
35
- "@atlaskit/editor-plugin-analytics": "^1.2.3",
36
- "@atlaskit/editor-plugin-editor-disabled": "^1.1.5",
37
- "@atlaskit/editor-plugin-feature-flags": "^1.1.0",
38
- "@atlaskit/editor-plugin-width": "^1.1.0",
39
- "@atlaskit/editor-prosemirror": "4.0.1",
40
- "@atlaskit/editor-tables": "^2.7.0",
41
- "@atlaskit/icon": "^22.3.0",
42
- "@atlaskit/pragmatic-drag-and-drop": "^1.1.0",
43
- "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^1.3.0",
44
- "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^1.1.0",
45
- "@atlaskit/tokens": "^1.50.0",
46
- "@babel/runtime": "^7.0.0",
47
- "@emotion/react": "^11.7.1",
48
- "raf-schd": "^4.0.3"
49
- },
50
- "peerDependencies": {
51
- "react": "^16.8.0",
52
- "react-dom": "^16.8.0"
53
- },
54
- "techstack": {
55
- "@atlassian/frontend": {
56
- "import-structure": [
57
- "atlassian-conventions"
58
- ],
59
- "circular-dependencies": [
60
- "file-and-folder-level"
61
- ]
62
- },
63
- "@repo/internal": {
64
- "dom-events": "use-bind-event-listener",
65
- "analytics": [
66
- "analytics-next"
67
- ],
68
- "design-tokens": [
69
- "color"
70
- ],
71
- "theming": [
72
- "react-context"
73
- ],
74
- "ui-components": [
75
- "lite-mode"
76
- ],
77
- "deprecation": [
78
- "no-deprecated-imports"
79
- ],
80
- "styling": [
81
- "emotion",
82
- "compiled"
83
- ],
84
- "imports": [
85
- "import-no-extraneous-disable-for-examples-and-docs"
86
- ]
87
- }
88
- },
89
- "platform-feature-flags": {
90
- "platform.editor.media.extended-resize-experience": {
91
- "type": "boolean",
92
- "referenceOnly": true
93
- }
94
- }
95
- }
2
+ "name": "@atlaskit/editor-plugin-block-controls",
3
+ "version": "1.4.19",
4
+ "description": "Block controls plugin for @atlaskit/editor-core",
5
+ "author": "Atlassian Pty Ltd",
6
+ "license": "Apache-2.0",
7
+ "publishConfig": {
8
+ "registry": "https://registry.npmjs.org/"
9
+ },
10
+ "atlassian": {
11
+ "team": "Editor: Jenga",
12
+ "inPublicMirror": false,
13
+ "releaseModel": "continuous"
14
+ },
15
+ "repository": "https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo",
16
+ "main": "dist/cjs/index.js",
17
+ "module": "dist/esm/index.js",
18
+ "module:es2019": "dist/es2019/index.js",
19
+ "types": "dist/types/index.d.ts",
20
+ "typesVersions": {
21
+ ">=4.5 <4.9": {
22
+ "*": ["dist/types-ts4.5/*", "dist/types-ts4.5/index.d.ts"]
23
+ }
24
+ },
25
+ "sideEffects": false,
26
+ "atlaskit:src": "src/index.ts",
27
+ "af:exports": {
28
+ ".": "./src/index.ts"
29
+ },
30
+ "dependencies": {
31
+ "@atlaskit/editor-common": "^82.6.0",
32
+ "@atlaskit/editor-plugin-analytics": "^1.2.3",
33
+ "@atlaskit/editor-plugin-editor-disabled": "^1.1.5",
34
+ "@atlaskit/editor-plugin-feature-flags": "^1.1.0",
35
+ "@atlaskit/editor-plugin-width": "^1.1.0",
36
+ "@atlaskit/editor-prosemirror": "4.0.1",
37
+ "@atlaskit/editor-tables": "^2.7.0",
38
+ "@atlaskit/icon": "^22.3.0",
39
+ "@atlaskit/platform-feature-flags": "^0.2.0",
40
+ "@atlaskit/pragmatic-drag-and-drop": "^1.1.0",
41
+ "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^1.3.0",
42
+ "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^1.1.0",
43
+ "@atlaskit/tokens": "^1.50.0",
44
+ "@babel/runtime": "^7.0.0",
45
+ "@emotion/react": "^11.7.1",
46
+ "bind-event-listener": "^3.0.0",
47
+ "raf-schd": "^4.0.3"
48
+ },
49
+ "peerDependencies": {
50
+ "react": "^16.8.0",
51
+ "react-dom": "^16.8.0"
52
+ },
53
+ "techstack": {
54
+ "@atlassian/frontend": {
55
+ "import-structure": ["atlassian-conventions"],
56
+ "circular-dependencies": ["file-and-folder-level"]
57
+ },
58
+ "@repo/internal": {
59
+ "dom-events": "use-bind-event-listener",
60
+ "analytics": ["analytics-next"],
61
+ "design-tokens": ["color"],
62
+ "theming": ["react-context"],
63
+ "ui-components": ["lite-mode"],
64
+ "deprecation": ["no-deprecated-imports"],
65
+ "styling": ["emotion", "compiled"],
66
+ "imports": ["import-no-extraneous-disable-for-examples-and-docs"]
67
+ }
68
+ },
69
+ "platform-feature-flags": {
70
+ "platform.editor.elements.drag-and-drop-doc-size-limit_7k4vq": {
71
+ "type": "boolean"
72
+ },
73
+ "platform.editor.media.extended-resize-experience": {
74
+ "type": "boolean",
75
+ "referenceOnly": true
76
+ }
77
+ }
78
+ }