@atlaskit/editor-core 187.32.0 → 187.32.1

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,12 @@
1
1
  # @atlaskit/editor-core
2
2
 
3
+ ## 187.32.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`37624e80f01`](https://bitbucket.org/atlassian/atlassian-frontend/commits/37624e80f01) - NO-ISSUE Cancel animation frame debounced call when unmounting scroll buttons
8
+ - [`dc93b06778b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/dc93b06778b) - Fix pasted mediaSingle nodes into parent nodes
9
+
3
10
  ## 187.32.0
4
11
 
5
12
  ### Minor Changes
@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.default = void 0;
8
+ exports.ScrollButtons = void 0;
9
9
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
10
10
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
11
  var _react = _interopRequireWildcard(require("react"));
@@ -23,7 +23,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
23
23
  var toolbarScrollButtons = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-gap: ", ";\n padding: ", " ", ";\n border-left: solid ", " 1px;\n flex-shrink: 0;\n align-items: center;\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-050, 4px)", "var(--ds-space-100, 8px)", "var(--ds-border, ".concat(_colors.N30, ")"));
24
24
  var LeftIcon = _chevronLeftLarge.default;
25
25
  var RightIcon = _chevronRightLarge.default;
26
- var _default = function _default(_ref) {
26
+ var ScrollButtons = function ScrollButtons(_ref) {
27
27
  var intl = _ref.intl,
28
28
  scrollContainerRef = _ref.scrollContainerRef,
29
29
  node = _ref.node,
@@ -41,52 +41,56 @@ var _default = function _default(_ref) {
41
41
  _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
42
42
  canScrollRight = _useState6[0],
43
43
  setCanScrollRight = _useState6[1];
44
- var scheduledSetCanScroll = (0, _rafSchd.default)(function () {
45
- var _ref2 = scrollContainerRef.current,
46
- scrollLeft = _ref2.scrollLeft,
47
- scrollWidth = _ref2.scrollWidth,
48
- offsetWidth = _ref2.offsetWidth;
44
+ var setCanScrollDebounced = (0, _rafSchd.default)(function () {
45
+ // Refs are null before mounting and after unmount
46
+ if (!scrollContainerRef.current) {
47
+ return;
48
+ }
49
+ var _scrollContainerRef$c = scrollContainerRef.current,
50
+ scrollLeft = _scrollContainerRef$c.scrollLeft,
51
+ scrollWidth = _scrollContainerRef$c.scrollWidth,
52
+ offsetWidth = _scrollContainerRef$c.offsetWidth;
49
53
  setCanScrollLeft(scrollLeft > 0);
50
54
  setCanScrollRight(scrollLeft + offsetWidth < scrollWidth - 1); // -1 to account for half pixel
51
55
  });
52
56
 
53
57
  var onScroll = function onScroll() {
54
- return scheduledSetCanScroll();
58
+ return setCanScrollDebounced();
55
59
  };
56
60
  var scrollLeft = function scrollLeft() {
57
- var _scrollContainerRef$c, _scrollContainerRef$c2, _scrollContainerRef$c3;
58
- var _ref3 = ((_scrollContainerRef$c = scrollContainerRef.current) === null || _scrollContainerRef$c === void 0 ? void 0 : _scrollContainerRef$c.getBoundingClientRect()) || {},
59
- _ref3$width = _ref3.width,
60
- scrollContainerWidth = _ref3$width === void 0 ? 0 : _ref3$width;
61
- var scrollLeft = ((_scrollContainerRef$c2 = scrollContainerRef.current) === null || _scrollContainerRef$c2 === void 0 ? void 0 : _scrollContainerRef$c2.scrollLeft) || 0;
61
+ var _scrollContainerRef$c2, _scrollContainerRef$c3, _scrollContainerRef$c4;
62
+ var _ref2 = ((_scrollContainerRef$c2 = scrollContainerRef.current) === null || _scrollContainerRef$c2 === void 0 ? void 0 : _scrollContainerRef$c2.getBoundingClientRect()) || {},
63
+ _ref2$width = _ref2.width,
64
+ scrollContainerWidth = _ref2$width === void 0 ? 0 : _ref2$width;
65
+ var scrollLeft = ((_scrollContainerRef$c3 = scrollContainerRef.current) === null || _scrollContainerRef$c3 === void 0 ? void 0 : _scrollContainerRef$c3.scrollLeft) || 0;
62
66
 
63
67
  // scroll to current position - scroll container width
64
68
  var scrollTo = scrollLeft - scrollContainerWidth;
65
- (_scrollContainerRef$c3 = scrollContainerRef.current) === null || _scrollContainerRef$c3 === void 0 ? void 0 : _scrollContainerRef$c3.scrollTo({
69
+ (_scrollContainerRef$c4 = scrollContainerRef.current) === null || _scrollContainerRef$c4 === void 0 ? void 0 : _scrollContainerRef$c4.scrollTo({
66
70
  top: 0,
67
71
  left: scrollTo,
68
72
  behavior: 'smooth'
69
73
  });
70
74
  };
71
75
  var scrollRight = function scrollRight() {
72
- var _scrollContainerRef$c4, _scrollContainerRef$c5, _scrollContainerRef$c6;
73
- var _ref4 = ((_scrollContainerRef$c4 = scrollContainerRef.current) === null || _scrollContainerRef$c4 === void 0 ? void 0 : _scrollContainerRef$c4.getBoundingClientRect()) || {},
74
- _ref4$width = _ref4.width,
75
- scrollContainerWidth = _ref4$width === void 0 ? 0 : _ref4$width;
76
- var scrollLeft = ((_scrollContainerRef$c5 = scrollContainerRef.current) === null || _scrollContainerRef$c5 === void 0 ? void 0 : _scrollContainerRef$c5.scrollLeft) || 0;
76
+ var _scrollContainerRef$c5, _scrollContainerRef$c6, _scrollContainerRef$c7;
77
+ var _ref3 = ((_scrollContainerRef$c5 = scrollContainerRef.current) === null || _scrollContainerRef$c5 === void 0 ? void 0 : _scrollContainerRef$c5.getBoundingClientRect()) || {},
78
+ _ref3$width = _ref3.width,
79
+ scrollContainerWidth = _ref3$width === void 0 ? 0 : _ref3$width;
80
+ var scrollLeft = ((_scrollContainerRef$c6 = scrollContainerRef.current) === null || _scrollContainerRef$c6 === void 0 ? void 0 : _scrollContainerRef$c6.scrollLeft) || 0;
77
81
 
78
82
  // scroll to current position + scroll container width
79
83
  var scrollTo = scrollLeft + scrollContainerWidth;
80
- (_scrollContainerRef$c6 = scrollContainerRef.current) === null || _scrollContainerRef$c6 === void 0 ? void 0 : _scrollContainerRef$c6.scrollTo({
84
+ (_scrollContainerRef$c7 = scrollContainerRef.current) === null || _scrollContainerRef$c7 === void 0 ? void 0 : _scrollContainerRef$c7.scrollTo({
81
85
  top: 0,
82
86
  left: scrollTo,
83
87
  behavior: 'smooth'
84
88
  });
85
89
  };
86
90
  var resizeObserver = new ResizeObserver(function (t) {
87
- var _scrollContainerRef$c7, _scrollContainerRef$c8, _scrollContainerRef$c9;
88
- var widthNeededToShowAllItems = ((_scrollContainerRef$c7 = scrollContainerRef.current) === null || _scrollContainerRef$c7 === void 0 ? void 0 : _scrollContainerRef$c7.scrollWidth) || 0;
89
- var availableSpace = (_scrollContainerRef$c8 = scrollContainerRef.current) === null || _scrollContainerRef$c8 === void 0 ? void 0 : (_scrollContainerRef$c9 = _scrollContainerRef$c8.parentNode) === null || _scrollContainerRef$c9 === void 0 ? void 0 : _scrollContainerRef$c9.offsetWidth;
91
+ var _scrollContainerRef$c8, _scrollContainerRef$c9, _scrollContainerRef$c10;
92
+ var widthNeededToShowAllItems = ((_scrollContainerRef$c8 = scrollContainerRef.current) === null || _scrollContainerRef$c8 === void 0 ? void 0 : _scrollContainerRef$c8.scrollWidth) || 0;
93
+ var availableSpace = (_scrollContainerRef$c9 = scrollContainerRef.current) === null || _scrollContainerRef$c9 === void 0 ? void 0 : (_scrollContainerRef$c10 = _scrollContainerRef$c9.parentNode) === null || _scrollContainerRef$c10 === void 0 ? void 0 : _scrollContainerRef$c10.offsetWidth;
90
94
  if (availableSpace >= widthNeededToShowAllItems) {
91
95
  setNeedScroll(false);
92
96
  } else {
@@ -109,6 +113,7 @@ var _default = function _default(_ref) {
109
113
  scrollContainerRefCurrent.removeEventListener('scroll', onScroll);
110
114
  resizeObserver.unobserve(scrollContainerRefCurrent);
111
115
  }
116
+ setCanScrollDebounced.cancel();
112
117
  };
113
118
  // eslint-disable-next-line react-hooks/exhaustive-deps
114
119
  }, []);
@@ -142,4 +147,4 @@ var _default = function _default(_ref) {
142
147
  disabled: !canScrollRight || disabled
143
148
  })) : null;
144
149
  };
145
- exports.default = _default;
150
+ exports.ScrollButtons = ScrollButtons;
@@ -36,7 +36,7 @@ var _EmojiPickerButton = require("./EmojiPickerButton");
36
36
  var _reactIntlNext = require("react-intl-next");
37
37
  var _messages = _interopRequireDefault(require("./messages"));
38
38
  var _commands2 = require("@atlaskit/editor-plugin-table/commands");
39
- var _ScrollButtons = _interopRequireDefault(require("./ScrollButtons"));
39
+ var _ScrollButtons = require("./ScrollButtons");
40
40
  var _uiMenu = require("@atlaskit/editor-common/ui-menu");
41
41
  var _forceFocus = require("../pm-plugins/force-focus");
42
42
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
@@ -489,7 +489,7 @@ var Toolbar = /*#__PURE__*/function (_Component) {
489
489
  mountRef: this.mountRef,
490
490
  mounted: this.state.mounted,
491
491
  featureFlags: this.props.featureFlags
492
- }))), scrollable && (0, _react2.jsx)(_ScrollButtons.default, {
492
+ }))), scrollable && (0, _react2.jsx)(_ScrollButtons.ScrollButtons, {
493
493
  intl: intl,
494
494
  scrollContainerRef: this.scrollContainerRef,
495
495
  node: node,
@@ -185,14 +185,29 @@ function transformSliceForMedia(slice, schema) {
185
185
  orderedList = _schema$nodes2.orderedList,
186
186
  media = _schema$nodes2.media,
187
187
  mediaInline = _schema$nodes2.mediaInline,
188
- expand = _schema$nodes2.expand;
188
+ expand = _schema$nodes2.expand,
189
+ nestedExpand = _schema$nodes2.nestedExpand;
189
190
  return function (selection) {
190
191
  var newSlice = slice;
191
- if ((0, _utils.hasParentNodeOfType)([layoutSection, table, bulletList, orderedList, expand])(selection)) {
192
+ if ((0, _utils.hasParentNodeOfType)([layoutSection, table, bulletList, orderedList, expand, nestedExpand])(selection)) {
192
193
  newSlice = (0, _slice.mapSlice)(newSlice, function (node) {
193
- var attrs = (0, _utils.hasParentNodeOfType)([layoutSection, table])(selection) ? {
194
+ var extendedOrLegacyAttrs = (0, _platformFeatureFlags.getBooleanFF)('platform.editor.media.extended-resize-experience') ? {
195
+ layout: node.attrs.layout,
196
+ widthType: node.attrs.widthType,
197
+ width: node.attrs.width
198
+ } : {
194
199
  layout: node.attrs.layout
195
- } : {};
200
+ };
201
+ var attrs = {};
202
+ if ((0, _utils.hasParentNodeOfType)([layoutSection, table])(selection)) {
203
+ // Supports layouts
204
+ attrs = _objectSpread({}, extendedOrLegacyAttrs);
205
+ } else if ((0, _utils.hasParentNodeOfType)([bulletList, orderedList, expand, nestedExpand])(selection)) {
206
+ // does not support other layouts
207
+ attrs = _objectSpread(_objectSpread({}, extendedOrLegacyAttrs), {}, {
208
+ layout: 'center'
209
+ });
210
+ }
196
211
  return node.type.name === 'mediaSingle' ? mediaSingle.createChecked(attrs, node.content, node.marks) : node;
197
212
  });
198
213
  }
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.version = exports.nextMajorVersion = exports.name = void 0;
7
7
  var name = "@atlaskit/editor-core";
8
8
  exports.name = name;
9
- var version = "187.32.0";
9
+ var version = "187.32.1";
10
10
  exports.version = version;
11
11
  var nextMajorVersion = function nextMajorVersion() {
12
12
  return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
@@ -18,7 +18,7 @@ const toolbarScrollButtons = css`
18
18
  `;
19
19
  const LeftIcon = ChevronLeftLargeIcon;
20
20
  const RightIcon = ChevronRightLargeIcon;
21
- export default (({
21
+ export const ScrollButtons = ({
22
22
  intl,
23
23
  scrollContainerRef,
24
24
  node,
@@ -28,7 +28,11 @@ export default (({
28
28
  const [needScroll, setNeedScroll] = useState(false);
29
29
  const [canScrollLeft, setCanScrollLeft] = useState(true);
30
30
  const [canScrollRight, setCanScrollRight] = useState(true);
31
- const scheduledSetCanScroll = rafSchedule(() => {
31
+ const setCanScrollDebounced = rafSchedule(() => {
32
+ // Refs are null before mounting and after unmount
33
+ if (!scrollContainerRef.current) {
34
+ return;
35
+ }
32
36
  const {
33
37
  scrollLeft,
34
38
  scrollWidth,
@@ -38,7 +42,7 @@ export default (({
38
42
  setCanScrollRight(scrollLeft + offsetWidth < scrollWidth - 1); // -1 to account for half pixel
39
43
  });
40
44
 
41
- const onScroll = () => scheduledSetCanScroll();
45
+ const onScroll = () => setCanScrollDebounced();
42
46
  const scrollLeft = () => {
43
47
  var _scrollContainerRef$c, _scrollContainerRef$c2, _scrollContainerRef$c3;
44
48
  const {
@@ -95,6 +99,7 @@ export default (({
95
99
  scrollContainerRefCurrent.removeEventListener('scroll', onScroll);
96
100
  resizeObserver.unobserve(scrollContainerRefCurrent);
97
101
  }
102
+ setCanScrollDebounced.cancel();
98
103
  };
99
104
  // eslint-disable-next-line react-hooks/exhaustive-deps
100
105
  }, []);
@@ -127,4 +132,4 @@ export default (({
127
132
  onClick: scrollRight,
128
133
  disabled: !canScrollRight || disabled
129
134
  })) : null;
130
- });
135
+ };
@@ -22,7 +22,7 @@ import { EmojiPickerButton } from './EmojiPickerButton';
22
22
  import { injectIntl } from 'react-intl-next';
23
23
  import messages from './messages';
24
24
  import { clearHoverSelection } from '@atlaskit/editor-plugin-table/commands';
25
- import ScrollButtons from './ScrollButtons';
25
+ import { ScrollButtons } from './ScrollButtons';
26
26
  import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
27
27
  import { checkShouldForceFocusAndApply, forceFocusSelector } from '../pm-plugins/force-focus';
28
28
  const ToolbarItems = /*#__PURE__*/React.memo(({
@@ -175,15 +175,33 @@ export function transformSliceForMedia(slice, schema) {
175
175
  orderedList,
176
176
  media,
177
177
  mediaInline,
178
- expand
178
+ expand,
179
+ nestedExpand
179
180
  } = schema.nodes;
180
181
  return selection => {
181
182
  let newSlice = slice;
182
- if (hasParentNodeOfType([layoutSection, table, bulletList, orderedList, expand])(selection)) {
183
+ if (hasParentNodeOfType([layoutSection, table, bulletList, orderedList, expand, nestedExpand])(selection)) {
183
184
  newSlice = mapSlice(newSlice, node => {
184
- const attrs = hasParentNodeOfType([layoutSection, table])(selection) ? {
185
+ const extendedOrLegacyAttrs = getBooleanFF('platform.editor.media.extended-resize-experience') ? {
186
+ layout: node.attrs.layout,
187
+ widthType: node.attrs.widthType,
188
+ width: node.attrs.width
189
+ } : {
185
190
  layout: node.attrs.layout
186
- } : {};
191
+ };
192
+ let attrs = {};
193
+ if (hasParentNodeOfType([layoutSection, table])(selection)) {
194
+ // Supports layouts
195
+ attrs = {
196
+ ...extendedOrLegacyAttrs
197
+ };
198
+ } else if (hasParentNodeOfType([bulletList, orderedList, expand, nestedExpand])(selection)) {
199
+ // does not support other layouts
200
+ attrs = {
201
+ ...extendedOrLegacyAttrs,
202
+ layout: 'center'
203
+ };
204
+ }
187
205
  return node.type.name === 'mediaSingle' ? mediaSingle.createChecked(attrs, node.content, node.marks) : node;
188
206
  });
189
207
  }
@@ -1,5 +1,5 @@
1
1
  export const name = "@atlaskit/editor-core";
2
- export const version = "187.32.0";
2
+ export const version = "187.32.1";
3
3
  export const nextMajorVersion = () => {
4
4
  return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
5
5
  };
@@ -13,7 +13,7 @@ import rafSchedule from 'raf-schd';
13
13
  var toolbarScrollButtons = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-gap: ", ";\n padding: ", " ", ";\n border-left: solid ", " 1px;\n flex-shrink: 0;\n align-items: center;\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-050, 4px)", "var(--ds-space-100, 8px)", "var(--ds-border, ".concat(N30, ")"));
14
14
  var LeftIcon = ChevronLeftLargeIcon;
15
15
  var RightIcon = ChevronRightLargeIcon;
16
- export default (function (_ref) {
16
+ export var ScrollButtons = function ScrollButtons(_ref) {
17
17
  var intl = _ref.intl,
18
18
  scrollContainerRef = _ref.scrollContainerRef,
19
19
  node = _ref.node,
@@ -31,52 +31,56 @@ export default (function (_ref) {
31
31
  _useState6 = _slicedToArray(_useState5, 2),
32
32
  canScrollRight = _useState6[0],
33
33
  setCanScrollRight = _useState6[1];
34
- var scheduledSetCanScroll = rafSchedule(function () {
35
- var _ref2 = scrollContainerRef.current,
36
- scrollLeft = _ref2.scrollLeft,
37
- scrollWidth = _ref2.scrollWidth,
38
- offsetWidth = _ref2.offsetWidth;
34
+ var setCanScrollDebounced = rafSchedule(function () {
35
+ // Refs are null before mounting and after unmount
36
+ if (!scrollContainerRef.current) {
37
+ return;
38
+ }
39
+ var _scrollContainerRef$c = scrollContainerRef.current,
40
+ scrollLeft = _scrollContainerRef$c.scrollLeft,
41
+ scrollWidth = _scrollContainerRef$c.scrollWidth,
42
+ offsetWidth = _scrollContainerRef$c.offsetWidth;
39
43
  setCanScrollLeft(scrollLeft > 0);
40
44
  setCanScrollRight(scrollLeft + offsetWidth < scrollWidth - 1); // -1 to account for half pixel
41
45
  });
42
46
 
43
47
  var onScroll = function onScroll() {
44
- return scheduledSetCanScroll();
48
+ return setCanScrollDebounced();
45
49
  };
46
50
  var scrollLeft = function scrollLeft() {
47
- var _scrollContainerRef$c, _scrollContainerRef$c2, _scrollContainerRef$c3;
48
- var _ref3 = ((_scrollContainerRef$c = scrollContainerRef.current) === null || _scrollContainerRef$c === void 0 ? void 0 : _scrollContainerRef$c.getBoundingClientRect()) || {},
49
- _ref3$width = _ref3.width,
50
- scrollContainerWidth = _ref3$width === void 0 ? 0 : _ref3$width;
51
- var scrollLeft = ((_scrollContainerRef$c2 = scrollContainerRef.current) === null || _scrollContainerRef$c2 === void 0 ? void 0 : _scrollContainerRef$c2.scrollLeft) || 0;
51
+ var _scrollContainerRef$c2, _scrollContainerRef$c3, _scrollContainerRef$c4;
52
+ var _ref2 = ((_scrollContainerRef$c2 = scrollContainerRef.current) === null || _scrollContainerRef$c2 === void 0 ? void 0 : _scrollContainerRef$c2.getBoundingClientRect()) || {},
53
+ _ref2$width = _ref2.width,
54
+ scrollContainerWidth = _ref2$width === void 0 ? 0 : _ref2$width;
55
+ var scrollLeft = ((_scrollContainerRef$c3 = scrollContainerRef.current) === null || _scrollContainerRef$c3 === void 0 ? void 0 : _scrollContainerRef$c3.scrollLeft) || 0;
52
56
 
53
57
  // scroll to current position - scroll container width
54
58
  var scrollTo = scrollLeft - scrollContainerWidth;
55
- (_scrollContainerRef$c3 = scrollContainerRef.current) === null || _scrollContainerRef$c3 === void 0 ? void 0 : _scrollContainerRef$c3.scrollTo({
59
+ (_scrollContainerRef$c4 = scrollContainerRef.current) === null || _scrollContainerRef$c4 === void 0 ? void 0 : _scrollContainerRef$c4.scrollTo({
56
60
  top: 0,
57
61
  left: scrollTo,
58
62
  behavior: 'smooth'
59
63
  });
60
64
  };
61
65
  var scrollRight = function scrollRight() {
62
- var _scrollContainerRef$c4, _scrollContainerRef$c5, _scrollContainerRef$c6;
63
- var _ref4 = ((_scrollContainerRef$c4 = scrollContainerRef.current) === null || _scrollContainerRef$c4 === void 0 ? void 0 : _scrollContainerRef$c4.getBoundingClientRect()) || {},
64
- _ref4$width = _ref4.width,
65
- scrollContainerWidth = _ref4$width === void 0 ? 0 : _ref4$width;
66
- var scrollLeft = ((_scrollContainerRef$c5 = scrollContainerRef.current) === null || _scrollContainerRef$c5 === void 0 ? void 0 : _scrollContainerRef$c5.scrollLeft) || 0;
66
+ var _scrollContainerRef$c5, _scrollContainerRef$c6, _scrollContainerRef$c7;
67
+ var _ref3 = ((_scrollContainerRef$c5 = scrollContainerRef.current) === null || _scrollContainerRef$c5 === void 0 ? void 0 : _scrollContainerRef$c5.getBoundingClientRect()) || {},
68
+ _ref3$width = _ref3.width,
69
+ scrollContainerWidth = _ref3$width === void 0 ? 0 : _ref3$width;
70
+ var scrollLeft = ((_scrollContainerRef$c6 = scrollContainerRef.current) === null || _scrollContainerRef$c6 === void 0 ? void 0 : _scrollContainerRef$c6.scrollLeft) || 0;
67
71
 
68
72
  // scroll to current position + scroll container width
69
73
  var scrollTo = scrollLeft + scrollContainerWidth;
70
- (_scrollContainerRef$c6 = scrollContainerRef.current) === null || _scrollContainerRef$c6 === void 0 ? void 0 : _scrollContainerRef$c6.scrollTo({
74
+ (_scrollContainerRef$c7 = scrollContainerRef.current) === null || _scrollContainerRef$c7 === void 0 ? void 0 : _scrollContainerRef$c7.scrollTo({
71
75
  top: 0,
72
76
  left: scrollTo,
73
77
  behavior: 'smooth'
74
78
  });
75
79
  };
76
80
  var resizeObserver = new ResizeObserver(function (t) {
77
- var _scrollContainerRef$c7, _scrollContainerRef$c8, _scrollContainerRef$c9;
78
- var widthNeededToShowAllItems = ((_scrollContainerRef$c7 = scrollContainerRef.current) === null || _scrollContainerRef$c7 === void 0 ? void 0 : _scrollContainerRef$c7.scrollWidth) || 0;
79
- var availableSpace = (_scrollContainerRef$c8 = scrollContainerRef.current) === null || _scrollContainerRef$c8 === void 0 ? void 0 : (_scrollContainerRef$c9 = _scrollContainerRef$c8.parentNode) === null || _scrollContainerRef$c9 === void 0 ? void 0 : _scrollContainerRef$c9.offsetWidth;
81
+ var _scrollContainerRef$c8, _scrollContainerRef$c9, _scrollContainerRef$c10;
82
+ var widthNeededToShowAllItems = ((_scrollContainerRef$c8 = scrollContainerRef.current) === null || _scrollContainerRef$c8 === void 0 ? void 0 : _scrollContainerRef$c8.scrollWidth) || 0;
83
+ var availableSpace = (_scrollContainerRef$c9 = scrollContainerRef.current) === null || _scrollContainerRef$c9 === void 0 ? void 0 : (_scrollContainerRef$c10 = _scrollContainerRef$c9.parentNode) === null || _scrollContainerRef$c10 === void 0 ? void 0 : _scrollContainerRef$c10.offsetWidth;
80
84
  if (availableSpace >= widthNeededToShowAllItems) {
81
85
  setNeedScroll(false);
82
86
  } else {
@@ -99,6 +103,7 @@ export default (function (_ref) {
99
103
  scrollContainerRefCurrent.removeEventListener('scroll', onScroll);
100
104
  resizeObserver.unobserve(scrollContainerRefCurrent);
101
105
  }
106
+ setCanScrollDebounced.cancel();
102
107
  };
103
108
  // eslint-disable-next-line react-hooks/exhaustive-deps
104
109
  }, []);
@@ -131,4 +136,4 @@ export default (function (_ref) {
131
136
  onClick: scrollRight,
132
137
  disabled: !canScrollRight || disabled
133
138
  })) : null;
134
- });
139
+ };
@@ -32,7 +32,7 @@ import { EmojiPickerButton } from './EmojiPickerButton';
32
32
  import { injectIntl } from 'react-intl-next';
33
33
  import messages from './messages';
34
34
  import { clearHoverSelection } from '@atlaskit/editor-plugin-table/commands';
35
- import ScrollButtons from './ScrollButtons';
35
+ import { ScrollButtons } from './ScrollButtons';
36
36
  import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
37
37
  import { checkShouldForceFocusAndApply, forceFocusSelector } from '../pm-plugins/force-focus';
38
38
  var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
@@ -171,14 +171,29 @@ export function transformSliceForMedia(slice, schema) {
171
171
  orderedList = _schema$nodes2.orderedList,
172
172
  media = _schema$nodes2.media,
173
173
  mediaInline = _schema$nodes2.mediaInline,
174
- expand = _schema$nodes2.expand;
174
+ expand = _schema$nodes2.expand,
175
+ nestedExpand = _schema$nodes2.nestedExpand;
175
176
  return function (selection) {
176
177
  var newSlice = slice;
177
- if (hasParentNodeOfType([layoutSection, table, bulletList, orderedList, expand])(selection)) {
178
+ if (hasParentNodeOfType([layoutSection, table, bulletList, orderedList, expand, nestedExpand])(selection)) {
178
179
  newSlice = mapSlice(newSlice, function (node) {
179
- var attrs = hasParentNodeOfType([layoutSection, table])(selection) ? {
180
+ var extendedOrLegacyAttrs = getBooleanFF('platform.editor.media.extended-resize-experience') ? {
181
+ layout: node.attrs.layout,
182
+ widthType: node.attrs.widthType,
183
+ width: node.attrs.width
184
+ } : {
180
185
  layout: node.attrs.layout
181
- } : {};
186
+ };
187
+ var attrs = {};
188
+ if (hasParentNodeOfType([layoutSection, table])(selection)) {
189
+ // Supports layouts
190
+ attrs = _objectSpread({}, extendedOrLegacyAttrs);
191
+ } else if (hasParentNodeOfType([bulletList, orderedList, expand, nestedExpand])(selection)) {
192
+ // does not support other layouts
193
+ attrs = _objectSpread(_objectSpread({}, extendedOrLegacyAttrs), {}, {
194
+ layout: 'center'
195
+ });
196
+ }
182
197
  return node.type.name === 'mediaSingle' ? mediaSingle.createChecked(attrs, node.content, node.marks) : node;
183
198
  });
184
199
  }
@@ -1,5 +1,5 @@
1
1
  export var name = "@atlaskit/editor-core";
2
- export var version = "187.32.0";
2
+ export var version = "187.32.1";
3
3
  export var nextMajorVersion = function nextMajorVersion() {
4
4
  return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
5
5
  };
@@ -3,11 +3,11 @@ import React from 'react';
3
3
  import { jsx } from '@emotion/react';
4
4
  import type { Node } from '@atlaskit/editor-prosemirror/model';
5
5
  import type { IntlShape } from 'react-intl-next';
6
- export interface Props {
6
+ interface ScrollButtonsProps {
7
7
  intl: IntlShape;
8
8
  scrollContainerRef: React.RefObject<HTMLDivElement>;
9
9
  node: Node;
10
10
  disabled: boolean;
11
11
  }
12
- declare const _default: ({ intl, scrollContainerRef, node, disabled }: Props) => jsx.JSX.Element | null;
13
- export default _default;
12
+ export declare const ScrollButtons: ({ intl, scrollContainerRef, node, disabled, }: ScrollButtonsProps) => jsx.JSX.Element | null;
13
+ export {};
@@ -5,9 +5,8 @@ import type { Node } from '@atlaskit/editor-prosemirror/model';
5
5
  import type { ExtensionProvider } from '@atlaskit/editor-common/extensions';
6
6
  import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
7
7
  import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
8
- import type { FloatingToolbarItem } from '@atlaskit/editor-common/types';
9
8
  import type { WrappedComponentProps } from 'react-intl-next';
10
- import type { FeatureFlags, PluginInjectionAPIWithDependencies, OptionalPlugin } from '@atlaskit/editor-common/types';
9
+ import type { FloatingToolbarItem, FeatureFlags, PluginInjectionAPIWithDependencies, OptionalPlugin } from '@atlaskit/editor-common/types';
11
10
  import type { decorationsPlugin } from '@atlaskit/editor-plugin-decorations';
12
11
  import type { contextPanelPlugin } from '@atlaskit/editor-plugin-context-panel';
13
12
  export type Item = FloatingToolbarItem<Function>;
@@ -3,11 +3,11 @@ import React from 'react';
3
3
  import { jsx } from '@emotion/react';
4
4
  import type { Node } from '@atlaskit/editor-prosemirror/model';
5
5
  import type { IntlShape } from 'react-intl-next';
6
- export interface Props {
6
+ interface ScrollButtonsProps {
7
7
  intl: IntlShape;
8
8
  scrollContainerRef: React.RefObject<HTMLDivElement>;
9
9
  node: Node;
10
10
  disabled: boolean;
11
11
  }
12
- declare const _default: ({ intl, scrollContainerRef, node, disabled }: Props) => jsx.JSX.Element | null;
13
- export default _default;
12
+ export declare const ScrollButtons: ({ intl, scrollContainerRef, node, disabled, }: ScrollButtonsProps) => jsx.JSX.Element | null;
13
+ export {};
@@ -5,9 +5,8 @@ import type { Node } from '@atlaskit/editor-prosemirror/model';
5
5
  import type { ExtensionProvider } from '@atlaskit/editor-common/extensions';
6
6
  import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
7
7
  import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
8
- import type { FloatingToolbarItem } from '@atlaskit/editor-common/types';
9
8
  import type { WrappedComponentProps } from 'react-intl-next';
10
- import type { FeatureFlags, PluginInjectionAPIWithDependencies, OptionalPlugin } from '@atlaskit/editor-common/types';
9
+ import type { FloatingToolbarItem, FeatureFlags, PluginInjectionAPIWithDependencies, OptionalPlugin } from '@atlaskit/editor-common/types';
11
10
  import type { decorationsPlugin } from '@atlaskit/editor-plugin-decorations';
12
11
  import type { contextPanelPlugin } from '@atlaskit/editor-plugin-context-panel';
13
12
  export type Item = FloatingToolbarItem<Function>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-core",
3
- "version": "187.32.0",
3
+ "version": "187.32.1",
4
4
  "description": "A package contains Atlassian editor core functionality",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"