@atlaskit/editor-common 102.3.4 → 102.5.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 (44) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/cjs/analytics/types/enums.js +2 -1
  3. package/dist/cjs/extensibility/ExtensionComponent.js +7 -3
  4. package/dist/cjs/extensibility/MultiBodiedExtension/action-api.js +14 -3
  5. package/dist/cjs/extensibility/MultiBodiedExtension/index.js +48 -29
  6. package/dist/cjs/monitoring/error.js +1 -1
  7. package/dist/cjs/styles/index.js +6 -0
  8. package/dist/cjs/styles/shared/smart-card.js +5 -2
  9. package/dist/cjs/ui/DropList/index.js +1 -1
  10. package/dist/es2019/analytics/types/enums.js +2 -1
  11. package/dist/es2019/extensibility/ExtensionComponent.js +7 -3
  12. package/dist/es2019/extensibility/MultiBodiedExtension/action-api.js +14 -3
  13. package/dist/es2019/extensibility/MultiBodiedExtension/index.js +31 -12
  14. package/dist/es2019/monitoring/error.js +1 -1
  15. package/dist/es2019/styles/index.js +1 -1
  16. package/dist/es2019/styles/shared/smart-card.js +15 -0
  17. package/dist/es2019/ui/DropList/index.js +1 -1
  18. package/dist/esm/analytics/types/enums.js +2 -1
  19. package/dist/esm/extensibility/ExtensionComponent.js +7 -3
  20. package/dist/esm/extensibility/MultiBodiedExtension/action-api.js +14 -3
  21. package/dist/esm/extensibility/MultiBodiedExtension/index.js +48 -29
  22. package/dist/esm/monitoring/error.js +1 -1
  23. package/dist/esm/styles/index.js +1 -1
  24. package/dist/esm/styles/shared/smart-card.js +4 -1
  25. package/dist/esm/ui/DropList/index.js +1 -1
  26. package/dist/types/analytics/types/enums.d.ts +2 -1
  27. package/dist/types/analytics/types/events.d.ts +1 -1
  28. package/dist/types/extensibility/ExtensionComponent.d.ts +1 -0
  29. package/dist/types/extensibility/MultiBodiedExtension/action-api.d.ts +4 -1
  30. package/dist/types/extensibility/MultiBodiedExtension/index.d.ts +1 -0
  31. package/dist/types/extensibility/MultiBodiedExtension/utils.d.ts +1 -1
  32. package/dist/types/extensions/types/extension-handler.d.ts +1 -0
  33. package/dist/types/styles/index.d.ts +1 -1
  34. package/dist/types/styles/shared/smart-card.d.ts +1 -0
  35. package/dist/types-ts4.5/analytics/types/enums.d.ts +2 -1
  36. package/dist/types-ts4.5/analytics/types/events.d.ts +1 -1
  37. package/dist/types-ts4.5/extensibility/ExtensionComponent.d.ts +1 -0
  38. package/dist/types-ts4.5/extensibility/MultiBodiedExtension/action-api.d.ts +4 -1
  39. package/dist/types-ts4.5/extensibility/MultiBodiedExtension/index.d.ts +1 -0
  40. package/dist/types-ts4.5/extensibility/MultiBodiedExtension/utils.d.ts +1 -1
  41. package/dist/types-ts4.5/extensions/types/extension-handler.d.ts +1 -0
  42. package/dist/types-ts4.5/styles/index.d.ts +1 -1
  43. package/dist/types-ts4.5/styles/shared/smart-card.d.ts +1 -0
  44. package/package.json +6 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,25 @@
1
1
  # @atlaskit/editor-common
2
2
 
3
+ ## 102.5.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#125487](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/125487)
8
+ [`e435eea47c743`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e435eea47c743) -
9
+ [ux] EDM-11991: Fix smart links avatar group padding inside editor and renderer
10
+
11
+ ## 102.4.0
12
+
13
+ ### Minor Changes
14
+
15
+ - [#122049](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/122049)
16
+ [`feaccb6b73652`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/feaccb6b73652) -
17
+ extend functionality of multiBodiedExtensions to allow requests for bodied overrides
18
+
19
+ ### Patch Changes
20
+
21
+ - Updated dependencies
22
+
3
23
  ## 102.3.4
4
24
 
5
25
  ### Patch Changes
@@ -159,7 +159,8 @@ var ACTION = exports.ACTION = /*#__PURE__*/function (ACTION) {
159
159
  ACTION["CHANGE_ACTIVE"] = "changeActive";
160
160
  ACTION["REMOVE_CHILD"] = "removeChild";
161
161
  ACTION["UPDATE_PARAMETERS"] = "updateParameters";
162
- ACTION["GET_CHILDERN"] = "getChildern";
162
+ ACTION["GET_CHILDREN"] = "getChildren";
163
+ ACTION["GET_CHILDREN_CONTAINER"] = "getChildrenContainer";
163
164
  ACTION["MOVED"] = "moved";
164
165
  ACTION["UPLOAD_COMMENCED"] = "uploadCommenced";
165
166
  ACTION["UPLOAD_SUCCEEDED"] = "uploadSucceeded";
@@ -20,6 +20,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
20
20
  var _react = _interopRequireWildcard(require("react"));
21
21
  var _memoizeOne = _interopRequireDefault(require("memoize-one"));
22
22
  var _state = require("@atlaskit/editor-prosemirror/state");
23
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
23
24
  var _extensions = require("../extensions");
24
25
  var _utils = require("../utils");
25
26
  var _Extension = _interopRequireDefault(require("./Extension/Extension"));
@@ -221,7 +222,7 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component) {
221
222
  }, {
222
223
  key: "render",
223
224
  value: function render() {
224
- var _this$state$_privateP;
225
+ var _this$state$_privateP2;
225
226
  var _this$props2 = this.props,
226
227
  node = _this$props2.node,
227
228
  handleContentDOMRef = _this$props2.handleContentDOMRef,
@@ -244,6 +245,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component) {
244
245
  var resolvedPosition = position && editorView.state.doc.resolve(position);
245
246
  var isNodeNested = !!(resolvedPosition && resolvedPosition.depth > 0);
246
247
  if (node.type.name === 'multiBodiedExtension') {
248
+ var _this$state$_privateP;
249
+ var allowBodiedOverride = ((_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__allowBodiedOverride) && (0, _platformFeatureFlags.fg)('platform_editor_multi_body_extension_extensibility');
247
250
  return /*#__PURE__*/_react.default.createElement(_MultiBodiedExtension.default, {
248
251
  node: node,
249
252
  editorView: editorView,
@@ -258,7 +261,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component) {
258
261
  isNodeNested: isNodeNested,
259
262
  isNodeHovered: this.state.isNodeHovered,
260
263
  setIsNodeHovered: this.setIsNodeHovered,
261
- isLivePageViewMode: isLivePageViewMode
264
+ isLivePageViewMode: isLivePageViewMode,
265
+ allowBodiedOverride: allowBodiedOverride
262
266
  });
263
267
  }
264
268
  var extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -273,7 +277,7 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component) {
273
277
  handleContentDOMRef: handleContentDOMRef,
274
278
  view: editorView,
275
279
  editorAppearance: editorAppearance,
276
- hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame,
280
+ hideFrame: (_this$state$_privateP2 = this.state._privateProps) === null || _this$state$_privateP2 === void 0 ? void 0 : _this$state$_privateP2.__hideFrame,
277
281
  pluginInjectionApi: pluginInjectionApi,
278
282
  macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
279
283
  isNodeSelected: selectedNode === node,
@@ -17,7 +17,9 @@ var useMultiBodiedExtensionActions = exports.useMultiBodiedExtensionActions = fu
17
17
  editorView = _ref.editorView,
18
18
  getPos = _ref.getPos,
19
19
  node = _ref.node,
20
- eventDispatcher = _ref.eventDispatcher;
20
+ eventDispatcher = _ref.eventDispatcher,
21
+ allowBodiedOverride = _ref.allowBodiedOverride,
22
+ childrenContainer = _ref.childrenContainer;
21
23
  var actions = _react.default.useMemo(function () {
22
24
  return {
23
25
  changeActive: function changeActive(index) {
@@ -139,11 +141,20 @@ var useMultiBodiedExtensionActions = exports.useMultiBodiedExtensionActions = fu
139
141
  }
140
142
  var children = (_state$doc$nodeAt = state.doc.nodeAt(pos)) === null || _state$doc$nodeAt === void 0 ? void 0 : _state$doc$nodeAt.content;
141
143
  if (eventDispatcher) {
142
- (0, _utils.sendMBEAnalyticsEvent)(_analytics.ACTION.GET_CHILDERN, node, eventDispatcher);
144
+ (0, _utils.sendMBEAnalyticsEvent)(_analytics.ACTION.GET_CHILDREN, node, eventDispatcher);
143
145
  }
144
146
  return children ? children.toJSON() : [];
147
+ },
148
+ getChildrenContainer: function getChildrenContainer() {
149
+ if (!allowBodiedOverride) {
150
+ throw new Error('Could not provide children container');
151
+ }
152
+ if (eventDispatcher) {
153
+ (0, _utils.sendMBEAnalyticsEvent)(_analytics.ACTION.GET_CHILDREN_CONTAINER, node, eventDispatcher);
154
+ }
155
+ return childrenContainer;
145
156
  }
146
157
  };
147
- }, [node, editorView, getPos, updateActiveChild, eventDispatcher]);
158
+ }, [node, editorView, getPos, updateActiveChild, eventDispatcher, allowBodiedOverride, childrenContainer]);
148
159
  return actions;
149
160
  };
@@ -46,6 +46,16 @@ var imageStyles = (0, _react2.css)({
46
46
  maxHeight: '24px',
47
47
  maxWidth: '24px'
48
48
  });
49
+ var MultiBodiedExtensionFrames = function MultiBodiedExtensionFrames(_ref) {
50
+ var articleRef = _ref.articleRef;
51
+ return (0, _react2.jsx)("article", {
52
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
53
+ className: "multiBodiedExtension--frames",
54
+ "data-testid": "multiBodiedExtension--frames",
55
+ ref: articleRef
56
+ });
57
+ };
58
+
49
59
  // Similar to the one in platform/packages/editor/editor-common/src/extensibility/Extension/Lozenge.tsx
50
60
  var getWrapperTitleContent = function getWrapperTitleContent(imageData, title, showMacroInteractionDesignUpdates) {
51
61
  if (showMacroInteractionDesignUpdates) {
@@ -76,24 +86,26 @@ var getWrapperTitleContent = function getWrapperTitleContent(imageData, title, s
76
86
  label: title
77
87
  }), title);
78
88
  };
79
- var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref) {
80
- var node = _ref.node,
81
- handleContentDOMRef = _ref.handleContentDOMRef,
82
- getPos = _ref.getPos,
83
- tryExtensionHandler = _ref.tryExtensionHandler,
84
- editorView = _ref.editorView,
85
- eventDispatcher = _ref.eventDispatcher,
86
- widthState = _ref.widthState,
87
- editorAppearance = _ref.editorAppearance,
88
- macroInteractionDesignFeatureFlags = _ref.macroInteractionDesignFeatureFlags,
89
- isNodeSelected = _ref.isNodeSelected,
90
- isNodeHovered = _ref.isNodeHovered,
91
- isNodeNested = _ref.isNodeNested,
92
- setIsNodeHovered = _ref.setIsNodeHovered,
93
- pluginInjectionApi = _ref.pluginInjectionApi,
94
- isLivePageViewMode = _ref.isLivePageViewMode;
95
- var _ref2 = macroInteractionDesignFeatureFlags || {},
96
- showMacroInteractionDesignUpdates = _ref2.showMacroInteractionDesignUpdates;
89
+ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2) {
90
+ var node = _ref2.node,
91
+ handleContentDOMRef = _ref2.handleContentDOMRef,
92
+ getPos = _ref2.getPos,
93
+ tryExtensionHandler = _ref2.tryExtensionHandler,
94
+ editorView = _ref2.editorView,
95
+ eventDispatcher = _ref2.eventDispatcher,
96
+ widthState = _ref2.widthState,
97
+ editorAppearance = _ref2.editorAppearance,
98
+ macroInteractionDesignFeatureFlags = _ref2.macroInteractionDesignFeatureFlags,
99
+ isNodeSelected = _ref2.isNodeSelected,
100
+ isNodeHovered = _ref2.isNodeHovered,
101
+ isNodeNested = _ref2.isNodeNested,
102
+ setIsNodeHovered = _ref2.setIsNodeHovered,
103
+ pluginInjectionApi = _ref2.pluginInjectionApi,
104
+ isLivePageViewMode = _ref2.isLivePageViewMode,
105
+ _ref2$allowBodiedOver = _ref2.allowBodiedOverride,
106
+ allowBodiedOverride = _ref2$allowBodiedOver === void 0 ? false : _ref2$allowBodiedOver;
107
+ var _ref3 = macroInteractionDesignFeatureFlags || {},
108
+ showMacroInteractionDesignUpdates = _ref3.showMacroInteractionDesignUpdates;
97
109
  var _node$attrs = node.attrs,
98
110
  parameters = _node$attrs.parameters,
99
111
  extensionKey = _node$attrs.extensionKey;
@@ -115,19 +127,26 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
115
127
  setActiveChildIndex(index);
116
128
  return true;
117
129
  }, [setActiveChildIndex]);
130
+ var articleRef = _react.default.useCallback(function (node) {
131
+ return handleContentDOMRef(node);
132
+ }, [handleContentDOMRef]);
133
+ var childrenContainer = _react.default.useMemo(function () {
134
+ return (0, _react2.jsx)(MultiBodiedExtensionFrames, {
135
+ articleRef: articleRef
136
+ });
137
+ }, [articleRef]);
118
138
  var actions = (0, _actionApi.useMultiBodiedExtensionActions)({
119
139
  updateActiveChild: updateActiveChild,
120
140
  editorView: editorView,
121
141
  getPos: getPos,
142
+ node: node,
122
143
  eventDispatcher: eventDispatcher,
123
- node: node
144
+ allowBodiedOverride: allowBodiedOverride,
145
+ childrenContainer: childrenContainer
124
146
  });
125
147
  var extensionHandlerResult = _react.default.useMemo(function () {
126
148
  return tryExtensionHandler(actions);
127
149
  }, [tryExtensionHandler, actions]);
128
- var articleRef = _react.default.useCallback(function (node) {
129
- return handleContentDOMRef(node);
130
- }, [handleContentDOMRef]);
131
150
  var shouldBreakout =
132
151
  // Extension should breakout when the layout is set to 'full-width' or 'wide'.
133
152
  ['full-width', 'wide'].includes(node.attrs.layout) &&
@@ -153,6 +172,7 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
153
172
  var containerClassNames = (0, _classnames.default)('multiBodiedExtension--container', {
154
173
  'remove-padding': showMacroInteractionDesignUpdates
155
174
  });
175
+ var bodyContainerClassNames = (0, _classnames.default)('multiBodiedExtension--body-container');
156
176
  var navigationClassNames = (0, _classnames.default)('multiBodiedExtension--navigation', {
157
177
  'remove-margins': showMacroInteractionDesignUpdates,
158
178
  'remove-border': showMacroInteractionDesignUpdates
@@ -206,19 +226,18 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
206
226
  css: getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates),
207
227
  "data-testid": "multiBodiedExtension--container",
208
228
  "data-active-child-index": activeChildIndex
209
- }, (0, _react2.jsx)("nav", {
229
+ }, allowBodiedOverride ? (0, _react2.jsx)("div", {
230
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
231
+ className: bodyContainerClassNames,
232
+ "data-testid": "multiBodiedExtension--body-container"
233
+ }, extensionHandlerResult) : (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)("nav", {
210
234
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
211
235
  className: navigationClassNames
212
236
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
213
237
  ,
214
238
  css: _MultiBodiedExtension.sharedMultiBodiedExtensionStyles.mbeNavigation,
215
239
  "data-testid": "multiBodiedExtension-navigation"
216
- }, extensionHandlerResult), (0, _react2.jsx)("article", {
217
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
218
- className: "multiBodiedExtension--frames",
219
- "data-testid": "multiBodiedExtension--frames",
220
- ref: articleRef
221
- }))));
240
+ }, extensionHandlerResult), childrenContainer))));
222
241
  };
223
242
  var MultiBodiedExtension = function MultiBodiedExtension(props) {
224
243
  var pluginInjectionApi = props.pluginInjectionApi;
@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
17
17
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
18
18
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
19
19
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
20
- var packageVersion = "102.3.4";
20
+ var packageVersion = "102.5.0";
21
21
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
22
22
  // Remove URL as it has UGC
23
23
  // Ignored via go/ees007
@@ -255,6 +255,12 @@ Object.defineProperty(exports, "getOrderedListInlineStyles", {
255
255
  return _lists.getOrderedListInlineStyles;
256
256
  }
257
257
  });
258
+ Object.defineProperty(exports, "getSmartCardSharedStyles", {
259
+ enumerable: true,
260
+ get: function get() {
261
+ return _smartCard.getSmartCardSharedStyles;
262
+ }
263
+ });
258
264
  Object.defineProperty(exports, "gridStyles", {
259
265
  enumerable: true,
260
266
  get: function get() {
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.smartCardSharedStyles = exports.SmartCardSharedCssClassName = void 0;
6
+ exports.smartCardSharedStyles = exports.getSmartCardSharedStyles = exports.SmartCardSharedCssClassName = void 0;
7
7
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
8
8
  var SmartCardSharedCssClassName = exports.SmartCardSharedCssClassName = {
9
9
  INLINE_CARD_CONTAINER: 'inlineCardView-content-wrap',
@@ -12,4 +12,7 @@ var SmartCardSharedCssClassName = exports.SmartCardSharedCssClassName = {
12
12
  DATASOURCE_CONTAINER: 'datasourceView-content-wrap',
13
13
  LOADER_WRAPPER: 'loader-wrapper'
14
14
  };
15
- var smartCardSharedStyles = exports.smartCardSharedStyles = "\n .".concat(SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, " {\n display: block;\n margin: ").concat(_editorSharedStyles.blockNodesVerticalMargin, " 0 0;\n max-width: ").concat(8 * 95, "px;\n }\n");
15
+ var smartCardSharedStyles = exports.smartCardSharedStyles = "\n .".concat(SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, " {\n display: block;\n margin: ").concat(_editorSharedStyles.blockNodesVerticalMargin, " 0 0;\n max-width: ").concat(8 * 95, "px;\n }\n");
16
+ var getSmartCardSharedStyles = exports.getSmartCardSharedStyles = function getSmartCardSharedStyles() {
17
+ return "\n .".concat(SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, " {\n display: block;\n margin: ").concat(_editorSharedStyles.blockNodesVerticalMargin, " 0 0;\n max-width: ").concat(8 * 95, "px;\n }\n\n .").concat(SmartCardSharedCssClassName.LOADER_WRAPPER, " {\n /* EDM-11991: Fix list plugin adding padding to ADS AvatarGroup start */\n ul, ol {\n padding-left: inherit;\n }\n /* EDM-11991: Fix list plugin add padding to ADS AvatarGroup end */\n }\n");
18
+ };
@@ -23,7 +23,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
23
23
  * @jsx jsx
24
24
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
25
25
  var packageName = "@atlaskit/editor-common";
26
- var packageVersion = "102.3.4";
26
+ var packageVersion = "102.5.0";
27
27
  var halfFocusRing = 1;
28
28
  var dropOffset = '0, 8';
29
29
  // Ignored via go/ees005
@@ -153,7 +153,8 @@ export let ACTION = /*#__PURE__*/function (ACTION) {
153
153
  ACTION["CHANGE_ACTIVE"] = "changeActive";
154
154
  ACTION["REMOVE_CHILD"] = "removeChild";
155
155
  ACTION["UPDATE_PARAMETERS"] = "updateParameters";
156
- ACTION["GET_CHILDERN"] = "getChildern";
156
+ ACTION["GET_CHILDREN"] = "getChildren";
157
+ ACTION["GET_CHILDREN_CONTAINER"] = "getChildrenContainer";
157
158
  ACTION["MOVED"] = "moved";
158
159
  ACTION["UPLOAD_COMMENCED"] = "uploadCommenced";
159
160
  ACTION["UPLOAD_SUCCEEDED"] = "uploadSucceeded";
@@ -4,6 +4,7 @@ import _extends from "@babel/runtime/helpers/extends";
4
4
  import React, { Component, useEffect, useLayoutEffect, useRef, useState } from 'react';
5
5
  import memoizeOne from 'memoize-one';
6
6
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
7
+ import { fg } from '@atlaskit/platform-feature-flags';
7
8
  import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '../extensions';
8
9
  import { getExtensionRenderer, nodeToJSON, toJSON } from '../utils';
9
10
  import Extension from './Extension/Extension';
@@ -171,7 +172,7 @@ class ExtensionComponentInner extends Component {
171
172
  this.parsePrivateNodePropsIfNeeded();
172
173
  }
173
174
  render() {
174
- var _this$state$_privateP;
175
+ var _this$state$_privateP2;
175
176
  const {
176
177
  node,
177
178
  handleContentDOMRef,
@@ -197,6 +198,8 @@ class ExtensionComponentInner extends Component {
197
198
  const resolvedPosition = position && editorView.state.doc.resolve(position);
198
199
  const isNodeNested = !!(resolvedPosition && resolvedPosition.depth > 0);
199
200
  if (node.type.name === 'multiBodiedExtension') {
201
+ var _this$state$_privateP;
202
+ const allowBodiedOverride = ((_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__allowBodiedOverride) && fg('platform_editor_multi_body_extension_extensibility');
200
203
  return /*#__PURE__*/React.createElement(MultiBodiedExtension, {
201
204
  node: node,
202
205
  editorView: editorView,
@@ -211,7 +214,8 @@ class ExtensionComponentInner extends Component {
211
214
  isNodeNested: isNodeNested,
212
215
  isNodeHovered: this.state.isNodeHovered,
213
216
  setIsNodeHovered: this.setIsNodeHovered,
214
- isLivePageViewMode: isLivePageViewMode
217
+ isLivePageViewMode: isLivePageViewMode,
218
+ allowBodiedOverride: allowBodiedOverride
215
219
  });
216
220
  }
217
221
  const extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -226,7 +230,7 @@ class ExtensionComponentInner extends Component {
226
230
  handleContentDOMRef: handleContentDOMRef,
227
231
  view: editorView,
228
232
  editorAppearance: editorAppearance,
229
- hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame,
233
+ hideFrame: (_this$state$_privateP2 = this.state._privateProps) === null || _this$state$_privateP2 === void 0 ? void 0 : _this$state$_privateP2.__hideFrame,
230
234
  pluginInjectionApi: pluginInjectionApi,
231
235
  macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
232
236
  isNodeSelected: selectedNode === node,
@@ -7,7 +7,9 @@ export const useMultiBodiedExtensionActions = ({
7
7
  editorView,
8
8
  getPos,
9
9
  node,
10
- eventDispatcher
10
+ eventDispatcher,
11
+ allowBodiedOverride,
12
+ childrenContainer
11
13
  }) => {
12
14
  const actions = React.useMemo(() => {
13
15
  return {
@@ -142,11 +144,20 @@ export const useMultiBodiedExtensionActions = ({
142
144
  }
143
145
  const children = (_state$doc$nodeAt = state.doc.nodeAt(pos)) === null || _state$doc$nodeAt === void 0 ? void 0 : _state$doc$nodeAt.content;
144
146
  if (eventDispatcher) {
145
- sendMBEAnalyticsEvent(ACTION.GET_CHILDERN, node, eventDispatcher);
147
+ sendMBEAnalyticsEvent(ACTION.GET_CHILDREN, node, eventDispatcher);
146
148
  }
147
149
  return children ? children.toJSON() : [];
150
+ },
151
+ getChildrenContainer() {
152
+ if (!allowBodiedOverride) {
153
+ throw new Error('Could not provide children container');
154
+ }
155
+ if (eventDispatcher) {
156
+ sendMBEAnalyticsEvent(ACTION.GET_CHILDREN_CONTAINER, node, eventDispatcher);
157
+ }
158
+ return childrenContainer;
148
159
  }
149
160
  };
150
- }, [node, editorView, getPos, updateActiveChild, eventDispatcher]);
161
+ }, [node, editorView, getPos, updateActiveChild, eventDispatcher, allowBodiedOverride, childrenContainer]);
151
162
  return actions;
152
163
  };
@@ -33,6 +33,17 @@ const imageStyles = css({
33
33
  maxHeight: '24px',
34
34
  maxWidth: '24px'
35
35
  });
36
+ const MultiBodiedExtensionFrames = ({
37
+ articleRef
38
+ }) => {
39
+ return jsx("article", {
40
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
41
+ className: "multiBodiedExtension--frames",
42
+ "data-testid": "multiBodiedExtension--frames",
43
+ ref: articleRef
44
+ });
45
+ };
46
+
36
47
  // Similar to the one in platform/packages/editor/editor-common/src/extensibility/Extension/Lozenge.tsx
37
48
  const getWrapperTitleContent = (imageData, title, showMacroInteractionDesignUpdates) => {
38
49
  if (showMacroInteractionDesignUpdates) {
@@ -80,7 +91,8 @@ const MultiBodiedExtensionWithWidth = ({
80
91
  isNodeNested,
81
92
  setIsNodeHovered,
82
93
  pluginInjectionApi,
83
- isLivePageViewMode
94
+ isLivePageViewMode,
95
+ allowBodiedOverride = false
84
96
  }) => {
85
97
  const {
86
98
  showMacroInteractionDesignUpdates
@@ -104,19 +116,26 @@ const MultiBodiedExtensionWithWidth = ({
104
116
  setActiveChildIndex(index);
105
117
  return true;
106
118
  }, [setActiveChildIndex]);
119
+ const articleRef = React.useCallback(node => {
120
+ return handleContentDOMRef(node);
121
+ }, [handleContentDOMRef]);
122
+ const childrenContainer = React.useMemo(() => {
123
+ return jsx(MultiBodiedExtensionFrames, {
124
+ articleRef: articleRef
125
+ });
126
+ }, [articleRef]);
107
127
  const actions = useMultiBodiedExtensionActions({
108
128
  updateActiveChild,
109
129
  editorView,
110
130
  getPos,
131
+ node,
111
132
  eventDispatcher,
112
- node
133
+ allowBodiedOverride,
134
+ childrenContainer
113
135
  });
114
136
  const extensionHandlerResult = React.useMemo(() => {
115
137
  return tryExtensionHandler(actions);
116
138
  }, [tryExtensionHandler, actions]);
117
- const articleRef = React.useCallback(node => {
118
- return handleContentDOMRef(node);
119
- }, [handleContentDOMRef]);
120
139
  const shouldBreakout =
121
140
  // Extension should breakout when the layout is set to 'full-width' or 'wide'.
122
141
  ['full-width', 'wide'].includes(node.attrs.layout) &&
@@ -143,6 +162,7 @@ const MultiBodiedExtensionWithWidth = ({
143
162
  const containerClassNames = classnames('multiBodiedExtension--container', {
144
163
  'remove-padding': showMacroInteractionDesignUpdates
145
164
  });
165
+ const bodyContainerClassNames = classnames('multiBodiedExtension--body-container');
146
166
  const navigationClassNames = classnames('multiBodiedExtension--navigation', {
147
167
  'remove-margins': showMacroInteractionDesignUpdates,
148
168
  'remove-border': showMacroInteractionDesignUpdates
@@ -192,19 +212,18 @@ const MultiBodiedExtensionWithWidth = ({
192
212
  css: getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates),
193
213
  "data-testid": "multiBodiedExtension--container",
194
214
  "data-active-child-index": activeChildIndex
195
- }, jsx("nav", {
215
+ }, allowBodiedOverride ? jsx("div", {
216
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
217
+ className: bodyContainerClassNames,
218
+ "data-testid": "multiBodiedExtension--body-container"
219
+ }, extensionHandlerResult) : jsx(Fragment, null, jsx("nav", {
196
220
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
197
221
  className: navigationClassNames
198
222
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
199
223
  ,
200
224
  css: sharedMultiBodiedExtensionStyles.mbeNavigation,
201
225
  "data-testid": "multiBodiedExtension-navigation"
202
- }, extensionHandlerResult), jsx("article", {
203
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
204
- className: "multiBodiedExtension--frames",
205
- "data-testid": "multiBodiedExtension--frames",
206
- ref: articleRef
207
- }))));
226
+ }, extensionHandlerResult), childrenContainer))));
208
227
  };
209
228
  const MultiBodiedExtension = props => {
210
229
  const {
@@ -1,7 +1,7 @@
1
1
  import { isFedRamp } from './environment';
2
2
  const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
3
3
  const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
4
- const packageVersion = "102.3.4";
4
+ const packageVersion = "102.5.0";
5
5
  const sanitiseSentryEvents = (data, _hint) => {
6
6
  // Remove URL as it has UGC
7
7
  // Ignored via go/ees007
@@ -21,7 +21,7 @@ export { shadowSharedStyle } from './shared/shadow';
21
21
  export { dateSharedStyle, DateSharedCssClassName } from './shared/date';
22
22
  export { tasksAndDecisionsStyles, TaskDecisionSharedCssClassName } from './shared/task-decision';
23
23
  export { StatusSharedCssClassName } from './shared/status';
24
- export { smartCardSharedStyles, SmartCardSharedCssClassName } from './shared/smart-card';
24
+ export { getSmartCardSharedStyles, smartCardSharedStyles, SmartCardSharedCssClassName } from './shared/smart-card';
25
25
  export { DropdownMenuSharedCssClassName } from './shared/dropdown-menu';
26
26
  export { CodeBlockSharedCssClassName, codeBlockSharedStyles, codeBlockInListSafariFix } from './shared/code-block';
27
27
  export { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from './shared/layout';
@@ -12,4 +12,19 @@ export const smartCardSharedStyles = `
12
12
  margin: ${blockNodesVerticalMargin} 0 0;
13
13
  max-width: ${8 * 95}px;
14
14
  }
15
+ `;
16
+ export const getSmartCardSharedStyles = () => `
17
+ .${SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER} {
18
+ display: block;
19
+ margin: ${blockNodesVerticalMargin} 0 0;
20
+ max-width: ${8 * 95}px;
21
+ }
22
+
23
+ .${SmartCardSharedCssClassName.LOADER_WRAPPER} {
24
+ /* EDM-11991: Fix list plugin adding padding to ADS AvatarGroup start */
25
+ ul, ol {
26
+ padding-left: inherit;
27
+ }
28
+ /* EDM-11991: Fix list plugin add padding to ADS AvatarGroup end */
29
+ }
15
30
  `;
@@ -13,7 +13,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
13
13
  import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
14
14
  import Layer from '../Layer';
15
15
  const packageName = "@atlaskit/editor-common";
16
- const packageVersion = "102.3.4";
16
+ const packageVersion = "102.5.0";
17
17
  const halfFocusRing = 1;
18
18
  const dropOffset = '0, 8';
19
19
  // Ignored via go/ees005
@@ -153,7 +153,8 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
153
153
  ACTION["CHANGE_ACTIVE"] = "changeActive";
154
154
  ACTION["REMOVE_CHILD"] = "removeChild";
155
155
  ACTION["UPDATE_PARAMETERS"] = "updateParameters";
156
- ACTION["GET_CHILDERN"] = "getChildern";
156
+ ACTION["GET_CHILDREN"] = "getChildren";
157
+ ACTION["GET_CHILDREN_CONTAINER"] = "getChildrenContainer";
157
158
  ACTION["MOVED"] = "moved";
158
159
  ACTION["UPLOAD_COMMENCED"] = "uploadCommenced";
159
160
  ACTION["UPLOAD_SUCCEEDED"] = "uploadSucceeded";
@@ -16,6 +16,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
16
16
  import React, { Component, useEffect, useLayoutEffect, useRef, useState } from 'react';
17
17
  import memoizeOne from 'memoize-one';
18
18
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
19
+ import { fg } from '@atlaskit/platform-feature-flags';
19
20
  import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '../extensions';
20
21
  import { getExtensionRenderer, nodeToJSON, toJSON } from '../utils';
21
22
  import Extension from './Extension/Extension';
@@ -212,7 +213,7 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component) {
212
213
  }, {
213
214
  key: "render",
214
215
  value: function render() {
215
- var _this$state$_privateP;
216
+ var _this$state$_privateP2;
216
217
  var _this$props2 = this.props,
217
218
  node = _this$props2.node,
218
219
  handleContentDOMRef = _this$props2.handleContentDOMRef,
@@ -235,6 +236,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component) {
235
236
  var resolvedPosition = position && editorView.state.doc.resolve(position);
236
237
  var isNodeNested = !!(resolvedPosition && resolvedPosition.depth > 0);
237
238
  if (node.type.name === 'multiBodiedExtension') {
239
+ var _this$state$_privateP;
240
+ var allowBodiedOverride = ((_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__allowBodiedOverride) && fg('platform_editor_multi_body_extension_extensibility');
238
241
  return /*#__PURE__*/React.createElement(MultiBodiedExtension, {
239
242
  node: node,
240
243
  editorView: editorView,
@@ -249,7 +252,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component) {
249
252
  isNodeNested: isNodeNested,
250
253
  isNodeHovered: this.state.isNodeHovered,
251
254
  setIsNodeHovered: this.setIsNodeHovered,
252
- isLivePageViewMode: isLivePageViewMode
255
+ isLivePageViewMode: isLivePageViewMode,
256
+ allowBodiedOverride: allowBodiedOverride
253
257
  });
254
258
  }
255
259
  var extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -264,7 +268,7 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component) {
264
268
  handleContentDOMRef: handleContentDOMRef,
265
269
  view: editorView,
266
270
  editorAppearance: editorAppearance,
267
- hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame,
271
+ hideFrame: (_this$state$_privateP2 = this.state._privateProps) === null || _this$state$_privateP2 === void 0 ? void 0 : _this$state$_privateP2.__hideFrame,
268
272
  pluginInjectionApi: pluginInjectionApi,
269
273
  macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
270
274
  isNodeSelected: selectedNode === node,
@@ -10,7 +10,9 @@ export var useMultiBodiedExtensionActions = function useMultiBodiedExtensionActi
10
10
  editorView = _ref.editorView,
11
11
  getPos = _ref.getPos,
12
12
  node = _ref.node,
13
- eventDispatcher = _ref.eventDispatcher;
13
+ eventDispatcher = _ref.eventDispatcher,
14
+ allowBodiedOverride = _ref.allowBodiedOverride,
15
+ childrenContainer = _ref.childrenContainer;
14
16
  var actions = React.useMemo(function () {
15
17
  return {
16
18
  changeActive: function changeActive(index) {
@@ -132,11 +134,20 @@ export var useMultiBodiedExtensionActions = function useMultiBodiedExtensionActi
132
134
  }
133
135
  var children = (_state$doc$nodeAt = state.doc.nodeAt(pos)) === null || _state$doc$nodeAt === void 0 ? void 0 : _state$doc$nodeAt.content;
134
136
  if (eventDispatcher) {
135
- sendMBEAnalyticsEvent(ACTION.GET_CHILDERN, node, eventDispatcher);
137
+ sendMBEAnalyticsEvent(ACTION.GET_CHILDREN, node, eventDispatcher);
136
138
  }
137
139
  return children ? children.toJSON() : [];
140
+ },
141
+ getChildrenContainer: function getChildrenContainer() {
142
+ if (!allowBodiedOverride) {
143
+ throw new Error('Could not provide children container');
144
+ }
145
+ if (eventDispatcher) {
146
+ sendMBEAnalyticsEvent(ACTION.GET_CHILDREN_CONTAINER, node, eventDispatcher);
147
+ }
148
+ return childrenContainer;
138
149
  }
139
150
  };
140
- }, [node, editorView, getPos, updateActiveChild, eventDispatcher]);
151
+ }, [node, editorView, getPos, updateActiveChild, eventDispatcher, allowBodiedOverride, childrenContainer]);
141
152
  return actions;
142
153
  };
@@ -38,6 +38,16 @@ var imageStyles = css({
38
38
  maxHeight: '24px',
39
39
  maxWidth: '24px'
40
40
  });
41
+ var MultiBodiedExtensionFrames = function MultiBodiedExtensionFrames(_ref) {
42
+ var articleRef = _ref.articleRef;
43
+ return jsx("article", {
44
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
45
+ className: "multiBodiedExtension--frames",
46
+ "data-testid": "multiBodiedExtension--frames",
47
+ ref: articleRef
48
+ });
49
+ };
50
+
41
51
  // Similar to the one in platform/packages/editor/editor-common/src/extensibility/Extension/Lozenge.tsx
42
52
  var getWrapperTitleContent = function getWrapperTitleContent(imageData, title, showMacroInteractionDesignUpdates) {
43
53
  if (showMacroInteractionDesignUpdates) {
@@ -68,24 +78,26 @@ var getWrapperTitleContent = function getWrapperTitleContent(imageData, title, s
68
78
  label: title
69
79
  }), title);
70
80
  };
71
- var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref) {
72
- var node = _ref.node,
73
- handleContentDOMRef = _ref.handleContentDOMRef,
74
- getPos = _ref.getPos,
75
- tryExtensionHandler = _ref.tryExtensionHandler,
76
- editorView = _ref.editorView,
77
- eventDispatcher = _ref.eventDispatcher,
78
- widthState = _ref.widthState,
79
- editorAppearance = _ref.editorAppearance,
80
- macroInteractionDesignFeatureFlags = _ref.macroInteractionDesignFeatureFlags,
81
- isNodeSelected = _ref.isNodeSelected,
82
- isNodeHovered = _ref.isNodeHovered,
83
- isNodeNested = _ref.isNodeNested,
84
- setIsNodeHovered = _ref.setIsNodeHovered,
85
- pluginInjectionApi = _ref.pluginInjectionApi,
86
- isLivePageViewMode = _ref.isLivePageViewMode;
87
- var _ref2 = macroInteractionDesignFeatureFlags || {},
88
- showMacroInteractionDesignUpdates = _ref2.showMacroInteractionDesignUpdates;
81
+ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2) {
82
+ var node = _ref2.node,
83
+ handleContentDOMRef = _ref2.handleContentDOMRef,
84
+ getPos = _ref2.getPos,
85
+ tryExtensionHandler = _ref2.tryExtensionHandler,
86
+ editorView = _ref2.editorView,
87
+ eventDispatcher = _ref2.eventDispatcher,
88
+ widthState = _ref2.widthState,
89
+ editorAppearance = _ref2.editorAppearance,
90
+ macroInteractionDesignFeatureFlags = _ref2.macroInteractionDesignFeatureFlags,
91
+ isNodeSelected = _ref2.isNodeSelected,
92
+ isNodeHovered = _ref2.isNodeHovered,
93
+ isNodeNested = _ref2.isNodeNested,
94
+ setIsNodeHovered = _ref2.setIsNodeHovered,
95
+ pluginInjectionApi = _ref2.pluginInjectionApi,
96
+ isLivePageViewMode = _ref2.isLivePageViewMode,
97
+ _ref2$allowBodiedOver = _ref2.allowBodiedOverride,
98
+ allowBodiedOverride = _ref2$allowBodiedOver === void 0 ? false : _ref2$allowBodiedOver;
99
+ var _ref3 = macroInteractionDesignFeatureFlags || {},
100
+ showMacroInteractionDesignUpdates = _ref3.showMacroInteractionDesignUpdates;
89
101
  var _node$attrs = node.attrs,
90
102
  parameters = _node$attrs.parameters,
91
103
  extensionKey = _node$attrs.extensionKey;
@@ -107,19 +119,26 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
107
119
  setActiveChildIndex(index);
108
120
  return true;
109
121
  }, [setActiveChildIndex]);
122
+ var articleRef = React.useCallback(function (node) {
123
+ return handleContentDOMRef(node);
124
+ }, [handleContentDOMRef]);
125
+ var childrenContainer = React.useMemo(function () {
126
+ return jsx(MultiBodiedExtensionFrames, {
127
+ articleRef: articleRef
128
+ });
129
+ }, [articleRef]);
110
130
  var actions = useMultiBodiedExtensionActions({
111
131
  updateActiveChild: updateActiveChild,
112
132
  editorView: editorView,
113
133
  getPos: getPos,
134
+ node: node,
114
135
  eventDispatcher: eventDispatcher,
115
- node: node
136
+ allowBodiedOverride: allowBodiedOverride,
137
+ childrenContainer: childrenContainer
116
138
  });
117
139
  var extensionHandlerResult = React.useMemo(function () {
118
140
  return tryExtensionHandler(actions);
119
141
  }, [tryExtensionHandler, actions]);
120
- var articleRef = React.useCallback(function (node) {
121
- return handleContentDOMRef(node);
122
- }, [handleContentDOMRef]);
123
142
  var shouldBreakout =
124
143
  // Extension should breakout when the layout is set to 'full-width' or 'wide'.
125
144
  ['full-width', 'wide'].includes(node.attrs.layout) &&
@@ -145,6 +164,7 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
145
164
  var containerClassNames = classnames('multiBodiedExtension--container', {
146
165
  'remove-padding': showMacroInteractionDesignUpdates
147
166
  });
167
+ var bodyContainerClassNames = classnames('multiBodiedExtension--body-container');
148
168
  var navigationClassNames = classnames('multiBodiedExtension--navigation', {
149
169
  'remove-margins': showMacroInteractionDesignUpdates,
150
170
  'remove-border': showMacroInteractionDesignUpdates
@@ -198,19 +218,18 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
198
218
  css: getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates),
199
219
  "data-testid": "multiBodiedExtension--container",
200
220
  "data-active-child-index": activeChildIndex
201
- }, jsx("nav", {
221
+ }, allowBodiedOverride ? jsx("div", {
222
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
223
+ className: bodyContainerClassNames,
224
+ "data-testid": "multiBodiedExtension--body-container"
225
+ }, extensionHandlerResult) : jsx(Fragment, null, jsx("nav", {
202
226
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
203
227
  className: navigationClassNames
204
228
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
205
229
  ,
206
230
  css: sharedMultiBodiedExtensionStyles.mbeNavigation,
207
231
  "data-testid": "multiBodiedExtension-navigation"
208
- }, extensionHandlerResult), jsx("article", {
209
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
210
- className: "multiBodiedExtension--frames",
211
- "data-testid": "multiBodiedExtension--frames",
212
- ref: articleRef
213
- }))));
232
+ }, extensionHandlerResult), childrenContainer))));
214
233
  };
215
234
  var MultiBodiedExtension = function MultiBodiedExtension(props) {
216
235
  var pluginInjectionApi = props.pluginInjectionApi;
@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
7
7
  import { isFedRamp } from './environment';
8
8
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
9
9
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
10
- var packageVersion = "102.3.4";
10
+ var packageVersion = "102.5.0";
11
11
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
12
12
  // Remove URL as it has UGC
13
13
  // Ignored via go/ees007
@@ -21,7 +21,7 @@ export { shadowSharedStyle } from './shared/shadow';
21
21
  export { dateSharedStyle, DateSharedCssClassName } from './shared/date';
22
22
  export { tasksAndDecisionsStyles, TaskDecisionSharedCssClassName } from './shared/task-decision';
23
23
  export { StatusSharedCssClassName } from './shared/status';
24
- export { smartCardSharedStyles, SmartCardSharedCssClassName } from './shared/smart-card';
24
+ export { getSmartCardSharedStyles, smartCardSharedStyles, SmartCardSharedCssClassName } from './shared/smart-card';
25
25
  export { DropdownMenuSharedCssClassName } from './shared/dropdown-menu';
26
26
  export { CodeBlockSharedCssClassName, codeBlockSharedStyles, codeBlockInListSafariFix } from './shared/code-block';
27
27
  export { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from './shared/layout';
@@ -6,4 +6,7 @@ export var SmartCardSharedCssClassName = {
6
6
  DATASOURCE_CONTAINER: 'datasourceView-content-wrap',
7
7
  LOADER_WRAPPER: 'loader-wrapper'
8
8
  };
9
- export var smartCardSharedStyles = "\n .".concat(SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, " {\n display: block;\n margin: ").concat(blockNodesVerticalMargin, " 0 0;\n max-width: ").concat(8 * 95, "px;\n }\n");
9
+ export var smartCardSharedStyles = "\n .".concat(SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, " {\n display: block;\n margin: ").concat(blockNodesVerticalMargin, " 0 0;\n max-width: ").concat(8 * 95, "px;\n }\n");
10
+ export var getSmartCardSharedStyles = function getSmartCardSharedStyles() {
11
+ return "\n .".concat(SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, " {\n display: block;\n margin: ").concat(blockNodesVerticalMargin, " 0 0;\n max-width: ").concat(8 * 95, "px;\n }\n\n .").concat(SmartCardSharedCssClassName.LOADER_WRAPPER, " {\n /* EDM-11991: Fix list plugin adding padding to ADS AvatarGroup start */\n ul, ol {\n padding-left: inherit;\n }\n /* EDM-11991: Fix list plugin add padding to ADS AvatarGroup end */\n }\n");
12
+ };
@@ -20,7 +20,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
20
20
  import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
21
21
  import Layer from '../Layer';
22
22
  var packageName = "@atlaskit/editor-common";
23
- var packageVersion = "102.3.4";
23
+ var packageVersion = "102.5.0";
24
24
  var halfFocusRing = 1;
25
25
  var dropOffset = '0, 8';
26
26
  // Ignored via go/ees005
@@ -166,7 +166,8 @@ export declare enum ACTION {
166
166
  CHANGE_ACTIVE = "changeActive",
167
167
  REMOVE_CHILD = "removeChild",
168
168
  UPDATE_PARAMETERS = "updateParameters",
169
- GET_CHILDERN = "getChildern",
169
+ GET_CHILDREN = "getChildren",
170
+ GET_CHILDREN_CONTAINER = "getChildrenContainer",
170
171
  MOVED = "moved",
171
172
  UPLOAD_COMMENCED = "uploadCommenced",
172
173
  UPLOAD_SUCCEEDED = "uploadSucceeded",
@@ -65,7 +65,7 @@ type CustomPanelEventPayload = TrackAEP<ACTION.CHANGED_BACKGROUND_COLOR | ACTION
65
65
  } | {
66
66
  icon: string;
67
67
  }, undefined>;
68
- type MBEEventPayload = TrackAEP<ACTION.ADD_CHILD | ACTION.CHANGE_ACTIVE | ACTION.DELETED | ACTION.REMOVE_CHILD | ACTION.UPDATE_PARAMETERS | ACTION.GET_CHILDERN, ACTION_SUBJECT.MULTI_BODIED_EXTENSION, undefined, {
68
+ type MBEEventPayload = TrackAEP<ACTION.ADD_CHILD | ACTION.CHANGE_ACTIVE | ACTION.DELETED | ACTION.REMOVE_CHILD | ACTION.UPDATE_PARAMETERS | ACTION.GET_CHILDREN | ACTION.GET_CHILDREN_CONTAINER, ACTION_SUBJECT.MULTI_BODIED_EXTENSION, undefined, {
69
69
  extensionType: string;
70
70
  extensionKey: string;
71
71
  localId: string;
@@ -29,6 +29,7 @@ export interface State {
29
29
  extensionHandlersFromProvider?: ExtensionHandlers;
30
30
  _privateProps?: {
31
31
  __hideFrame?: boolean;
32
+ __allowBodiedOverride?: boolean;
32
33
  };
33
34
  activeChildIndex?: number;
34
35
  isNodeHovered?: boolean;
@@ -1,3 +1,4 @@
1
+ import React from 'react';
1
2
  import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
2
3
  import type { EditorView } from '@atlaskit/editor-prosemirror/view';
3
4
  import type { EventDispatcher } from '../../event-dispatcher';
@@ -8,6 +9,8 @@ type ActionsProps = {
8
9
  editorView: EditorView;
9
10
  getPos: () => number | undefined;
10
11
  eventDispatcher?: EventDispatcher;
12
+ allowBodiedOverride: boolean;
13
+ childrenContainer: React.ReactNode;
11
14
  };
12
- export declare const useMultiBodiedExtensionActions: ({ updateActiveChild, editorView, getPos, node, eventDispatcher, }: ActionsProps) => MultiBodiedExtensionActions;
15
+ export declare const useMultiBodiedExtensionActions: ({ updateActiveChild, editorView, getPos, node, eventDispatcher, allowBodiedOverride, childrenContainer, }: ActionsProps) => MultiBodiedExtensionActions;
13
16
  export {};
@@ -27,6 +27,7 @@ type Props = {
27
27
  isNodeNested?: boolean;
28
28
  setIsNodeHovered?: (isHovered: boolean) => void;
29
29
  isLivePageViewMode?: boolean;
30
+ allowBodiedOverride?: boolean;
30
31
  };
31
32
  declare const MultiBodiedExtension: (props: Props & OverflowShadowProps) => jsx.JSX.Element;
32
33
  export default MultiBodiedExtension;
@@ -1,6 +1,6 @@
1
1
  import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
2
2
  import type { ACTION } from '../../analytics';
3
3
  import type { EventDispatcher } from '../../event-dispatcher';
4
- type AnalyticsActionTypes = ACTION.ADD_CHILD | ACTION.CHANGE_ACTIVE | ACTION.DELETED | ACTION.REMOVE_CHILD | ACTION.UPDATE_PARAMETERS | ACTION.GET_CHILDERN;
4
+ type AnalyticsActionTypes = ACTION.ADD_CHILD | ACTION.CHANGE_ACTIVE | ACTION.DELETED | ACTION.REMOVE_CHILD | ACTION.UPDATE_PARAMETERS | ACTION.GET_CHILDREN | ACTION.GET_CHILDREN_CONTAINER;
5
5
  export declare const sendMBEAnalyticsEvent: (action: AnalyticsActionTypes, node: PmNode, eventDispatcher: EventDispatcher) => void;
6
6
  export {};
@@ -48,6 +48,7 @@ export type MultiBodiedExtensionActions = {
48
48
  removeChild: (index: number) => boolean;
49
49
  updateParameters: (parameters: Parameters) => boolean;
50
50
  getChildren(): Array<ADFEntity>;
51
+ getChildrenContainer(): React.ReactNode;
51
52
  };
52
53
  export type ParametersGetter<T extends Parameters = Parameters> = TransformBefore<T>;
53
54
  export type AsyncParametersGetter<T extends Parameters = Parameters> = TransformAfter<T>;
@@ -18,7 +18,7 @@ export { shadowSharedStyle } from './shared/shadow';
18
18
  export { dateSharedStyle, DateSharedCssClassName } from './shared/date';
19
19
  export { tasksAndDecisionsStyles, TaskDecisionSharedCssClassName } from './shared/task-decision';
20
20
  export { StatusSharedCssClassName } from './shared/status';
21
- export { smartCardSharedStyles, SmartCardSharedCssClassName } from './shared/smart-card';
21
+ export { getSmartCardSharedStyles, smartCardSharedStyles, SmartCardSharedCssClassName } from './shared/smart-card';
22
22
  export { DropdownMenuSharedCssClassName } from './shared/dropdown-menu';
23
23
  export { CodeBlockSharedCssClassName, codeBlockSharedStyles, codeBlockInListSafariFix, } from './shared/code-block';
24
24
  export { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from './shared/layout';
@@ -6,3 +6,4 @@ export declare const SmartCardSharedCssClassName: {
6
6
  LOADER_WRAPPER: string;
7
7
  };
8
8
  export declare const smartCardSharedStyles: string;
9
+ export declare const getSmartCardSharedStyles: () => string;
@@ -166,7 +166,8 @@ export declare enum ACTION {
166
166
  CHANGE_ACTIVE = "changeActive",
167
167
  REMOVE_CHILD = "removeChild",
168
168
  UPDATE_PARAMETERS = "updateParameters",
169
- GET_CHILDERN = "getChildern",
169
+ GET_CHILDREN = "getChildren",
170
+ GET_CHILDREN_CONTAINER = "getChildrenContainer",
170
171
  MOVED = "moved",
171
172
  UPLOAD_COMMENCED = "uploadCommenced",
172
173
  UPLOAD_SUCCEEDED = "uploadSucceeded",
@@ -65,7 +65,7 @@ type CustomPanelEventPayload = TrackAEP<ACTION.CHANGED_BACKGROUND_COLOR | ACTION
65
65
  } | {
66
66
  icon: string;
67
67
  }, undefined>;
68
- type MBEEventPayload = TrackAEP<ACTION.ADD_CHILD | ACTION.CHANGE_ACTIVE | ACTION.DELETED | ACTION.REMOVE_CHILD | ACTION.UPDATE_PARAMETERS | ACTION.GET_CHILDERN, ACTION_SUBJECT.MULTI_BODIED_EXTENSION, undefined, {
68
+ type MBEEventPayload = TrackAEP<ACTION.ADD_CHILD | ACTION.CHANGE_ACTIVE | ACTION.DELETED | ACTION.REMOVE_CHILD | ACTION.UPDATE_PARAMETERS | ACTION.GET_CHILDREN | ACTION.GET_CHILDREN_CONTAINER, ACTION_SUBJECT.MULTI_BODIED_EXTENSION, undefined, {
69
69
  extensionType: string;
70
70
  extensionKey: string;
71
71
  localId: string;
@@ -29,6 +29,7 @@ export interface State {
29
29
  extensionHandlersFromProvider?: ExtensionHandlers;
30
30
  _privateProps?: {
31
31
  __hideFrame?: boolean;
32
+ __allowBodiedOverride?: boolean;
32
33
  };
33
34
  activeChildIndex?: number;
34
35
  isNodeHovered?: boolean;
@@ -1,3 +1,4 @@
1
+ import React from 'react';
1
2
  import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
2
3
  import type { EditorView } from '@atlaskit/editor-prosemirror/view';
3
4
  import type { EventDispatcher } from '../../event-dispatcher';
@@ -8,6 +9,8 @@ type ActionsProps = {
8
9
  editorView: EditorView;
9
10
  getPos: () => number | undefined;
10
11
  eventDispatcher?: EventDispatcher;
12
+ allowBodiedOverride: boolean;
13
+ childrenContainer: React.ReactNode;
11
14
  };
12
- export declare const useMultiBodiedExtensionActions: ({ updateActiveChild, editorView, getPos, node, eventDispatcher, }: ActionsProps) => MultiBodiedExtensionActions;
15
+ export declare const useMultiBodiedExtensionActions: ({ updateActiveChild, editorView, getPos, node, eventDispatcher, allowBodiedOverride, childrenContainer, }: ActionsProps) => MultiBodiedExtensionActions;
13
16
  export {};
@@ -27,6 +27,7 @@ type Props = {
27
27
  isNodeNested?: boolean;
28
28
  setIsNodeHovered?: (isHovered: boolean) => void;
29
29
  isLivePageViewMode?: boolean;
30
+ allowBodiedOverride?: boolean;
30
31
  };
31
32
  declare const MultiBodiedExtension: (props: Props & OverflowShadowProps) => jsx.JSX.Element;
32
33
  export default MultiBodiedExtension;
@@ -1,6 +1,6 @@
1
1
  import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
2
2
  import type { ACTION } from '../../analytics';
3
3
  import type { EventDispatcher } from '../../event-dispatcher';
4
- type AnalyticsActionTypes = ACTION.ADD_CHILD | ACTION.CHANGE_ACTIVE | ACTION.DELETED | ACTION.REMOVE_CHILD | ACTION.UPDATE_PARAMETERS | ACTION.GET_CHILDERN;
4
+ type AnalyticsActionTypes = ACTION.ADD_CHILD | ACTION.CHANGE_ACTIVE | ACTION.DELETED | ACTION.REMOVE_CHILD | ACTION.UPDATE_PARAMETERS | ACTION.GET_CHILDREN | ACTION.GET_CHILDREN_CONTAINER;
5
5
  export declare const sendMBEAnalyticsEvent: (action: AnalyticsActionTypes, node: PmNode, eventDispatcher: EventDispatcher) => void;
6
6
  export {};
@@ -48,6 +48,7 @@ export type MultiBodiedExtensionActions = {
48
48
  removeChild: (index: number) => boolean;
49
49
  updateParameters: (parameters: Parameters) => boolean;
50
50
  getChildren(): Array<ADFEntity>;
51
+ getChildrenContainer(): React.ReactNode;
51
52
  };
52
53
  export type ParametersGetter<T extends Parameters = Parameters> = TransformBefore<T>;
53
54
  export type AsyncParametersGetter<T extends Parameters = Parameters> = TransformAfter<T>;
@@ -18,7 +18,7 @@ export { shadowSharedStyle } from './shared/shadow';
18
18
  export { dateSharedStyle, DateSharedCssClassName } from './shared/date';
19
19
  export { tasksAndDecisionsStyles, TaskDecisionSharedCssClassName } from './shared/task-decision';
20
20
  export { StatusSharedCssClassName } from './shared/status';
21
- export { smartCardSharedStyles, SmartCardSharedCssClassName } from './shared/smart-card';
21
+ export { getSmartCardSharedStyles, smartCardSharedStyles, SmartCardSharedCssClassName } from './shared/smart-card';
22
22
  export { DropdownMenuSharedCssClassName } from './shared/dropdown-menu';
23
23
  export { CodeBlockSharedCssClassName, codeBlockSharedStyles, codeBlockInListSafariFix, } from './shared/code-block';
24
24
  export { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from './shared/layout';
@@ -6,3 +6,4 @@ export declare const SmartCardSharedCssClassName: {
6
6
  LOADER_WRAPPER: string;
7
7
  };
8
8
  export declare const smartCardSharedStyles: string;
9
+ export declare const getSmartCardSharedStyles: () => string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-common",
3
- "version": "102.3.4",
3
+ "version": "102.5.0",
4
4
  "description": "A package that contains common classes and components for editor and renderer",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -135,7 +135,7 @@
135
135
  "@atlaskit/editor-shared-styles": "^3.4.0",
136
136
  "@atlaskit/editor-tables": "^2.9.0",
137
137
  "@atlaskit/emoji": "^68.0.0",
138
- "@atlaskit/icon": "^24.1.0",
138
+ "@atlaskit/icon": "^25.0.0",
139
139
  "@atlaskit/icon-object": "^7.0.0",
140
140
  "@atlaskit/link-datasource": "^3.22.0",
141
141
  "@atlaskit/link-picker": "^3.0.0",
@@ -160,7 +160,7 @@
160
160
  "@atlaskit/spinner": "^18.0.0",
161
161
  "@atlaskit/task-decision": "^19.0.0",
162
162
  "@atlaskit/textfield": "^8.0.0",
163
- "@atlaskit/tmp-editor-statsig": "^3.5.0",
163
+ "@atlaskit/tmp-editor-statsig": "^3.6.0",
164
164
  "@atlaskit/tokens": "^4.4.0",
165
165
  "@atlaskit/tooltip": "^20.0.0",
166
166
  "@atlaskit/width-detector": "^5.0.0",
@@ -316,6 +316,9 @@
316
316
  "platform_renderer_table_sort_btn_aria_hidden": {
317
317
  "type": "boolean"
318
318
  },
319
+ "platform_editor_multi_body_extension_extensibility": {
320
+ "type": "boolean"
321
+ },
319
322
  "platform_editor_nested_tables_resizing": {
320
323
  "type": "boolean"
321
324
  },