@atlaskit/editor-plugin-layout 20.0.0 → 20.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/editor-plugin-layout
2
2
 
3
+ ## 20.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`1e8d2aad8e882`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1e8d2aad8e882) -
8
+ Remove the permanent `platform_editor_layout_typeahead_reorder` experiment and its temporary
9
+ Editor Statsig registration.
10
+ - Updated dependencies
11
+
12
+ ## 20.0.1
13
+
14
+ ### Patch Changes
15
+
16
+ - [`8d37dc7e55d62`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8d37dc7e55d62) -
17
+ Clean up shipped experiment `platform_editor_block_menu`
18
+ - Updated dependencies
19
+
3
20
  ## 20.0.0
4
21
 
5
22
  ### Patch Changes
@@ -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"));
@@ -59,7 +59,7 @@ var selectIntoLayoutSection = exports.selectIntoLayoutSection = function selectI
59
59
  return tr;
60
60
  };
61
61
  var layoutPlugin = exports.layoutPlugin = function layoutPlugin(_ref) {
62
- var _api$analytics2;
62
+ var _api$blockMenu, _api$analytics2;
63
63
  var _ref$config = _ref.config,
64
64
  options = _ref$config === void 0 ? {} : _ref$config,
65
65
  api = _ref.api;
@@ -69,23 +69,20 @@ var layoutPlugin = exports.layoutPlugin = function layoutPlugin(_ref) {
69
69
  exposure: true
70
70
  });
71
71
  var isRegisteredSlashCommandEnabled = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_slash_command') && isAdvancedLayoutEnabled;
72
- if ((0, _editorExperiment.editorExperiment)('platform_editor_block_menu', true)) {
73
- var _api$blockMenu;
74
- api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents([{
75
- type: 'block-menu-item',
76
- key: _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key,
77
- parent: {
78
- type: 'block-menu-section',
79
- key: _blockMenu.TRANSFORM_STRUCTURE_MENU_SECTION.key,
80
- rank: _blockMenu.TRANSFORM_STRUCTURE_MENU_SECTION_RANK[_blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]
81
- },
82
- component: (0, _LayoutBlockMenuItem.createLayoutBlockMenuItem)(api),
83
- isHidden: function isHidden() {
84
- var _api$blockMenu2;
85
- return Boolean(api === null || api === void 0 || (_api$blockMenu2 = api.blockMenu) === null || _api$blockMenu2 === void 0 ? void 0 : _api$blockMenu2.actions.isTransformOptionDisabled(LAYOUT_SECTION_NODE_NAME));
86
- }
87
- }]);
88
- }
72
+ api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents([{
73
+ type: 'block-menu-item',
74
+ key: _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key,
75
+ parent: {
76
+ type: 'block-menu-section',
77
+ key: _blockMenu.TRANSFORM_STRUCTURE_MENU_SECTION.key,
78
+ rank: _blockMenu.TRANSFORM_STRUCTURE_MENU_SECTION_RANK[_blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]
79
+ },
80
+ component: (0, _LayoutBlockMenuItem.createLayoutBlockMenuItem)(api),
81
+ isHidden: function isHidden() {
82
+ var _api$blockMenu2;
83
+ return Boolean(api === null || api === void 0 || (_api$blockMenu2 = api.blockMenu) === null || _api$blockMenu2 === void 0 ? void 0 : _api$blockMenu2.actions.isTransformOptionDisabled(LAYOUT_SECTION_NODE_NAME));
84
+ }
85
+ }]);
89
86
  if ((0, _expValEquals.expValEquals)('platform_editor_layout_column_menu', 'isEnabled', true)) {
90
87
  var _api$uiControlRegistr;
91
88
  api === null || api === void 0 || (_api$uiControlRegistr = api.uiControlRegistry) === null || _api$uiControlRegistr === void 0 || _api$uiControlRegistr.actions.register((0, _components.getLayoutColumnMenuComponents)({
@@ -177,6 +174,34 @@ var layoutPlugin = exports.layoutPlugin = function layoutPlugin(_ref) {
177
174
  return tr;
178
175
  };
179
176
  if ((0, _editorExperiment.editorExperiment)('advanced_layouts', true)) {
177
+ var createAdvancedColumnLayoutOption = function createAdvancedColumnLayoutOption(_ref4) {
178
+ var columnCount = _ref4.columnCount,
179
+ descriptionColumnCount = _ref4.descriptionColumnCount,
180
+ Icon = _ref4.icon,
181
+ id = _ref4.id,
182
+ keyword = _ref4.keyword,
183
+ title = _ref4.title;
184
+ return {
185
+ id: id,
186
+ title: title,
187
+ description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
188
+ numberOfColumns: descriptionColumnCount
189
+ }),
190
+ keywords: ['layout', 'column', 'section', 'col', keyword],
191
+ priority: 1100,
192
+ icon: Icon,
193
+ action: function action(insert, state) {
194
+ var tr = insert((0, _actions.createMultiColumnLayoutSection)(state, columnCount));
195
+ if ((0, _fg.fg)('platform_editor_column_count_analytics')) {
196
+ withInsertLayoutAnalytics(tr, columnCount);
197
+ } else {
198
+ withInsertLayoutAnalytics(tr);
199
+ }
200
+ selectIntoLayoutSection(tr);
201
+ return tr;
202
+ }
203
+ };
204
+ };
180
205
  var advancedSingleColumnOption = allowAdvancedSingleColumnLayout ? [{
181
206
  id: 'onecolumnlayout',
182
207
  title: formatMessage(_messages.layoutMessages.singleColumnAdvancedLayout),
@@ -197,158 +222,43 @@ var layoutPlugin = exports.layoutPlugin = function layoutPlugin(_ref) {
197
222
  return tr;
198
223
  }
199
224
  }] : [];
200
- if ((0, _expValEquals.expValEquals)('platform_editor_layout_typeahead_reorder', 'isEnabled', true)) {
201
- var createAdvancedColumnLayoutOption = function createAdvancedColumnLayoutOption(_ref4) {
202
- var columnCount = _ref4.columnCount,
203
- descriptionColumnCount = _ref4.descriptionColumnCount,
204
- Icon = _ref4.icon,
205
- id = _ref4.id,
206
- keyword = _ref4.keyword,
207
- title = _ref4.title;
208
- return {
209
- id: id,
210
- title: title,
211
- description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
212
- numberOfColumns: descriptionColumnCount
213
- }),
214
- keywords: ['layout', 'column', 'section', 'col', keyword],
215
- priority: 1100,
216
- icon: Icon,
217
- action: function action(insert, state) {
218
- var tr = insert((0, _actions.createMultiColumnLayoutSection)(state, columnCount));
219
- if ((0, _fg.fg)('platform_editor_column_count_analytics')) {
220
- withInsertLayoutAnalytics(tr, columnCount);
221
- } else {
222
- withInsertLayoutAnalytics(tr);
223
- }
224
- selectIntoLayoutSection(tr);
225
- return tr;
226
- }
227
- };
228
- };
229
- return [createAdvancedColumnLayoutOption({
230
- columnCount: 2,
231
- descriptionColumnCount: 'two',
232
- icon: function icon() {
233
- return /*#__PURE__*/_react.default.createElement(_quickInsert.IconTwoColumnLayout, null);
234
- },
235
- id: 'twocolumnslayout',
236
- keyword: 'two column',
237
- title: formatMessage(_messages.layoutMessages.twoColumnsAdvancedLayout)
238
- })].concat(advancedSingleColumnOption, [createAdvancedColumnLayoutOption({
239
- columnCount: 3,
240
- descriptionColumnCount: 'three',
241
- icon: function icon() {
242
- return /*#__PURE__*/_react.default.createElement(_quickInsert.IconThreeColumnLayout, null);
243
- },
244
- id: 'threecolumnslayout',
245
- keyword: 'three column',
246
- title: formatMessage(_messages.layoutMessages.threeColumnsAdvancedLayout)
247
- }), createAdvancedColumnLayoutOption({
248
- columnCount: 4,
249
- descriptionColumnCount: 'four',
250
- icon: function icon() {
251
- return /*#__PURE__*/_react.default.createElement(_quickInsert.IconFourColumnLayout, null);
252
- },
253
- id: 'fourcolumnslayout',
254
- keyword: 'four column',
255
- title: formatMessage(_messages.layoutMessages.fourColumns)
256
- }), createAdvancedColumnLayoutOption({
257
- columnCount: 5,
258
- descriptionColumnCount: 'five',
259
- icon: function icon() {
260
- return /*#__PURE__*/_react.default.createElement(_quickInsert.IconFiveColumnLayout, null);
261
- },
262
- id: 'fivecolumnslayout',
263
- keyword: 'five column',
264
- title: formatMessage(_messages.layoutMessages.fiveColumns)
265
- })]);
266
- }
267
- return [].concat(advancedSingleColumnOption, [{
268
- id: 'twocolumnslayout',
269
- title: formatMessage(_messages.layoutMessages.twoColumnsAdvancedLayout),
270
- description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
271
- numberOfColumns: 'two'
272
- }),
273
- keywords: ['layout', 'column', 'section', 'col', 'two column'],
274
- priority: 1100,
225
+ return [createAdvancedColumnLayoutOption({
226
+ columnCount: 2,
227
+ descriptionColumnCount: 'two',
275
228
  icon: function icon() {
276
229
  return /*#__PURE__*/_react.default.createElement(_quickInsert.IconTwoColumnLayout, null);
277
230
  },
278
- action: function action(insert, state) {
279
- var tr = insert((0, _actions.createMultiColumnLayoutSection)(state, 2));
280
- if ((0, _fg.fg)('platform_editor_column_count_analytics')) {
281
- withInsertLayoutAnalytics(tr, 2);
282
- } else {
283
- withInsertLayoutAnalytics(tr);
284
- }
285
- selectIntoLayoutSection(tr);
286
- return tr;
287
- }
288
- }, {
289
- id: 'threecolumnslayout',
290
- title: formatMessage(_messages.layoutMessages.threeColumnsAdvancedLayout),
291
- description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
292
- numberOfColumns: 'three'
293
- }),
294
- keywords: ['layout', 'column', 'section', 'col', 'three column'],
295
- priority: 1100,
231
+ id: 'twocolumnslayout',
232
+ keyword: 'two column',
233
+ title: formatMessage(_messages.layoutMessages.twoColumnsAdvancedLayout)
234
+ })].concat(advancedSingleColumnOption, [createAdvancedColumnLayoutOption({
235
+ columnCount: 3,
236
+ descriptionColumnCount: 'three',
296
237
  icon: function icon() {
297
238
  return /*#__PURE__*/_react.default.createElement(_quickInsert.IconThreeColumnLayout, null);
298
239
  },
299
- action: function action(insert, state) {
300
- var tr = insert((0, _actions.createMultiColumnLayoutSection)(state, 3));
301
- if ((0, _fg.fg)('platform_editor_column_count_analytics')) {
302
- withInsertLayoutAnalytics(tr, 3);
303
- } else {
304
- withInsertLayoutAnalytics(tr);
305
- }
306
- selectIntoLayoutSection(tr);
307
- return tr;
308
- }
309
- }, {
310
- id: 'fourcolumnslayout',
311
- title: formatMessage(_messages.layoutMessages.fourColumns),
312
- description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
313
- numberOfColumns: 'four'
314
- }),
315
- keywords: ['layout', 'column', 'section', 'col', 'four column'],
316
- priority: 1100,
240
+ id: 'threecolumnslayout',
241
+ keyword: 'three column',
242
+ title: formatMessage(_messages.layoutMessages.threeColumnsAdvancedLayout)
243
+ }), createAdvancedColumnLayoutOption({
244
+ columnCount: 4,
245
+ descriptionColumnCount: 'four',
317
246
  icon: function icon() {
318
247
  return /*#__PURE__*/_react.default.createElement(_quickInsert.IconFourColumnLayout, null);
319
248
  },
320
- action: function action(insert, state) {
321
- var tr = insert((0, _actions.createMultiColumnLayoutSection)(state, 4));
322
- if ((0, _fg.fg)('platform_editor_column_count_analytics')) {
323
- withInsertLayoutAnalytics(tr, 4);
324
- } else {
325
- withInsertLayoutAnalytics(tr);
326
- }
327
- selectIntoLayoutSection(tr);
328
- return tr;
329
- }
330
- }, {
331
- id: 'fivecolumnslayout',
332
- title: formatMessage(_messages.layoutMessages.fiveColumns),
333
- description: formatMessage(_messages.toolbarInsertBlockMessages.columnsDescriptionAdvancedLayout, {
334
- numberOfColumns: 'five'
335
- }),
336
- keywords: ['layout', 'column', 'section', 'col', 'five column'],
337
- priority: 1100,
249
+ id: 'fourcolumnslayout',
250
+ keyword: 'four column',
251
+ title: formatMessage(_messages.layoutMessages.fourColumns)
252
+ }), createAdvancedColumnLayoutOption({
253
+ columnCount: 5,
254
+ descriptionColumnCount: 'five',
338
255
  icon: function icon() {
339
256
  return /*#__PURE__*/_react.default.createElement(_quickInsert.IconFiveColumnLayout, null);
340
257
  },
341
- action: function action(insert, state) {
342
- var tr = insert((0, _actions.createMultiColumnLayoutSection)(state, 5));
343
- if ((0, _fg.fg)('platform_editor_column_count_analytics')) {
344
- withInsertLayoutAnalytics(tr, 5);
345
- } else {
346
- withInsertLayoutAnalytics(tr);
347
- }
348
- selectIntoLayoutSection(tr);
349
- return tr;
350
- }
351
- }]);
258
+ id: 'fivecolumnslayout',
259
+ keyword: 'five column',
260
+ title: formatMessage(_messages.layoutMessages.fiveColumns)
261
+ })]);
352
262
  } else {
353
263
  return [{
354
264
  id: 'layout',
@@ -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) {
@@ -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); }
@@ -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");
@@ -1,2 +1,3 @@
1
1
  /* eslint-disable @atlaskit/editor/no-re-export */
2
+
2
3
  export { layoutPlugin } from '../layoutPlugin';
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
- import { layoutColumn, layoutColumnWithLocalId } from '@atlaskit/adf-schema/nodes/layout-column';
3
2
  import { layoutSection, layoutSectionWithLocalId, layoutSectionWithSingleColumn, layoutSectionWithSingleColumnLocalId } from '@atlaskit/adf-schema/layout-section';
3
+ import { layoutColumn, layoutColumnWithLocalId } from '@atlaskit/adf-schema/nodes/layout-column';
4
4
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
5
5
  import { TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM, TRANSFORM_STRUCTURE_MENU_SECTION, TRANSFORM_STRUCTURE_MENU_SECTION_RANK } from '@atlaskit/editor-common/block-menu';
6
6
  import { layoutMessages, toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
@@ -9,8 +9,8 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
9
9
  import { findParentNode } from '@atlaskit/editor-prosemirror/utils';
10
10
  import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
11
11
  import { fg } from '@atlaskit/platform-feature-flags/fg';
12
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
12
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
13
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
14
14
  import { createDefaultLayoutSection, createMultiColumnLayoutSection, deleteLayoutColumn, distributeLayoutColumns, insertLayoutColumn, insertLayoutColumnsWithAnalytics, setLayoutColumnDangerPreview, setLayoutColumnValign, toggleLayoutColumnMenu } from './pm-plugins/actions';
15
15
  import { default as createLayoutKeymapPlugin } from './pm-plugins/keymap';
16
16
  import { default as createLayoutPlugin } from './pm-plugins/main';
@@ -54,30 +54,27 @@ export const layoutPlugin = ({
54
54
  config: options = {},
55
55
  api
56
56
  }) => {
57
- var _api$analytics2;
57
+ var _api$blockMenu, _api$analytics2;
58
58
  const blockControlMigrationEnabled = isExperimentEnabled('platform_editor_block_control_migration');
59
59
  const isAdvancedLayoutEnabled = editorExperiment('advanced_layouts', true);
60
60
  const allowAdvancedSingleColumnLayout = isAdvancedLayoutEnabled && editorExperiment('single_column_layouts', true, {
61
61
  exposure: true
62
62
  });
63
63
  const isRegisteredSlashCommandEnabled = isExperimentEnabled('platform_editor_slash_command') && isAdvancedLayoutEnabled;
64
- if (editorExperiment('platform_editor_block_menu', true)) {
65
- var _api$blockMenu;
66
- api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.registerBlockMenuComponents([{
67
- type: 'block-menu-item',
68
- key: TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key,
69
- parent: {
70
- type: 'block-menu-section',
71
- key: TRANSFORM_STRUCTURE_MENU_SECTION.key,
72
- rank: TRANSFORM_STRUCTURE_MENU_SECTION_RANK[TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]
73
- },
74
- component: createLayoutBlockMenuItem(api),
75
- isHidden: () => {
76
- var _api$blockMenu2;
77
- return Boolean(api === null || api === void 0 ? void 0 : (_api$blockMenu2 = api.blockMenu) === null || _api$blockMenu2 === void 0 ? void 0 : _api$blockMenu2.actions.isTransformOptionDisabled(LAYOUT_SECTION_NODE_NAME));
78
- }
79
- }]);
80
- }
64
+ api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.registerBlockMenuComponents([{
65
+ type: 'block-menu-item',
66
+ key: TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key,
67
+ parent: {
68
+ type: 'block-menu-section',
69
+ key: TRANSFORM_STRUCTURE_MENU_SECTION.key,
70
+ rank: TRANSFORM_STRUCTURE_MENU_SECTION_RANK[TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]
71
+ },
72
+ component: createLayoutBlockMenuItem(api),
73
+ isHidden: () => {
74
+ var _api$blockMenu2;
75
+ return Boolean(api === null || api === void 0 ? void 0 : (_api$blockMenu2 = api.blockMenu) === null || _api$blockMenu2 === void 0 ? void 0 : _api$blockMenu2.actions.isTransformOptionDisabled(LAYOUT_SECTION_NODE_NAME));
76
+ }
77
+ }]);
81
78
  if (expValEquals('platform_editor_layout_column_menu', 'isEnabled', true)) {
82
79
  var _api$uiControlRegistr;
83
80
  api === null || api === void 0 ? void 0 : (_api$uiControlRegistr = api.uiControlRegistry) === null || _api$uiControlRegistr === void 0 ? void 0 : _api$uiControlRegistr.actions.register(getLayoutColumnMenuComponents({
@@ -169,159 +166,80 @@ export const layoutPlugin = ({
169
166
  return tr;
170
167
  };
171
168
  if (editorExperiment('advanced_layouts', true)) {
172
- const advancedSingleColumnOption = allowAdvancedSingleColumnLayout ? [{
173
- id: 'onecolumnlayout',
174
- title: formatMessage(layoutMessages.singleColumnAdvancedLayout),
175
- description: formatMessage(messages.singleColumnsDescriptionAdvancedLayout),
176
- keywords: ['layout', 'column', 'section', 'col', 'single column'],
177
- priority: 1100,
178
- icon: () => /*#__PURE__*/React.createElement(IconOneColumnLayout, null),
179
- action(insert, state) {
180
- const tr = insert(createMultiColumnLayoutSection(state, 1));
181
- if (fg('platform_editor_column_count_analytics')) {
182
- withInsertLayoutAnalytics(tr, 1);
183
- } else {
184
- withInsertLayoutAnalytics(tr);
185
- }
186
- selectIntoLayoutSection(tr);
187
- return tr;
188
- }
189
- }] : [];
190
- if (expValEquals('platform_editor_layout_typeahead_reorder', 'isEnabled', true)) {
191
- const createAdvancedColumnLayoutOption = ({
192
- columnCount,
193
- descriptionColumnCount,
194
- icon: Icon,
195
- id,
196
- keyword,
197
- title
198
- }) => ({
199
- id,
200
- title,
201
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
202
- numberOfColumns: descriptionColumnCount
203
- }),
204
- keywords: ['layout', 'column', 'section', 'col', keyword],
205
- priority: 1100,
206
- icon: Icon,
207
- action(insert, state) {
208
- const tr = insert(createMultiColumnLayoutSection(state, columnCount));
209
- if (fg('platform_editor_column_count_analytics')) {
210
- withInsertLayoutAnalytics(tr, columnCount);
211
- } else {
212
- withInsertLayoutAnalytics(tr);
213
- }
214
- selectIntoLayoutSection(tr);
215
- return tr;
216
- }
217
- });
218
- return [createAdvancedColumnLayoutOption({
219
- columnCount: 2,
220
- descriptionColumnCount: 'two',
221
- icon: () => /*#__PURE__*/React.createElement(IconTwoColumnLayout, null),
222
- id: 'twocolumnslayout',
223
- keyword: 'two column',
224
- title: formatMessage(layoutMessages.twoColumnsAdvancedLayout)
225
- }), ...advancedSingleColumnOption, createAdvancedColumnLayoutOption({
226
- columnCount: 3,
227
- descriptionColumnCount: 'three',
228
- icon: () => /*#__PURE__*/React.createElement(IconThreeColumnLayout, null),
229
- id: 'threecolumnslayout',
230
- keyword: 'three column',
231
- title: formatMessage(layoutMessages.threeColumnsAdvancedLayout)
232
- }), createAdvancedColumnLayoutOption({
233
- columnCount: 4,
234
- descriptionColumnCount: 'four',
235
- icon: () => /*#__PURE__*/React.createElement(IconFourColumnLayout, null),
236
- id: 'fourcolumnslayout',
237
- keyword: 'four column',
238
- title: formatMessage(layoutMessages.fourColumns)
239
- }), createAdvancedColumnLayoutOption({
240
- columnCount: 5,
241
- descriptionColumnCount: 'five',
242
- icon: () => /*#__PURE__*/React.createElement(IconFiveColumnLayout, null),
243
- id: 'fivecolumnslayout',
244
- keyword: 'five column',
245
- title: formatMessage(layoutMessages.fiveColumns)
246
- })];
247
- }
248
- return [...advancedSingleColumnOption, {
249
- id: 'twocolumnslayout',
250
- title: formatMessage(layoutMessages.twoColumnsAdvancedLayout),
169
+ const createAdvancedColumnLayoutOption = ({
170
+ columnCount,
171
+ descriptionColumnCount,
172
+ icon: Icon,
173
+ id,
174
+ keyword,
175
+ title
176
+ }) => ({
177
+ id,
178
+ title,
251
179
  description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
252
- numberOfColumns: 'two'
180
+ numberOfColumns: descriptionColumnCount
253
181
  }),
254
- keywords: ['layout', 'column', 'section', 'col', 'two column'],
182
+ keywords: ['layout', 'column', 'section', 'col', keyword],
255
183
  priority: 1100,
256
- icon: () => /*#__PURE__*/React.createElement(IconTwoColumnLayout, null),
184
+ icon: Icon,
257
185
  action(insert, state) {
258
- const tr = insert(createMultiColumnLayoutSection(state, 2));
186
+ const tr = insert(createMultiColumnLayoutSection(state, columnCount));
259
187
  if (fg('platform_editor_column_count_analytics')) {
260
- withInsertLayoutAnalytics(tr, 2);
188
+ withInsertLayoutAnalytics(tr, columnCount);
261
189
  } else {
262
190
  withInsertLayoutAnalytics(tr);
263
191
  }
264
192
  selectIntoLayoutSection(tr);
265
193
  return tr;
266
194
  }
267
- }, {
268
- id: 'threecolumnslayout',
269
- title: formatMessage(layoutMessages.threeColumnsAdvancedLayout),
270
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
271
- numberOfColumns: 'three'
272
- }),
273
- keywords: ['layout', 'column', 'section', 'col', 'three column'],
195
+ });
196
+ const advancedSingleColumnOption = allowAdvancedSingleColumnLayout ? [{
197
+ id: 'onecolumnlayout',
198
+ title: formatMessage(layoutMessages.singleColumnAdvancedLayout),
199
+ description: formatMessage(messages.singleColumnsDescriptionAdvancedLayout),
200
+ keywords: ['layout', 'column', 'section', 'col', 'single column'],
274
201
  priority: 1100,
275
- icon: () => /*#__PURE__*/React.createElement(IconThreeColumnLayout, null),
202
+ icon: () => /*#__PURE__*/React.createElement(IconOneColumnLayout, null),
276
203
  action(insert, state) {
277
- const tr = insert(createMultiColumnLayoutSection(state, 3));
204
+ const tr = insert(createMultiColumnLayoutSection(state, 1));
278
205
  if (fg('platform_editor_column_count_analytics')) {
279
- withInsertLayoutAnalytics(tr, 3);
206
+ withInsertLayoutAnalytics(tr, 1);
280
207
  } else {
281
208
  withInsertLayoutAnalytics(tr);
282
209
  }
283
210
  selectIntoLayoutSection(tr);
284
211
  return tr;
285
212
  }
286
- }, {
287
- id: 'fourcolumnslayout',
288
- title: formatMessage(layoutMessages.fourColumns),
289
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
290
- numberOfColumns: 'four'
291
- }),
292
- keywords: ['layout', 'column', 'section', 'col', 'four column'],
293
- priority: 1100,
213
+ }] : [];
214
+ return [createAdvancedColumnLayoutOption({
215
+ columnCount: 2,
216
+ descriptionColumnCount: 'two',
217
+ icon: () => /*#__PURE__*/React.createElement(IconTwoColumnLayout, null),
218
+ id: 'twocolumnslayout',
219
+ keyword: 'two column',
220
+ title: formatMessage(layoutMessages.twoColumnsAdvancedLayout)
221
+ }), ...advancedSingleColumnOption, createAdvancedColumnLayoutOption({
222
+ columnCount: 3,
223
+ descriptionColumnCount: 'three',
224
+ icon: () => /*#__PURE__*/React.createElement(IconThreeColumnLayout, null),
225
+ id: 'threecolumnslayout',
226
+ keyword: 'three column',
227
+ title: formatMessage(layoutMessages.threeColumnsAdvancedLayout)
228
+ }), createAdvancedColumnLayoutOption({
229
+ columnCount: 4,
230
+ descriptionColumnCount: 'four',
294
231
  icon: () => /*#__PURE__*/React.createElement(IconFourColumnLayout, null),
295
- action(insert, state) {
296
- const tr = insert(createMultiColumnLayoutSection(state, 4));
297
- if (fg('platform_editor_column_count_analytics')) {
298
- withInsertLayoutAnalytics(tr, 4);
299
- } else {
300
- withInsertLayoutAnalytics(tr);
301
- }
302
- selectIntoLayoutSection(tr);
303
- return tr;
304
- }
305
- }, {
306
- id: 'fivecolumnslayout',
307
- title: formatMessage(layoutMessages.fiveColumns),
308
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
309
- numberOfColumns: 'five'
310
- }),
311
- keywords: ['layout', 'column', 'section', 'col', 'five column'],
312
- priority: 1100,
232
+ id: 'fourcolumnslayout',
233
+ keyword: 'four column',
234
+ title: formatMessage(layoutMessages.fourColumns)
235
+ }), createAdvancedColumnLayoutOption({
236
+ columnCount: 5,
237
+ descriptionColumnCount: 'five',
313
238
  icon: () => /*#__PURE__*/React.createElement(IconFiveColumnLayout, null),
314
- action(insert, state) {
315
- const tr = insert(createMultiColumnLayoutSection(state, 5));
316
- if (fg('platform_editor_column_count_analytics')) {
317
- withInsertLayoutAnalytics(tr, 5);
318
- } else {
319
- withInsertLayoutAnalytics(tr);
320
- }
321
- selectIntoLayoutSection(tr);
322
- return tr;
323
- }
324
- }];
239
+ id: 'fivecolumnslayout',
240
+ keyword: 'five column',
241
+ title: formatMessage(layoutMessages.fiveColumns)
242
+ })];
325
243
  } else {
326
244
  return [{
327
245
  id: 'layout',
@@ -6,8 +6,8 @@ import { BreakoutResizer, ignoreResizerMutations } from '@atlaskit/editor-common
6
6
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
7
7
  import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
8
8
  import { fg } from '@atlaskit/platform-feature-flags/fg';
9
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
10
9
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
10
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
11
11
  import { selectIntoLayout } from '../pm-plugins/utils';
12
12
  import { LayoutSSRReactContextsProvider } from '../ui/LayoutSSRReactContextsProvider';
13
13
  import { isEmptyLayout } from './utils';
@@ -6,8 +6,8 @@ import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state
6
6
  import { Mapping, StepMap } from '@atlaskit/editor-prosemirror/transform';
7
7
  import { safeInsert } from '@atlaskit/editor-prosemirror/utils';
8
8
  import { fg } from '@atlaskit/platform-feature-flags/fg';
9
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
10
9
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
10
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
11
11
  import { DEFAULT_LAYOUT_COLUMN_VALIGN, EVEN_DISTRIBUTED_COL_WIDTHS, MAX_LAYOUT_COLUMNS, MAX_STANDARD_LAYOUT_COLUMNS, MIN_LAYOUT_COLUMN_WIDTH_PERCENT } from './consts';
12
12
  import { pluginKey } from './plugin-key';
13
13
  import { calculateDistribution, isDistributedUniformly, redistributeAfterDeletion, redistributeProportionally } from './utils/layout-column-distribution';
@@ -7,8 +7,8 @@ import { Fragment } from '@atlaskit/editor-prosemirror/model';
7
7
  import { NodeSelection, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
8
8
  import { findParentNodeClosestToPos, findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
9
9
  import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
10
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
11
10
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
11
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
12
12
  import { fixColumnSizes, fixColumnStructure, getSelectedLayout, LAYOUT_COLUMN_INSERT_META } from './actions';
13
13
  import { getColumnDividerDecorations } from './column-resize-divider';
14
14
  import { EVEN_DISTRIBUTED_COL_WIDTHS } from './consts';
@@ -4,8 +4,8 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
4
4
  import { findParentNodeOfType, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
5
5
  import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
6
6
  import { fg } from '@atlaskit/platform-feature-flags/fg';
7
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
8
7
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
8
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
9
9
  export const getMaybeLayoutSection = state => {
10
10
  const {
11
11
  schema: {
@@ -2,10 +2,10 @@ import React, { useCallback } from 'react';
2
2
  import { useIntl } from 'react-intl';
3
3
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
4
4
  import { QuickInsertMenuItem } from '@atlaskit/editor-common/quick-insert/menu-item';
5
- import LayoutThreeColumnsIcon from '@atlaskit/icon/core/layout-three-columns';
6
- import LayoutTwoColumnsIcon from '@atlaskit/icon/core/layout-two-columns';
7
5
  import LayoutFiveColumnsIcon from '@atlaskit/icon-lab/core/layout-five-columns';
8
6
  import LayoutFourColumnsIcon from '@atlaskit/icon-lab/core/layout-four-columns';
7
+ import LayoutThreeColumnsIcon from '@atlaskit/icon/core/layout-three-columns';
8
+ import LayoutTwoColumnsIcon from '@atlaskit/icon/core/layout-two-columns';
9
9
  import { selectIntoLayoutSection } from '../../layoutPlugin';
10
10
  import { createMultiColumnLayoutSection } from '../../pm-plugins/actions';
11
11
  const icons = {
@@ -13,8 +13,8 @@ import LayoutTwoColumnsIcon from '@atlaskit/icon/core/layout-two-columns';
13
13
  import LayoutTwoColumnsSidebarLeftIcon from '@atlaskit/icon/core/layout-two-columns-sidebar-left';
14
14
  import LayoutTwoColumnsSidebarRightIcon from '@atlaskit/icon/core/layout-two-columns-sidebar-right';
15
15
  import TableColumnsDistributeIcon from '@atlaskit/icon/core/table-columns-distribute';
16
- import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
17
16
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
17
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
18
18
  import { deleteActiveLayoutNode, distributeLayoutColumns, getPresetLayout, setPresetLayout } from '../pm-plugins/actions';
19
19
  import { isDistributedUniformly } from '../pm-plugins/utils/layout-column-distribution';
20
20
  import { EditorLayoutFiveColumnsIcon, EditorLayoutFourColumnsIcon } from './icons/LayoutColumnsIcon';
@@ -1,2 +1,3 @@
1
1
  /* eslint-disable @atlaskit/editor/no-re-export */
2
+
2
3
  export { layoutPlugin } from '../layoutPlugin';
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
- import { layoutColumn, layoutColumnWithLocalId } from '@atlaskit/adf-schema/nodes/layout-column';
3
2
  import { layoutSection, layoutSectionWithLocalId, layoutSectionWithSingleColumn, layoutSectionWithSingleColumnLocalId } from '@atlaskit/adf-schema/layout-section';
3
+ import { layoutColumn, layoutColumnWithLocalId } from '@atlaskit/adf-schema/nodes/layout-column';
4
4
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
5
5
  import { TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM, TRANSFORM_STRUCTURE_MENU_SECTION, TRANSFORM_STRUCTURE_MENU_SECTION_RANK } from '@atlaskit/editor-common/block-menu';
6
6
  import { layoutMessages, toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
@@ -9,8 +9,8 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
9
9
  import { findParentNode } from '@atlaskit/editor-prosemirror/utils';
10
10
  import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
11
11
  import { fg } from '@atlaskit/platform-feature-flags/fg';
12
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
12
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
13
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
14
14
  import { createDefaultLayoutSection, createMultiColumnLayoutSection, deleteLayoutColumn as _deleteLayoutColumn, distributeLayoutColumns as _distributeLayoutColumns, insertLayoutColumn as _insertLayoutColumn, insertLayoutColumnsWithAnalytics, setLayoutColumnDangerPreview, setLayoutColumnValign as _setLayoutColumnValign, toggleLayoutColumnMenu } from './pm-plugins/actions';
15
15
  import { default as createLayoutKeymapPlugin } from './pm-plugins/keymap';
16
16
  import { default as createLayoutPlugin } from './pm-plugins/main';
@@ -52,7 +52,7 @@ export var selectIntoLayoutSection = function selectIntoLayoutSection(tr) {
52
52
  return tr;
53
53
  };
54
54
  export var layoutPlugin = function layoutPlugin(_ref) {
55
- var _api$analytics2;
55
+ var _api$blockMenu, _api$analytics2;
56
56
  var _ref$config = _ref.config,
57
57
  options = _ref$config === void 0 ? {} : _ref$config,
58
58
  api = _ref.api;
@@ -62,23 +62,20 @@ export var layoutPlugin = function layoutPlugin(_ref) {
62
62
  exposure: true
63
63
  });
64
64
  var isRegisteredSlashCommandEnabled = isExperimentEnabled('platform_editor_slash_command') && isAdvancedLayoutEnabled;
65
- if (editorExperiment('platform_editor_block_menu', true)) {
66
- var _api$blockMenu;
67
- api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents([{
68
- type: 'block-menu-item',
69
- key: TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key,
70
- parent: {
71
- type: 'block-menu-section',
72
- key: TRANSFORM_STRUCTURE_MENU_SECTION.key,
73
- rank: TRANSFORM_STRUCTURE_MENU_SECTION_RANK[TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]
74
- },
75
- component: createLayoutBlockMenuItem(api),
76
- isHidden: function isHidden() {
77
- var _api$blockMenu2;
78
- return Boolean(api === null || api === void 0 || (_api$blockMenu2 = api.blockMenu) === null || _api$blockMenu2 === void 0 ? void 0 : _api$blockMenu2.actions.isTransformOptionDisabled(LAYOUT_SECTION_NODE_NAME));
79
- }
80
- }]);
81
- }
65
+ api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents([{
66
+ type: 'block-menu-item',
67
+ key: TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key,
68
+ parent: {
69
+ type: 'block-menu-section',
70
+ key: TRANSFORM_STRUCTURE_MENU_SECTION.key,
71
+ rank: TRANSFORM_STRUCTURE_MENU_SECTION_RANK[TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]
72
+ },
73
+ component: createLayoutBlockMenuItem(api),
74
+ isHidden: function isHidden() {
75
+ var _api$blockMenu2;
76
+ return Boolean(api === null || api === void 0 || (_api$blockMenu2 = api.blockMenu) === null || _api$blockMenu2 === void 0 ? void 0 : _api$blockMenu2.actions.isTransformOptionDisabled(LAYOUT_SECTION_NODE_NAME));
77
+ }
78
+ }]);
82
79
  if (expValEquals('platform_editor_layout_column_menu', 'isEnabled', true)) {
83
80
  var _api$uiControlRegistr;
84
81
  api === null || api === void 0 || (_api$uiControlRegistr = api.uiControlRegistry) === null || _api$uiControlRegistr === void 0 || _api$uiControlRegistr.actions.register(getLayoutColumnMenuComponents({
@@ -170,6 +167,34 @@ export var layoutPlugin = function layoutPlugin(_ref) {
170
167
  return tr;
171
168
  };
172
169
  if (editorExperiment('advanced_layouts', true)) {
170
+ var createAdvancedColumnLayoutOption = function createAdvancedColumnLayoutOption(_ref4) {
171
+ var columnCount = _ref4.columnCount,
172
+ descriptionColumnCount = _ref4.descriptionColumnCount,
173
+ Icon = _ref4.icon,
174
+ id = _ref4.id,
175
+ keyword = _ref4.keyword,
176
+ title = _ref4.title;
177
+ return {
178
+ id: id,
179
+ title: title,
180
+ description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
181
+ numberOfColumns: descriptionColumnCount
182
+ }),
183
+ keywords: ['layout', 'column', 'section', 'col', keyword],
184
+ priority: 1100,
185
+ icon: Icon,
186
+ action: function action(insert, state) {
187
+ var tr = insert(createMultiColumnLayoutSection(state, columnCount));
188
+ if (fg('platform_editor_column_count_analytics')) {
189
+ withInsertLayoutAnalytics(tr, columnCount);
190
+ } else {
191
+ withInsertLayoutAnalytics(tr);
192
+ }
193
+ selectIntoLayoutSection(tr);
194
+ return tr;
195
+ }
196
+ };
197
+ };
173
198
  var advancedSingleColumnOption = allowAdvancedSingleColumnLayout ? [{
174
199
  id: 'onecolumnlayout',
175
200
  title: formatMessage(layoutMessages.singleColumnAdvancedLayout),
@@ -190,158 +215,43 @@ export var layoutPlugin = function layoutPlugin(_ref) {
190
215
  return tr;
191
216
  }
192
217
  }] : [];
193
- if (expValEquals('platform_editor_layout_typeahead_reorder', 'isEnabled', true)) {
194
- var createAdvancedColumnLayoutOption = function createAdvancedColumnLayoutOption(_ref4) {
195
- var columnCount = _ref4.columnCount,
196
- descriptionColumnCount = _ref4.descriptionColumnCount,
197
- Icon = _ref4.icon,
198
- id = _ref4.id,
199
- keyword = _ref4.keyword,
200
- title = _ref4.title;
201
- return {
202
- id: id,
203
- title: title,
204
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
205
- numberOfColumns: descriptionColumnCount
206
- }),
207
- keywords: ['layout', 'column', 'section', 'col', keyword],
208
- priority: 1100,
209
- icon: Icon,
210
- action: function action(insert, state) {
211
- var tr = insert(createMultiColumnLayoutSection(state, columnCount));
212
- if (fg('platform_editor_column_count_analytics')) {
213
- withInsertLayoutAnalytics(tr, columnCount);
214
- } else {
215
- withInsertLayoutAnalytics(tr);
216
- }
217
- selectIntoLayoutSection(tr);
218
- return tr;
219
- }
220
- };
221
- };
222
- return [createAdvancedColumnLayoutOption({
223
- columnCount: 2,
224
- descriptionColumnCount: 'two',
225
- icon: function icon() {
226
- return /*#__PURE__*/React.createElement(IconTwoColumnLayout, null);
227
- },
228
- id: 'twocolumnslayout',
229
- keyword: 'two column',
230
- title: formatMessage(layoutMessages.twoColumnsAdvancedLayout)
231
- })].concat(advancedSingleColumnOption, [createAdvancedColumnLayoutOption({
232
- columnCount: 3,
233
- descriptionColumnCount: 'three',
234
- icon: function icon() {
235
- return /*#__PURE__*/React.createElement(IconThreeColumnLayout, null);
236
- },
237
- id: 'threecolumnslayout',
238
- keyword: 'three column',
239
- title: formatMessage(layoutMessages.threeColumnsAdvancedLayout)
240
- }), createAdvancedColumnLayoutOption({
241
- columnCount: 4,
242
- descriptionColumnCount: 'four',
243
- icon: function icon() {
244
- return /*#__PURE__*/React.createElement(IconFourColumnLayout, null);
245
- },
246
- id: 'fourcolumnslayout',
247
- keyword: 'four column',
248
- title: formatMessage(layoutMessages.fourColumns)
249
- }), createAdvancedColumnLayoutOption({
250
- columnCount: 5,
251
- descriptionColumnCount: 'five',
252
- icon: function icon() {
253
- return /*#__PURE__*/React.createElement(IconFiveColumnLayout, null);
254
- },
255
- id: 'fivecolumnslayout',
256
- keyword: 'five column',
257
- title: formatMessage(layoutMessages.fiveColumns)
258
- })]);
259
- }
260
- return [].concat(advancedSingleColumnOption, [{
261
- id: 'twocolumnslayout',
262
- title: formatMessage(layoutMessages.twoColumnsAdvancedLayout),
263
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
264
- numberOfColumns: 'two'
265
- }),
266
- keywords: ['layout', 'column', 'section', 'col', 'two column'],
267
- priority: 1100,
218
+ return [createAdvancedColumnLayoutOption({
219
+ columnCount: 2,
220
+ descriptionColumnCount: 'two',
268
221
  icon: function icon() {
269
222
  return /*#__PURE__*/React.createElement(IconTwoColumnLayout, null);
270
223
  },
271
- action: function action(insert, state) {
272
- var tr = insert(createMultiColumnLayoutSection(state, 2));
273
- if (fg('platform_editor_column_count_analytics')) {
274
- withInsertLayoutAnalytics(tr, 2);
275
- } else {
276
- withInsertLayoutAnalytics(tr);
277
- }
278
- selectIntoLayoutSection(tr);
279
- return tr;
280
- }
281
- }, {
282
- id: 'threecolumnslayout',
283
- title: formatMessage(layoutMessages.threeColumnsAdvancedLayout),
284
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
285
- numberOfColumns: 'three'
286
- }),
287
- keywords: ['layout', 'column', 'section', 'col', 'three column'],
288
- priority: 1100,
224
+ id: 'twocolumnslayout',
225
+ keyword: 'two column',
226
+ title: formatMessage(layoutMessages.twoColumnsAdvancedLayout)
227
+ })].concat(advancedSingleColumnOption, [createAdvancedColumnLayoutOption({
228
+ columnCount: 3,
229
+ descriptionColumnCount: 'three',
289
230
  icon: function icon() {
290
231
  return /*#__PURE__*/React.createElement(IconThreeColumnLayout, null);
291
232
  },
292
- action: function action(insert, state) {
293
- var tr = insert(createMultiColumnLayoutSection(state, 3));
294
- if (fg('platform_editor_column_count_analytics')) {
295
- withInsertLayoutAnalytics(tr, 3);
296
- } else {
297
- withInsertLayoutAnalytics(tr);
298
- }
299
- selectIntoLayoutSection(tr);
300
- return tr;
301
- }
302
- }, {
303
- id: 'fourcolumnslayout',
304
- title: formatMessage(layoutMessages.fourColumns),
305
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
306
- numberOfColumns: 'four'
307
- }),
308
- keywords: ['layout', 'column', 'section', 'col', 'four column'],
309
- priority: 1100,
233
+ id: 'threecolumnslayout',
234
+ keyword: 'three column',
235
+ title: formatMessage(layoutMessages.threeColumnsAdvancedLayout)
236
+ }), createAdvancedColumnLayoutOption({
237
+ columnCount: 4,
238
+ descriptionColumnCount: 'four',
310
239
  icon: function icon() {
311
240
  return /*#__PURE__*/React.createElement(IconFourColumnLayout, null);
312
241
  },
313
- action: function action(insert, state) {
314
- var tr = insert(createMultiColumnLayoutSection(state, 4));
315
- if (fg('platform_editor_column_count_analytics')) {
316
- withInsertLayoutAnalytics(tr, 4);
317
- } else {
318
- withInsertLayoutAnalytics(tr);
319
- }
320
- selectIntoLayoutSection(tr);
321
- return tr;
322
- }
323
- }, {
324
- id: 'fivecolumnslayout',
325
- title: formatMessage(layoutMessages.fiveColumns),
326
- description: formatMessage(messages.columnsDescriptionAdvancedLayout, {
327
- numberOfColumns: 'five'
328
- }),
329
- keywords: ['layout', 'column', 'section', 'col', 'five column'],
330
- priority: 1100,
242
+ id: 'fourcolumnslayout',
243
+ keyword: 'four column',
244
+ title: formatMessage(layoutMessages.fourColumns)
245
+ }), createAdvancedColumnLayoutOption({
246
+ columnCount: 5,
247
+ descriptionColumnCount: 'five',
331
248
  icon: function icon() {
332
249
  return /*#__PURE__*/React.createElement(IconFiveColumnLayout, null);
333
250
  },
334
- action: function action(insert, state) {
335
- var tr = insert(createMultiColumnLayoutSection(state, 5));
336
- if (fg('platform_editor_column_count_analytics')) {
337
- withInsertLayoutAnalytics(tr, 5);
338
- } else {
339
- withInsertLayoutAnalytics(tr);
340
- }
341
- selectIntoLayoutSection(tr);
342
- return tr;
343
- }
344
- }]);
251
+ id: 'fivecolumnslayout',
252
+ keyword: 'five column',
253
+ title: formatMessage(layoutMessages.fiveColumns)
254
+ })]);
345
255
  } else {
346
256
  return [{
347
257
  id: 'layout',
@@ -16,8 +16,8 @@ import { BreakoutResizer, ignoreResizerMutations } from '@atlaskit/editor-common
16
16
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
17
17
  import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
18
18
  import { fg } from '@atlaskit/platform-feature-flags/fg';
19
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
20
19
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
20
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
21
21
  import { selectIntoLayout } from '../pm-plugins/utils';
22
22
  import { LayoutSSRReactContextsProvider } from '../ui/LayoutSSRReactContextsProvider';
23
23
  import { isEmptyLayout } from './utils';
@@ -9,8 +9,8 @@ import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state
9
9
  import { Mapping, StepMap } from '@atlaskit/editor-prosemirror/transform';
10
10
  import { safeInsert } from '@atlaskit/editor-prosemirror/utils';
11
11
  import { fg } from '@atlaskit/platform-feature-flags/fg';
12
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
12
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
13
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
14
14
  import { DEFAULT_LAYOUT_COLUMN_VALIGN, EVEN_DISTRIBUTED_COL_WIDTHS, MAX_LAYOUT_COLUMNS, MAX_STANDARD_LAYOUT_COLUMNS, MIN_LAYOUT_COLUMN_WIDTH_PERCENT } from './consts';
15
15
  import { pluginKey } from './plugin-key';
16
16
  import { calculateDistribution, isDistributedUniformly, redistributeAfterDeletion, redistributeProportionally } from './utils/layout-column-distribution';
@@ -11,8 +11,8 @@ import { Fragment } from '@atlaskit/editor-prosemirror/model';
11
11
  import { NodeSelection, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
12
12
  import { findParentNodeClosestToPos, findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
13
13
  import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
14
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
15
14
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
15
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
16
16
  import { fixColumnSizes, fixColumnStructure, getSelectedLayout, LAYOUT_COLUMN_INSERT_META } from './actions';
17
17
  import { getColumnDividerDecorations } from './column-resize-divider';
18
18
  import { EVEN_DISTRIBUTED_COL_WIDTHS } from './consts';
@@ -4,8 +4,8 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
4
4
  import { findParentNodeOfType, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
5
5
  import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
6
6
  import { fg } from '@atlaskit/platform-feature-flags/fg';
7
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
8
7
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
8
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
9
9
  export var getMaybeLayoutSection = function getMaybeLayoutSection(state) {
10
10
  var _state$schema$nodes = state.schema.nodes,
11
11
  layoutSection = _state$schema$nodes.layoutSection,
@@ -2,10 +2,10 @@ import React, { useCallback } from 'react';
2
2
  import { useIntl } from 'react-intl';
3
3
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
4
4
  import { QuickInsertMenuItem } from '@atlaskit/editor-common/quick-insert/menu-item';
5
- import LayoutThreeColumnsIcon from '@atlaskit/icon/core/layout-three-columns';
6
- import LayoutTwoColumnsIcon from '@atlaskit/icon/core/layout-two-columns';
7
5
  import LayoutFiveColumnsIcon from '@atlaskit/icon-lab/core/layout-five-columns';
8
6
  import LayoutFourColumnsIcon from '@atlaskit/icon-lab/core/layout-four-columns';
7
+ import LayoutThreeColumnsIcon from '@atlaskit/icon/core/layout-three-columns';
8
+ import LayoutTwoColumnsIcon from '@atlaskit/icon/core/layout-two-columns';
9
9
  import { selectIntoLayoutSection } from '../../layoutPlugin';
10
10
  import { createMultiColumnLayoutSection } from '../../pm-plugins/actions';
11
11
  var icons = {
@@ -17,8 +17,8 @@ import LayoutTwoColumnsIcon from '@atlaskit/icon/core/layout-two-columns';
17
17
  import LayoutTwoColumnsSidebarLeftIcon from '@atlaskit/icon/core/layout-two-columns-sidebar-left';
18
18
  import LayoutTwoColumnsSidebarRightIcon from '@atlaskit/icon/core/layout-two-columns-sidebar-right';
19
19
  import TableColumnsDistributeIcon from '@atlaskit/icon/core/table-columns-distribute';
20
- import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
21
20
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
21
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
22
22
  import { deleteActiveLayoutNode, distributeLayoutColumns, getPresetLayout, setPresetLayout } from '../pm-plugins/actions';
23
23
  import { isDistributedUniformly } from '../pm-plugins/utils/layout-column-distribution';
24
24
  import { EditorLayoutFiveColumnsIcon, EditorLayoutFourColumnsIcon } from './icons/LayoutColumnsIcon';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-layout",
3
- "version": "20.0.0",
3
+ "version": "20.0.2",
4
4
  "description": "Layout plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -37,20 +37,20 @@
37
37
  "@atlaskit/editor-plugin-width": "^20.0.0",
38
38
  "@atlaskit/editor-prosemirror": "^9.0.0",
39
39
  "@atlaskit/editor-shared-styles": "^4.3.0",
40
- "@atlaskit/editor-toolbar": "^2.6.0",
40
+ "@atlaskit/editor-toolbar": "^2.7.0",
41
41
  "@atlaskit/editor-ui-control-model": "^2.9.0",
42
42
  "@atlaskit/icon": "^37.7.0",
43
43
  "@atlaskit/icon-lab": "^7.9.0",
44
44
  "@atlaskit/platform-feature-experiments": "^0.3.0",
45
45
  "@atlaskit/platform-feature-flags": "^2.2.0",
46
- "@atlaskit/tmp-editor-statsig": "^199.0.0",
46
+ "@atlaskit/tmp-editor-statsig": "^201.0.0",
47
47
  "@atlaskit/tokens": "^18.2.0",
48
48
  "@babel/runtime": "^7.0.0",
49
49
  "@emotion/react": "^11.7.1",
50
50
  "bind-event-listener": "^3.0.0"
51
51
  },
52
52
  "peerDependencies": {
53
- "@atlaskit/editor-common": "^123.0.0",
53
+ "@atlaskit/editor-common": "^123.2.0",
54
54
  "react": "^18.2.0 || ^19.2.0",
55
55
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
56
56
  },