@atlaskit/editor-plugin-breakout 1.8.7 → 1.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 (10) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/cjs/plugin.js +37 -12
  3. package/dist/cjs/utils/is-supported-node.js +5 -0
  4. package/dist/es2019/plugin.js +37 -12
  5. package/dist/es2019/utils/is-supported-node.js +5 -0
  6. package/dist/esm/plugin.js +37 -12
  7. package/dist/esm/utils/is-supported-node.js +5 -0
  8. package/dist/types/plugin.d.ts +6 -1
  9. package/dist/types-ts4.5/plugin.d.ts +3 -1
  10. package/package.json +9 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/editor-plugin-breakout
2
2
 
3
+ ## 1.9.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#159777](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/159777)
8
+ [`64dae465493a4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/64dae465493a4) -
9
+ Add Breakout Resizing component to editor-common, add support in Layout plugin
10
+
11
+ ### Patch Changes
12
+
13
+ - [#158291](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/158291)
14
+ [`f485597c02e9a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f485597c02e9a) -
15
+ Refactoring the core editor component to remove unsafe methods for React 18.
16
+ - Updated dependencies
17
+
3
18
  ## 1.8.7
4
19
 
5
20
  ### Patch Changes
package/dist/cjs/plugin.js CHANGED
@@ -134,13 +134,26 @@ mark, view) {
134
134
  dom.style.display = 'flex';
135
135
  dom.style.justifyContent = 'center';
136
136
  contentDOM.style.transition = "min-width 0.5s ".concat(_editorSharedStyles.akEditorSwoopCubicBezier);
137
-
138
- // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
139
- if (mark.attrs.mode === 'full-width') {
140
- contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
141
- }
142
- if (mark.attrs.mode === 'wide') {
143
- contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
137
+ if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_breakout_resizing')) {
138
+ if (mark.attrs.width) {
139
+ contentDOM.style.minWidth = "min(".concat(mark.attrs.width, "px, calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding)))");
140
+ } else {
141
+ // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
142
+ if (mark.attrs.mode === 'full-width') {
143
+ contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
144
+ }
145
+ if (mark.attrs.mode === 'wide') {
146
+ contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
147
+ }
148
+ }
149
+ } else {
150
+ // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
151
+ if (mark.attrs.mode === 'full-width') {
152
+ contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
153
+ }
154
+ if (mark.attrs.mode === 'wide') {
155
+ contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
156
+ }
144
157
  }
145
158
  this.dom = dom;
146
159
  this.mark = mark;
@@ -192,24 +205,36 @@ function createPlugin(pluginInjectionApi, _ref2) {
192
205
  });
193
206
  }
194
207
  var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
195
- var _breakoutState$breako, _breakoutState$breako2;
208
+ var _breakoutState$breako3, _breakoutState$breako4;
196
209
  var api = _ref3.api,
197
210
  editorView = _ref3.editorView,
198
211
  boundariesElement = _ref3.boundariesElement,
199
212
  scrollableElement = _ref3.scrollableElement,
200
213
  mountPoint = _ref3.mountPoint;
201
214
  // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
202
- var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['width', 'breakout', 'editorViewMode']),
215
+ var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['width', 'breakout', 'editorViewMode', 'editorDisabled']),
203
216
  breakoutState = _useSharedPluginState.breakoutState,
204
- editorViewModeState = _useSharedPluginState.editorViewModeState;
217
+ editorViewModeState = _useSharedPluginState.editorViewModeState,
218
+ editorDisabledState = _useSharedPluginState.editorDisabledState;
205
219
  var isViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
206
220
  var isEditMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit';
221
+ if ((0, _platformFeatureFlags.fg)('platform_editor_react_editor_view_react_18')) {
222
+ var _breakoutState$breako, _breakoutState$breako2;
223
+ return !isViewMode && editorDisabledState !== undefined && !(editorDisabledState !== null && editorDisabledState !== void 0 && editorDisabledState.editorDisabled) ? /*#__PURE__*/_react.default.createElement(_LayoutButton.default, {
224
+ editorView: editorView,
225
+ mountPoint: mountPoint,
226
+ boundariesElement: boundariesElement,
227
+ scrollableElement: scrollableElement,
228
+ node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null,
229
+ isLivePage: isEditMode
230
+ }) : null;
231
+ }
207
232
  return !isViewMode ? /*#__PURE__*/_react.default.createElement(_LayoutButton.default, {
208
233
  editorView: editorView,
209
234
  mountPoint: mountPoint,
210
235
  boundariesElement: boundariesElement,
211
236
  scrollableElement: scrollableElement,
212
- node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null,
237
+ node: (_breakoutState$breako3 = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako4 = breakoutState.breakoutNode) === null || _breakoutState$breako4 === void 0 ? void 0 : _breakoutState$breako4.node) !== null && _breakoutState$breako3 !== void 0 ? _breakoutState$breako3 : null,
213
238
  isLivePage: isEditMode
214
239
  }) : null;
215
240
  };
@@ -252,7 +277,7 @@ var breakoutPlugin = exports.breakoutPlugin = function breakoutPlugin(_ref4) {
252
277
  popupsBoundariesElement = _ref5.popupsBoundariesElement,
253
278
  popupsScrollableElement = _ref5.popupsScrollableElement;
254
279
  // This is a bit crappy, but should be resolved once we move to a static schema.
255
- if (options && !options.allowBreakoutButton || !editorView.editable) {
280
+ if (options && !options.allowBreakoutButton || !editorView.editable && !(0, _platformFeatureFlags.fg)('platform_editor_react_editor_view_react_18')) {
256
281
  return null;
257
282
  }
258
283
  return /*#__PURE__*/_react.default.createElement(LayoutButtonWrapper, {
package/dist/cjs/utils/is-supported-node.js CHANGED
@@ -4,12 +4,17 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.isSupportedNodeForBreakout = isSupportedNodeForBreakout;
7
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
7
8
  var supportedNodesForBreakout = ['codeBlock', 'layoutSection', 'expand'];
9
+ var supportedNodesForBreakoutAdvancedLayouts = ['codeBlock', 'expand'];
8
10
 
9
11
  /**
10
12
  * Check if breakout can be applied to a node
11
13
  * @param node Node to check
12
14
  */
13
15
  function isSupportedNodeForBreakout(node) {
16
+ if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_breakout_resizing')) {
17
+ return supportedNodesForBreakoutAdvancedLayouts.indexOf(node.type.name) !== -1;
18
+ }
14
19
  return supportedNodesForBreakout.indexOf(node.type.name) !== -1;
15
20
  }
package/dist/es2019/plugin.js CHANGED
@@ -121,13 +121,26 @@ class BreakoutView {
121
121
  dom.style.display = 'flex';
122
122
  dom.style.justifyContent = 'center';
123
123
  contentDOM.style.transition = `min-width 0.5s ${akEditorSwoopCubicBezier}`;
124
-
125
- // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
126
- if (mark.attrs.mode === 'full-width') {
127
- contentDOM.style.minWidth = `max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))`;
128
- }
129
- if (mark.attrs.mode === 'wide') {
130
- contentDOM.style.minWidth = `max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))`;
124
+ if (fg('platform_editor_advanced_layouts_breakout_resizing')) {
125
+ if (mark.attrs.width) {
126
+ contentDOM.style.minWidth = `min(${mark.attrs.width}px, calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding)))`;
127
+ } else {
128
+ // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
129
+ if (mark.attrs.mode === 'full-width') {
130
+ contentDOM.style.minWidth = `max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))`;
131
+ }
132
+ if (mark.attrs.mode === 'wide') {
133
+ contentDOM.style.minWidth = `max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))`;
134
+ }
135
+ }
136
+ } else {
137
+ // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
138
+ if (mark.attrs.mode === 'full-width') {
139
+ contentDOM.style.minWidth = `max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))`;
140
+ }
141
+ if (mark.attrs.mode === 'wide') {
142
+ contentDOM.style.minWidth = `max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))`;
143
+ }
131
144
  }
132
145
  this.dom = dom;
133
146
  this.mark = mark;
@@ -188,20 +201,32 @@ const LayoutButtonWrapper = ({
188
201
  scrollableElement,
189
202
  mountPoint
190
203
  }) => {
191
- var _breakoutState$breako, _breakoutState$breako2;
204
+ var _breakoutState$breako3, _breakoutState$breako4;
192
205
  // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
193
206
  const {
194
207
  breakoutState,
195
- editorViewModeState
196
- } = useSharedPluginState(api, ['width', 'breakout', 'editorViewMode']);
208
+ editorViewModeState,
209
+ editorDisabledState
210
+ } = useSharedPluginState(api, ['width', 'breakout', 'editorViewMode', 'editorDisabled']);
197
211
  const isViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
198
212
  const isEditMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit';
213
+ if (fg('platform_editor_react_editor_view_react_18')) {
214
+ var _breakoutState$breako, _breakoutState$breako2;
215
+ return !isViewMode && editorDisabledState !== undefined && !(editorDisabledState !== null && editorDisabledState !== void 0 && editorDisabledState.editorDisabled) ? /*#__PURE__*/React.createElement(LayoutButton, {
216
+ editorView: editorView,
217
+ mountPoint: mountPoint,
218
+ boundariesElement: boundariesElement,
219
+ scrollableElement: scrollableElement,
220
+ node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null,
221
+ isLivePage: isEditMode
222
+ }) : null;
223
+ }
199
224
  return !isViewMode ? /*#__PURE__*/React.createElement(LayoutButton, {
200
225
  editorView: editorView,
201
226
  mountPoint: mountPoint,
202
227
  boundariesElement: boundariesElement,
203
228
  scrollableElement: scrollableElement,
204
- node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null,
229
+ node: (_breakoutState$breako3 = breakoutState === null || breakoutState === void 0 ? void 0 : (_breakoutState$breako4 = breakoutState.breakoutNode) === null || _breakoutState$breako4 === void 0 ? void 0 : _breakoutState$breako4.node) !== null && _breakoutState$breako3 !== void 0 ? _breakoutState$breako3 : null,
205
230
  isLivePage: isEditMode
206
231
  }) : null;
207
232
  };
@@ -243,7 +268,7 @@ export const breakoutPlugin = ({
243
268
  popupsScrollableElement
244
269
  }) {
245
270
  // This is a bit crappy, but should be resolved once we move to a static schema.
246
- if (options && !options.allowBreakoutButton || !editorView.editable) {
271
+ if (options && !options.allowBreakoutButton || !editorView.editable && !fg('platform_editor_react_editor_view_react_18')) {
247
272
  return null;
248
273
  }
249
274
  return /*#__PURE__*/React.createElement(LayoutButtonWrapper, {
package/dist/es2019/utils/is-supported-node.js CHANGED
@@ -1,9 +1,14 @@
1
+ import { fg } from '@atlaskit/platform-feature-flags';
1
2
  const supportedNodesForBreakout = ['codeBlock', 'layoutSection', 'expand'];
3
+ const supportedNodesForBreakoutAdvancedLayouts = ['codeBlock', 'expand'];
2
4
 
3
5
  /**
4
6
  * Check if breakout can be applied to a node
5
7
  * @param node Node to check
6
8
  */
7
9
  export function isSupportedNodeForBreakout(node) {
10
+ if (fg('platform_editor_advanced_layouts_breakout_resizing')) {
11
+ return supportedNodesForBreakoutAdvancedLayouts.indexOf(node.type.name) !== -1;
12
+ }
8
13
  return supportedNodesForBreakout.indexOf(node.type.name) !== -1;
9
14
  }
package/dist/esm/plugin.js CHANGED
@@ -127,13 +127,26 @@ mark, view) {
127
127
  dom.style.display = 'flex';
128
128
  dom.style.justifyContent = 'center';
129
129
  contentDOM.style.transition = "min-width 0.5s ".concat(akEditorSwoopCubicBezier);
130
-
131
- // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
132
- if (mark.attrs.mode === 'full-width') {
133
- contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
134
- }
135
- if (mark.attrs.mode === 'wide') {
136
- contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
130
+ if (fg('platform_editor_advanced_layouts_breakout_resizing')) {
131
+ if (mark.attrs.width) {
132
+ contentDOM.style.minWidth = "min(".concat(mark.attrs.width, "px, calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding)))");
133
+ } else {
134
+ // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
135
+ if (mark.attrs.mode === 'full-width') {
136
+ contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
137
+ }
138
+ if (mark.attrs.mode === 'wide') {
139
+ contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
140
+ }
141
+ }
142
+ } else {
143
+ // original breakout algorithm is in calcBreakoutWidth from platform/packages/editor/editor-common/src/utils/breakout.ts
144
+ if (mark.attrs.mode === 'full-width') {
145
+ contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--full-width-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
146
+ }
147
+ if (mark.attrs.mode === 'wide') {
148
+ contentDOM.style.minWidth = "max(var(--ak-editor--line-length), min(var(--ak-editor--breakout-wide-layout-width), calc(100cqw - var(--ak-editor--breakout-full-page-guttering-padding))))";
149
+ }
137
150
  }
138
151
  this.dom = dom;
139
152
  this.mark = mark;
@@ -185,24 +198,36 @@ function createPlugin(pluginInjectionApi, _ref2) {
185
198
  });
186
199
  }
187
200
  var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
188
- var _breakoutState$breako, _breakoutState$breako2;
201
+ var _breakoutState$breako3, _breakoutState$breako4;
189
202
  var api = _ref3.api,
190
203
  editorView = _ref3.editorView,
191
204
  boundariesElement = _ref3.boundariesElement,
192
205
  scrollableElement = _ref3.scrollableElement,
193
206
  mountPoint = _ref3.mountPoint;
194
207
  // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
195
- var _useSharedPluginState = useSharedPluginState(api, ['width', 'breakout', 'editorViewMode']),
208
+ var _useSharedPluginState = useSharedPluginState(api, ['width', 'breakout', 'editorViewMode', 'editorDisabled']),
196
209
  breakoutState = _useSharedPluginState.breakoutState,
197
- editorViewModeState = _useSharedPluginState.editorViewModeState;
210
+ editorViewModeState = _useSharedPluginState.editorViewModeState,
211
+ editorDisabledState = _useSharedPluginState.editorDisabledState;
198
212
  var isViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
199
213
  var isEditMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit';
214
+ if (fg('platform_editor_react_editor_view_react_18')) {
215
+ var _breakoutState$breako, _breakoutState$breako2;
216
+ return !isViewMode && editorDisabledState !== undefined && !(editorDisabledState !== null && editorDisabledState !== void 0 && editorDisabledState.editorDisabled) ? /*#__PURE__*/React.createElement(LayoutButton, {
217
+ editorView: editorView,
218
+ mountPoint: mountPoint,
219
+ boundariesElement: boundariesElement,
220
+ scrollableElement: scrollableElement,
221
+ node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null,
222
+ isLivePage: isEditMode
223
+ }) : null;
224
+ }
200
225
  return !isViewMode ? /*#__PURE__*/React.createElement(LayoutButton, {
201
226
  editorView: editorView,
202
227
  mountPoint: mountPoint,
203
228
  boundariesElement: boundariesElement,
204
229
  scrollableElement: scrollableElement,
205
- node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null,
230
+ node: (_breakoutState$breako3 = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako4 = breakoutState.breakoutNode) === null || _breakoutState$breako4 === void 0 ? void 0 : _breakoutState$breako4.node) !== null && _breakoutState$breako3 !== void 0 ? _breakoutState$breako3 : null,
206
231
  isLivePage: isEditMode
207
232
  }) : null;
208
233
  };
@@ -245,7 +270,7 @@ export var breakoutPlugin = function breakoutPlugin(_ref4) {
245
270
  popupsBoundariesElement = _ref5.popupsBoundariesElement,
246
271
  popupsScrollableElement = _ref5.popupsScrollableElement;
247
272
  // This is a bit crappy, but should be resolved once we move to a static schema.
248
- if (options && !options.allowBreakoutButton || !editorView.editable) {
273
+ if (options && !options.allowBreakoutButton || !editorView.editable && !fg('platform_editor_react_editor_view_react_18')) {
249
274
  return null;
250
275
  }
251
276
  return /*#__PURE__*/React.createElement(LayoutButtonWrapper, {
package/dist/esm/utils/is-supported-node.js CHANGED
@@ -1,9 +1,14 @@
1
+ import { fg } from '@atlaskit/platform-feature-flags';
1
2
  var supportedNodesForBreakout = ['codeBlock', 'layoutSection', 'expand'];
3
+ var supportedNodesForBreakoutAdvancedLayouts = ['codeBlock', 'expand'];
2
4
 
3
5
  /**
4
6
  * Check if breakout can be applied to a node
5
7
  * @param node Node to check
6
8
  */
7
9
  export function isSupportedNodeForBreakout(node) {
10
+ if (fg('platform_editor_advanced_layouts_breakout_resizing')) {
11
+ return supportedNodesForBreakoutAdvancedLayouts.indexOf(node.type.name) !== -1;
12
+ }
8
13
  return supportedNodesForBreakout.indexOf(node.type.name) !== -1;
9
14
  }
package/dist/types/plugin.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
2
+ import { type EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
2
3
  import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
3
4
  import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
4
5
  import type { BreakoutPluginState } from './types';
@@ -7,7 +8,11 @@ export interface BreakoutPluginOptions {
7
8
  }
8
9
  export type BreakoutPlugin = NextEditorPlugin<'breakout', {
9
10
  pluginConfiguration: BreakoutPluginOptions | undefined;
10
- dependencies: [WidthPlugin, OptionalPlugin<EditorViewModePlugin>];
11
+ dependencies: [
12
+ WidthPlugin,
13
+ OptionalPlugin<EditorViewModePlugin>,
14
+ OptionalPlugin<EditorDisabledPlugin>
15
+ ];
11
16
  sharedState: Partial<BreakoutPluginState>;
12
17
  }>;
13
18
  export declare const breakoutPlugin: BreakoutPlugin;
package/dist/types-ts4.5/plugin.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
2
+ import { type EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
2
3
  import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
3
4
  import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
4
5
  import type { BreakoutPluginState } from './types';
@@ -9,7 +10,8 @@ export type BreakoutPlugin = NextEditorPlugin<'breakout', {
9
10
  pluginConfiguration: BreakoutPluginOptions | undefined;
10
11
  dependencies: [
11
12
  WidthPlugin,
12
- OptionalPlugin<EditorViewModePlugin>
13
+ OptionalPlugin<EditorViewModePlugin>,
14
+ OptionalPlugin<EditorDisabledPlugin>
13
15
  ];
14
16
  sharedState: Partial<BreakoutPluginState>;
15
17
  }>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-breakout",
3
- "version": "1.8.7",
3
+ "version": "1.9.0",
4
4
  "description": "Breakout plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -32,7 +32,8 @@
32
32
  },
33
33
  "dependencies": {
34
34
  "@atlaskit/adf-schema": "^44.2.0",
35
- "@atlaskit/editor-common": "^94.11.0",
35
+ "@atlaskit/editor-common": "^94.12.0",
36
+ "@atlaskit/editor-plugin-editor-disabled": "^1.3.0",
36
37
  "@atlaskit/editor-plugin-editor-viewmode": "^2.1.0",
37
38
  "@atlaskit/editor-plugin-width": "^1.3.0",
38
39
  "@atlaskit/editor-prosemirror": "6.0.0",
@@ -101,6 +102,9 @@
101
102
  "platform_editor_core_increase_full_page_guttering": {
102
103
  "type": "boolean"
103
104
  },
105
+ "platform_editor_react_editor_view_react_18": {
106
+ "type": "boolean"
107
+ },
104
108
  "editor_support_code_block_wrapping": {
105
109
  "type": "boolean"
106
110
  },
@@ -109,6 +113,9 @@
109
113
  },
110
114
  "platform_editor_breakout_use_css": {
111
115
  "type": "boolean"
116
+ },
117
+ "platform_editor_advanced_layouts_breakout_resizing": {
118
+ "type": "boolean"
112
119
  }
113
120
  }
114
121
  }