@atlaskit/editor-plugin-layout 20.0.1 → 20.0.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.
- package/CHANGELOG.md +25 -0
- package/dist/cjs/layoutPlugin.js +56 -145
- package/dist/cjs/nodeviews/index.js +1 -1
- package/dist/cjs/pm-plugins/actions.js +1 -1
- package/dist/cjs/pm-plugins/main.js +1 -1
- package/dist/cjs/pm-plugins/utils/index.js +1 -1
- package/dist/cjs/ui/LayoutColumnMenu/index.js +10 -9
- package/dist/cjs/ui/quick-insert/LayoutQuickInsertMenuItem.js +2 -2
- package/dist/cjs/ui/toolbar.js +1 -1
- package/dist/es2019/entry-points/layout-plugin.js +1 -0
- package/dist/es2019/layoutPlugin.js +55 -136
- package/dist/es2019/nodeviews/index.js +1 -1
- package/dist/es2019/pm-plugins/actions.js +1 -1
- package/dist/es2019/pm-plugins/main.js +1 -1
- package/dist/es2019/pm-plugins/utils/index.js +1 -1
- package/dist/es2019/ui/LayoutColumnMenu/index.js +9 -8
- package/dist/es2019/ui/quick-insert/LayoutQuickInsertMenuItem.js +2 -2
- package/dist/es2019/ui/toolbar.js +1 -1
- package/dist/esm/entry-points/layout-plugin.js +1 -0
- package/dist/esm/layoutPlugin.js +56 -145
- package/dist/esm/nodeviews/index.js +1 -1
- package/dist/esm/pm-plugins/actions.js +1 -1
- package/dist/esm/pm-plugins/main.js +1 -1
- package/dist/esm/pm-plugins/utils/index.js +1 -1
- package/dist/esm/ui/LayoutColumnMenu/index.js +10 -9
- package/dist/esm/ui/quick-insert/LayoutQuickInsertMenuItem.js +2 -2
- package/dist/esm/ui/toolbar.js +1 -1
- package/dist/types/ui/LayoutColumnMenu/index.d.ts +0 -1
- package/package.json +7 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,30 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-layout
|
|
2
2
|
|
|
3
|
+
## 20.0.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`fc26bfc51dd5c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/fc26bfc51dd5c) -
|
|
8
|
+
Add sparse block-control surface anchors, intersection-driven candidates, and explicit visibility
|
|
9
|
+
invalidation for registry-backed block controls. Expose registration change subscriptions from the
|
|
10
|
+
UI control registry model, and refresh cached visibility from suggestion and collapse transaction
|
|
11
|
+
metadata. Under `platform_editor_block_control_migration`, use native node-anchor identity across
|
|
12
|
+
Editor and Block Controls, and route expand keyboard focus through the shared Block Controls
|
|
13
|
+
command. Preserve Show Diff visibility checks in both migration cohorts so block controls stay
|
|
14
|
+
hidden while a diff is displayed. Keep the block menu closed when a migrated layout-column handle
|
|
15
|
+
opens the layout menu, and close the layout menu when the selection moves away from its selected
|
|
16
|
+
columns.
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
19
|
+
## 20.0.2
|
|
20
|
+
|
|
21
|
+
### Patch Changes
|
|
22
|
+
|
|
23
|
+
- [`1e8d2aad8e882`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1e8d2aad8e882) -
|
|
24
|
+
Remove the permanent `platform_editor_layout_typeahead_reorder` experiment and its temporary
|
|
25
|
+
Editor Statsig registration.
|
|
26
|
+
- Updated dependencies
|
|
27
|
+
|
|
3
28
|
## 20.0.1
|
|
4
29
|
|
|
5
30
|
### Patch Changes
|
package/dist/cjs/layoutPlugin.js
CHANGED
|
@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.selectIntoLayoutSection = exports.layoutPlugin = void 0;
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _layoutColumn = require("@atlaskit/adf-schema/nodes/layout-column");
|
|
10
9
|
var _layoutSection = require("@atlaskit/adf-schema/layout-section");
|
|
10
|
+
var _layoutColumn = require("@atlaskit/adf-schema/nodes/layout-column");
|
|
11
11
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
12
12
|
var _blockMenu = require("@atlaskit/editor-common/block-menu");
|
|
13
13
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
@@ -16,8 +16,8 @@ var _state = require("@atlaskit/editor-prosemirror/state");
|
|
|
16
16
|
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
17
17
|
var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
|
|
18
18
|
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
19
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
20
19
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
20
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
21
21
|
var _actions = require("./pm-plugins/actions");
|
|
22
22
|
var _keymap = _interopRequireDefault(require("./pm-plugins/keymap"));
|
|
23
23
|
var _main = _interopRequireDefault(require("./pm-plugins/main"));
|
|
@@ -63,7 +63,6 @@ var layoutPlugin = exports.layoutPlugin = function layoutPlugin(_ref) {
|
|
|
63
63
|
var _ref$config = _ref.config,
|
|
64
64
|
options = _ref$config === void 0 ? {} : _ref$config,
|
|
65
65
|
api = _ref.api;
|
|
66
|
-
var blockControlMigrationEnabled = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_block_control_migration');
|
|
67
66
|
var isAdvancedLayoutEnabled = (0, _editorExperiment.editorExperiment)('advanced_layouts', true);
|
|
68
67
|
var allowAdvancedSingleColumnLayout = isAdvancedLayoutEnabled && (0, _editorExperiment.editorExperiment)('single_column_layouts', true, {
|
|
69
68
|
exposure: true
|
|
@@ -174,6 +173,34 @@ var layoutPlugin = exports.layoutPlugin = function layoutPlugin(_ref) {
|
|
|
174
173
|
return tr;
|
|
175
174
|
};
|
|
176
175
|
if ((0, _editorExperiment.editorExperiment)('advanced_layouts', true)) {
|
|
176
|
+
var createAdvancedColumnLayoutOption = function createAdvancedColumnLayoutOption(_ref4) {
|
|
177
|
+
var columnCount = _ref4.columnCount,
|
|
178
|
+
descriptionColumnCount = _ref4.descriptionColumnCount,
|
|
179
|
+
Icon = _ref4.icon,
|
|
180
|
+
id = _ref4.id,
|
|
181
|
+
keyword = _ref4.keyword,
|
|
182
|
+
title = _ref4.title;
|
|
183
|
+
return {
|
|
184
|
+
id: id,
|
|
185
|
+
title: title,
|
|
186
|
+
description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
|
|
187
|
+
numberOfColumns: descriptionColumnCount
|
|
188
|
+
}),
|
|
189
|
+
keywords: ['layout', 'column', 'section', 'col', keyword],
|
|
190
|
+
priority: 1100,
|
|
191
|
+
icon: Icon,
|
|
192
|
+
action: function action(insert, state) {
|
|
193
|
+
var tr = insert((0, _actions.createMultiColumnLayoutSection)(state, columnCount));
|
|
194
|
+
if ((0, _fg.fg)('platform_editor_column_count_analytics')) {
|
|
195
|
+
withInsertLayoutAnalytics(tr, columnCount);
|
|
196
|
+
} else {
|
|
197
|
+
withInsertLayoutAnalytics(tr);
|
|
198
|
+
}
|
|
199
|
+
selectIntoLayoutSection(tr);
|
|
200
|
+
return tr;
|
|
201
|
+
}
|
|
202
|
+
};
|
|
203
|
+
};
|
|
177
204
|
var advancedSingleColumnOption = allowAdvancedSingleColumnLayout ? [{
|
|
178
205
|
id: 'onecolumnlayout',
|
|
179
206
|
title: formatMessage(_messages.layoutMessages.singleColumnAdvancedLayout),
|
|
@@ -194,158 +221,43 @@ var layoutPlugin = exports.layoutPlugin = function layoutPlugin(_ref) {
|
|
|
194
221
|
return tr;
|
|
195
222
|
}
|
|
196
223
|
}] : [];
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
descriptionColumnCount = _ref4.descriptionColumnCount,
|
|
201
|
-
Icon = _ref4.icon,
|
|
202
|
-
id = _ref4.id,
|
|
203
|
-
keyword = _ref4.keyword,
|
|
204
|
-
title = _ref4.title;
|
|
205
|
-
return {
|
|
206
|
-
id: id,
|
|
207
|
-
title: title,
|
|
208
|
-
description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
|
|
209
|
-
numberOfColumns: descriptionColumnCount
|
|
210
|
-
}),
|
|
211
|
-
keywords: ['layout', 'column', 'section', 'col', keyword],
|
|
212
|
-
priority: 1100,
|
|
213
|
-
icon: Icon,
|
|
214
|
-
action: function action(insert, state) {
|
|
215
|
-
var tr = insert((0, _actions.createMultiColumnLayoutSection)(state, columnCount));
|
|
216
|
-
if ((0, _fg.fg)('platform_editor_column_count_analytics')) {
|
|
217
|
-
withInsertLayoutAnalytics(tr, columnCount);
|
|
218
|
-
} else {
|
|
219
|
-
withInsertLayoutAnalytics(tr);
|
|
220
|
-
}
|
|
221
|
-
selectIntoLayoutSection(tr);
|
|
222
|
-
return tr;
|
|
223
|
-
}
|
|
224
|
-
};
|
|
225
|
-
};
|
|
226
|
-
return [createAdvancedColumnLayoutOption({
|
|
227
|
-
columnCount: 2,
|
|
228
|
-
descriptionColumnCount: 'two',
|
|
229
|
-
icon: function icon() {
|
|
230
|
-
return /*#__PURE__*/_react.default.createElement(_quickInsert.IconTwoColumnLayout, null);
|
|
231
|
-
},
|
|
232
|
-
id: 'twocolumnslayout',
|
|
233
|
-
keyword: 'two column',
|
|
234
|
-
title: formatMessage(_messages.layoutMessages.twoColumnsAdvancedLayout)
|
|
235
|
-
})].concat(advancedSingleColumnOption, [createAdvancedColumnLayoutOption({
|
|
236
|
-
columnCount: 3,
|
|
237
|
-
descriptionColumnCount: 'three',
|
|
238
|
-
icon: function icon() {
|
|
239
|
-
return /*#__PURE__*/_react.default.createElement(_quickInsert.IconThreeColumnLayout, null);
|
|
240
|
-
},
|
|
241
|
-
id: 'threecolumnslayout',
|
|
242
|
-
keyword: 'three column',
|
|
243
|
-
title: formatMessage(_messages.layoutMessages.threeColumnsAdvancedLayout)
|
|
244
|
-
}), createAdvancedColumnLayoutOption({
|
|
245
|
-
columnCount: 4,
|
|
246
|
-
descriptionColumnCount: 'four',
|
|
247
|
-
icon: function icon() {
|
|
248
|
-
return /*#__PURE__*/_react.default.createElement(_quickInsert.IconFourColumnLayout, null);
|
|
249
|
-
},
|
|
250
|
-
id: 'fourcolumnslayout',
|
|
251
|
-
keyword: 'four column',
|
|
252
|
-
title: formatMessage(_messages.layoutMessages.fourColumns)
|
|
253
|
-
}), createAdvancedColumnLayoutOption({
|
|
254
|
-
columnCount: 5,
|
|
255
|
-
descriptionColumnCount: 'five',
|
|
256
|
-
icon: function icon() {
|
|
257
|
-
return /*#__PURE__*/_react.default.createElement(_quickInsert.IconFiveColumnLayout, null);
|
|
258
|
-
},
|
|
259
|
-
id: 'fivecolumnslayout',
|
|
260
|
-
keyword: 'five column',
|
|
261
|
-
title: formatMessage(_messages.layoutMessages.fiveColumns)
|
|
262
|
-
})]);
|
|
263
|
-
}
|
|
264
|
-
return [].concat(advancedSingleColumnOption, [{
|
|
265
|
-
id: 'twocolumnslayout',
|
|
266
|
-
title: formatMessage(_messages.layoutMessages.twoColumnsAdvancedLayout),
|
|
267
|
-
description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
|
|
268
|
-
numberOfColumns: 'two'
|
|
269
|
-
}),
|
|
270
|
-
keywords: ['layout', 'column', 'section', 'col', 'two column'],
|
|
271
|
-
priority: 1100,
|
|
224
|
+
return [createAdvancedColumnLayoutOption({
|
|
225
|
+
columnCount: 2,
|
|
226
|
+
descriptionColumnCount: 'two',
|
|
272
227
|
icon: function icon() {
|
|
273
228
|
return /*#__PURE__*/_react.default.createElement(_quickInsert.IconTwoColumnLayout, null);
|
|
274
229
|
},
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
}
|
|
282
|
-
selectIntoLayoutSection(tr);
|
|
283
|
-
return tr;
|
|
284
|
-
}
|
|
285
|
-
}, {
|
|
286
|
-
id: 'threecolumnslayout',
|
|
287
|
-
title: formatMessage(_messages.layoutMessages.threeColumnsAdvancedLayout),
|
|
288
|
-
description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
|
|
289
|
-
numberOfColumns: 'three'
|
|
290
|
-
}),
|
|
291
|
-
keywords: ['layout', 'column', 'section', 'col', 'three column'],
|
|
292
|
-
priority: 1100,
|
|
230
|
+
id: 'twocolumnslayout',
|
|
231
|
+
keyword: 'two column',
|
|
232
|
+
title: formatMessage(_messages.layoutMessages.twoColumnsAdvancedLayout)
|
|
233
|
+
})].concat(advancedSingleColumnOption, [createAdvancedColumnLayoutOption({
|
|
234
|
+
columnCount: 3,
|
|
235
|
+
descriptionColumnCount: 'three',
|
|
293
236
|
icon: function icon() {
|
|
294
237
|
return /*#__PURE__*/_react.default.createElement(_quickInsert.IconThreeColumnLayout, null);
|
|
295
238
|
},
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
}
|
|
303
|
-
selectIntoLayoutSection(tr);
|
|
304
|
-
return tr;
|
|
305
|
-
}
|
|
306
|
-
}, {
|
|
307
|
-
id: 'fourcolumnslayout',
|
|
308
|
-
title: formatMessage(_messages.layoutMessages.fourColumns),
|
|
309
|
-
description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
|
|
310
|
-
numberOfColumns: 'four'
|
|
311
|
-
}),
|
|
312
|
-
keywords: ['layout', 'column', 'section', 'col', 'four column'],
|
|
313
|
-
priority: 1100,
|
|
239
|
+
id: 'threecolumnslayout',
|
|
240
|
+
keyword: 'three column',
|
|
241
|
+
title: formatMessage(_messages.layoutMessages.threeColumnsAdvancedLayout)
|
|
242
|
+
}), createAdvancedColumnLayoutOption({
|
|
243
|
+
columnCount: 4,
|
|
244
|
+
descriptionColumnCount: 'four',
|
|
314
245
|
icon: function icon() {
|
|
315
246
|
return /*#__PURE__*/_react.default.createElement(_quickInsert.IconFourColumnLayout, null);
|
|
316
247
|
},
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
}
|
|
324
|
-
selectIntoLayoutSection(tr);
|
|
325
|
-
return tr;
|
|
326
|
-
}
|
|
327
|
-
}, {
|
|
328
|
-
id: 'fivecolumnslayout',
|
|
329
|
-
title: formatMessage(_messages.layoutMessages.fiveColumns),
|
|
330
|
-
description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
|
|
331
|
-
numberOfColumns: 'five'
|
|
332
|
-
}),
|
|
333
|
-
keywords: ['layout', 'column', 'section', 'col', 'five column'],
|
|
334
|
-
priority: 1100,
|
|
248
|
+
id: 'fourcolumnslayout',
|
|
249
|
+
keyword: 'four column',
|
|
250
|
+
title: formatMessage(_messages.layoutMessages.fourColumns)
|
|
251
|
+
}), createAdvancedColumnLayoutOption({
|
|
252
|
+
columnCount: 5,
|
|
253
|
+
descriptionColumnCount: 'five',
|
|
335
254
|
icon: function icon() {
|
|
336
255
|
return /*#__PURE__*/_react.default.createElement(_quickInsert.IconFiveColumnLayout, null);
|
|
337
256
|
},
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
} else {
|
|
343
|
-
withInsertLayoutAnalytics(tr);
|
|
344
|
-
}
|
|
345
|
-
selectIntoLayoutSection(tr);
|
|
346
|
-
return tr;
|
|
347
|
-
}
|
|
348
|
-
}]);
|
|
257
|
+
id: 'fivecolumnslayout',
|
|
258
|
+
keyword: 'five column',
|
|
259
|
+
title: formatMessage(_messages.layoutMessages.fiveColumns)
|
|
260
|
+
})]);
|
|
349
261
|
} else {
|
|
350
262
|
return [{
|
|
351
263
|
id: 'layout',
|
|
@@ -384,8 +296,7 @@ var layoutPlugin = exports.layoutPlugin = function layoutPlugin(_ref) {
|
|
|
384
296
|
editorView: editorView,
|
|
385
297
|
mountTo: popupsMountPoint,
|
|
386
298
|
boundariesElement: popupsBoundariesElement,
|
|
387
|
-
scrollableElement: popupsScrollableElement
|
|
388
|
-
useRegistryAnchor: blockControlMigrationEnabled
|
|
299
|
+
scrollableElement: popupsScrollableElement
|
|
389
300
|
}) : null);
|
|
390
301
|
},
|
|
391
302
|
getSharedState: function getSharedState(editorState) {
|
|
@@ -20,8 +20,8 @@ var _resizer = require("@atlaskit/editor-common/resizer");
|
|
|
20
20
|
var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
|
|
21
21
|
var _model = require("@atlaskit/editor-prosemirror/model");
|
|
22
22
|
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
23
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
24
23
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
24
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
25
25
|
var _utils = require("../pm-plugins/utils");
|
|
26
26
|
var _LayoutSSRReactContextsProvider = require("../ui/LayoutSSRReactContextsProvider");
|
|
27
27
|
var _utils2 = require("./utils");
|
|
@@ -17,8 +17,8 @@ var _state = require("@atlaskit/editor-prosemirror/state");
|
|
|
17
17
|
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
18
18
|
var _utils2 = require("@atlaskit/editor-prosemirror/utils");
|
|
19
19
|
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
20
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
21
20
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
21
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
22
22
|
var _consts = require("./consts");
|
|
23
23
|
var _pluginKey = require("./plugin-key");
|
|
24
24
|
var _layoutColumnDistribution = require("./utils/layout-column-distribution");
|
|
@@ -16,8 +16,8 @@ var _model = require("@atlaskit/editor-prosemirror/model");
|
|
|
16
16
|
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
17
17
|
var _utils2 = require("@atlaskit/editor-prosemirror/utils");
|
|
18
18
|
var _view2 = require("@atlaskit/editor-prosemirror/view");
|
|
19
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
20
19
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
20
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
21
21
|
var _actions = require("./actions");
|
|
22
22
|
var _columnResizeDivider = require("./column-resize-divider");
|
|
23
23
|
var _consts = require("./consts");
|
|
@@ -9,8 +9,8 @@ var _state = require("@atlaskit/editor-prosemirror/state");
|
|
|
9
9
|
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
10
10
|
var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
|
|
11
11
|
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
12
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
13
12
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
13
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
14
14
|
// eslint-disable-next-line @typescript-eslint/consistent-type-imports
|
|
15
15
|
|
|
16
16
|
var getMaybeLayoutSection = exports.getMaybeLayoutSection = function getMaybeLayoutSection(state) {
|
|
@@ -17,6 +17,7 @@ var _userIntent = require("@atlaskit/editor-common/user-intent");
|
|
|
17
17
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
18
18
|
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
19
19
|
var _editorUiControlModel = require("@atlaskit/editor-ui-control-model");
|
|
20
|
+
var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
|
|
20
21
|
var _layoutColumnSelection = require("../../pm-plugins/utils/layout-column-selection");
|
|
21
22
|
var _components = require("./components");
|
|
22
23
|
var _keys = require("./keys");
|
|
@@ -51,8 +52,7 @@ var LayoutColumnMenu = exports.LayoutColumnMenu = /*#__PURE__*/_react.default.me
|
|
|
51
52
|
editorView = _ref.editorView,
|
|
52
53
|
mountTo = _ref.mountTo,
|
|
53
54
|
boundariesElement = _ref.boundariesElement,
|
|
54
|
-
scrollableElement = _ref.scrollableElement
|
|
55
|
-
useRegistryAnchor = _ref.useRegistryAnchor;
|
|
55
|
+
scrollableElement = _ref.scrollableElement;
|
|
56
56
|
var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['layout', 'selection'], function (states) {
|
|
57
57
|
var _states$layoutState$i, _states$layoutState, _states$layoutState2, _states$layoutState$l, _states$layoutState3, _states$selectionStat;
|
|
58
58
|
return {
|
|
@@ -123,12 +123,13 @@ var LayoutColumnMenu = exports.LayoutColumnMenu = /*#__PURE__*/_react.default.me
|
|
|
123
123
|
});
|
|
124
124
|
}, [handleMenuKeyDown, isLayoutColumnMenuOpen]);
|
|
125
125
|
var components = (_api$uiControlRegistr = api === null || api === void 0 || (_api$uiControlRegistr2 = api.uiControlRegistry) === null || _api$uiControlRegistr2 === void 0 ? void 0 : _api$uiControlRegistr2.actions.getComponents(_keys.LAYOUT_COLUMN_MENU.key)) !== null && _api$uiControlRegistr !== void 0 ? _api$uiControlRegistr : [];
|
|
126
|
+
var hasValidMenuSelection = !(0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_block_control_migration') || selection !== undefined && (0, _layoutColumnSelection.getLayoutColumnMenuAnchorPos)(selection, layoutColumnMenuAnchorPos) !== undefined;
|
|
126
127
|
var legacyTarget = (0, _react.useMemo)(function () {
|
|
127
|
-
return isLayoutColumnMenuOpen && !
|
|
128
|
-
}, [editorView, isLayoutColumnMenuOpen, layoutColumnMenuAnchorPos, selection
|
|
128
|
+
return isLayoutColumnMenuOpen && !(0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_block_control_migration') ? getLayoutColumnMenuTarget(editorView, selection, layoutColumnMenuAnchorPos) : null;
|
|
129
|
+
}, [editorView, isLayoutColumnMenuOpen, layoutColumnMenuAnchorPos, selection]);
|
|
129
130
|
var surfaceTargetRef = (0, _react.useRef)(null);
|
|
130
131
|
var surfaceAnchorPosRef = (0, _react.useRef)(undefined);
|
|
131
|
-
if (!
|
|
132
|
+
if (!(0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_block_control_migration') || !isLayoutColumnMenuOpen) {
|
|
132
133
|
surfaceTargetRef.current = null;
|
|
133
134
|
surfaceAnchorPosRef.current = undefined;
|
|
134
135
|
} else if (!surfaceTargetRef.current || surfaceAnchorPosRef.current !== layoutColumnMenuAnchorPos) {
|
|
@@ -136,7 +137,7 @@ var LayoutColumnMenu = exports.LayoutColumnMenu = /*#__PURE__*/_react.default.me
|
|
|
136
137
|
surfaceTargetRef.current = (_surfaceDragHandleEle = _surfaceDragHandleElement.surfaceDragHandleElementStore.get(editorView)) !== null && _surfaceDragHandleEle !== void 0 ? _surfaceDragHandleEle : surfaceTargetRef.current;
|
|
137
138
|
surfaceAnchorPosRef.current = layoutColumnMenuAnchorPos;
|
|
138
139
|
}
|
|
139
|
-
var target =
|
|
140
|
+
var target = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_block_control_migration') ? surfaceTargetRef.current : legacyTarget;
|
|
140
141
|
var hasValidTarget = target instanceof HTMLElement;
|
|
141
142
|
var positionLayoutColumnMenu = (0, _react.useCallback)(function (position) {
|
|
142
143
|
var _menuWrapperRef$curre;
|
|
@@ -155,10 +156,10 @@ var LayoutColumnMenu = exports.LayoutColumnMenu = /*#__PURE__*/_react.default.me
|
|
|
155
156
|
return position;
|
|
156
157
|
}, [editorView, scrollableElement, target]);
|
|
157
158
|
(0, _react.useEffect)(function () {
|
|
158
|
-
if (isLayoutColumnMenuOpen && (!hasValidTarget || components.length === 0)) {
|
|
159
|
+
if (isLayoutColumnMenuOpen && (!hasValidMenuSelection || !hasValidTarget || components.length === 0)) {
|
|
159
160
|
closeLayoutColumnMenu();
|
|
160
161
|
}
|
|
161
|
-
}, [closeLayoutColumnMenu, components.length, hasValidTarget, isLayoutColumnMenuOpen]);
|
|
162
|
+
}, [closeLayoutColumnMenu, components.length, hasValidMenuSelection, hasValidTarget, isLayoutColumnMenuOpen]);
|
|
162
163
|
var _useMemo = (0, _react.useMemo)(function () {
|
|
163
164
|
return (0, _utils.getLayoutColumnMenuPositioningProps)();
|
|
164
165
|
}, []),
|
|
@@ -166,7 +167,7 @@ var LayoutColumnMenu = exports.LayoutColumnMenu = /*#__PURE__*/_react.default.me
|
|
|
166
167
|
alignY = _useMemo.alignY,
|
|
167
168
|
offset = _useMemo.offset,
|
|
168
169
|
useManualBelowFlip = _useMemo.useManualBelowFlip;
|
|
169
|
-
if (!isLayoutColumnMenuOpen || components.length === 0 || !hasValidTarget) {
|
|
170
|
+
if (!isLayoutColumnMenuOpen || !hasValidMenuSelection || components.length === 0 || !hasValidTarget) {
|
|
170
171
|
return null;
|
|
171
172
|
}
|
|
172
173
|
return /*#__PURE__*/_react.default.createElement(PopupWithListeners, {
|
|
@@ -10,10 +10,10 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
10
10
|
var _reactIntl = require("react-intl");
|
|
11
11
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
12
12
|
var _menuItem = require("@atlaskit/editor-common/quick-insert/menu-item");
|
|
13
|
-
var _layoutThreeColumns = _interopRequireDefault(require("@atlaskit/icon/core/layout-three-columns"));
|
|
14
|
-
var _layoutTwoColumns = _interopRequireDefault(require("@atlaskit/icon/core/layout-two-columns"));
|
|
15
13
|
var _layoutFiveColumns = _interopRequireDefault(require("@atlaskit/icon-lab/core/layout-five-columns"));
|
|
16
14
|
var _layoutFourColumns = _interopRequireDefault(require("@atlaskit/icon-lab/core/layout-four-columns"));
|
|
15
|
+
var _layoutThreeColumns = _interopRequireDefault(require("@atlaskit/icon/core/layout-three-columns"));
|
|
16
|
+
var _layoutTwoColumns = _interopRequireDefault(require("@atlaskit/icon/core/layout-two-columns"));
|
|
17
17
|
var _layoutPlugin = require("../../layoutPlugin");
|
|
18
18
|
var _actions = require("../../pm-plugins/actions");
|
|
19
19
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
package/dist/cjs/ui/toolbar.js
CHANGED
|
@@ -23,8 +23,8 @@ var _layoutTwoColumns = _interopRequireDefault(require("@atlaskit/icon/core/layo
|
|
|
23
23
|
var _layoutTwoColumnsSidebarLeft = _interopRequireDefault(require("@atlaskit/icon/core/layout-two-columns-sidebar-left"));
|
|
24
24
|
var _layoutTwoColumnsSidebarRight = _interopRequireDefault(require("@atlaskit/icon/core/layout-two-columns-sidebar-right"));
|
|
25
25
|
var _tableColumnsDistribute = _interopRequireDefault(require("@atlaskit/icon/core/table-columns-distribute"));
|
|
26
|
-
var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
|
|
27
26
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
27
|
+
var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
|
|
28
28
|
var _actions = require("../pm-plugins/actions");
|
|
29
29
|
var _layoutColumnDistribution = require("../pm-plugins/utils/layout-column-distribution");
|
|
30
30
|
var _LayoutColumnsIcon = require("./icons/LayoutColumnsIcon");
|