@atlaskit/editor-core 197.2.4 → 197.2.6

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 (14) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/cjs/ui/Appearance/FullPage/FullPage.js +3 -10
  3. package/dist/cjs/ui/Toolbar/ToolbarInner.js +7 -0
  4. package/dist/cjs/ui/Toolbar/hooks.js +2 -1
  5. package/dist/cjs/version-wrapper.js +1 -1
  6. package/dist/es2019/ui/Appearance/FullPage/FullPage.js +3 -10
  7. package/dist/es2019/ui/Toolbar/ToolbarInner.js +7 -0
  8. package/dist/es2019/ui/Toolbar/hooks.js +2 -1
  9. package/dist/es2019/version-wrapper.js +1 -1
  10. package/dist/esm/ui/Appearance/FullPage/FullPage.js +3 -10
  11. package/dist/esm/ui/Toolbar/ToolbarInner.js +7 -0
  12. package/dist/esm/ui/Toolbar/hooks.js +2 -1
  13. package/dist/esm/version-wrapper.js +1 -1
  14. package/package.json +10 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,28 @@
1
1
  # @atlaskit/editor-core
2
2
 
3
+ ## 197.2.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [#137244](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/137244)
8
+ [`e6f32d1f22896`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e6f32d1f22896) -
9
+ Control show or hide editor toolbar in SSR environment
10
+ - [#136871](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/136871)
11
+ [`87a30d5cb3ffb`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/87a30d5cb3ffb) -
12
+ ED-24814 - Addressing a bug where changing the language on a wrapped code block caused the wrapped
13
+ decorator to disappear. Required changing the sequence in which we update the keys on the wrapped
14
+ states WeakMap. Due to the amount of changes, it has all be placed behind a bug fix feature gate
15
+ (editor_code_block_wrapping_language_change_bug) and the original feature gate
16
+ (editor_support_code_block_wrapping).
17
+
18
+ ## 197.2.5
19
+
20
+ ### Patch Changes
21
+
22
+ - [#136744](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/136744)
23
+ [`58f46f65a5d7c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/58f46f65a5d7c) -
24
+ Improve performance by removing unnecessary toolbar reflow.
25
+
3
26
  ## 197.2.4
4
27
 
5
28
  ### Patch Changes
package/dist/cjs/ui/Appearance/FullPage/FullPage.js CHANGED
@@ -55,7 +55,7 @@ var useShowKeyline = function useShowKeyline(contentAreaRef) {
55
55
  return showKeyline;
56
56
  };
57
57
  var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
58
- var _editorAPI$primaryToo, _scrollContentContain, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
58
+ var _scrollContentContain, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
59
59
  var wrapperElementRef = (0, _react.useMemo)(function () {
60
60
  return props.innerRef;
61
61
  }, [props.innerRef]);
@@ -66,15 +66,8 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
66
66
  editorViewModeState = _useSharedPluginState.editorViewModeState,
67
67
  primaryToolbarState = _useSharedPluginState.primaryToolbarState;
68
68
  var primaryToolbarComponents = props.primaryToolbarComponents;
69
- var toolbarComponentsSSR = (0, _platformFeatureFlags.fg)('platform_editor_toolbar_ssr') ? editorAPI === null || editorAPI === void 0 || (_editorAPI$primaryToo = editorAPI.primaryToolbar) === null || _editorAPI$primaryToo === void 0 || (_editorAPI$primaryToo = _editorAPI$primaryToo.sharedState.currentState()) === null || _editorAPI$primaryToo === void 0 ? void 0 : _editorAPI$primaryToo.components : [];
70
- if (Array.isArray(primaryToolbarComponents)) {
71
- var _primaryToolbarState$;
72
- var additionalComponents = (_primaryToolbarState$ = primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) !== null && _primaryToolbarState$ !== void 0 ? _primaryToolbarState$ : [];
73
- // The primary toolbar state may be undefined if we are in SSR environment - in which case fallback to the current state (useLayoutEffect doesn't work in SSR)
74
- if (additionalComponents.length === 0) {
75
- additionalComponents = toolbarComponentsSSR !== null && toolbarComponentsSSR !== void 0 ? toolbarComponentsSSR : [];
76
- }
77
- primaryToolbarComponents = additionalComponents.concat(primaryToolbarComponents);
69
+ if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
70
+ primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
78
71
  }
79
72
  var isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
80
73
  var popupsBoundariesElement = props.popupsBoundariesElement || (scrollContentContainerRef === null || scrollContentContainerRef === void 0 || (_scrollContentContain = scrollContentContainerRef.current) === null || _scrollContentContain === void 0 ? void 0 : _scrollContentContain.containerArea) || undefined;
package/dist/cjs/ui/Toolbar/ToolbarInner.js CHANGED
@@ -14,7 +14,9 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
14
14
  var _react = _interopRequireDefault(require("react"));
15
15
  var _react2 = require("@emotion/react");
16
16
  var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
17
+ var _coreUtils = require("@atlaskit/editor-common/core-utils");
17
18
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
19
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
18
20
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
19
21
  function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
20
22
  * @jsxRuntime classic
@@ -58,6 +60,11 @@ var ToolbarInner = exports.ToolbarInner = /*#__PURE__*/function (_React$Componen
58
60
  if (!items || !items.length) {
59
61
  return null;
60
62
  }
63
+ if ((0, _coreUtils.isSSR)() && (0, _platformFeatureFlags.fg)('platform_hide_editor_toolbar_ssr')) {
64
+ // Toolbar in SSR environment is showing collapsed state, which caused layout shift after hydrating to SPA.
65
+ // Hiding toolbar in SSR until the dependency of screen width is resolved in SSR environment.
66
+ return null;
67
+ }
61
68
  return (0, _react2.jsx)("div", {
62
69
  css: toolbarComponentsWrapper
63
70
  }, items.map(function (component, key) {
package/dist/cjs/ui/Toolbar/hooks.js CHANGED
@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.useElementWidth = void 0;
8
8
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
9
9
  var _react = _interopRequireDefault(require("react"));
10
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
10
11
  var useElementWidth = exports.useElementWidth = function useElementWidth(ref, _ref) {
11
12
  var skip = _ref.skip;
12
13
  var _React$useState = _react.default.useState(undefined),
@@ -14,7 +15,7 @@ var useElementWidth = exports.useElementWidth = function useElementWidth(ref, _r
14
15
  elementWidth = _React$useState2[0],
15
16
  setWidth = _React$useState2[1];
16
17
  _react.default.useEffect(function () {
17
- if (!skip && ref.current) {
18
+ if (!skip && ref.current && !(0, _platformFeatureFlags.fg)('platform_editor_prevent_toolbar_width_reflow')) {
18
19
  setWidth(Math.round(ref.current.getBoundingClientRect().width));
19
20
  }
20
21
  }, [skip, setWidth, ref]);
package/dist/cjs/version-wrapper.js CHANGED
@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.version = exports.name = void 0;
7
7
  var name = exports.name = "@atlaskit/editor-core";
8
- var version = exports.version = "197.2.4";
8
+ var version = exports.version = "197.2.6";
package/dist/es2019/ui/Appearance/FullPage/FullPage.js CHANGED
@@ -38,7 +38,7 @@ const useShowKeyline = contentAreaRef => {
38
38
  return showKeyline;
39
39
  };
40
40
  export const FullPageEditor = props => {
41
- var _editorAPI$primaryToo, _editorAPI$primaryToo2, _scrollContentContain, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
41
+ var _scrollContentContain, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
42
42
  const wrapperElementRef = useMemo(() => props.innerRef, [props.innerRef]);
43
43
  const scrollContentContainerRef = useRef(null);
44
44
  const showKeyline = useShowKeyline(scrollContentContainerRef);
@@ -48,15 +48,8 @@ export const FullPageEditor = props => {
48
48
  primaryToolbarState
49
49
  } = useSharedPluginState(editorAPI, ['editorViewMode', 'primaryToolbar']);
50
50
  let primaryToolbarComponents = props.primaryToolbarComponents;
51
- const toolbarComponentsSSR = fg('platform_editor_toolbar_ssr') ? editorAPI === null || editorAPI === void 0 ? void 0 : (_editorAPI$primaryToo = editorAPI.primaryToolbar) === null || _editorAPI$primaryToo === void 0 ? void 0 : (_editorAPI$primaryToo2 = _editorAPI$primaryToo.sharedState.currentState()) === null || _editorAPI$primaryToo2 === void 0 ? void 0 : _editorAPI$primaryToo2.components : [];
52
- if (Array.isArray(primaryToolbarComponents)) {
53
- var _primaryToolbarState$;
54
- let additionalComponents = (_primaryToolbarState$ = primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) !== null && _primaryToolbarState$ !== void 0 ? _primaryToolbarState$ : [];
55
- // The primary toolbar state may be undefined if we are in SSR environment - in which case fallback to the current state (useLayoutEffect doesn't work in SSR)
56
- if (additionalComponents.length === 0) {
57
- additionalComponents = toolbarComponentsSSR !== null && toolbarComponentsSSR !== void 0 ? toolbarComponentsSSR : [];
58
- }
59
- primaryToolbarComponents = additionalComponents.concat(primaryToolbarComponents);
51
+ if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
52
+ primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
60
53
  }
61
54
  const isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
62
55
  const popupsBoundariesElement = props.popupsBoundariesElement || (scrollContentContainerRef === null || scrollContentContainerRef === void 0 ? void 0 : (_scrollContentContain = scrollContentContainerRef.current) === null || _scrollContentContain === void 0 ? void 0 : _scrollContentContain.containerArea) || undefined;
package/dist/es2019/ui/Toolbar/ToolbarInner.js CHANGED
@@ -7,7 +7,9 @@ import React from 'react';
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
8
8
  import { css, jsx } from '@emotion/react';
9
9
  import isEqual from 'lodash/isEqual';
10
+ import { isSSR } from '@atlaskit/editor-common/core-utils';
10
11
  import { akEditorMobileMaxWidth } from '@atlaskit/editor-shared-styles';
12
+ import { fg } from '@atlaskit/platform-feature-flags';
11
13
  const toolbarComponentsWrapper = css({
12
14
  display: 'flex',
13
15
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -39,6 +41,11 @@ export class ToolbarInner extends React.Component {
39
41
  if (!items || !items.length) {
40
42
  return null;
41
43
  }
44
+ if (isSSR() && fg('platform_hide_editor_toolbar_ssr')) {
45
+ // Toolbar in SSR environment is showing collapsed state, which caused layout shift after hydrating to SPA.
46
+ // Hiding toolbar in SSR until the dependency of screen width is resolved in SSR environment.
47
+ return null;
48
+ }
42
49
  return jsx("div", {
43
50
  css: toolbarComponentsWrapper
44
51
  }, items.map((component, key) => {
package/dist/es2019/ui/Toolbar/hooks.js CHANGED
@@ -1,10 +1,11 @@
1
1
  import React from 'react';
2
+ import { fg } from '@atlaskit/platform-feature-flags';
2
3
  export const useElementWidth = (ref, {
3
4
  skip
4
5
  }) => {
5
6
  const [elementWidth, setWidth] = React.useState(undefined);
6
7
  React.useEffect(() => {
7
- if (!skip && ref.current) {
8
+ if (!skip && ref.current && !fg('platform_editor_prevent_toolbar_width_reflow')) {
8
9
  setWidth(Math.round(ref.current.getBoundingClientRect().width));
9
10
  }
10
11
  }, [skip, setWidth, ref]);
package/dist/es2019/version-wrapper.js CHANGED
@@ -1,2 +1,2 @@
1
1
  export const name = "@atlaskit/editor-core";
2
- export const version = "197.2.4";
2
+ export const version = "197.2.6";
package/dist/esm/ui/Appearance/FullPage/FullPage.js CHANGED
@@ -44,7 +44,7 @@ var useShowKeyline = function useShowKeyline(contentAreaRef) {
44
44
  return showKeyline;
45
45
  };
46
46
  export var FullPageEditor = function FullPageEditor(props) {
47
- var _editorAPI$primaryToo, _scrollContentContain, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
47
+ var _scrollContentContain, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
48
48
  var wrapperElementRef = useMemo(function () {
49
49
  return props.innerRef;
50
50
  }, [props.innerRef]);
@@ -55,15 +55,8 @@ export var FullPageEditor = function FullPageEditor(props) {
55
55
  editorViewModeState = _useSharedPluginState.editorViewModeState,
56
56
  primaryToolbarState = _useSharedPluginState.primaryToolbarState;
57
57
  var primaryToolbarComponents = props.primaryToolbarComponents;
58
- var toolbarComponentsSSR = fg('platform_editor_toolbar_ssr') ? editorAPI === null || editorAPI === void 0 || (_editorAPI$primaryToo = editorAPI.primaryToolbar) === null || _editorAPI$primaryToo === void 0 || (_editorAPI$primaryToo = _editorAPI$primaryToo.sharedState.currentState()) === null || _editorAPI$primaryToo === void 0 ? void 0 : _editorAPI$primaryToo.components : [];
59
- if (Array.isArray(primaryToolbarComponents)) {
60
- var _primaryToolbarState$;
61
- var additionalComponents = (_primaryToolbarState$ = primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) !== null && _primaryToolbarState$ !== void 0 ? _primaryToolbarState$ : [];
62
- // The primary toolbar state may be undefined if we are in SSR environment - in which case fallback to the current state (useLayoutEffect doesn't work in SSR)
63
- if (additionalComponents.length === 0) {
64
- additionalComponents = toolbarComponentsSSR !== null && toolbarComponentsSSR !== void 0 ? toolbarComponentsSSR : [];
65
- }
66
- primaryToolbarComponents = additionalComponents.concat(primaryToolbarComponents);
58
+ if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
59
+ primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
67
60
  }
68
61
  var isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
69
62
  var popupsBoundariesElement = props.popupsBoundariesElement || (scrollContentContainerRef === null || scrollContentContainerRef === void 0 || (_scrollContentContain = scrollContentContainerRef.current) === null || _scrollContentContain === void 0 ? void 0 : _scrollContentContain.containerArea) || undefined;
package/dist/esm/ui/Toolbar/ToolbarInner.js CHANGED
@@ -15,7 +15,9 @@ import React from 'react';
15
15
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
16
16
  import { css, jsx } from '@emotion/react';
17
17
  import isEqual from 'lodash/isEqual';
18
+ import { isSSR } from '@atlaskit/editor-common/core-utils';
18
19
  import { akEditorMobileMaxWidth } from '@atlaskit/editor-shared-styles';
20
+ import { fg } from '@atlaskit/platform-feature-flags';
19
21
  var toolbarComponentsWrapper = css(_defineProperty({
20
22
  display: 'flex'
21
23
  }, "@media (max-width: ".concat(akEditorMobileMaxWidth, "px)"), {
@@ -54,6 +56,11 @@ export var ToolbarInner = /*#__PURE__*/function (_React$Component) {
54
56
  if (!items || !items.length) {
55
57
  return null;
56
58
  }
59
+ if (isSSR() && fg('platform_hide_editor_toolbar_ssr')) {
60
+ // Toolbar in SSR environment is showing collapsed state, which caused layout shift after hydrating to SPA.
61
+ // Hiding toolbar in SSR until the dependency of screen width is resolved in SSR environment.
62
+ return null;
63
+ }
57
64
  return jsx("div", {
58
65
  css: toolbarComponentsWrapper
59
66
  }, items.map(function (component, key) {
package/dist/esm/ui/Toolbar/hooks.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  import React from 'react';
3
+ import { fg } from '@atlaskit/platform-feature-flags';
3
4
  export var useElementWidth = function useElementWidth(ref, _ref) {
4
5
  var skip = _ref.skip;
5
6
  var _React$useState = React.useState(undefined),
@@ -7,7 +8,7 @@ export var useElementWidth = function useElementWidth(ref, _ref) {
7
8
  elementWidth = _React$useState2[0],
8
9
  setWidth = _React$useState2[1];
9
10
  React.useEffect(function () {
10
- if (!skip && ref.current) {
11
+ if (!skip && ref.current && !fg('platform_editor_prevent_toolbar_width_reflow')) {
11
12
  setWidth(Math.round(ref.current.getBoundingClientRect().width));
12
13
  }
13
14
  }, [skip, setWidth, ref]);
package/dist/esm/version-wrapper.js CHANGED
@@ -1,2 +1,2 @@
1
1
  export var name = "@atlaskit/editor-core";
2
- export var version = "197.2.4";
2
+ export var version = "197.2.6";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-core",
3
- "version": "197.2.4",
3
+ "version": "197.2.6",
4
4
  "description": "A package contains Atlassian editor core functionality",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -100,7 +100,7 @@
100
100
  "@atlaskit/modal-dialog": "^12.15.0",
101
101
  "@atlaskit/primitives": "^12.1.0",
102
102
  "@atlaskit/renderer": "^109.51.0",
103
- "@atlaskit/smart-card": "^27.19.0",
103
+ "@atlaskit/smart-card": "^27.20.0",
104
104
  "@atlaskit/synchrony-test-helpers": "^2.5.0",
105
105
  "@atlaskit/toggle": "^13.3.0",
106
106
  "@atlaskit/util-data-test": "^17.9.0",
@@ -198,6 +198,9 @@
198
198
  "type": "boolean",
199
199
  "referenceOnly": "true"
200
200
  },
201
+ "platform_editor_prevent_toolbar_width_reflow": {
202
+ "type": "boolean"
203
+ },
201
204
  "platform.editor.single-player-expand": {
202
205
  "type": "boolean",
203
206
  "referenceOnly": "true"
@@ -249,10 +252,14 @@
249
252
  "type": "boolean",
250
253
  "referenceOnly": true
251
254
  },
255
+ "editor_code_block_wrapping_language_change_bug": {
256
+ "type": "boolean",
257
+ "referenceOnly": true
258
+ },
252
259
  "platform_editor_drag_and_drop_expand_style_fix": {
253
260
  "type": "boolean"
254
261
  },
255
- "platform_editor_toolbar_ssr": {
262
+ "platform_hide_editor_toolbar_ssr": {
256
263
  "type": "boolean"
257
264
  },
258
265
  "platform_editor_remove_hide_avatar_group_prop": {