@atlaskit/editor-plugin-breakout 12.3.6 → 12.3.8

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,18 @@
1
1
  # @atlaskit/editor-plugin-breakout
2
2
 
3
+ ## 12.3.8
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 12.3.7
10
+
11
+ ### Patch Changes
12
+
13
+ - [`a33857a7c0fac`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a33857a7c0fac) -
14
+ [ux] [EDITOR-8082] Fix width for breakout resizable nodes in max-width mode
15
+
3
16
  ## 12.3.6
4
17
 
5
18
  ### Patch Changes
@@ -25,7 +25,8 @@ var addBreakoutToResizableNode = function addBreakoutToResizableNode(_ref) {
25
25
  newState = _ref.newState,
26
26
  newTr = _ref.newTr,
27
27
  breakoutResizableNodes = _ref.breakoutResizableNodes,
28
- isFullWidthEnabled = _ref.isFullWidthEnabled;
28
+ isFullWidthEnabled = _ref.isFullWidthEnabled,
29
+ isMaxWidthEnabled = _ref.isMaxWidthEnabled;
29
30
  var updatedDocChanged = false;
30
31
  var updatedTr = newTr;
31
32
  var $pos = newState.doc.resolve(pos);
@@ -38,7 +39,7 @@ var addBreakoutToResizableNode = function addBreakoutToResizableNode(_ref) {
38
39
  });
39
40
  var isExpand = node.type === expand;
40
41
  if (!breakoutMark) {
41
- var width = isFullWidthEnabled ? _editorSharedStyles.akEditorFullWidthLayoutWidth : _editorSharedStyles.akEditorDefaultLayoutWidth;
42
+ var width = isMaxWidthEnabled ? _editorSharedStyles.akEditorMaxWidthLayoutWidth : isFullWidthEnabled ? _editorSharedStyles.akEditorFullWidthLayoutWidth : _editorSharedStyles.akEditorDefaultLayoutWidth;
42
43
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
43
44
  width: width
44
45
  })]);
@@ -55,7 +56,7 @@ var addBreakoutToResizableNode = function addBreakoutToResizableNode(_ref) {
55
56
  var mode = breakoutMark.attrs.mode;
56
57
 
57
58
  // if breakout is present on node, but page appearance is 'full width' force width to full width to maintain backwards compatibility
58
- var newWidth = isFullWidthEnabled || mode === 'full-width' ? _editorSharedStyles.akEditorFullWidthLayoutWidth : _editorSharedStyles.akEditorCalculatedWideLayoutWidth;
59
+ var newWidth = isMaxWidthEnabled ? _editorSharedStyles.akEditorMaxWidthLayoutWidth : isFullWidthEnabled || mode === 'full-width' ? _editorSharedStyles.akEditorFullWidthLayoutWidth : _editorSharedStyles.akEditorCalculatedWideLayoutWidth;
59
60
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
60
61
  width: newWidth,
61
62
  mode: mode
@@ -150,6 +151,7 @@ var createResizingPlugin = exports.createResizingPlugin = function createResizin
150
151
  return;
151
152
  }
152
153
  var isFullWidthEnabled = !((options === null || options === void 0 ? void 0 : options.allowBreakoutButton) === true);
154
+ var isMaxWidthEnabled = (options === null || options === void 0 ? void 0 : options.appearance) === 'max' && (0, _expValEquals.expValEquals)('confluence_max_width_content_appearance', 'isEnabled', true) && (0, _expValEquals.expValEquals)('platform_editor_lovability_breakout_resizing_fixes', 'isEnabled', true);
153
155
  var state = editorView.state;
154
156
  var _state$schema$nodes = state.schema.nodes,
155
157
  expand = _state$schema$nodes.expand,
@@ -173,7 +175,8 @@ var createResizingPlugin = exports.createResizingPlugin = function createResizin
173
175
  newState: state,
174
176
  newTr: newTr,
175
177
  breakoutResizableNodes: breakoutResizableNodes,
176
- isFullWidthEnabled: isFullWidthEnabled
178
+ isFullWidthEnabled: isFullWidthEnabled,
179
+ isMaxWidthEnabled: isMaxWidthEnabled
177
180
  }),
178
181
  updatedTr = _addBreakoutToResizab.updatedTr,
179
182
  updatedDocChanged = _addBreakoutToResizab.updatedDocChanged;
@@ -213,6 +216,7 @@ var createResizingPlugin = exports.createResizingPlugin = function createResizin
213
216
  panel_c1 = _newState$schema$node.panel_c1;
214
217
  var breakoutResizableNodes = (0, _experiments.editorExperiment)('platform_synced_block', true) ? (0, _utils.getBreakoutResizableNodeTypes)(newState.schema, isRuleAndPanelResizingEnabled) : isRuleAndPanelResizingEnabled ? new Set([expand, codeBlock, layoutSection, rule, panel, panel_c1]) : new Set([expand, codeBlock, layoutSection]);
215
218
  var isFullWidthEnabled = !((options === null || options === void 0 ? void 0 : options.allowBreakoutButton) === true);
219
+ var isMaxWidthEnabled = (options === null || options === void 0 ? void 0 : options.appearance) === 'max' && (0, _expValEquals.expValEquals)('confluence_max_width_content_appearance', 'isEnabled', true) && (0, _expValEquals.expValEquals)('platform_editor_lovability_breakout_resizing_fixes', 'isEnabled', true);
216
220
  var isPageLoadNormalizationEnabled = (0, _expValEquals.expValEquals)('platform_editor_add_breakout_marks_on_page_load', 'isEnabled', true);
217
221
  var isPanelAndDividerNormalizationEnabled = isRuleAndPanelResizingEnabled && !(0, _platformFeatureFlags.fg)('platform_editor_lovability_resize_patch_1');
218
222
  if (!isPageLoadNormalizationEnabled && !isPanelAndDividerNormalizationEnabled && (0, _document.isReplaceDocOperation)(transactions, oldState)) {
@@ -223,7 +227,8 @@ var createResizingPlugin = exports.createResizingPlugin = function createResizin
223
227
  newState: newState,
224
228
  newTr: newTr,
225
229
  breakoutResizableNodes: breakoutResizableNodes,
226
- isFullWidthEnabled: isFullWidthEnabled
230
+ isFullWidthEnabled: isFullWidthEnabled,
231
+ isMaxWidthEnabled: isMaxWidthEnabled
227
232
  }),
228
233
  updatedTr = _addBreakoutToResizab2.updatedTr,
229
234
  updatedDocChanged = _addBreakoutToResizab2.updatedDocChanged;
@@ -246,7 +251,8 @@ var createResizingPlugin = exports.createResizingPlugin = function createResizin
246
251
  newState: newState,
247
252
  newTr: newTr,
248
253
  breakoutResizableNodes: breakoutResizableNodes,
249
- isFullWidthEnabled: isFullWidthEnabled
254
+ isFullWidthEnabled: isFullWidthEnabled,
255
+ isMaxWidthEnabled: isMaxWidthEnabled
250
256
  }),
251
257
  updatedTr = _addBreakoutToResizab3.updatedTr,
252
258
  updatedDocChanged = _addBreakoutToResizab3.updatedDocChanged;
@@ -2,7 +2,7 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
2
  import { getBreakoutResizableNodeTypes, stepAddsOneOf } from '@atlaskit/editor-common/utils';
3
3
  import { getChangedNodes, isReplaceDocOperation } from '@atlaskit/editor-common/utils/document';
4
4
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
5
- import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidth } from '@atlaskit/editor-shared-styles';
5
+ import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorMaxWidthLayoutWidth, akEditorCalculatedWideLayoutWidth } from '@atlaskit/editor-shared-styles';
6
6
  import { fg } from '@atlaskit/platform-feature-flags';
7
7
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
8
8
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -15,7 +15,8 @@ const addBreakoutToResizableNode = ({
15
15
  newState,
16
16
  newTr,
17
17
  breakoutResizableNodes,
18
- isFullWidthEnabled
18
+ isFullWidthEnabled,
19
+ isMaxWidthEnabled
19
20
  }) => {
20
21
  let updatedDocChanged = false;
21
22
  let updatedTr = newTr;
@@ -31,7 +32,7 @@ const addBreakoutToResizableNode = ({
31
32
  const breakoutMark = node.marks.find(mark => mark.type === breakout);
32
33
  const isExpand = node.type === expand;
33
34
  if (!breakoutMark) {
34
- const width = isFullWidthEnabled ? akEditorFullWidthLayoutWidth : akEditorDefaultLayoutWidth;
35
+ const width = isMaxWidthEnabled ? akEditorMaxWidthLayoutWidth : isFullWidthEnabled ? akEditorFullWidthLayoutWidth : akEditorDefaultLayoutWidth;
35
36
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
36
37
  width: width
37
38
  })]);
@@ -48,7 +49,7 @@ const addBreakoutToResizableNode = ({
48
49
  const mode = breakoutMark.attrs.mode;
49
50
 
50
51
  // if breakout is present on node, but page appearance is 'full width' force width to full width to maintain backwards compatibility
51
- const newWidth = isFullWidthEnabled || mode === 'full-width' ? akEditorFullWidthLayoutWidth : akEditorCalculatedWideLayoutWidth;
52
+ const newWidth = isMaxWidthEnabled ? akEditorMaxWidthLayoutWidth : isFullWidthEnabled || mode === 'full-width' ? akEditorFullWidthLayoutWidth : akEditorCalculatedWideLayoutWidth;
52
53
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
53
54
  width: newWidth,
54
55
  mode: mode
@@ -145,6 +146,7 @@ export const createResizingPlugin = (api, getIntl, nodeViewPortalProviderAPI, op
145
146
  return;
146
147
  }
147
148
  const isFullWidthEnabled = !((options === null || options === void 0 ? void 0 : options.allowBreakoutButton) === true);
149
+ const isMaxWidthEnabled = (options === null || options === void 0 ? void 0 : options.appearance) === 'max' && expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) && expValEquals('platform_editor_lovability_breakout_resizing_fixes', 'isEnabled', true);
148
150
  const {
149
151
  state
150
152
  } = editorView;
@@ -174,7 +176,8 @@ export const createResizingPlugin = (api, getIntl, nodeViewPortalProviderAPI, op
174
176
  newState: state,
175
177
  newTr,
176
178
  breakoutResizableNodes,
177
- isFullWidthEnabled
179
+ isFullWidthEnabled,
180
+ isMaxWidthEnabled
178
181
  });
179
182
  newTr = updatedTr;
180
183
  hasDocChanged = hasDocChanged || updatedDocChanged;
@@ -214,6 +217,7 @@ export const createResizingPlugin = (api, getIntl, nodeViewPortalProviderAPI, op
214
217
  } = newState.schema.nodes;
215
218
  const breakoutResizableNodes = editorExperiment('platform_synced_block', true) ? getBreakoutResizableNodeTypes(newState.schema, isRuleAndPanelResizingEnabled) : isRuleAndPanelResizingEnabled ? new Set([expand, codeBlock, layoutSection, rule, panel, panel_c1]) : new Set([expand, codeBlock, layoutSection]);
216
219
  const isFullWidthEnabled = !((options === null || options === void 0 ? void 0 : options.allowBreakoutButton) === true);
220
+ const isMaxWidthEnabled = (options === null || options === void 0 ? void 0 : options.appearance) === 'max' && expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) && expValEquals('platform_editor_lovability_breakout_resizing_fixes', 'isEnabled', true);
217
221
  const isPageLoadNormalizationEnabled = expValEquals('platform_editor_add_breakout_marks_on_page_load', 'isEnabled', true);
218
222
  const isPanelAndDividerNormalizationEnabled = isRuleAndPanelResizingEnabled && !fg('platform_editor_lovability_resize_patch_1');
219
223
  if (!isPageLoadNormalizationEnabled && !isPanelAndDividerNormalizationEnabled && isReplaceDocOperation(transactions, oldState)) {
@@ -227,7 +231,8 @@ export const createResizingPlugin = (api, getIntl, nodeViewPortalProviderAPI, op
227
231
  newState,
228
232
  newTr,
229
233
  breakoutResizableNodes,
230
- isFullWidthEnabled
234
+ isFullWidthEnabled,
235
+ isMaxWidthEnabled
231
236
  });
232
237
  newTr = updatedTr;
233
238
  hasDocChanged = hasDocChanged || updatedDocChanged;
@@ -250,7 +255,8 @@ export const createResizingPlugin = (api, getIntl, nodeViewPortalProviderAPI, op
250
255
  newState,
251
256
  newTr,
252
257
  breakoutResizableNodes,
253
- isFullWidthEnabled
258
+ isFullWidthEnabled,
259
+ isMaxWidthEnabled
254
260
  });
255
261
  newTr = updatedTr;
256
262
  hasDocChanged = hasDocChanged || updatedDocChanged;
@@ -5,7 +5,7 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
5
5
  import { getBreakoutResizableNodeTypes, stepAddsOneOf } from '@atlaskit/editor-common/utils';
6
6
  import { getChangedNodes, isReplaceDocOperation } from '@atlaskit/editor-common/utils/document';
7
7
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
8
- import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidth } from '@atlaskit/editor-shared-styles';
8
+ import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorMaxWidthLayoutWidth, akEditorCalculatedWideLayoutWidth } from '@atlaskit/editor-shared-styles';
9
9
  import { fg } from '@atlaskit/platform-feature-flags';
10
10
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
11
11
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -18,7 +18,8 @@ var addBreakoutToResizableNode = function addBreakoutToResizableNode(_ref) {
18
18
  newState = _ref.newState,
19
19
  newTr = _ref.newTr,
20
20
  breakoutResizableNodes = _ref.breakoutResizableNodes,
21
- isFullWidthEnabled = _ref.isFullWidthEnabled;
21
+ isFullWidthEnabled = _ref.isFullWidthEnabled,
22
+ isMaxWidthEnabled = _ref.isMaxWidthEnabled;
22
23
  var updatedDocChanged = false;
23
24
  var updatedTr = newTr;
24
25
  var $pos = newState.doc.resolve(pos);
@@ -31,7 +32,7 @@ var addBreakoutToResizableNode = function addBreakoutToResizableNode(_ref) {
31
32
  });
32
33
  var isExpand = node.type === expand;
33
34
  if (!breakoutMark) {
34
- var width = isFullWidthEnabled ? akEditorFullWidthLayoutWidth : akEditorDefaultLayoutWidth;
35
+ var width = isMaxWidthEnabled ? akEditorMaxWidthLayoutWidth : isFullWidthEnabled ? akEditorFullWidthLayoutWidth : akEditorDefaultLayoutWidth;
35
36
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
36
37
  width: width
37
38
  })]);
@@ -48,7 +49,7 @@ var addBreakoutToResizableNode = function addBreakoutToResizableNode(_ref) {
48
49
  var mode = breakoutMark.attrs.mode;
49
50
 
50
51
  // if breakout is present on node, but page appearance is 'full width' force width to full width to maintain backwards compatibility
51
- var newWidth = isFullWidthEnabled || mode === 'full-width' ? akEditorFullWidthLayoutWidth : akEditorCalculatedWideLayoutWidth;
52
+ var newWidth = isMaxWidthEnabled ? akEditorMaxWidthLayoutWidth : isFullWidthEnabled || mode === 'full-width' ? akEditorFullWidthLayoutWidth : akEditorCalculatedWideLayoutWidth;
52
53
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
53
54
  width: newWidth,
54
55
  mode: mode
@@ -143,6 +144,7 @@ export var createResizingPlugin = function createResizingPlugin(api, getIntl, no
143
144
  return;
144
145
  }
145
146
  var isFullWidthEnabled = !((options === null || options === void 0 ? void 0 : options.allowBreakoutButton) === true);
147
+ var isMaxWidthEnabled = (options === null || options === void 0 ? void 0 : options.appearance) === 'max' && expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) && expValEquals('platform_editor_lovability_breakout_resizing_fixes', 'isEnabled', true);
146
148
  var state = editorView.state;
147
149
  var _state$schema$nodes = state.schema.nodes,
148
150
  expand = _state$schema$nodes.expand,
@@ -166,7 +168,8 @@ export var createResizingPlugin = function createResizingPlugin(api, getIntl, no
166
168
  newState: state,
167
169
  newTr: newTr,
168
170
  breakoutResizableNodes: breakoutResizableNodes,
169
- isFullWidthEnabled: isFullWidthEnabled
171
+ isFullWidthEnabled: isFullWidthEnabled,
172
+ isMaxWidthEnabled: isMaxWidthEnabled
170
173
  }),
171
174
  updatedTr = _addBreakoutToResizab.updatedTr,
172
175
  updatedDocChanged = _addBreakoutToResizab.updatedDocChanged;
@@ -206,6 +209,7 @@ export var createResizingPlugin = function createResizingPlugin(api, getIntl, no
206
209
  panel_c1 = _newState$schema$node.panel_c1;
207
210
  var breakoutResizableNodes = editorExperiment('platform_synced_block', true) ? getBreakoutResizableNodeTypes(newState.schema, isRuleAndPanelResizingEnabled) : isRuleAndPanelResizingEnabled ? new Set([expand, codeBlock, layoutSection, rule, panel, panel_c1]) : new Set([expand, codeBlock, layoutSection]);
208
211
  var isFullWidthEnabled = !((options === null || options === void 0 ? void 0 : options.allowBreakoutButton) === true);
212
+ var isMaxWidthEnabled = (options === null || options === void 0 ? void 0 : options.appearance) === 'max' && expValEquals('confluence_max_width_content_appearance', 'isEnabled', true) && expValEquals('platform_editor_lovability_breakout_resizing_fixes', 'isEnabled', true);
209
213
  var isPageLoadNormalizationEnabled = expValEquals('platform_editor_add_breakout_marks_on_page_load', 'isEnabled', true);
210
214
  var isPanelAndDividerNormalizationEnabled = isRuleAndPanelResizingEnabled && !fg('platform_editor_lovability_resize_patch_1');
211
215
  if (!isPageLoadNormalizationEnabled && !isPanelAndDividerNormalizationEnabled && isReplaceDocOperation(transactions, oldState)) {
@@ -216,7 +220,8 @@ export var createResizingPlugin = function createResizingPlugin(api, getIntl, no
216
220
  newState: newState,
217
221
  newTr: newTr,
218
222
  breakoutResizableNodes: breakoutResizableNodes,
219
- isFullWidthEnabled: isFullWidthEnabled
223
+ isFullWidthEnabled: isFullWidthEnabled,
224
+ isMaxWidthEnabled: isMaxWidthEnabled
220
225
  }),
221
226
  updatedTr = _addBreakoutToResizab2.updatedTr,
222
227
  updatedDocChanged = _addBreakoutToResizab2.updatedDocChanged;
@@ -239,7 +244,8 @@ export var createResizingPlugin = function createResizingPlugin(api, getIntl, no
239
244
  newState: newState,
240
245
  newTr: newTr,
241
246
  breakoutResizableNodes: breakoutResizableNodes,
242
- isFullWidthEnabled: isFullWidthEnabled
247
+ isFullWidthEnabled: isFullWidthEnabled,
248
+ isMaxWidthEnabled: isMaxWidthEnabled
243
249
  }),
244
250
  updatedTr = _addBreakoutToResizab3.updatedTr,
245
251
  updatedDocChanged = _addBreakoutToResizab3.updatedDocChanged;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-breakout",
3
- "version": "12.3.6",
3
+ "version": "12.3.8",
4
4
  "description": "Breakout plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -22,7 +22,7 @@
22
22
  "atlaskit:src": "src/index.ts",
23
23
  "dependencies": {
24
24
  "@atlaskit/adf-schema": "^56.1.0",
25
- "@atlaskit/editor-plugin-block-controls": "^13.2.0",
25
+ "@atlaskit/editor-plugin-block-controls": "^13.3.0",
26
26
  "@atlaskit/editor-plugin-editor-disabled": "^12.0.0",
27
27
  "@atlaskit/editor-plugin-editor-viewmode": "^14.0.0",
28
28
  "@atlaskit/editor-plugin-guideline": "^12.0.0",
@@ -35,8 +35,8 @@
35
35
  "@atlaskit/platform-feature-flags": "^2.1.0",
36
36
  "@atlaskit/pragmatic-drag-and-drop": "^2.0.0",
37
37
  "@atlaskit/theme": "^26.1.0",
38
- "@atlaskit/tmp-editor-statsig": "^132.0.0",
39
- "@atlaskit/tokens": "^16.2.0",
38
+ "@atlaskit/tmp-editor-statsig": "^133.0.0",
39
+ "@atlaskit/tokens": "^16.3.0",
40
40
  "@atlaskit/tooltip": "^23.1.0",
41
41
  "@babel/runtime": "^7.0.0",
42
42
  "@emotion/react": "^11.7.1",
@@ -45,7 +45,7 @@
45
45
  "uuid": "^3.1.0"
46
46
  },
47
47
  "peerDependencies": {
48
- "@atlaskit/editor-common": "^116.35.0",
48
+ "@atlaskit/editor-common": "^116.39.0",
49
49
  "react": "^18.2.0",
50
50
  "react-dom": "^18.2.0",
51
51
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"