@atlaskit/editor-plugin-block-controls 1.13.1 → 1.13.3

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 (8) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/dist/cjs/pm-plugins/empty-block-experiment.js +5 -0
  3. package/dist/cjs/ui/drop-target.js +5 -3
  4. package/dist/es2019/pm-plugins/empty-block-experiment.js +5 -0
  5. package/dist/es2019/ui/drop-target.js +6 -3
  6. package/dist/esm/pm-plugins/empty-block-experiment.js +5 -0
  7. package/dist/esm/ui/drop-target.js +5 -3
  8. package/package.json +6 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,26 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 1.13.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [#138270](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/138270)
8
+ [`4911de090a806`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4911de090a806) -
9
+ [ux] [ED-24880] Fixed bug which allowed empty block experiment insert button to appear when editor
10
+ is disabled
11
+ - [#138118](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/138118)
12
+ [`5e4d9eb1aefe4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5e4d9eb1aefe4) -
13
+ NOISSUE: Upgrades editor React peer dependencies to v18
14
+ - Updated dependencies
15
+
16
+ ## 1.13.2
17
+
18
+ ### Patch Changes
19
+
20
+ - [#136674](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/136674)
21
+ [`1f8459f560d36`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1f8459f560d36) -
22
+ [ux] Bump z-index of drop targets
23
+
3
24
  ## 1.13.1
4
25
 
5
26
  ### Patch Changes
package/dist/cjs/pm-plugins/empty-block-experiment.js CHANGED
@@ -10,6 +10,11 @@ var _view = require("@atlaskit/editor-prosemirror/view");
10
10
  var _widget = require("../ui/empty-block-experiment/widget");
11
11
  var emptyBlockExperimentPluginKey = exports.emptyBlockExperimentPluginKey = new _state.PluginKey('emptyBlockExperiment');
12
12
  var getDecorations = function getDecorations(tr, api, getIntl) {
13
+ var _api$editorDisabled;
14
+ var isEditorDisabled = api === null || api === void 0 || (_api$editorDisabled = api.editorDisabled) === null || _api$editorDisabled === void 0 || (_api$editorDisabled = _api$editorDisabled.sharedState.currentState()) === null || _api$editorDisabled === void 0 ? void 0 : _api$editorDisabled.editorDisabled;
15
+ if (isEditorDisabled) {
16
+ return _view.DecorationSet.empty;
17
+ }
13
18
  var widget = (0, _widget.createEmptyBlockWidgetDecoration)(tr.selection, api, getIntl);
14
19
  if (widget) {
15
20
  return _view.DecorationSet.create(tr.doc, [widget]);
package/dist/cjs/ui/drop-target.js CHANGED
@@ -13,6 +13,7 @@ var _hooks = require("@atlaskit/editor-common/hooks");
13
13
  var _box = require("@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box");
14
14
  var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
15
15
  var _constants = require("@atlaskit/theme/constants");
16
+ var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
16
17
  var _dragTargetDebug = require("../utils/drag-target-debug");
17
18
  var _consts = require("./consts");
18
19
  /**
@@ -24,7 +25,8 @@ var _consts = require("./consts");
24
25
 
25
26
  var DEFAULT_DROP_INDICATOR_WIDTH = 760;
26
27
  var EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH = '--editor-block-controls-drop-indicator-width';
27
- var EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN = '--editor-block-controls-drop-indicator-leftMargin';
28
+ var EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN = '--editor-block-controls-drop-target-leftMargin';
29
+ var EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX = '--editor-block-controls-drop-target-zindex';
28
30
  var styleDropTarget = (0, _react2.css)({
29
31
  height: "var(--ds-space-100, 8px)",
30
32
  marginTop: "var(--ds-space-negative-100, -8px)",
@@ -33,7 +35,7 @@ var styleDropTarget = (0, _react2.css)({
33
35
  position: 'absolute',
34
36
  left: '0',
35
37
  display: 'block',
36
- zIndex: _constants.layers.card()
38
+ zIndex: "var(".concat(EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, ", 110)")
37
39
  });
38
40
  var styleDropIndicator = (0, _react2.css)({
39
41
  height: '100%',
@@ -141,7 +143,7 @@ var DropTarget = exports.DropTarget = function DropTarget(_ref3) {
141
143
  }, [prevNode, nextNode, parentNode]);
142
144
  var dynamicStyle = (_dynamicStyle = {
143
145
  width: isNestedDropTarget ? 'unset' : '100%'
144
- }, (0, _defineProperty2.default)(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat((widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || DEFAULT_DROP_INDICATOR_WIDTH, "px")), (0, _defineProperty2.default)(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? (0, _consts.getNestedNodeLeftPaddingMargin)(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), _dynamicStyle);
146
+ }, (0, _defineProperty2.default)(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat((widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || DEFAULT_DROP_INDICATOR_WIDTH, "px")), (0, _defineProperty2.default)(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? (0, _consts.getNestedNodeLeftPaddingMargin)(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), (0, _defineProperty2.default)(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, (0, _experiments.editorExperiment)('nested-dnd', true) ? _constants.layers.navigation() : _constants.layers.card()), _dynamicStyle);
145
147
  return (
146
148
  // Note: Firefox has trouble with using a button element as the handle for drag and drop
147
149
  (0, _react2.jsx)("div", {
package/dist/es2019/pm-plugins/empty-block-experiment.js CHANGED
@@ -4,6 +4,11 @@ import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
4
4
  import { createEmptyBlockWidgetDecoration } from '../ui/empty-block-experiment/widget';
5
5
  export const emptyBlockExperimentPluginKey = new PluginKey('emptyBlockExperiment');
6
6
  const getDecorations = (tr, api, getIntl) => {
7
+ var _api$editorDisabled, _api$editorDisabled$s;
8
+ const isEditorDisabled = api === null || api === void 0 ? void 0 : (_api$editorDisabled = api.editorDisabled) === null || _api$editorDisabled === void 0 ? void 0 : (_api$editorDisabled$s = _api$editorDisabled.sharedState.currentState()) === null || _api$editorDisabled$s === void 0 ? void 0 : _api$editorDisabled$s.editorDisabled;
9
+ if (isEditorDisabled) {
10
+ return DecorationSet.empty;
11
+ }
7
12
  const widget = createEmptyBlockWidgetDecoration(tr.selection, api, getIntl);
8
13
  if (widget) {
9
14
  return DecorationSet.create(tr.doc, [widget]);
package/dist/es2019/ui/drop-target.js CHANGED
@@ -10,11 +10,13 @@ import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
10
10
  import { DropIndicator } from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';
11
11
  import { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
12
12
  import { layers } from '@atlaskit/theme/constants';
13
+ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
13
14
  import { isBlocksDragTargetDebug } from '../utils/drag-target-debug';
14
15
  import { getNestedNodeLeftPaddingMargin, nodeMargins, spaceLookupMap } from './consts';
15
16
  const DEFAULT_DROP_INDICATOR_WIDTH = 760;
16
17
  const EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH = '--editor-block-controls-drop-indicator-width';
17
- const EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN = '--editor-block-controls-drop-indicator-leftMargin';
18
+ const EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN = '--editor-block-controls-drop-target-leftMargin';
19
+ const EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX = '--editor-block-controls-drop-target-zindex';
18
20
  const styleDropTarget = css({
19
21
  height: "var(--ds-space-100, 8px)",
20
22
  marginTop: "var(--ds-space-negative-100, -8px)",
@@ -23,7 +25,7 @@ const styleDropTarget = css({
23
25
  position: 'absolute',
24
26
  left: '0',
25
27
  display: 'block',
26
- zIndex: layers.card()
28
+ zIndex: `var(${EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX}, 110)`
27
29
  });
28
30
  const styleDropIndicator = css({
29
31
  height: '100%',
@@ -125,7 +127,8 @@ export const DropTarget = ({
125
127
  const dynamicStyle = {
126
128
  width: isNestedDropTarget ? 'unset' : '100%',
127
129
  [EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH]: isNestedDropTarget ? '100%' : `${(widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || DEFAULT_DROP_INDICATOR_WIDTH}px`,
128
- [EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN]: isNestedDropTarget ? getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'
130
+ [EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN]: isNestedDropTarget ? getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0',
131
+ [EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX]: editorExperiment('nested-dnd', true) ? layers.navigation() : layers.card()
129
132
  };
130
133
  return (
131
134
  // Note: Firefox has trouble with using a button element as the handle for drag and drop
package/dist/esm/pm-plugins/empty-block-experiment.js CHANGED
@@ -4,6 +4,11 @@ import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
4
4
  import { createEmptyBlockWidgetDecoration } from '../ui/empty-block-experiment/widget';
5
5
  export var emptyBlockExperimentPluginKey = new PluginKey('emptyBlockExperiment');
6
6
  var getDecorations = function getDecorations(tr, api, getIntl) {
7
+ var _api$editorDisabled;
8
+ var isEditorDisabled = api === null || api === void 0 || (_api$editorDisabled = api.editorDisabled) === null || _api$editorDisabled === void 0 || (_api$editorDisabled = _api$editorDisabled.sharedState.currentState()) === null || _api$editorDisabled === void 0 ? void 0 : _api$editorDisabled.editorDisabled;
9
+ if (isEditorDisabled) {
10
+ return DecorationSet.empty;
11
+ }
7
12
  var widget = createEmptyBlockWidgetDecoration(tr.selection, api, getIntl);
8
13
  if (widget) {
9
14
  return DecorationSet.create(tr.doc, [widget]);
package/dist/esm/ui/drop-target.js CHANGED
@@ -12,11 +12,13 @@ import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
12
12
  import { DropIndicator } from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';
13
13
  import { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
14
14
  import { layers } from '@atlaskit/theme/constants';
15
+ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
15
16
  import { isBlocksDragTargetDebug } from '../utils/drag-target-debug';
16
17
  import { getNestedNodeLeftPaddingMargin, nodeMargins, spaceLookupMap } from './consts';
17
18
  var DEFAULT_DROP_INDICATOR_WIDTH = 760;
18
19
  var EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH = '--editor-block-controls-drop-indicator-width';
19
- var EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN = '--editor-block-controls-drop-indicator-leftMargin';
20
+ var EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN = '--editor-block-controls-drop-target-leftMargin';
21
+ var EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX = '--editor-block-controls-drop-target-zindex';
20
22
  var styleDropTarget = css({
21
23
  height: "var(--ds-space-100, 8px)",
22
24
  marginTop: "var(--ds-space-negative-100, -8px)",
@@ -25,7 +27,7 @@ var styleDropTarget = css({
25
27
  position: 'absolute',
26
28
  left: '0',
27
29
  display: 'block',
28
- zIndex: layers.card()
30
+ zIndex: "var(".concat(EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, ", 110)")
29
31
  });
30
32
  var styleDropIndicator = css({
31
33
  height: '100%',
@@ -133,7 +135,7 @@ export var DropTarget = function DropTarget(_ref3) {
133
135
  }, [prevNode, nextNode, parentNode]);
134
136
  var dynamicStyle = (_dynamicStyle = {
135
137
  width: isNestedDropTarget ? 'unset' : '100%'
136
- }, _defineProperty(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat((widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || DEFAULT_DROP_INDICATOR_WIDTH, "px")), _defineProperty(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), _dynamicStyle);
138
+ }, _defineProperty(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat((widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || DEFAULT_DROP_INDICATOR_WIDTH, "px")), _defineProperty(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), _defineProperty(_dynamicStyle, EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, editorExperiment('nested-dnd', true) ? layers.navigation() : layers.card()), _dynamicStyle);
137
139
  return (
138
140
  // Note: Firefox has trouble with using a button element as the handle for drag and drop
139
141
  jsx("div", {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "1.13.1",
3
+ "version": "1.13.3",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -8,7 +8,8 @@
8
8
  "registry": "https://registry.npmjs.org/"
9
9
  },
10
10
  "atlassian": {
11
- "team": "Editor: Jenga"
11
+ "team": "Editor: Jenga",
12
+ "runReact18": true
12
13
  },
13
14
  "repository": "https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo",
14
15
  "main": "dist/cjs/index.js",
@@ -29,7 +30,7 @@
29
30
  ".": "./src/index.ts"
30
31
  },
31
32
  "dependencies": {
32
- "@atlaskit/editor-common": "^88.11.0",
33
+ "@atlaskit/editor-common": "^88.12.0",
33
34
  "@atlaskit/editor-plugin-accessibility-utils": "^1.2.0",
34
35
  "@atlaskit/editor-plugin-analytics": "^1.8.0",
35
36
  "@atlaskit/editor-plugin-editor-disabled": "^1.3.0",
@@ -57,8 +58,8 @@
57
58
  "uuid": "^3.1.0"
58
59
  },
59
60
  "peerDependencies": {
60
- "react": "^16.8.0",
61
- "react-dom": "^16.8.0",
61
+ "react": "^16.8.0 || ^17.0.0 || ~18.2.0",
62
+ "react-dom": "^16.8.0 || ^17.0.0 || ~18.2.0",
62
63
  "react-intl-next": "npm:react-intl@^5.18.1"
63
64
  },
64
65
  "techstack": {