@atlaskit/editor-plugin-breakout 2.8.2 → 2.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/pm-plugins/pragmatic-resizer.js +3 -0
  3. package/dist/cjs/pm-plugins/resizer-callbacks.js +11 -2
  4. package/dist/cjs/pm-plugins/resizing-mark-view.js +18 -3
  5. package/dist/cjs/pm-plugins/resizing-plugin.js +14 -5
  6. package/dist/es2019/pm-plugins/pragmatic-resizer.js +3 -0
  7. package/dist/es2019/pm-plugins/resizer-callbacks.js +11 -2
  8. package/dist/es2019/pm-plugins/resizing-mark-view.js +18 -3
  9. package/dist/es2019/pm-plugins/resizing-plugin.js +14 -5
  10. package/dist/esm/pm-plugins/pragmatic-resizer.js +3 -0
  11. package/dist/esm/pm-plugins/resizer-callbacks.js +11 -2
  12. package/dist/esm/pm-plugins/resizing-mark-view.js +18 -3
  13. package/dist/esm/pm-plugins/resizing-plugin.js +14 -5
  14. package/package.json +10 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/editor-plugin-breakout
2
2
 
3
+ ## 2.9.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#170867](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/170867)
8
+ [`5ef91045141dd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5ef91045141dd) -
9
+ Add new fallback css widths for breakout resizing plugin, to fix issues in full width page
10
+
11
+ ## 2.8.3
12
+
13
+ ### Patch Changes
14
+
15
+ - [#174482](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/174482)
16
+ [`6947eb8ffc2bc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6947eb8ffc2bc) -
17
+ Add new FG to fix issue with migration logic for full width pages
18
+ - Updated dependencies
19
+
3
20
  ## 2.8.2
4
21
 
5
22
  ### Patch Changes
package/dist/cjs/pm-plugins/pragmatic-resizer.js CHANGED
@@ -71,6 +71,9 @@ var createPragmaticResizer = exports.createPragmaticResizer = function createPra
71
71
  var handle = document.createElement('div');
72
72
  handle.contentEditable = 'false';
73
73
  handle.classList.add('pm-breakout-resize-handle-container');
74
+ if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_width_changes')) {
75
+ handle.style.gridColumn = side === 'left' ? '1' : '3';
76
+ }
74
77
  var rail = document.createElement('div');
75
78
  rail.classList.add('pm-breakout-resize-handle-rail');
76
79
  if (side === 'left') {
package/dist/cjs/pm-plugins/resizer-callbacks.js CHANGED
@@ -132,7 +132,12 @@ function createResizerCallbacks(_ref2) {
132
132
  });
133
133
  }
134
134
  }
135
- contentDOM.style.setProperty(_resizingMarkView.LOCAL_RESIZE_PROPERTY, "".concat(newWidth, "px"));
135
+ if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_width_changes')) {
136
+ // dom is used for width calculations
137
+ dom.style.setProperty(_resizingMarkView.LOCAL_RESIZE_PROPERTY, "".concat(newWidth, "px"));
138
+ } else {
139
+ contentDOM.style.setProperty(_resizingMarkView.LOCAL_RESIZE_PROPERTY, "".concat(newWidth, "px"));
140
+ }
136
141
  },
137
142
  onDrop: function onDrop(_ref7) {
138
143
  var _api$guideline2;
@@ -169,7 +174,11 @@ function createResizerCallbacks(_ref2) {
169
174
  isEditMode = (api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) === 'edit';
170
175
  }
171
176
  (0, _setBreakoutWidth.setBreakoutWidth)(newWidth, mode, pos, isEditMode)(view.state, view.dispatch);
172
- contentDOM.style.removeProperty(_resizingMarkView.LOCAL_RESIZE_PROPERTY);
177
+ if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_width_changes')) {
178
+ dom.style.removeProperty(_resizingMarkView.LOCAL_RESIZE_PROPERTY);
179
+ } else {
180
+ contentDOM.style.removeProperty(_resizingMarkView.LOCAL_RESIZE_PROPERTY);
181
+ }
173
182
  if (node && (0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_hello_release')) {
174
183
  var resizedPayload = (0, _analytics.generateResizedEventPayload)({
175
184
  node: node,
package/dist/cjs/pm-plugins/resizing-mark-view.js CHANGED
@@ -44,10 +44,25 @@ var ResizingMarkView = exports.ResizingMarkView = /*#__PURE__*/function () {
44
44
  dom.style.justifyContent = 'center';
45
45
 
46
46
  // contentDOM - styles
47
- contentDOM.style.gridRow = '1';
48
- contentDOM.style.gridColumn = '1';
47
+ if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_width_changes')) {
48
+ contentDOM.style.gridColumn = '2';
49
+ } else {
50
+ contentDOM.style.gridRow = '1';
51
+ contentDOM.style.gridColumn = '1';
52
+ }
49
53
  contentDOM.style.zIndex = '1';
50
- if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_hello_release')) {
54
+ if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_width_changes')) {
55
+ if (mark.attrs.width) {
56
+ dom.style.gridTemplateColumns = "auto min(var(".concat(LOCAL_RESIZE_PROPERTY, ", ").concat(mark.attrs.width, "px), var(--ak-editor--breakout-fallback-width)) auto");
57
+ } else {
58
+ if (mark.attrs.mode === 'wide') {
59
+ contentDOM.style.width = "max(var(--ak-editor--line-length), min(var(".concat(LOCAL_RESIZE_PROPERTY, ", var(--ak-editor--breakout-wide-layout-width)), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))");
60
+ }
61
+ if (mark.attrs.mode === 'full-width') {
62
+ contentDOM.style.width = "max(var(--ak-editor--line-length), min(var(".concat(LOCAL_RESIZE_PROPERTY, ", var(--ak-editor--full-width-layout-width)), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))");
63
+ }
64
+ }
65
+ } else if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_hello_release')) {
51
66
  if (mark.attrs.width) {
52
67
  contentDOM.style.width = "min(var(".concat(LOCAL_RESIZE_PROPERTY, ", ").concat(mark.attrs.width, "px), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding)))");
53
68
  } else {
package/dist/cjs/pm-plugins/resizing-plugin.js CHANGED
@@ -51,7 +51,9 @@ var addBreakoutToResizableNode = function addBreakoutToResizableNode(_ref) {
51
51
  updatedDocChanged = true;
52
52
  } else if ((breakoutMark === null || breakoutMark === void 0 ? void 0 : breakoutMark.attrs.width) === null || (breakoutMark === null || breakoutMark === void 0 ? void 0 : breakoutMark.attrs.width) === undefined) {
53
53
  var mode = breakoutMark.attrs.mode;
54
- var newWidth = mode === 'wide' ? _editorSharedStyles.akEditorCalculatedWideLayoutWidth : _editorSharedStyles.akEditorFullWidthLayoutWidth;
54
+ var newWidth = (0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_patch_1') ?
55
+ // if breakout is present on node, but page appearance is 'full width' force width to full width to maintain backwards compatibility
56
+ isFullWidthEnabled || mode === 'full-width' ? _editorSharedStyles.akEditorFullWidthLayoutWidth : _editorSharedStyles.akEditorCalculatedWideLayoutWidth : mode === 'wide' ? _editorSharedStyles.akEditorCalculatedWideLayoutWidth : _editorSharedStyles.akEditorFullWidthLayoutWidth;
55
57
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
56
58
  width: newWidth,
57
59
  mode: mode
@@ -119,10 +121,17 @@ var createResizingPlugin = exports.createResizingPlugin = function createResizin
119
121
  handleKeyDown: (0, _handleKeyDown.handleKeyDown)(api)
120
122
  },
121
123
  appendTransaction: function appendTransaction(transactions, oldState, newState) {
122
- var _api$editorViewMode;
123
- // if editor is in live-view mode don't send transactions
124
- if ((api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) !== 'edit' && (0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_hello_release')) {
125
- return;
124
+ if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_patch_1')) {
125
+ var _api$editorViewMode;
126
+ if ((api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) === 'view') {
127
+ return;
128
+ }
129
+ } else {
130
+ var _api$editorViewMode2;
131
+ // if editor is in live-view mode don't send transactions
132
+ if ((api === null || api === void 0 || (_api$editorViewMode2 = api.editorViewMode) === null || _api$editorViewMode2 === void 0 || (_api$editorViewMode2 = _api$editorViewMode2.sharedState.currentState()) === null || _api$editorViewMode2 === void 0 ? void 0 : _api$editorViewMode2.mode) !== 'edit' && (0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_hello_release')) {
133
+ return;
134
+ }
126
135
  }
127
136
  var newTr = newState.tr;
128
137
  var hasDocChanged = false;
package/dist/es2019/pm-plugins/pragmatic-resizer.js CHANGED
@@ -59,6 +59,9 @@ export const createPragmaticResizer = ({
59
59
  const handle = document.createElement('div');
60
60
  handle.contentEditable = 'false';
61
61
  handle.classList.add('pm-breakout-resize-handle-container');
62
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
63
+ handle.style.gridColumn = side === 'left' ? '1' : '3';
64
+ }
62
65
  const rail = document.createElement('div');
63
66
  rail.classList.add('pm-breakout-resize-handle-rail');
64
67
  if (side === 'left') {
package/dist/es2019/pm-plugins/resizer-callbacks.js CHANGED
@@ -129,7 +129,12 @@ export function createResizerCallbacks({
129
129
  });
130
130
  }
131
131
  }
132
- contentDOM.style.setProperty(LOCAL_RESIZE_PROPERTY, `${newWidth}px`);
132
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
133
+ // dom is used for width calculations
134
+ dom.style.setProperty(LOCAL_RESIZE_PROPERTY, `${newWidth}px`);
135
+ } else {
136
+ contentDOM.style.setProperty(LOCAL_RESIZE_PROPERTY, `${newWidth}px`);
137
+ }
133
138
  },
134
139
  onDrop({
135
140
  location,
@@ -165,7 +170,11 @@ export function createResizerCallbacks({
165
170
  isEditMode = (api === null || api === void 0 ? void 0 : (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 ? void 0 : (_api$editorViewMode$s = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode$s === void 0 ? void 0 : _api$editorViewMode$s.mode) === 'edit';
166
171
  }
167
172
  setBreakoutWidth(newWidth, mode, pos, isEditMode)(view.state, view.dispatch);
168
- contentDOM.style.removeProperty(LOCAL_RESIZE_PROPERTY);
173
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
174
+ dom.style.removeProperty(LOCAL_RESIZE_PROPERTY);
175
+ } else {
176
+ contentDOM.style.removeProperty(LOCAL_RESIZE_PROPERTY);
177
+ }
169
178
  if (node && fg('platform_editor_breakout_resizing_hello_release')) {
170
179
  const resizedPayload = generateResizedEventPayload({
171
180
  node,
package/dist/es2019/pm-plugins/resizing-mark-view.js CHANGED
@@ -31,10 +31,25 @@ export class ResizingMarkView {
31
31
  dom.style.justifyContent = 'center';
32
32
 
33
33
  // contentDOM - styles
34
- contentDOM.style.gridRow = '1';
35
- contentDOM.style.gridColumn = '1';
34
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
35
+ contentDOM.style.gridColumn = '2';
36
+ } else {
37
+ contentDOM.style.gridRow = '1';
38
+ contentDOM.style.gridColumn = '1';
39
+ }
36
40
  contentDOM.style.zIndex = '1';
37
- if (fg('platform_editor_breakout_resizing_hello_release')) {
41
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
42
+ if (mark.attrs.width) {
43
+ dom.style.gridTemplateColumns = `auto min(var(${LOCAL_RESIZE_PROPERTY}, ${mark.attrs.width}px), var(--ak-editor--breakout-fallback-width)) auto`;
44
+ } else {
45
+ if (mark.attrs.mode === 'wide') {
46
+ contentDOM.style.width = `max(var(--ak-editor--line-length), min(var(${LOCAL_RESIZE_PROPERTY}, var(--ak-editor--breakout-wide-layout-width)), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))`;
47
+ }
48
+ if (mark.attrs.mode === 'full-width') {
49
+ contentDOM.style.width = `max(var(--ak-editor--line-length), min(var(${LOCAL_RESIZE_PROPERTY}, var(--ak-editor--full-width-layout-width)), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))`;
50
+ }
51
+ }
52
+ } else if (fg('platform_editor_breakout_resizing_hello_release')) {
38
53
  if (mark.attrs.width) {
39
54
  contentDOM.style.width = `min(var(${LOCAL_RESIZE_PROPERTY}, ${mark.attrs.width}px), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding)))`;
40
55
  } else {
package/dist/es2019/pm-plugins/resizing-plugin.js CHANGED
@@ -44,7 +44,9 @@ const addBreakoutToResizableNode = ({
44
44
  updatedDocChanged = true;
45
45
  } else if ((breakoutMark === null || breakoutMark === void 0 ? void 0 : breakoutMark.attrs.width) === null || (breakoutMark === null || breakoutMark === void 0 ? void 0 : breakoutMark.attrs.width) === undefined) {
46
46
  const mode = breakoutMark.attrs.mode;
47
- const newWidth = mode === 'wide' ? akEditorCalculatedWideLayoutWidth : akEditorFullWidthLayoutWidth;
47
+ const newWidth = fg('platform_editor_breakout_resizing_patch_1') ?
48
+ // if breakout is present on node, but page appearance is 'full width' force width to full width to maintain backwards compatibility
49
+ isFullWidthEnabled || mode === 'full-width' ? akEditorFullWidthLayoutWidth : akEditorCalculatedWideLayoutWidth : mode === 'wide' ? akEditorCalculatedWideLayoutWidth : akEditorFullWidthLayoutWidth;
48
50
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
49
51
  width: newWidth,
50
52
  mode: mode
@@ -115,10 +117,17 @@ export const createResizingPlugin = (api, getIntl, nodeViewPortalProviderAPI, op
115
117
  handleKeyDown: handleKeyDown(api)
116
118
  },
117
119
  appendTransaction(transactions, oldState, newState) {
118
- var _api$editorViewMode, _api$editorViewMode$s;
119
- // if editor is in live-view mode don't send transactions
120
- if ((api === null || api === void 0 ? void 0 : (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 ? void 0 : (_api$editorViewMode$s = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode$s === void 0 ? void 0 : _api$editorViewMode$s.mode) !== 'edit' && fg('platform_editor_breakout_resizing_hello_release')) {
121
- return;
120
+ if (fg('platform_editor_breakout_resizing_patch_1')) {
121
+ var _api$editorViewMode, _api$editorViewMode$s;
122
+ if ((api === null || api === void 0 ? void 0 : (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 ? void 0 : (_api$editorViewMode$s = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode$s === void 0 ? void 0 : _api$editorViewMode$s.mode) === 'view') {
123
+ return;
124
+ }
125
+ } else {
126
+ var _api$editorViewMode2, _api$editorViewMode2$;
127
+ // if editor is in live-view mode don't send transactions
128
+ if ((api === null || api === void 0 ? void 0 : (_api$editorViewMode2 = api.editorViewMode) === null || _api$editorViewMode2 === void 0 ? void 0 : (_api$editorViewMode2$ = _api$editorViewMode2.sharedState.currentState()) === null || _api$editorViewMode2$ === void 0 ? void 0 : _api$editorViewMode2$.mode) !== 'edit' && fg('platform_editor_breakout_resizing_hello_release')) {
129
+ return;
130
+ }
122
131
  }
123
132
  let newTr = newState.tr;
124
133
  let hasDocChanged = false;
package/dist/esm/pm-plugins/pragmatic-resizer.js CHANGED
@@ -62,6 +62,9 @@ export var createPragmaticResizer = function createPragmaticResizer(_ref2) {
62
62
  var handle = document.createElement('div');
63
63
  handle.contentEditable = 'false';
64
64
  handle.classList.add('pm-breakout-resize-handle-container');
65
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
66
+ handle.style.gridColumn = side === 'left' ? '1' : '3';
67
+ }
65
68
  var rail = document.createElement('div');
66
69
  rail.classList.add('pm-breakout-resize-handle-rail');
67
70
  if (side === 'left') {
package/dist/esm/pm-plugins/resizer-callbacks.js CHANGED
@@ -125,7 +125,12 @@ export function createResizerCallbacks(_ref2) {
125
125
  });
126
126
  }
127
127
  }
128
- contentDOM.style.setProperty(LOCAL_RESIZE_PROPERTY, "".concat(newWidth, "px"));
128
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
129
+ // dom is used for width calculations
130
+ dom.style.setProperty(LOCAL_RESIZE_PROPERTY, "".concat(newWidth, "px"));
131
+ } else {
132
+ contentDOM.style.setProperty(LOCAL_RESIZE_PROPERTY, "".concat(newWidth, "px"));
133
+ }
129
134
  },
130
135
  onDrop: function onDrop(_ref7) {
131
136
  var _api$guideline2;
@@ -162,7 +167,11 @@ export function createResizerCallbacks(_ref2) {
162
167
  isEditMode = (api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) === 'edit';
163
168
  }
164
169
  setBreakoutWidth(newWidth, mode, pos, isEditMode)(view.state, view.dispatch);
165
- contentDOM.style.removeProperty(LOCAL_RESIZE_PROPERTY);
170
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
171
+ dom.style.removeProperty(LOCAL_RESIZE_PROPERTY);
172
+ } else {
173
+ contentDOM.style.removeProperty(LOCAL_RESIZE_PROPERTY);
174
+ }
166
175
  if (node && fg('platform_editor_breakout_resizing_hello_release')) {
167
176
  var resizedPayload = generateResizedEventPayload({
168
177
  node: node,
package/dist/esm/pm-plugins/resizing-mark-view.js CHANGED
@@ -37,10 +37,25 @@ export var ResizingMarkView = /*#__PURE__*/function () {
37
37
  dom.style.justifyContent = 'center';
38
38
 
39
39
  // contentDOM - styles
40
- contentDOM.style.gridRow = '1';
41
- contentDOM.style.gridColumn = '1';
40
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
41
+ contentDOM.style.gridColumn = '2';
42
+ } else {
43
+ contentDOM.style.gridRow = '1';
44
+ contentDOM.style.gridColumn = '1';
45
+ }
42
46
  contentDOM.style.zIndex = '1';
43
- if (fg('platform_editor_breakout_resizing_hello_release')) {
47
+ if (fg('platform_editor_breakout_resizing_width_changes')) {
48
+ if (mark.attrs.width) {
49
+ dom.style.gridTemplateColumns = "auto min(var(".concat(LOCAL_RESIZE_PROPERTY, ", ").concat(mark.attrs.width, "px), var(--ak-editor--breakout-fallback-width)) auto");
50
+ } else {
51
+ if (mark.attrs.mode === 'wide') {
52
+ contentDOM.style.width = "max(var(--ak-editor--line-length), min(var(".concat(LOCAL_RESIZE_PROPERTY, ", var(--ak-editor--breakout-wide-layout-width)), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))");
53
+ }
54
+ if (mark.attrs.mode === 'full-width') {
55
+ contentDOM.style.width = "max(var(--ak-editor--line-length), min(var(".concat(LOCAL_RESIZE_PROPERTY, ", var(--ak-editor--full-width-layout-width)), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))");
56
+ }
57
+ }
58
+ } else if (fg('platform_editor_breakout_resizing_hello_release')) {
44
59
  if (mark.attrs.width) {
45
60
  contentDOM.style.width = "min(var(".concat(LOCAL_RESIZE_PROPERTY, ", ").concat(mark.attrs.width, "px), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding)))");
46
61
  } else {
package/dist/esm/pm-plugins/resizing-plugin.js CHANGED
@@ -44,7 +44,9 @@ var addBreakoutToResizableNode = function addBreakoutToResizableNode(_ref) {
44
44
  updatedDocChanged = true;
45
45
  } else if ((breakoutMark === null || breakoutMark === void 0 ? void 0 : breakoutMark.attrs.width) === null || (breakoutMark === null || breakoutMark === void 0 ? void 0 : breakoutMark.attrs.width) === undefined) {
46
46
  var mode = breakoutMark.attrs.mode;
47
- var newWidth = mode === 'wide' ? akEditorCalculatedWideLayoutWidth : akEditorFullWidthLayoutWidth;
47
+ var newWidth = fg('platform_editor_breakout_resizing_patch_1') ?
48
+ // if breakout is present on node, but page appearance is 'full width' force width to full width to maintain backwards compatibility
49
+ isFullWidthEnabled || mode === 'full-width' ? akEditorFullWidthLayoutWidth : akEditorCalculatedWideLayoutWidth : mode === 'wide' ? akEditorCalculatedWideLayoutWidth : akEditorFullWidthLayoutWidth;
48
50
  updatedTr = newTr.setNodeMarkup(pos, node.type, node.attrs, [breakout.create({
49
51
  width: newWidth,
50
52
  mode: mode
@@ -112,10 +114,17 @@ export var createResizingPlugin = function createResizingPlugin(api, getIntl, no
112
114
  handleKeyDown: handleKeyDown(api)
113
115
  },
114
116
  appendTransaction: function appendTransaction(transactions, oldState, newState) {
115
- var _api$editorViewMode;
116
- // if editor is in live-view mode don't send transactions
117
- if ((api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) !== 'edit' && fg('platform_editor_breakout_resizing_hello_release')) {
118
- return;
117
+ if (fg('platform_editor_breakout_resizing_patch_1')) {
118
+ var _api$editorViewMode;
119
+ if ((api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) === 'view') {
120
+ return;
121
+ }
122
+ } else {
123
+ var _api$editorViewMode2;
124
+ // if editor is in live-view mode don't send transactions
125
+ if ((api === null || api === void 0 || (_api$editorViewMode2 = api.editorViewMode) === null || _api$editorViewMode2 === void 0 || (_api$editorViewMode2 = _api$editorViewMode2.sharedState.currentState()) === null || _api$editorViewMode2 === void 0 ? void 0 : _api$editorViewMode2.mode) !== 'edit' && fg('platform_editor_breakout_resizing_hello_release')) {
126
+ return;
127
+ }
119
128
  }
120
129
  var newTr = newState.tr;
121
130
  var hasDocChanged = false;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-breakout",
3
- "version": "2.8.2",
3
+ "version": "2.9.0",
4
4
  "description": "Breakout plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -34,7 +34,7 @@
34
34
  },
35
35
  "dependencies": {
36
36
  "@atlaskit/adf-schema": "^47.6.0",
37
- "@atlaskit/editor-common": "^107.0.0",
37
+ "@atlaskit/editor-common": "^107.1.0",
38
38
  "@atlaskit/editor-plugin-block-controls": "^3.19.0",
39
39
  "@atlaskit/editor-plugin-editor-disabled": "^2.1.0",
40
40
  "@atlaskit/editor-plugin-editor-viewmode": "^4.0.0",
@@ -44,12 +44,12 @@
44
44
  "@atlaskit/editor-plugin-width": "^3.0.0",
45
45
  "@atlaskit/editor-prosemirror": "7.0.0",
46
46
  "@atlaskit/editor-shared-styles": "^3.4.0",
47
- "@atlaskit/icon": "^27.0.0",
47
+ "@atlaskit/icon": "^27.1.0",
48
48
  "@atlaskit/platform-feature-flags": "^1.1.0",
49
49
  "@atlaskit/pragmatic-drag-and-drop": "^1.7.0",
50
50
  "@atlaskit/theme": "^18.0.0",
51
51
  "@atlaskit/tmp-editor-statsig": "^8.0.0",
52
- "@atlaskit/tokens": "^5.3.0",
52
+ "@atlaskit/tokens": "^5.4.0",
53
53
  "@atlaskit/tooltip": "^20.3.0",
54
54
  "@babel/runtime": "^7.0.0",
55
55
  "@emotion/react": "^11.7.1",
@@ -119,6 +119,12 @@
119
119
  },
120
120
  "platform_editor_breakout_resizing_hello_release": {
121
121
  "type": "boolean"
122
+ },
123
+ "platform_editor_breakout_resizing_patch_1": {
124
+ "type": "boolean"
125
+ },
126
+ "platform_editor_breakout_resizing_width_changes": {
127
+ "type": "boolean"
122
128
  }
123
129
  }
124
130
  }