@atlaskit/editor-plugin-insert-block 2.3.6 → 2.4.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,33 @@
1
1
  # @atlaskit/editor-plugin-insert-block
2
2
 
3
+ ## 2.4.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#155333](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/155333)
8
+ [`8b2c7d6c20aa1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8b2c7d6c20aa1) -
9
+ change logic to ensure plus menu can open in comment when insert-right-rail experiment is enabled
10
+ - [#155735](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/155735)
11
+ [`1beeeda29023a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1beeeda29023a) -
12
+ Upgrades editor packages to react 18
13
+ - [#155345](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/155345)
14
+ [`9f00717c4915b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/9f00717c4915b) -
15
+ [ux] Add layout placeholder behind feature gate
16
+ - Updated dependencies
17
+
18
+ ## 2.4.0
19
+
20
+ ### Minor Changes
21
+
22
+ - [#154398](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/154398)
23
+ [`ca1591355d790`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ca1591355d790) -
24
+ [ux] Allows for passing functions to the quickInsert plugin that allow for capturing element
25
+ insertion metrics and then using that data to change the element sort order
26
+
27
+ ### Patch Changes
28
+
29
+ - Updated dependencies
30
+
3
31
  ## 2.3.6
4
32
 
5
33
  ### Patch Changes
@@ -27,7 +27,7 @@ var _excluded = ["children"];
27
27
  // AFP-2532 TODO: Fix automatic suppressions below
28
28
  // eslint-disable-next-line @atlassian/tangerine/import/entry-points
29
29
  var InsertMenu = function InsertMenu(_ref) {
30
- var _pluginInjectionApi$q7, _pluginInjectionApi$q8;
30
+ var _pluginInjectionApi$q9, _pluginInjectionApi$q10;
31
31
  var editorView = _ref.editorView,
32
32
  dropdownItems = _ref.dropdownItems,
33
33
  showElementBrowserLink = _ref.showElementBrowserLink,
@@ -66,18 +66,20 @@ var InsertMenu = function InsertMenu(_ref) {
66
66
  var quickInsertDropdownItems = dropdownItems.map(transform);
67
67
  var viewMoreItem = showElementBrowserLink ? quickInsertDropdownItems.pop() : undefined;
68
68
  var onInsertItem = (0, _react.useCallback)(function (item) {
69
+ var _pluginInjectionApi$q, _pluginInjectionApi$q2;
69
70
  toggleVisiblity();
70
71
  if (!editorView.hasFocus()) {
71
72
  editorView.focus();
72
73
  }
74
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q === void 0 || (_pluginInjectionApi$q = _pluginInjectionApi$q.actions) === null || _pluginInjectionApi$q === void 0 || (_pluginInjectionApi$q2 = _pluginInjectionApi$q.onInsert) === null || _pluginInjectionApi$q2 === void 0 || _pluginInjectionApi$q2.call(_pluginInjectionApi$q, item);
73
75
  if (isFullPageAppearance && (0, _experiments.editorExperiment)('insert-menu-in-right-rail', true)) {
74
- var _pluginInjectionApi$q;
75
- pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q === void 0 || _pluginInjectionApi$q.actions.insertItem(item,
76
+ var _pluginInjectionApi$q3;
77
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q3 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q3 === void 0 || _pluginInjectionApi$q3.actions.insertItem(item,
76
78
  // @ts-expect-error
77
79
  _analytics.INPUT_METHOD.INSERT_MENU_RIGHT_RAIL)(editorView.state, editorView.dispatch);
78
80
  } else {
79
- var _pluginInjectionApi$q2;
80
- pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q2 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q2 === void 0 || _pluginInjectionApi$q2.actions.insertItem(item, _analytics.INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
81
+ var _pluginInjectionApi$q4;
82
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q4 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q4 === void 0 || _pluginInjectionApi$q4.actions.insertItem(item, _analytics.INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
81
83
  }
82
84
  }, [editorView, toggleVisiblity, pluginInjectionApi, isFullPageAppearance]);
83
85
  var getItems = (0, _react.useCallback)(function (query, category) {
@@ -89,19 +91,19 @@ var InsertMenu = function InsertMenu(_ref) {
89
91
  * @see above transform function for more details.
90
92
  */
91
93
  if (query) {
92
- var _pluginInjectionApi$q3, _pluginInjectionApi$q4;
93
- result = (_pluginInjectionApi$q3 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q4 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q4 === void 0 ? void 0 : _pluginInjectionApi$q4.actions.getSuggestions({
94
+ var _pluginInjectionApi$q5, _pluginInjectionApi$q6;
95
+ result = (_pluginInjectionApi$q5 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.actions.getSuggestions({
94
96
  query: query,
95
97
  category: category
96
- })) !== null && _pluginInjectionApi$q3 !== void 0 ? _pluginInjectionApi$q3 : [];
98
+ })) !== null && _pluginInjectionApi$q5 !== void 0 ? _pluginInjectionApi$q5 : [];
97
99
  } else {
98
- var _pluginInjectionApi$q5, _pluginInjectionApi$q6;
99
- var featuredQuickInsertSuggestions = (_pluginInjectionApi$q5 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.actions.getSuggestions({
100
+ var _pluginInjectionApi$q7, _pluginInjectionApi$q8;
101
+ var featuredQuickInsertSuggestions = (_pluginInjectionApi$q7 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q8 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : _pluginInjectionApi$q8.actions.getSuggestions({
100
102
  category: category,
101
103
  featuredItems: true,
102
104
  // @ts-ignore
103
105
  templateItems: isFullPageAppearance && (0, _experiments.editorExperiment)('element-level-templates', true)
104
- })) !== null && _pluginInjectionApi$q5 !== void 0 ? _pluginInjectionApi$q5 : [];
106
+ })) !== null && _pluginInjectionApi$q7 !== void 0 ? _pluginInjectionApi$q7 : [];
105
107
  if (isFullPageAppearance && (0, _experiments.editorExperiment)('element-level-templates', true)) {
106
108
  // Make sure template options appear as top 5 items
107
109
  featuredQuickInsertSuggestions.sort(function (a, b) {
@@ -116,8 +118,8 @@ var InsertMenu = function InsertMenu(_ref) {
116
118
  }
117
119
  setItemCount(result.length);
118
120
  return result;
119
- }, [pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q7 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q7 === void 0 ? void 0 : _pluginInjectionApi$q7.actions, quickInsertDropdownItems, isFullPageAppearance]);
120
- var emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q8 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q8 === void 0 || (_pluginInjectionApi$q8 = _pluginInjectionApi$q8.sharedState.currentState()) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : _pluginInjectionApi$q8.emptyStateHandler;
121
+ }, [pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q9 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q9 === void 0 ? void 0 : _pluginInjectionApi$q9.actions, quickInsertDropdownItems, isFullPageAppearance]);
122
+ var emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q10 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q10 === void 0 || (_pluginInjectionApi$q10 = _pluginInjectionApi$q10.sharedState.currentState()) === null || _pluginInjectionApi$q10 === void 0 ? void 0 : _pluginInjectionApi$q10.emptyStateHandler;
121
123
 
122
124
  /**
123
125
  * For insert menu in right rail experiment
@@ -350,8 +350,9 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
350
350
  var _pluginInjectionApi$l;
351
351
  var _this$props4 = _this.props,
352
352
  editorView = _this$props4.editorView,
353
- pluginInjectionApi = _this$props4.pluginInjectionApi;
354
- pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.layout) === null || _pluginInjectionApi$l === void 0 || _pluginInjectionApi$l.actions.insertLayoutColumns(inputMethod)(editorView.state, editorView.dispatch);
353
+ pluginInjectionApi = _this$props4.pluginInjectionApi,
354
+ intl = _this$props4.intl;
355
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.layout) === null || _pluginInjectionApi$l === void 0 || _pluginInjectionApi$l.actions.insertLayoutColumns(inputMethod, intl.formatMessage)(editorView.state, editorView.dispatch);
355
356
  return true;
356
357
  });
357
358
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "createStatus", function (inputMethod) {
@@ -786,7 +787,7 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
786
787
  editorView: this.props.editorView,
787
788
  spacing: this.props.isReducedSpacing ? 'none' : 'default',
788
789
  label: this.props.intl.formatMessage(_messages.messages.insertMenu),
789
- open: this.state.isPlusMenuOpen && (0, _experiments.editorExperiment)('insert-menu-in-right-rail', false),
790
+ open: (0, _experiments.editorExperiment)('insert-menu-in-right-rail', true) ? !isFullPageAppearance && this.state.isPlusMenuOpen : this.state.isPlusMenuOpen,
790
791
  plusButtonRef: this.plusButtonRef,
791
792
  items: this.state.dropdownItems,
792
793
  onRef: this.handleDropDownButtonRef,
@@ -26,7 +26,7 @@ const InsertMenu = ({
26
26
  pluginInjectionApi,
27
27
  isFullPageAppearance
28
28
  }) => {
29
- var _pluginInjectionApi$q7, _pluginInjectionApi$q8, _pluginInjectionApi$q9;
29
+ var _pluginInjectionApi$q10, _pluginInjectionApi$q11, _pluginInjectionApi$q12;
30
30
  const [itemCount, setItemCount] = useState(0);
31
31
  const transform = useCallback(item => ({
32
32
  title: item.content,
@@ -49,18 +49,20 @@ const InsertMenu = ({
49
49
  const quickInsertDropdownItems = dropdownItems.map(transform);
50
50
  const viewMoreItem = showElementBrowserLink ? quickInsertDropdownItems.pop() : undefined;
51
51
  const onInsertItem = useCallback(item => {
52
+ var _pluginInjectionApi$q, _pluginInjectionApi$q2, _pluginInjectionApi$q3;
52
53
  toggleVisiblity();
53
54
  if (!editorView.hasFocus()) {
54
55
  editorView.focus();
55
56
  }
57
+ pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q === void 0 ? void 0 : (_pluginInjectionApi$q2 = _pluginInjectionApi$q.actions) === null || _pluginInjectionApi$q2 === void 0 ? void 0 : (_pluginInjectionApi$q3 = _pluginInjectionApi$q2.onInsert) === null || _pluginInjectionApi$q3 === void 0 ? void 0 : _pluginInjectionApi$q3.call(_pluginInjectionApi$q2, item);
56
58
  if (isFullPageAppearance && editorExperiment('insert-menu-in-right-rail', true)) {
57
- var _pluginInjectionApi$q;
58
- pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q === void 0 ? void 0 : _pluginInjectionApi$q.actions.insertItem(item,
59
+ var _pluginInjectionApi$q4;
60
+ pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q4 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q4 === void 0 ? void 0 : _pluginInjectionApi$q4.actions.insertItem(item,
59
61
  // @ts-expect-error
60
62
  INPUT_METHOD.INSERT_MENU_RIGHT_RAIL)(editorView.state, editorView.dispatch);
61
63
  } else {
62
- var _pluginInjectionApi$q2;
63
- pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q2 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q2 === void 0 ? void 0 : _pluginInjectionApi$q2.actions.insertItem(item, INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
64
+ var _pluginInjectionApi$q5;
65
+ pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q5 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q5 === void 0 ? void 0 : _pluginInjectionApi$q5.actions.insertItem(item, INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
64
66
  }
65
67
  }, [editorView, toggleVisiblity, pluginInjectionApi, isFullPageAppearance]);
66
68
  const getItems = useCallback((query, category) => {
@@ -72,19 +74,19 @@ const InsertMenu = ({
72
74
  * @see above transform function for more details.
73
75
  */
74
76
  if (query) {
75
- var _pluginInjectionApi$q3, _pluginInjectionApi$q4;
76
- result = (_pluginInjectionApi$q3 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q4 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q4 === void 0 ? void 0 : _pluginInjectionApi$q4.actions.getSuggestions({
77
+ var _pluginInjectionApi$q6, _pluginInjectionApi$q7;
78
+ result = (_pluginInjectionApi$q6 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q7 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q7 === void 0 ? void 0 : _pluginInjectionApi$q7.actions.getSuggestions({
77
79
  query,
78
80
  category
79
- })) !== null && _pluginInjectionApi$q3 !== void 0 ? _pluginInjectionApi$q3 : [];
81
+ })) !== null && _pluginInjectionApi$q6 !== void 0 ? _pluginInjectionApi$q6 : [];
80
82
  } else {
81
- var _pluginInjectionApi$q5, _pluginInjectionApi$q6;
82
- const featuredQuickInsertSuggestions = (_pluginInjectionApi$q5 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.actions.getSuggestions({
83
+ var _pluginInjectionApi$q8, _pluginInjectionApi$q9;
84
+ const featuredQuickInsertSuggestions = (_pluginInjectionApi$q8 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q9 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q9 === void 0 ? void 0 : _pluginInjectionApi$q9.actions.getSuggestions({
83
85
  category,
84
86
  featuredItems: true,
85
87
  // @ts-ignore
86
88
  templateItems: isFullPageAppearance && editorExperiment('element-level-templates', true)
87
- })) !== null && _pluginInjectionApi$q5 !== void 0 ? _pluginInjectionApi$q5 : [];
89
+ })) !== null && _pluginInjectionApi$q8 !== void 0 ? _pluginInjectionApi$q8 : [];
88
90
  if (isFullPageAppearance && editorExperiment('element-level-templates', true)) {
89
91
  // Make sure template options appear as top 5 items
90
92
  featuredQuickInsertSuggestions.sort((a, b) => {
@@ -99,8 +101,8 @@ const InsertMenu = ({
99
101
  }
100
102
  setItemCount(result.length);
101
103
  return result;
102
- }, [pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q7 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q7 === void 0 ? void 0 : _pluginInjectionApi$q7.actions, quickInsertDropdownItems, isFullPageAppearance]);
103
- const emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q8 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : (_pluginInjectionApi$q9 = _pluginInjectionApi$q8.sharedState.currentState()) === null || _pluginInjectionApi$q9 === void 0 ? void 0 : _pluginInjectionApi$q9.emptyStateHandler;
104
+ }, [pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q10 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q10 === void 0 ? void 0 : _pluginInjectionApi$q10.actions, quickInsertDropdownItems, isFullPageAppearance]);
105
+ const emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q11 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q11 === void 0 ? void 0 : (_pluginInjectionApi$q12 = _pluginInjectionApi$q11.sharedState.currentState()) === null || _pluginInjectionApi$q12 === void 0 ? void 0 : _pluginInjectionApi$q12.emptyStateHandler;
104
106
 
105
107
  /**
106
108
  * For insert menu in right rail experiment
@@ -360,9 +360,10 @@ export class ToolbarInsertBlock extends React.PureComponent {
360
360
  var _pluginInjectionApi$l;
361
361
  const {
362
362
  editorView,
363
- pluginInjectionApi
363
+ pluginInjectionApi,
364
+ intl
364
365
  } = this.props;
365
- pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$l = pluginInjectionApi.layout) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.insertLayoutColumns(inputMethod)(editorView.state, editorView.dispatch);
366
+ pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$l = pluginInjectionApi.layout) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.insertLayoutColumns(inputMethod, intl.formatMessage)(editorView.state, editorView.dispatch);
366
367
  return true;
367
368
  });
368
369
  _defineProperty(this, "createStatus", inputMethod => {
@@ -820,7 +821,7 @@ export class ToolbarInsertBlock extends React.PureComponent {
820
821
  editorView: this.props.editorView,
821
822
  spacing: this.props.isReducedSpacing ? 'none' : 'default',
822
823
  label: this.props.intl.formatMessage(messages.insertMenu),
823
- open: this.state.isPlusMenuOpen && editorExperiment('insert-menu-in-right-rail', false),
824
+ open: editorExperiment('insert-menu-in-right-rail', true) ? !isFullPageAppearance && this.state.isPlusMenuOpen : this.state.isPlusMenuOpen,
824
825
  plusButtonRef: this.plusButtonRef,
825
826
  items: this.state.dropdownItems,
826
827
  onRef: this.handleDropDownButtonRef,
@@ -22,7 +22,7 @@ import { borderRadius } from '@atlaskit/theme';
22
22
  import { N0, N30A, N60A } from '@atlaskit/theme/colors';
23
23
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
24
24
  var InsertMenu = function InsertMenu(_ref) {
25
- var _pluginInjectionApi$q7, _pluginInjectionApi$q8;
25
+ var _pluginInjectionApi$q9, _pluginInjectionApi$q10;
26
26
  var editorView = _ref.editorView,
27
27
  dropdownItems = _ref.dropdownItems,
28
28
  showElementBrowserLink = _ref.showElementBrowserLink,
@@ -61,18 +61,20 @@ var InsertMenu = function InsertMenu(_ref) {
61
61
  var quickInsertDropdownItems = dropdownItems.map(transform);
62
62
  var viewMoreItem = showElementBrowserLink ? quickInsertDropdownItems.pop() : undefined;
63
63
  var onInsertItem = useCallback(function (item) {
64
+ var _pluginInjectionApi$q, _pluginInjectionApi$q2;
64
65
  toggleVisiblity();
65
66
  if (!editorView.hasFocus()) {
66
67
  editorView.focus();
67
68
  }
69
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q === void 0 || (_pluginInjectionApi$q = _pluginInjectionApi$q.actions) === null || _pluginInjectionApi$q === void 0 || (_pluginInjectionApi$q2 = _pluginInjectionApi$q.onInsert) === null || _pluginInjectionApi$q2 === void 0 || _pluginInjectionApi$q2.call(_pluginInjectionApi$q, item);
68
70
  if (isFullPageAppearance && editorExperiment('insert-menu-in-right-rail', true)) {
69
- var _pluginInjectionApi$q;
70
- pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q === void 0 || _pluginInjectionApi$q.actions.insertItem(item,
71
+ var _pluginInjectionApi$q3;
72
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q3 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q3 === void 0 || _pluginInjectionApi$q3.actions.insertItem(item,
71
73
  // @ts-expect-error
72
74
  INPUT_METHOD.INSERT_MENU_RIGHT_RAIL)(editorView.state, editorView.dispatch);
73
75
  } else {
74
- var _pluginInjectionApi$q2;
75
- pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q2 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q2 === void 0 || _pluginInjectionApi$q2.actions.insertItem(item, INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
76
+ var _pluginInjectionApi$q4;
77
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q4 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q4 === void 0 || _pluginInjectionApi$q4.actions.insertItem(item, INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
76
78
  }
77
79
  }, [editorView, toggleVisiblity, pluginInjectionApi, isFullPageAppearance]);
78
80
  var getItems = useCallback(function (query, category) {
@@ -84,19 +86,19 @@ var InsertMenu = function InsertMenu(_ref) {
84
86
  * @see above transform function for more details.
85
87
  */
86
88
  if (query) {
87
- var _pluginInjectionApi$q3, _pluginInjectionApi$q4;
88
- result = (_pluginInjectionApi$q3 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q4 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q4 === void 0 ? void 0 : _pluginInjectionApi$q4.actions.getSuggestions({
89
+ var _pluginInjectionApi$q5, _pluginInjectionApi$q6;
90
+ result = (_pluginInjectionApi$q5 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.actions.getSuggestions({
89
91
  query: query,
90
92
  category: category
91
- })) !== null && _pluginInjectionApi$q3 !== void 0 ? _pluginInjectionApi$q3 : [];
93
+ })) !== null && _pluginInjectionApi$q5 !== void 0 ? _pluginInjectionApi$q5 : [];
92
94
  } else {
93
- var _pluginInjectionApi$q5, _pluginInjectionApi$q6;
94
- var featuredQuickInsertSuggestions = (_pluginInjectionApi$q5 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.actions.getSuggestions({
95
+ var _pluginInjectionApi$q7, _pluginInjectionApi$q8;
96
+ var featuredQuickInsertSuggestions = (_pluginInjectionApi$q7 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q8 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : _pluginInjectionApi$q8.actions.getSuggestions({
95
97
  category: category,
96
98
  featuredItems: true,
97
99
  // @ts-ignore
98
100
  templateItems: isFullPageAppearance && editorExperiment('element-level-templates', true)
99
- })) !== null && _pluginInjectionApi$q5 !== void 0 ? _pluginInjectionApi$q5 : [];
101
+ })) !== null && _pluginInjectionApi$q7 !== void 0 ? _pluginInjectionApi$q7 : [];
100
102
  if (isFullPageAppearance && editorExperiment('element-level-templates', true)) {
101
103
  // Make sure template options appear as top 5 items
102
104
  featuredQuickInsertSuggestions.sort(function (a, b) {
@@ -111,8 +113,8 @@ var InsertMenu = function InsertMenu(_ref) {
111
113
  }
112
114
  setItemCount(result.length);
113
115
  return result;
114
- }, [pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q7 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q7 === void 0 ? void 0 : _pluginInjectionApi$q7.actions, quickInsertDropdownItems, isFullPageAppearance]);
115
- var emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q8 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q8 === void 0 || (_pluginInjectionApi$q8 = _pluginInjectionApi$q8.sharedState.currentState()) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : _pluginInjectionApi$q8.emptyStateHandler;
116
+ }, [pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q9 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q9 === void 0 ? void 0 : _pluginInjectionApi$q9.actions, quickInsertDropdownItems, isFullPageAppearance]);
117
+ var emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$q10 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q10 === void 0 || (_pluginInjectionApi$q10 = _pluginInjectionApi$q10.sharedState.currentState()) === null || _pluginInjectionApi$q10 === void 0 ? void 0 : _pluginInjectionApi$q10.emptyStateHandler;
116
118
 
117
119
  /**
118
120
  * For insert menu in right rail experiment
@@ -341,8 +341,9 @@ export var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
341
341
  var _pluginInjectionApi$l;
342
342
  var _this$props4 = _this.props,
343
343
  editorView = _this$props4.editorView,
344
- pluginInjectionApi = _this$props4.pluginInjectionApi;
345
- pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.layout) === null || _pluginInjectionApi$l === void 0 || _pluginInjectionApi$l.actions.insertLayoutColumns(inputMethod)(editorView.state, editorView.dispatch);
344
+ pluginInjectionApi = _this$props4.pluginInjectionApi,
345
+ intl = _this$props4.intl;
346
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.layout) === null || _pluginInjectionApi$l === void 0 || _pluginInjectionApi$l.actions.insertLayoutColumns(inputMethod, intl.formatMessage)(editorView.state, editorView.dispatch);
346
347
  return true;
347
348
  });
348
349
  _defineProperty(_assertThisInitialized(_this), "createStatus", function (inputMethod) {
@@ -777,7 +778,7 @@ export var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
777
778
  editorView: this.props.editorView,
778
779
  spacing: this.props.isReducedSpacing ? 'none' : 'default',
779
780
  label: this.props.intl.formatMessage(messages.insertMenu),
780
- open: this.state.isPlusMenuOpen && editorExperiment('insert-menu-in-right-rail', false),
781
+ open: editorExperiment('insert-menu-in-right-rail', true) ? !isFullPageAppearance && this.state.isPlusMenuOpen : this.state.isPlusMenuOpen,
781
782
  plusButtonRef: this.plusButtonRef,
782
783
  items: this.state.dropdownItems,
783
784
  onRef: this.handleDropDownButtonRef,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-insert-block",
3
- "version": "2.3.6",
3
+ "version": "2.4.1",
4
4
  "description": "Insert block plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -10,7 +10,7 @@
10
10
  "atlassian": {
11
11
  "team": "Editor: Lego",
12
12
  "singleton": true,
13
- "runReact18": false
13
+ "runReact18": true
14
14
  },
15
15
  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
16
16
  "main": "dist/cjs/index.js",
@@ -31,8 +31,8 @@
31
31
  ".": "./src/index.ts"
32
32
  },
33
33
  "dependencies": {
34
- "@atlaskit/button": "^20.2.0",
35
- "@atlaskit/editor-common": "^94.0.0",
34
+ "@atlaskit/button": "^20.3.0",
35
+ "@atlaskit/editor-common": "^94.2.0",
36
36
  "@atlaskit/editor-plugin-analytics": "^1.10.0",
37
37
  "@atlaskit/editor-plugin-block-type": "^3.16.0",
38
38
  "@atlaskit/editor-plugin-code-block": "^3.5.0",
@@ -50,7 +50,7 @@
50
50
  "@atlaskit/editor-plugin-panel": "^2.6.0",
51
51
  "@atlaskit/editor-plugin-placeholder-text": "^1.8.0",
52
52
  "@atlaskit/editor-plugin-primary-toolbar": "^2.0.0",
53
- "@atlaskit/editor-plugin-quick-insert": "^1.4.0",
53
+ "@atlaskit/editor-plugin-quick-insert": "^1.5.0",
54
54
  "@atlaskit/editor-plugin-rule": "^1.9.0",
55
55
  "@atlaskit/editor-plugin-status": "^2.5.0",
56
56
  "@atlaskit/editor-plugin-table": "^7.29.0",
@@ -60,12 +60,12 @@
60
60
  "@atlaskit/editor-shared-styles": "^3.0.0",
61
61
  "@atlaskit/emoji": "^67.8.0",
62
62
  "@atlaskit/heading": "2.4.6",
63
- "@atlaskit/icon": "^22.23.0",
63
+ "@atlaskit/icon": "^22.24.0",
64
64
  "@atlaskit/icon-lab": "^1.0.0",
65
65
  "@atlaskit/platform-feature-flags": "^0.3.0",
66
66
  "@atlaskit/primitives": "^12.2.0",
67
67
  "@atlaskit/theme": "^14.0.0",
68
- "@atlaskit/tmp-editor-statsig": "^2.7.0",
68
+ "@atlaskit/tmp-editor-statsig": "^2.8.0",
69
69
  "@atlaskit/tokens": "^2.0.0",
70
70
  "@atlaskit/tooltip": "18.8.5",
71
71
  "@babel/runtime": "^7.0.0",
@@ -85,7 +85,6 @@
85
85
  "@atlaskit/ssr": "*",
86
86
  "@atlaskit/visual-regression": "*",
87
87
  "@testing-library/react": "^12.1.5",
88
- "react-dom": "^16.8.0",
89
88
  "typescript": "~5.4.2"
90
89
  },
91
90
  "techstack": {