@atlaskit/editor-plugin-block-controls 9.0.17 → 9.0.18

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 (5) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/ui/global-styles.js +15 -9
  3. package/dist/es2019/ui/global-styles.js +21 -15
  4. package/dist/esm/ui/global-styles.js +15 -9
  5. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 9.0.18
4
+
5
+ ### Patch Changes
6
+
7
+ - [`bd008993d07cd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/bd008993d07cd) -
8
+ Reuse the same selectors for determinig hover locations and location to draw drag handle
9
+ - Updated dependencies
10
+
3
11
  ## 9.0.17
4
12
 
5
13
  ### Patch Changes
package/dist/cjs/ui/global-styles.js CHANGED
@@ -32,6 +32,12 @@ var dragHandlerAnchorSelector = '[data-drag-handler-anchor-name]:not([data-drag-
32
32
  * Disregards anchors that can not have handles next to them, and so shouldn't have an extended hover zone
33
33
  */
34
34
  var dragHandlerAnchorSelectorNext = "[".concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "]:not([data-prosemirror-node-name=\"tableRow\"], [data-prosemirror-node-name=\"tableCell\"], [data-prosemirror-node-name=\"tableHeader\"], [data-prosemirror-node-name=\"media\"], [data-prosemirror-node-inline=\"true\"])");
35
+
36
+ /**
37
+ * Extended version that also excludes descendants of taskList.
38
+ * preventing the ::after hover zone from blocking checkbox inputs in blockTaskItem nodes.
39
+ */
40
+ var dragHandlerAnchorSelectorWithTaskExclusion = "[".concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "]:not([data-prosemirror-node-name=\"tableRow\"], [data-prosemirror-node-name=\"tableCell\"], [data-prosemirror-node-name=\"tableHeader\"], [data-prosemirror-node-name=\"media\"], [data-prosemirror-node-inline=\"true\"], [data-prosemirror-node-name=\"taskList\"] [").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "])");
35
41
  var gutterPaddingWidth = function gutterPaddingWidth() {
36
42
  return (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? "".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px") : '100%';
37
43
  };
@@ -96,10 +102,10 @@ var extendedHoverZone = function extendedHoverZone() {
96
102
  }));
97
103
  };
98
104
  var extendedHoverZoneNext = function extendedHoverZoneNext() {
99
- return (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".block-ctrl-drag-preview ".concat(dragHandlerAnchorSelectorNext, "::after"), {
105
+ return (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".block-ctrl-drag-preview ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "::after"), {
100
106
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
101
107
  display: 'none !important'
102
- }), '.ProseMirror', (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "&& ".concat(dragHandlerAnchorSelectorNext, "::after"), {
108
+ }), '.ProseMirror', (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "&& ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "::after"), {
103
109
  content: '""',
104
110
  position: 'absolute',
105
111
  top: 0,
@@ -110,7 +116,7 @@ var extendedHoverZoneNext = function extendedHoverZoneNext() {
110
116
  height: '100%',
111
117
  cursor: 'default',
112
118
  zIndex: 1
113
- }), "&& ".concat(dragHandlerAnchorSelectorNext, ":not([").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "] [").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "])::after"), {
119
+ }), "&& ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, ":not([").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "] [").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "])::after"), {
114
120
  content: '""',
115
121
  position: 'absolute',
116
122
  top: 0,
@@ -122,7 +128,7 @@ var extendedHoverZoneNext = function extendedHoverZoneNext() {
122
128
  cursor: 'default',
123
129
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
124
130
  zIndex: -1
125
- }), "&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > ".concat(dragHandlerAnchorSelectorNext, "::after"), {
131
+ }), "&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "::after"), {
126
132
  content: '""',
127
133
  position: 'absolute',
128
134
  top: 0,
@@ -133,13 +139,13 @@ var extendedHoverZoneNext = function extendedHoverZoneNext() {
133
139
  zIndex: 1
134
140
  })), 'hr[data-drag-handler-anchor-name]', {
135
141
  overflow: 'visible'
136
- }), "[data-blocks-drag-handle-container=\"true\"] + ".concat(dragHandlerAnchorSelectorNext, ":not([").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "] [").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "])::after"), {
142
+ }), "[data-blocks-drag-handle-container=\"true\"] + ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, ":not([").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "] [").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "])::after"), {
137
143
  display: 'none'
138
144
  }));
139
145
  };
140
146
  var layoutColumnExtendedHoverZone = (0, _react.css)({
141
147
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
142
- '.ProseMirror': (0, _defineProperty2.default)({}, "&&& ".concat(dragHandlerAnchorSelectorNext, "[data-layout-column]::after"), {
148
+ '.ProseMirror': (0, _defineProperty2.default)({}, "&&& ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "[data-layout-column]::after"), {
143
149
  content: '""',
144
150
  position: 'absolute',
145
151
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
@@ -154,7 +160,7 @@ var layoutColumnExtendedHoverZone = (0, _react.css)({
154
160
  });
155
161
  var layoutColumnWithoutHoverZone = (0, _react.css)({
156
162
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
157
- '.ProseMirror': (0, _defineProperty2.default)({}, "&&& ".concat(dragHandlerAnchorSelectorNext, "[data-layout-column]::after"), {
163
+ '.ProseMirror': (0, _defineProperty2.default)({}, "&&& ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "[data-layout-column]::after"), {
158
164
  display: 'none'
159
165
  })
160
166
  });
@@ -169,7 +175,7 @@ var extendHoverZoneReduced = (0, _react.css)({
169
175
  });
170
176
  var extendHoverZoneReducedNext = (0, _react.css)({
171
177
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
172
- '.ProseMirror': (0, _defineProperty2.default)({}, "> ".concat(dragHandlerAnchorSelectorNext, "::after"), (0, _defineProperty2.default)({}, "@container editor-area (max-width: ".concat(_editorSharedStyles.akEditorFullPageNarrowBreakout, "px)"), {
178
+ '.ProseMirror': (0, _defineProperty2.default)({}, "> ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "::after"), (0, _defineProperty2.default)({}, "@container editor-area (max-width: ".concat(_editorSharedStyles.akEditorFullPageNarrowBreakout, "px)"), {
173
179
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
174
180
  left: "-".concat(_editorSharedStyles.akEditorGutterPaddingReduced, "px"),
175
181
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
@@ -185,7 +191,7 @@ var extendedDragZone = (0, _react.css)({
185
191
  });
186
192
  var extendedDragZoneNext = (0, _react.css)({
187
193
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
188
- '.ProseMirror': (0, _defineProperty2.default)({}, "&& ".concat(dragHandlerAnchorSelectorNext, ":not([").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "] [").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "])::after"), {
194
+ '.ProseMirror': (0, _defineProperty2.default)({}, "&& ".concat((0, _expValEquals.expValEquals)('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, ":not([").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "] [").concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "])::after"), {
189
195
  width: 'var(--ak-editor-max-container-width)',
190
196
  left: "calc((100% - var(--ak-editor-max-container-width))/2)"
191
197
  })
package/dist/es2019/ui/global-styles.js CHANGED
@@ -24,6 +24,12 @@ const dragHandlerAnchorSelector = '[data-drag-handler-anchor-name]:not([data-dra
24
24
  * Disregards anchors that can not have handles next to them, and so shouldn't have an extended hover zone
25
25
  */
26
26
  const dragHandlerAnchorSelectorNext = `[${NODE_ANCHOR_ATTR_NAME}]:not([data-prosemirror-node-name="tableRow"], [data-prosemirror-node-name="tableCell"], [data-prosemirror-node-name="tableHeader"], [data-prosemirror-node-name="media"], [data-prosemirror-node-inline="true"])`;
27
+
28
+ /**
29
+ * Extended version that also excludes descendants of taskList.
30
+ * preventing the ::after hover zone from blocking checkbox inputs in blockTaskItem nodes.
31
+ */
32
+ const dragHandlerAnchorSelectorWithTaskExclusion = `[${NODE_ANCHOR_ATTR_NAME}]:not([data-prosemirror-node-name="tableRow"], [data-prosemirror-node-name="tableCell"], [data-prosemirror-node-name="tableHeader"], [data-prosemirror-node-name="media"], [data-prosemirror-node-inline="true"], [data-prosemirror-node-name="taskList"] [${NODE_ANCHOR_ATTR_NAME}])`;
27
33
  const gutterPaddingWidth = () => editorExperiment('platform_editor_controls', 'variant1') ? `${akEditorGutterPaddingDynamic()}px` : '100%';
28
34
  const gutterPaddingLeft = () => editorExperiment('platform_editor_controls', 'variant1') ? `-${akEditorGutterPaddingDynamic()}px` : '-100px';
29
35
  const extendedHoverZone = () => css({
@@ -103,15 +109,15 @@ const extendedHoverZone = () => css({
103
109
  }
104
110
  });
105
111
  const extendedHoverZoneNext = () => css({
106
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
107
- [`.block-ctrl-drag-preview ${dragHandlerAnchorSelectorNext}::after`]: {
112
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
113
+ [`.block-ctrl-drag-preview ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}::after`]: {
108
114
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
109
115
  display: 'none !important'
110
116
  },
111
117
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
112
118
  '.ProseMirror': {
113
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
114
- [`&& ${dragHandlerAnchorSelectorNext}::after`]: {
119
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
120
+ [`&& ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}::after`]: {
115
121
  content: '""',
116
122
  position: 'absolute',
117
123
  top: 0,
@@ -126,7 +132,7 @@ const extendedHoverZoneNext = () => css({
126
132
  // Top level depth hover zone should extend to gutter padding area
127
133
  // we select the top level by using NOT nested anchor selector
128
134
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
129
- [`&& ${dragHandlerAnchorSelectorNext}:not([${NODE_ANCHOR_ATTR_NAME}] [${NODE_ANCHOR_ATTR_NAME}])::after`]: {
135
+ [`&& ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}:not([${NODE_ANCHOR_ATTR_NAME}] [${NODE_ANCHOR_ATTR_NAME}])::after`]: {
130
136
  content: '""',
131
137
  position: 'absolute',
132
138
  top: 0,
@@ -139,8 +145,8 @@ const extendedHoverZoneNext = () => css({
139
145
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
140
146
  zIndex: -1
141
147
  },
142
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
143
- [`&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > ${dragHandlerAnchorSelectorNext}::after`]: {
148
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
149
+ [`&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}::after`]: {
144
150
  content: '""',
145
151
  position: 'absolute',
146
152
  top: 0,
@@ -158,7 +164,7 @@ const extendedHoverZoneNext = () => css({
158
164
  },
159
165
  //Hide pseudo element at top depth level. Leave for nested depths to prevent mouseover loop.
160
166
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
161
- [`[data-blocks-drag-handle-container="true"] + ${dragHandlerAnchorSelectorNext}:not([${NODE_ANCHOR_ATTR_NAME}] [${NODE_ANCHOR_ATTR_NAME}])::after`]: {
167
+ [`[data-blocks-drag-handle-container="true"] + ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}:not([${NODE_ANCHOR_ATTR_NAME}] [${NODE_ANCHOR_ATTR_NAME}])::after`]: {
162
168
  display: 'none'
163
169
  }
164
170
  });
@@ -166,8 +172,8 @@ const layoutColumnExtendedHoverZone = css({
166
172
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
167
173
  '.ProseMirror': {
168
174
  // hover zone for layout column should be placed near the top of the column (where drag handle is)
169
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
170
- [`&&& ${dragHandlerAnchorSelectorNext}[data-layout-column]::after`]: {
175
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
176
+ [`&&& ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}[data-layout-column]::after`]: {
171
177
  content: '""',
172
178
  position: 'absolute',
173
179
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
@@ -185,8 +191,8 @@ const layoutColumnWithoutHoverZone = css({
185
191
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
186
192
  '.ProseMirror': {
187
193
  // when advanced_layouts is off, layout columns should not have hover zones, because there aren't any drag handles for layout columns
188
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
189
- [`&&& ${dragHandlerAnchorSelectorNext}[data-layout-column]::after`]: {
194
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
195
+ [`&&& ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}[data-layout-column]::after`]: {
190
196
  display: 'none'
191
197
  }
192
198
  }
@@ -209,8 +215,8 @@ const extendHoverZoneReduced = css({
209
215
  const extendHoverZoneReducedNext = css({
210
216
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
211
217
  '.ProseMirror': {
212
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
213
- [`> ${dragHandlerAnchorSelectorNext}::after`]: {
218
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
219
+ [`> ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}::after`]: {
214
220
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-container-queries, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
215
221
  [`@container editor-area (max-width: ${akEditorFullPageNarrowBreakout}px)`]: {
216
222
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
@@ -235,7 +241,7 @@ const extendedDragZoneNext = css({
235
241
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
236
242
  '.ProseMirror': {
237
243
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
238
- [`&& ${dragHandlerAnchorSelectorNext}:not([${NODE_ANCHOR_ATTR_NAME}] [${NODE_ANCHOR_ATTR_NAME}])::after`]: {
244
+ [`&& ${expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext}:not([${NODE_ANCHOR_ATTR_NAME}] [${NODE_ANCHOR_ATTR_NAME}])::after`]: {
239
245
  width: 'var(--ak-editor-max-container-width)',
240
246
  left: `calc((100% - var(--ak-editor-max-container-width))/2)`
241
247
  }
package/dist/esm/ui/global-styles.js CHANGED
@@ -25,6 +25,12 @@ var dragHandlerAnchorSelector = '[data-drag-handler-anchor-name]:not([data-drag-
25
25
  * Disregards anchors that can not have handles next to them, and so shouldn't have an extended hover zone
26
26
  */
27
27
  var dragHandlerAnchorSelectorNext = "[".concat(NODE_ANCHOR_ATTR_NAME, "]:not([data-prosemirror-node-name=\"tableRow\"], [data-prosemirror-node-name=\"tableCell\"], [data-prosemirror-node-name=\"tableHeader\"], [data-prosemirror-node-name=\"media\"], [data-prosemirror-node-inline=\"true\"])");
28
+
29
+ /**
30
+ * Extended version that also excludes descendants of taskList.
31
+ * preventing the ::after hover zone from blocking checkbox inputs in blockTaskItem nodes.
32
+ */
33
+ var dragHandlerAnchorSelectorWithTaskExclusion = "[".concat(NODE_ANCHOR_ATTR_NAME, "]:not([data-prosemirror-node-name=\"tableRow\"], [data-prosemirror-node-name=\"tableCell\"], [data-prosemirror-node-name=\"tableHeader\"], [data-prosemirror-node-name=\"media\"], [data-prosemirror-node-inline=\"true\"], [data-prosemirror-node-name=\"taskList\"] [").concat(NODE_ANCHOR_ATTR_NAME, "])");
28
34
  var gutterPaddingWidth = function gutterPaddingWidth() {
29
35
  return editorExperiment('platform_editor_controls', 'variant1') ? "".concat(akEditorGutterPaddingDynamic(), "px") : '100%';
30
36
  };
@@ -89,10 +95,10 @@ var extendedHoverZone = function extendedHoverZone() {
89
95
  }));
90
96
  };
91
97
  var extendedHoverZoneNext = function extendedHoverZoneNext() {
92
- return css(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ".block-ctrl-drag-preview ".concat(dragHandlerAnchorSelectorNext, "::after"), {
98
+ return css(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ".block-ctrl-drag-preview ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "::after"), {
93
99
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
94
100
  display: 'none !important'
95
- }), '.ProseMirror', _defineProperty(_defineProperty(_defineProperty({}, "&& ".concat(dragHandlerAnchorSelectorNext, "::after"), {
101
+ }), '.ProseMirror', _defineProperty(_defineProperty(_defineProperty({}, "&& ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "::after"), {
96
102
  content: '""',
97
103
  position: 'absolute',
98
104
  top: 0,
@@ -103,7 +109,7 @@ var extendedHoverZoneNext = function extendedHoverZoneNext() {
103
109
  height: '100%',
104
110
  cursor: 'default',
105
111
  zIndex: 1
106
- }), "&& ".concat(dragHandlerAnchorSelectorNext, ":not([").concat(NODE_ANCHOR_ATTR_NAME, "] [").concat(NODE_ANCHOR_ATTR_NAME, "])::after"), {
112
+ }), "&& ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, ":not([").concat(NODE_ANCHOR_ATTR_NAME, "] [").concat(NODE_ANCHOR_ATTR_NAME, "])::after"), {
107
113
  content: '""',
108
114
  position: 'absolute',
109
115
  top: 0,
@@ -115,7 +121,7 @@ var extendedHoverZoneNext = function extendedHoverZoneNext() {
115
121
  cursor: 'default',
116
122
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
117
123
  zIndex: -1
118
- }), "&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > ".concat(dragHandlerAnchorSelectorNext, "::after"), {
124
+ }), "&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "::after"), {
119
125
  content: '""',
120
126
  position: 'absolute',
121
127
  top: 0,
@@ -126,13 +132,13 @@ var extendedHoverZoneNext = function extendedHoverZoneNext() {
126
132
  zIndex: 1
127
133
  })), 'hr[data-drag-handler-anchor-name]', {
128
134
  overflow: 'visible'
129
- }), "[data-blocks-drag-handle-container=\"true\"] + ".concat(dragHandlerAnchorSelectorNext, ":not([").concat(NODE_ANCHOR_ATTR_NAME, "] [").concat(NODE_ANCHOR_ATTR_NAME, "])::after"), {
135
+ }), "[data-blocks-drag-handle-container=\"true\"] + ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, ":not([").concat(NODE_ANCHOR_ATTR_NAME, "] [").concat(NODE_ANCHOR_ATTR_NAME, "])::after"), {
130
136
  display: 'none'
131
137
  }));
132
138
  };
133
139
  var layoutColumnExtendedHoverZone = css({
134
140
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
135
- '.ProseMirror': _defineProperty({}, "&&& ".concat(dragHandlerAnchorSelectorNext, "[data-layout-column]::after"), {
141
+ '.ProseMirror': _defineProperty({}, "&&& ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "[data-layout-column]::after"), {
136
142
  content: '""',
137
143
  position: 'absolute',
138
144
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
@@ -147,7 +153,7 @@ var layoutColumnExtendedHoverZone = css({
147
153
  });
148
154
  var layoutColumnWithoutHoverZone = css({
149
155
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
150
- '.ProseMirror': _defineProperty({}, "&&& ".concat(dragHandlerAnchorSelectorNext, "[data-layout-column]::after"), {
156
+ '.ProseMirror': _defineProperty({}, "&&& ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "[data-layout-column]::after"), {
151
157
  display: 'none'
152
158
  })
153
159
  });
@@ -162,7 +168,7 @@ var extendHoverZoneReduced = css({
162
168
  });
163
169
  var extendHoverZoneReducedNext = css({
164
170
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
165
- '.ProseMirror': _defineProperty({}, "> ".concat(dragHandlerAnchorSelectorNext, "::after"), _defineProperty({}, "@container editor-area (max-width: ".concat(akEditorFullPageNarrowBreakout, "px)"), {
171
+ '.ProseMirror': _defineProperty({}, "> ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, "::after"), _defineProperty({}, "@container editor-area (max-width: ".concat(akEditorFullPageNarrowBreakout, "px)"), {
166
172
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
167
173
  left: "-".concat(akEditorGutterPaddingReduced, "px"),
168
174
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
@@ -178,7 +184,7 @@ var extendedDragZone = css({
178
184
  });
179
185
  var extendedDragZoneNext = css({
180
186
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
181
- '.ProseMirror': _defineProperty({}, "&& ".concat(dragHandlerAnchorSelectorNext, ":not([").concat(NODE_ANCHOR_ATTR_NAME, "] [").concat(NODE_ANCHOR_ATTR_NAME, "])::after"), {
187
+ '.ProseMirror': _defineProperty({}, "&& ".concat(expValEquals('platform_editor_unify_native_dnd_selectors', 'isEnabled', true) ? dragHandlerAnchorSelectorWithTaskExclusion : dragHandlerAnchorSelectorNext, ":not([").concat(NODE_ANCHOR_ATTR_NAME, "] [").concat(NODE_ANCHOR_ATTR_NAME, "])::after"), {
182
188
  width: 'var(--ak-editor-max-container-width)',
183
189
  left: "calc((100% - var(--ak-editor-max-container-width))/2)"
184
190
  })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "9.0.17",
3
+ "version": "9.0.18",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -56,7 +56,7 @@
56
56
  "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
57
57
  "@atlaskit/primitives": "^18.0.0",
58
58
  "@atlaskit/theme": "^22.0.0",
59
- "@atlaskit/tmp-editor-statsig": "^44.0.0",
59
+ "@atlaskit/tmp-editor-statsig": "^44.2.0",
60
60
  "@atlaskit/tokens": "^11.1.0",
61
61
  "@atlaskit/tooltip": "^21.0.0",
62
62
  "@babel/runtime": "^7.0.0",
@@ -67,7 +67,7 @@
67
67
  "uuid": "^3.1.0"
68
68
  },
69
69
  "peerDependencies": {
70
- "@atlaskit/editor-common": "^112.7.0",
70
+ "@atlaskit/editor-common": "^112.8.0",
71
71
  "react": "^18.2.0",
72
72
  "react-dom": "^18.2.0",
73
73
  "react-intl-next": "npm:react-intl@^5.18.1"