@atlaskit/editor-plugin-insert-block 30.0.2 → 30.0.3

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 (5) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/cjs/ui/registered-insert-menu/RegisteredInsertButton.js +13 -5
  3. package/dist/es2019/ui/registered-insert-menu/RegisteredInsertButton.js +13 -5
  4. package/dist/esm/ui/registered-insert-menu/RegisteredInsertButton.js +13 -5
  5. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @atlaskit/editor-plugin-insert-block
2
2
 
3
+ ## 30.0.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [`d2ab481bc48f5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d2ab481bc48f5) -
8
+ Render the registered Insert toolbar button before EditorView is attached under
9
+ platform_editor_ssr_toolbar_optimistic, preventing late insertion when
10
+ platform_editor_slash_command is enabled.
11
+ - Updated dependencies
12
+
3
13
  ## 30.0.2
4
14
 
5
15
  ### Patch Changes
package/dist/cjs/ui/registered-insert-menu/RegisteredInsertButton.js CHANGED
@@ -22,6 +22,7 @@ var _addIcon = require("@atlaskit/editor-toolbar/add-icon");
22
22
  var _toolbarButton = require("@atlaskit/editor-toolbar/toolbar-button");
23
23
  var _toolbarTooltip = require("@atlaskit/editor-toolbar/toolbar-tooltip");
24
24
  var _uiContext = require("@atlaskit/editor-toolbar/ui-context");
25
+ var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
25
26
  var _RegisteredInsertMenuContent = require("./RegisteredInsertMenuContent");
26
27
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
27
28
  var DEFAULT_MENU_MAX_HEIGHT = 520;
@@ -34,6 +35,7 @@ var RegisteredInsertButton = exports.RegisteredInsertButton = function Registere
34
35
  var api = _ref.api;
35
36
  var _useEditorToolbar = (0, _context.useEditorToolbar)(),
36
37
  editorView = _useEditorToolbar.editorView;
38
+ var isOptimistic = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_ssr_toolbar_optimistic');
37
39
  var _useIntl = (0, _reactIntl.useIntl)(),
38
40
  formatMessage = _useIntl.formatMessage;
39
41
  var _useToolbarUI = (0, _uiContext.useToolbarUI)(),
@@ -74,8 +76,12 @@ var RegisteredInsertButton = exports.RegisteredInsertButton = function Registere
74
76
  }
75
77
  }, []);
76
78
  var open = (0, _react.useCallback)(function () {
79
+ // Early clicks must not queue a popup to open when the editor becomes ready.
80
+ if (!editorView) {
81
+ return;
82
+ }
77
83
  setIsOpen(true);
78
- }, []);
84
+ }, [editorView]);
79
85
  var onPopupUnmount = (0, _react.useCallback)(function () {
80
86
  // Outside dismissal must not move focus away from the element that was clicked.
81
87
  setIsOpen(false);
@@ -86,7 +92,7 @@ var RegisteredInsertButton = exports.RegisteredInsertButton = function Registere
86
92
  var closeForSelection = (0, _react.useCallback)(function () {
87
93
  return close(false);
88
94
  }, [close]);
89
- if (!(api !== null && api !== void 0 && api.insertBlock) || !editorView) {
95
+ if (!(api !== null && api !== void 0 && api.insertBlock) || !editorView && !isOptimistic) {
90
96
  return null;
91
97
  }
92
98
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_toolbarTooltip.ToolbarTooltip, {
@@ -99,15 +105,17 @@ var RegisteredInsertButton = exports.RegisteredInsertButton = function Registere
99
105
  iconBefore: /*#__PURE__*/_react.default.createElement(_addIcon.AddIcon, {
100
106
  size: "small",
101
107
  label: formatMessage(_insertBlock.toolbarInsertBlockMessages.insertMenu)
102
- }),
103
- isDisabled: !isAllowed || isDisabled,
108
+ })
109
+ // Keep the optimistic SSR button visible before the live view is attached.
110
+ ,
111
+ isDisabled: isDisabled || (!isOptimistic || !!editorView) && !isAllowed,
104
112
  isSelected: isOpen,
105
113
  onClick: isOpen ? function () {
106
114
  return close(true);
107
115
  } : open,
108
116
  ref: buttonRef,
109
117
  testId: _keys.TOOLBAR_BUTTON_TEST_ID.INSERT
110
- })), isOpen && buttonRef.current && /*#__PURE__*/_react.default.createElement(_Popup.default, {
118
+ })), isOpen && buttonRef.current && editorView && /*#__PURE__*/_react.default.createElement(_Popup.default, {
111
119
  alignX: "right",
112
120
  boundariesElement: popupsBoundariesElement,
113
121
  fitHeight: menuHeight,
package/dist/es2019/ui/registered-insert-menu/RegisteredInsertButton.js CHANGED
@@ -13,6 +13,7 @@ import { AddIcon } from '@atlaskit/editor-toolbar/add-icon';
13
13
  import { ToolbarButton } from '@atlaskit/editor-toolbar/toolbar-button';
14
14
  import { ToolbarTooltip } from '@atlaskit/editor-toolbar/toolbar-tooltip';
15
15
  import { useToolbarUI } from '@atlaskit/editor-toolbar/ui-context';
16
+ import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
16
17
  import { RegisteredInsertMenuContent } from './RegisteredInsertMenuContent';
17
18
  const DEFAULT_MENU_MAX_HEIGHT = 520;
18
19
  const POPUP_OFFSET = [0, 3];
@@ -26,6 +27,7 @@ export const RegisteredInsertButton = ({
26
27
  const {
27
28
  editorView
28
29
  } = useEditorToolbar();
30
+ const isOptimistic = isExperimentEnabled('platform_editor_ssr_toolbar_optimistic');
29
31
  const {
30
32
  formatMessage
31
33
  } = useIntl();
@@ -65,15 +67,19 @@ export const RegisteredInsertButton = ({
65
67
  }
66
68
  }, []);
67
69
  const open = useCallback(() => {
70
+ // Early clicks must not queue a popup to open when the editor becomes ready.
71
+ if (!editorView) {
72
+ return;
73
+ }
68
74
  setIsOpen(true);
69
- }, []);
75
+ }, [editorView]);
70
76
  const onPopupUnmount = useCallback(() => {
71
77
  // Outside dismissal must not move focus away from the element that was clicked.
72
78
  setIsOpen(false);
73
79
  }, []);
74
80
  const closeAndRestoreFocus = useCallback(() => close(true), [close]);
75
81
  const closeForSelection = useCallback(() => close(false), [close]);
76
- if (!(api !== null && api !== void 0 && api.insertBlock) || !editorView) {
82
+ if (!(api !== null && api !== void 0 && api.insertBlock) || !editorView && !isOptimistic) {
77
83
  return null;
78
84
  }
79
85
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ToolbarTooltip, {
@@ -86,13 +92,15 @@ export const RegisteredInsertButton = ({
86
92
  iconBefore: /*#__PURE__*/React.createElement(AddIcon, {
87
93
  size: "small",
88
94
  label: formatMessage(messages.insertMenu)
89
- }),
90
- isDisabled: !isAllowed || isDisabled,
95
+ })
96
+ // Keep the optimistic SSR button visible before the live view is attached.
97
+ ,
98
+ isDisabled: isDisabled || (!isOptimistic || !!editorView) && !isAllowed,
91
99
  isSelected: isOpen,
92
100
  onClick: isOpen ? () => close(true) : open,
93
101
  ref: buttonRef,
94
102
  testId: TOOLBAR_BUTTON_TEST_ID.INSERT
95
- })), isOpen && buttonRef.current && /*#__PURE__*/React.createElement(Popup, {
103
+ })), isOpen && buttonRef.current && editorView && /*#__PURE__*/React.createElement(Popup, {
96
104
  alignX: "right",
97
105
  boundariesElement: popupsBoundariesElement,
98
106
  fitHeight: menuHeight,
package/dist/esm/ui/registered-insert-menu/RegisteredInsertButton.js CHANGED
@@ -14,6 +14,7 @@ import { AddIcon } from '@atlaskit/editor-toolbar/add-icon';
14
14
  import { ToolbarButton } from '@atlaskit/editor-toolbar/toolbar-button';
15
15
  import { ToolbarTooltip } from '@atlaskit/editor-toolbar/toolbar-tooltip';
16
16
  import { useToolbarUI } from '@atlaskit/editor-toolbar/ui-context';
17
+ import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
17
18
  import { RegisteredInsertMenuContent } from './RegisteredInsertMenuContent';
18
19
  var DEFAULT_MENU_MAX_HEIGHT = 520;
19
20
  var POPUP_OFFSET = [0, 3];
@@ -25,6 +26,7 @@ export var RegisteredInsertButton = function RegisteredInsertButton(_ref) {
25
26
  var api = _ref.api;
26
27
  var _useEditorToolbar = useEditorToolbar(),
27
28
  editorView = _useEditorToolbar.editorView;
29
+ var isOptimistic = isExperimentEnabled('platform_editor_ssr_toolbar_optimistic');
28
30
  var _useIntl = useIntl(),
29
31
  formatMessage = _useIntl.formatMessage;
30
32
  var _useToolbarUI = useToolbarUI(),
@@ -65,8 +67,12 @@ export var RegisteredInsertButton = function RegisteredInsertButton(_ref) {
65
67
  }
66
68
  }, []);
67
69
  var open = useCallback(function () {
70
+ // Early clicks must not queue a popup to open when the editor becomes ready.
71
+ if (!editorView) {
72
+ return;
73
+ }
68
74
  setIsOpen(true);
69
- }, []);
75
+ }, [editorView]);
70
76
  var onPopupUnmount = useCallback(function () {
71
77
  // Outside dismissal must not move focus away from the element that was clicked.
72
78
  setIsOpen(false);
@@ -77,7 +83,7 @@ export var RegisteredInsertButton = function RegisteredInsertButton(_ref) {
77
83
  var closeForSelection = useCallback(function () {
78
84
  return close(false);
79
85
  }, [close]);
80
- if (!(api !== null && api !== void 0 && api.insertBlock) || !editorView) {
86
+ if (!(api !== null && api !== void 0 && api.insertBlock) || !editorView && !isOptimistic) {
81
87
  return null;
82
88
  }
83
89
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ToolbarTooltip, {
@@ -90,15 +96,17 @@ export var RegisteredInsertButton = function RegisteredInsertButton(_ref) {
90
96
  iconBefore: /*#__PURE__*/React.createElement(AddIcon, {
91
97
  size: "small",
92
98
  label: formatMessage(messages.insertMenu)
93
- }),
94
- isDisabled: !isAllowed || isDisabled,
99
+ })
100
+ // Keep the optimistic SSR button visible before the live view is attached.
101
+ ,
102
+ isDisabled: isDisabled || (!isOptimistic || !!editorView) && !isAllowed,
95
103
  isSelected: isOpen,
96
104
  onClick: isOpen ? function () {
97
105
  return close(true);
98
106
  } : open,
99
107
  ref: buttonRef,
100
108
  testId: TOOLBAR_BUTTON_TEST_ID.INSERT
101
- })), isOpen && buttonRef.current && /*#__PURE__*/React.createElement(Popup, {
109
+ })), isOpen && buttonRef.current && editorView && /*#__PURE__*/React.createElement(Popup, {
102
110
  alignX: "right",
103
111
  boundariesElement: popupsBoundariesElement,
104
112
  fitHeight: menuHeight,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-insert-block",
3
- "version": "30.0.2",
3
+ "version": "30.0.3",
4
4
  "description": "Insert block plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -51,7 +51,7 @@
51
51
  "@atlaskit/editor-plugin-type-ahead": "^30.0.0",
52
52
  "@atlaskit/editor-plugin-ui-control-registry": "^23.0.0",
53
53
  "@atlaskit/editor-prosemirror": "^9.0.0",
54
- "@atlaskit/editor-shared-styles": "^4.5.0",
54
+ "@atlaskit/editor-shared-styles": "^4.6.0",
55
55
  "@atlaskit/editor-toolbar": "^2.8.0",
56
56
  "@atlaskit/editor-toolbar-model": "^1.2.0",
57
57
  "@atlaskit/editor-ui-control-model": "^2.10.0",
@@ -72,7 +72,7 @@
72
72
  "react-virtualized": "^9.22.6"
73
73
  },
74
74
  "peerDependencies": {
75
- "@atlaskit/editor-common": "^133.1.0",
75
+ "@atlaskit/editor-common": "^133.4.0",
76
76
  "react": "^18.2.0 || ^19.2.0",
77
77
  "react-dom": "^18.2.0 || ^19.2.0",
78
78
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"