@atlaskit/editor-core 221.2.1 → 221.3.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.
Files changed (29) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/afm-cc/tsconfig.json +3 -0
  3. package/afm-products/tsconfig.json +3 -0
  4. package/dist/cjs/create-editor/ReactEditorView.js +66 -9
  5. package/dist/cjs/ui/Appearance/FullPage/FullPage.js +1 -1
  6. package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js +50 -3
  7. package/dist/cjs/ui/Appearance/FullPage/FullPageToolbarNext.js +21 -2
  8. package/dist/cjs/ui/EditorContentContainer/EditorContentContainer-compiled.js +2 -2
  9. package/dist/cjs/ui/EditorContentContainer/EditorContentContainer-emotion.js +2 -2
  10. package/dist/cjs/ui/EditorContentContainer/styles/expandStyles.js +2 -2
  11. package/dist/cjs/version-wrapper.js +1 -1
  12. package/dist/es2019/create-editor/ReactEditorView.js +60 -9
  13. package/dist/es2019/ui/Appearance/FullPage/FullPage.js +1 -1
  14. package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js +50 -3
  15. package/dist/es2019/ui/Appearance/FullPage/FullPageToolbarNext.js +21 -2
  16. package/dist/es2019/ui/EditorContentContainer/EditorContentContainer-compiled.js +2 -2
  17. package/dist/es2019/ui/EditorContentContainer/EditorContentContainer-emotion.js +3 -3
  18. package/dist/es2019/ui/EditorContentContainer/styles/expandStyles.js +1 -1
  19. package/dist/es2019/version-wrapper.js +1 -1
  20. package/dist/esm/create-editor/ReactEditorView.js +66 -9
  21. package/dist/esm/ui/Appearance/FullPage/FullPage.js +1 -1
  22. package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js +50 -3
  23. package/dist/esm/ui/Appearance/FullPage/FullPageToolbarNext.js +21 -2
  24. package/dist/esm/ui/EditorContentContainer/EditorContentContainer-compiled.js +2 -2
  25. package/dist/esm/ui/EditorContentContainer/EditorContentContainer-emotion.js +3 -3
  26. package/dist/esm/ui/EditorContentContainer/styles/expandStyles.js +1 -1
  27. package/dist/esm/version-wrapper.js +1 -1
  28. package/dist/types/ui/EditorContentContainer/styles/expandStyles.d.ts +1 -1
  29. package/package.json +10 -10
package/CHANGELOG.md CHANGED
@@ -1,5 +1,31 @@
1
1
  # @atlaskit/editor-core
2
2
 
3
+ ## 221.3.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`3378314fe2ec1`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3378314fe2ec1) -
8
+ Clean up experiment `platform_editor_chromeless_expand_fix`
9
+ - [`9d2c2c1c016bd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9d2c2c1c016bd) -
10
+ [ux] Server-side render the editor toolbar (FullPageToolbarNext) with toolbar items enabled (not
11
+ hidden/disabled), so the toolbar is visible and interactive-looking on first paint — before
12
+ EditorView or collab edit is initialized. Clicks before editor is ready are noops.
13
+ - Updated dependencies
14
+
15
+ ## 221.3.0
16
+
17
+ ### Minor Changes
18
+
19
+ - [`036b4169b1a86`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/036b4169b1a86) -
20
+ [ux] Make Footer sit at the bottom of the page
21
+
22
+ ### Patch Changes
23
+
24
+ - [`ee28cf33718b0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ee28cf33718b0) -
25
+ Add @atlassian/react-compiler-gating as a runtime dependency to enable React Compiler platform
26
+ gating.
27
+ - Updated dependencies
28
+
3
29
  ## 221.2.1
4
30
 
5
31
  ### Patch Changes
@@ -116,6 +116,9 @@
116
116
  {
117
117
  "path": "../../../design-system/width-detector/afm-cc/tsconfig.json"
118
118
  },
119
+ {
120
+ "path": "../../../react-compiler/react-compiler-gating/afm-cc/tsconfig.json"
121
+ },
119
122
  {
120
123
  "path": "../../editor-common/afm-cc/tsconfig.json"
121
124
  },
@@ -116,6 +116,9 @@
116
116
  {
117
117
  "path": "../../../design-system/width-detector/afm-products/tsconfig.json"
118
118
  },
119
+ {
120
+ "path": "../../../react-compiler/react-compiler-gating/afm-products/tsconfig.json"
121
+ },
119
122
  {
120
123
  "path": "../../editor-common/afm-products/tsconfig.json"
121
124
  },
@@ -32,6 +32,8 @@ var _model = require("@atlaskit/editor-prosemirror/model");
32
32
  var _state2 = require("@atlaskit/editor-prosemirror/state");
33
33
  var _view = require("@atlaskit/editor-prosemirror/view");
34
34
  var _editorSsrRenderer = require("@atlaskit/editor-ssr-renderer");
35
+ var _createSsrEditorState = require("@atlaskit/editor-ssr-renderer/create-ssr-editor-state");
36
+ var _createSsrPmPlugins = require("@atlaskit/editor-ssr-renderer/create-ssr-pm-plugins");
35
37
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
36
38
  var _interactionIdContext = require("@atlaskit/react-ufo/interaction-id-context");
37
39
  var _interactionMetrics = require("@atlaskit/react-ufo/interaction-metrics");
@@ -114,7 +116,12 @@ function ReactEditorView(props) {
114
116
  __livePage = _props$editorProps.__livePage,
115
117
  onEditorCreated = props.onEditorCreated,
116
118
  onEditorDestroyed = props.onEditorDestroyed;
117
- var ssrEditorStateRef = (0, _react.useRef)(undefined);
119
+
120
+ // Holds the best available EditorState before the ProseMirror EditorView has mounted.
121
+ // On SSR: set to the SSR-rendered state so toolbar plugins can read it via getEditorState().
122
+ // On client first render: set to initialEditorState for the same reason.
123
+ // Cleared to undefined once createEditorView runs and viewRef.current becomes available.
124
+ var preMountEditorStateRef = (0, _react.useRef)(undefined);
118
125
  var editorRef = (0, _react.useRef)(null);
119
126
  var viewRef = (0, _react.useRef)();
120
127
  var focusTimeoutId = (0, _react.useRef)();
@@ -142,8 +149,8 @@ function ReactEditorView(props) {
142
149
  return (0, _featureFlagsFromProps.createFeatureFlagsFromProps)(editorPropFeatureFlags);
143
150
  }, [editorPropFeatureFlags]);
144
151
  var getEditorState = (0, _react.useCallback)(function () {
145
- var _ssrEditorStateRef$cu, _viewRef$current;
146
- return (_ssrEditorStateRef$cu = ssrEditorStateRef.current) !== null && _ssrEditorStateRef$cu !== void 0 ? _ssrEditorStateRef$cu : (_viewRef$current = viewRef.current) === null || _viewRef$current === void 0 ? void 0 : _viewRef$current.state;
152
+ var _preMountEditorStateR, _viewRef$current;
153
+ return (_preMountEditorStateR = preMountEditorStateRef.current) !== null && _preMountEditorStateR !== void 0 ? _preMountEditorStateR : (_viewRef$current = viewRef.current) === null || _viewRef$current === void 0 ? void 0 : _viewRef$current.state;
147
154
  }, []);
148
155
  var getEditorView = (0, _react.useCallback)(function () {
149
156
  return viewRef.current;
@@ -266,12 +273,17 @@ function ReactEditorView(props) {
266
273
  // so we can save some CPU time here.
267
274
  return undefined;
268
275
  }
269
- return createEditorState({
276
+ var state = createEditorState({
270
277
  props: props,
271
278
  doc: defaultValue,
272
279
  // ED-4759: Don't set selection at end for full-page editor - should be at start.
273
280
  selectionAtStart: (0, _isFullPage.isFullPage)(nextAppearance)
274
281
  });
282
+ if ((0, _expValEquals.expValEquals)('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true)) {
283
+ // CSR only, synchronously set preMountEditorStateRef so it's ready to be consumed by children including toolbar
284
+ preMountEditorStateRef.current = state;
285
+ }
286
+ return state;
275
287
  },
276
288
  // This is only used for the initial state - afterwards we will have `viewRef` available for use
277
289
  // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -672,6 +684,10 @@ function ReactEditorView(props) {
672
684
  mount: node
673
685
  }, getDirectEditorProps());
674
686
  viewRef.current = view;
687
+ if ((0, _expValEquals.expValEquals)('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true)) {
688
+ // clears pre-mount state as soon as the final view is mounted
689
+ preMountEditorStateRef.current = undefined;
690
+ }
675
691
  (0, _measureRender.measureRender)(_measureEnum.default.PROSEMIRROR_RENDERED, function (_ref3) {
676
692
  var duration = _ref3.duration,
677
693
  startTime = _ref3.startTime,
@@ -1037,17 +1053,56 @@ function ReactEditorView(props) {
1037
1053
  return buildDoc(schema);
1038
1054
  };
1039
1055
  var doc = (0, _ssrMeasures.profileSSROperation)("".concat(SSR_TRACE_SEGMENT_NAME, "/buildDoc"), doBuildDoc, onSSRMeasure);
1056
+
1057
+ // When the platform_editor_ssr_toolbar_optimistic is on, we create SSR-safe PM plugins and EditorState
1058
+ // HERE in ssrDeps — before any children render — so that FullPageToolbarNext can read correct
1059
+ // plugin state via useSharedPluginStateWithSelector → currentState() → getEditorState().
1060
+ //
1061
+ // We also pass these pre-built pmPlugins and editorState to EditorSSRRenderer so it can
1062
+ // skip redundant creation (avoids double createPluginsList + EditorState.create).
1063
+ if ((0, _expValEquals.expValEquals)('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true)) {
1064
+ var ssrPMPlugins = (0, _ssrMeasures.profileSSROperation)("".concat(SSR_TRACE_SEGMENT_NAME, "/createSSRPMPlugins"), function () {
1065
+ return (0, _createSsrPmPlugins.createSSRPMPlugins)({
1066
+ plugins: plugins,
1067
+ schema: schema,
1068
+ portalProviderAPI: props.portalProviderAPI,
1069
+ getIntl: function getIntl() {
1070
+ return props.intl;
1071
+ }
1072
+ });
1073
+ }, onSSRMeasure);
1074
+ var ssrState = (0, _ssrMeasures.profileSSROperation)("".concat(SSR_TRACE_SEGMENT_NAME, "/createSSREditorState"), function () {
1075
+ return (0, _createSsrEditorState.createSSREditorState)({
1076
+ doc: doc,
1077
+ schema: schema,
1078
+ pmPlugins: ssrPMPlugins
1079
+ });
1080
+ }, onSSRMeasure);
1081
+ return {
1082
+ plugins: plugins,
1083
+ schema: schema,
1084
+ doc: doc,
1085
+ ssrPMPlugins: ssrPMPlugins,
1086
+ ssrEditorState: ssrState
1087
+ };
1088
+ }
1040
1089
  return {
1041
1090
  plugins: plugins,
1042
1091
  schema: schema,
1043
- doc: doc
1092
+ doc: doc,
1093
+ ssrPMPlugins: undefined,
1094
+ ssrEditorState: undefined
1044
1095
  };
1045
- }, [allowBlockType, buildDoc, props.preset, onSSRMeasure]);
1096
+ }, [allowBlockType, buildDoc, props.preset, onSSRMeasure, props.portalProviderAPI, props.intl]);
1097
+ // SSR only, synchronously set preMountEditorStateRef so it's ready to be consumed by children including toolbar
1098
+ if (ssrDeps !== null && ssrDeps !== void 0 && ssrDeps.ssrEditorState) {
1099
+ preMountEditorStateRef.current = ssrDeps.ssrEditorState;
1100
+ }
1046
1101
  var _props$editorProps3 = props.editorProps,
1047
1102
  assistiveLabel = _props$editorProps3.assistiveLabel,
1048
1103
  assistiveDescribedBy = _props$editorProps3.assistiveDescribedBy;
1049
1104
  var handleSsrEditorStateChanged = (0, _react.useCallback)(function (state) {
1050
- ssrEditorStateRef.current = state;
1105
+ preMountEditorStateRef.current = state;
1051
1106
  // Notify listeners about the initial SSR state
1052
1107
  pluginInjectionAPI.current.onEditorViewUpdated({
1053
1108
  newEditorState: state,
@@ -1094,11 +1149,13 @@ function ReactEditorView(props) {
1094
1149
  id: EDIT_AREA_ID,
1095
1150
  "aria-describedby": assistiveDescribedBy,
1096
1151
  "data-editor-id": editorId.current,
1097
- onSSRMeasure: onSSRMeasure
1152
+ onSSRMeasure: onSSRMeasure,
1153
+ prebuiltPMPlugins: ssrDeps.ssrPMPlugins,
1154
+ prebuiltEditorState: ssrDeps.ssrEditorState
1098
1155
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
1099
1156
  ,
1100
1157
  onEditorStateChanged: (0, _expValEquals.expValEquals)('platform_editor_perf_lint_cleanup', 'isEnabled', true) ? handleSsrEditorStateChanged : function (state) {
1101
- ssrEditorStateRef.current = state;
1158
+ preMountEditorStateRef.current = state;
1102
1159
  // Notify listeners about the initial SSR state
1103
1160
  pluginInjectionAPI.current.onEditorViewUpdated({
1104
1161
  newEditorState: state,
@@ -170,7 +170,7 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
170
170
  (0, _editorSharedStyles.FULL_PAGE_EDITOR_TOOLBAR_HEIGHT)(isToolbarAIFCEnabled)
171
171
  }
172
172
  }, !isEditorToolbarHidden && (isToolbarAIFCEnabled ? /*#__PURE__*/_react.default.createElement(_FullPageToolbarNext.FullPageToolbarNext, {
173
- disabled: !!props.disabled || !hasHadInteraction && (0, _expValEquals.expValEquals)('platform_editor_default_toolbar_state', 'isEnabled', true),
173
+ disabled: (0, _expValEquals.expValEquals)('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true) ? !hasHadInteraction ? false : !!props.disabled : !!props.disabled || !hasHadInteraction && (0, _expValEquals.expValEquals)('platform_editor_default_toolbar_state', 'isEnabled', true),
174
174
  disabledWithoutInteractionLogic: !!props.disabled,
175
175
  toolbarDockingPosition: toolbarDockingPosition !== null && toolbarDockingPosition !== void 0 ? toolbarDockingPosition : toolbarDocking,
176
176
  beforeIcon: props.primaryToolbarIconBefore,
@@ -72,6 +72,15 @@ var hideEditorContentAreaProsemirrorWithAttributeStyle = (0, _react2.css)({
72
72
  display: 'none'
73
73
  }
74
74
  });
75
+ var hideEditorContentAreaScrollGutterWithAttributeStyle = (0, _react2.css)({
76
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
77
+ '&[data-markdown-mode-hide-scroll-gutter="true"] > .ak-editor-content-area > [data-vc="scroll-gutter"]': {
78
+ display: 'none'
79
+ }
80
+ });
81
+ var hideEditorScrollGutterStyle = (0, _react2.css)({
82
+ display: 'none'
83
+ });
75
84
  var fullWidthNonChromelessBreakoutBlockTableStyle = (0, _react2.css)({
76
85
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-1
77
86
  '.fabric-editor--full-width-mode:not(:has(#chromeless-editor))': {
@@ -228,6 +237,38 @@ var contentAreaHeightNoToolbar = (0, _react2.css)({
228
237
  var markdownModeContainerBackgroundStyle = (0, _react2.css)({
229
238
  backgroundColor: "var(--ds-surface-sunken, #F8F8F8)"
230
239
  });
240
+ var markdownModeContentAreaStyle = (0, _react2.css)({
241
+ boxSizing: 'border-box',
242
+ height: '100%',
243
+ margin: 0,
244
+ maxWidth: 'none',
245
+ minWidth: 0,
246
+ paddingBottom: 0,
247
+ paddingTop: 0,
248
+ width: '100%',
249
+ // The markdown source view is rendered through PluginSlot. Stretch those
250
+ // intermediate wrappers so its in-flow footer can sit at the bottom without
251
+ // overlaying the CodeMirror scrollbar.
252
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
253
+ '> .ak-editor-content-area': {
254
+ boxSizing: 'border-box',
255
+ display: 'flex',
256
+ flexDirection: 'column',
257
+ height: '100%',
258
+ minHeight: 0,
259
+ minWidth: 0,
260
+ padding: 0,
261
+ width: '100%'
262
+ },
263
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
264
+ '> .ak-editor-content-area > [data-testid="plugins-components-wrapper"]': {
265
+ display: 'flex',
266
+ flex: '1 1 auto',
267
+ minHeight: 0,
268
+ minWidth: 0,
269
+ width: '100%'
270
+ }
271
+ });
231
272
  var CONTENT_AREA_TEST_ID = exports.CONTENT_AREA_TEST_ID = 'ak-editor-fp-content-area';
232
273
  // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
233
274
  var EDITOR_CONTAINER = exports.EDITOR_CONTAINER = 'ak-editor-container';
@@ -266,7 +307,10 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
266
307
  var _states$markdownModeS2;
267
308
  return (_states$markdownModeS2 = states.markdownModeState) === null || _states$markdownModeS2 === void 0 ? void 0 : _states$markdownModeS2.isMarkdownMode;
268
309
  });
269
- var shouldHideProseMirrorForMarkdownMode = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('cc-markdown-mode', 'isEnabled', true) && markdownPluginCurrentView !== 'preview' && markdownPluginCurrentIsMarkdownMode;
310
+ var isMarkdownModeExperimentEnabled = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('cc-markdown-mode', 'isEnabled', true);
311
+ var shouldHideProseMirrorForMarkdownMode = isMarkdownModeExperimentEnabled && markdownPluginCurrentView !== 'preview' && markdownPluginCurrentIsMarkdownMode;
312
+ var shouldHideScrollGutterForMarkdownMode = isMarkdownModeExperimentEnabled && markdownPluginCurrentIsMarkdownMode;
313
+ var shouldUseMarkdownModeMvpLayout = shouldHideProseMirrorForMarkdownMode && (0, _platformFeatureFlags.fg)('platform_editor_md_mvp_layout');
270
314
  return (0, _react2.jsx)("div", {
271
315
  css: [contentAreaNew, props.isEditorToolbarHidden && contentAreaHeightNoToolbar],
272
316
  "data-testid": CONTENT_AREA_TEST_ID,
@@ -274,7 +318,7 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
274
318
  }, (0, _react2.jsx)("div", {
275
319
  css: [
276
320
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
277
- _StyledComponents.contentAreaWrapper, shouldHideProseMirrorForMarkdownMode && (0, _platformFeatureFlags.fg)('platform_editor_md_mvp_layout') && markdownModeContainerBackgroundStyle],
321
+ _StyledComponents.contentAreaWrapper, shouldUseMarkdownModeMvpLayout && markdownModeContainerBackgroundStyle],
278
322
  "data-testid": EDITOR_CONTAINER,
279
323
  "data-editor-container": 'true'
280
324
  }, (0, _react2.jsx)(_EditorContentContainer.default
@@ -293,10 +337,11 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
293
337
  editorDisabled: props.disabled
294
338
  }, (0, _react2.jsx)("div", {
295
339
  "data-markdown-mode-hide-prosemirror": shouldHideProseMirrorForMarkdownMode ? 'true' : undefined,
340
+ "data-markdown-mode-hide-scroll-gutter": shouldHideScrollGutterForMarkdownMode ? 'true' : undefined,
296
341
  css: [editorContentAreaNew, editorContentAreaProsemirrorStyle,
297
342
  // EDITOR-6558: hide ProseMirror when the markdown-mode plugin
298
343
  // reports a non-WYSIWYG view.
299
- shouldHideProseMirrorForMarkdownMode && hideEditorContentAreaProsemirrorWithAttributeStyle, tableFullPageEditorStylesNew, fullWidthNonChromelessBreakoutBlockTableStyle,
344
+ shouldHideProseMirrorForMarkdownMode && hideEditorContentAreaProsemirrorWithAttributeStyle, shouldHideScrollGutterForMarkdownMode && hideEditorContentAreaScrollGutterWithAttributeStyle, shouldUseMarkdownModeMvpLayout && markdownModeContentAreaStyle, tableFullPageEditorStylesNew, fullWidthNonChromelessBreakoutBlockTableStyle,
300
345
  // for breakout resizing, there's no need to restrict the width of codeblocks as they're always wrapped in a breakout mark
301
346
  (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_breakout_resizing', 'isEnabled', true) ? editorContentAreaContainerStyleExcludeCodeBlockNew : editorContentAreaContainerStyleNew, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && editorContentAreaContainerNestedDndStyle, !(0, _platformFeatureFlags.fg)('platform_editor_controls_no_toolbar_space') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && contentAreaReducedHeaderSpace, !(0, _platformFeatureFlags.fg)('platform_editor_controls_no_toolbar_space') && props.isEditorToolbarHidden && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && contentAreaReservedPrimaryToolbarSpace],
302
347
  style: {
@@ -341,6 +386,7 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
341
386
  wrapperElement: props.wrapperElement
342
387
  }), props.editorDOMElement, !!props.customContentComponents && 'after' in props.customContentComponents ? (0, _contentComponentWrapper.contentComponentClickWrapper)(props.customContentComponents.after) : null, allowScrollGutter && ((0, _experiments.editorExperiment)('platform_editor_blocks', true) ? (0, _react2.jsx)("div", {
343
388
  id: "editor-scroll-gutter",
389
+ css: shouldHideScrollGutterForMarkdownMode && hideEditorScrollGutterStyle,
344
390
  style: {
345
391
  paddingBottom: "".concat((_allowScrollGutter$gu = allowScrollGutter.gutterSize) !== null && _allowScrollGutter$gu !== void 0 ? _allowScrollGutter$gu : '120', "px")
346
392
  },
@@ -348,6 +394,7 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
348
394
  "data-editor-scroll-gutter": "true"
349
395
  }) : (0, _react2.jsx)("div", {
350
396
  id: "editor-scroll-gutter",
397
+ css: shouldHideScrollGutterForMarkdownMode && hideEditorScrollGutterStyle,
351
398
  style: {
352
399
  paddingBottom: "".concat((_allowScrollGutter$gu2 = allowScrollGutter.gutterSize) !== null && _allowScrollGutter$gu2 !== void 0 ? _allowScrollGutter$gu2 : '120', "px")
353
400
  },
@@ -126,7 +126,12 @@ var FullPageToolbarNext = exports.FullPageToolbarNext = function FullPageToolbar
126
126
  // - primary toolbar isn't registered
127
127
  // - no custom primary toolbar components to render
128
128
  // note: primary toolbar must render if toolbar docking preference is set to "controlled" to avoid SSR conflicts
129
- if (!shouldShowToolbarContainer(toolbar, customPrimaryToolbarComponents)) {
129
+ // note(platform_editor_ssr_toolbar_optimistic): On the SSR and CSR, the toolbar plugin may be registered in the
130
+ // injection API but its components not yet populated. Bypass the early-return
131
+ // so the toolbar chrome stays mounted for layout stability; ToolbarNext renders
132
+ // null inside it until components arrive.
133
+ var isAwaitingToolbarComponents = (0, _expValEquals.expValEquals)('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true) && !Boolean(editorAPI === null || editorAPI === void 0 ? void 0 : editorAPI.toolbar);
134
+ if (!isAwaitingToolbarComponents && !shouldShowToolbarContainer(toolbar, customPrimaryToolbarComponents)) {
130
135
  return /*#__PURE__*/_react.default.createElement(ToolbarPortal, null, null);
131
136
  }
132
137
  return /*#__PURE__*/_react.default.createElement(_contextPanel.ContextPanelConsumer, null, function (_ref6) {
@@ -142,7 +147,21 @@ var FullPageToolbarNext = exports.FullPageToolbarNext = function FullPageToolbar
142
147
  showKeyline: showKeyline || ContextPanelWidth > 0
143
148
  }, beforeIcon && /*#__PURE__*/_react.default.createElement("div", {
144
149
  className: (0, _runtime.ax)([styles.mainToolbarIconBefore, styles.mainToolbarIconBeforeNew])
145
- }, beforeIcon), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(FirstChildWrapper, null, (0, _expValEquals.expValEquals)('platform_editor_default_toolbar_state', 'isEnabled', true) ? primaryToolbarDockingConfigEnabled && components && visibleToolbarComponents && (0, _toolbar2.isToolbar)(toolbar) && /*#__PURE__*/_react.default.createElement(_Toolbar.ToolbarNext, {
150
+ }, beforeIcon), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(FirstChildWrapper, null, (0, _expValEquals.expValEquals)('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true) ?
151
+ // optimistic toolbar — render immediately on both SSR and CSR with items enabled.
152
+ // Clicks are noops until editorView mounts.
153
+ primaryToolbarDockingConfigEnabled && (components && visibleToolbarComponents && (0, _toolbar2.isToolbar)(toolbar) ? /*#__PURE__*/_react.default.createElement(_Toolbar.ToolbarNext, {
154
+ toolbar: toolbar,
155
+ components: visibleToolbarComponents,
156
+ editorView: editorView,
157
+ editorAPI: editorAPI,
158
+ popupsMountPoint: mountPoint,
159
+ editorAppearance: "full-page",
160
+ isDisabled: disabled,
161
+ disabledWithoutInteractionLogic: false
162
+ }) :
163
+ // toolbar plugin not yet registered — render nothing inside the chrome for layout stability
164
+ null) : (0, _expValEquals.expValEquals)('platform_editor_default_toolbar_state', 'isEnabled', true) ? primaryToolbarDockingConfigEnabled && components && visibleToolbarComponents && (0, _toolbar2.isToolbar)(toolbar) && /*#__PURE__*/_react.default.createElement(_Toolbar.ToolbarNext, {
146
165
  toolbar: toolbar,
147
166
  components: visibleToolbarComponents,
148
167
  editorView: editorView,
@@ -185,7 +185,7 @@ var editorContentStyles = {
185
185
  emojiDenseStyles: "_2f9he0wb _gof5e0wb _1kube0wb _1jg61osq _ik5u1osq _7vzk1f51 _1n9bv47k _7pqpv47k",
186
186
  expandStyles: "_1fkbxmi2 _vx27xmi2 _1n9xxmi2 _1oymxmi2",
187
187
  expandStylesBase: "_1dcv12b0 _vir8sm61 _nshtskji _1ffuu2gc _eyk7fyzg _1ia1h2mm _ullp1kdv _1ci8stnw _14zzb3bt _1psiidpf _9apoidpf _t1ygidpf _1dr7idpf _py7e1osq _q9kpglyw _2jyr1ial _1tv57wq0 _63an1j28 _g5xu1j28 _5u1u1j28 _1oif1j28 _age41gly _1ymq1bqt _v5bbe4h9 _1husnqa1 _1xt11j28 _1t5a10yn _o7hy9c8s _1rdsfs2f _1kd91qdr _1x8yidpf _3tz5idpf _1b7utlke _1vuvusvi _372tidpf _g7u3dgkc _8va114w8 _bc4d1r31 _1d0tglyw _4fj21o36 _1fbsglyw _1p5p1j28 _1gxpkb7n _1245kb7n _1fmjf1ug _ig0i4w17 _18mboxwj _1ev778tn _15uri7a9 _caue1rpy _149p1txw _u29r1osq _1icakb7n _hiyf1rpy _oemsidpf _ux5uidpf _im3nidpf _4uf1idpf _8q99glyw _2gbkglyw _wn6j1r31 _m5xjglyw _eu2zidpf _11pmewfl _oi2iewfl _1otu1txw _rrwboxwj _ikp21osq _txkaazsu _1wtktlke _ar4h1h6o _3emmglyw _14wj12b0 _18x1sm61 _qg62idpf _3dscidpf _1xnzidpf _1l2jidpf _1aljidpf _kb94idpf _bqovidpf _1dx5idpf _sma4dfik _1slov77o _wo9i1dpa _bj9o180e _1rrkdgkc _m4h31ul7 _zsbmglyw _upeu1ejb _1hr01ejb _13mr1txw _a0pq1h6o _1gdo1h6o _kinytlke _wyq613gf _hl71sm61 _n4fm1l7x _sv44u2gc _2xjk14w8 _czgd1txw _1i7i15vq _1pnt15vq _wz3i15vq _1g6m15vq _9s8f1osq _10zo1osq _1ish1ule _zkn71ule _19mvidpf _vkxwidpf _ay4r7mnp _1m2q7mnp _1io9glyw _1gwnglyw _vgp2ze3t _svkwu2gc _157n1ejb _1c011b66 _1dwdj4ch _fqkm1osq _9n6nusvi _1xgj1kdv _70nuglyw _11qn1osq _1q2615vq _vffj15vq _o1nxstnw _1j9kt94y _1u1ft94y _1s0y7mnp _17sv1q9c _1a5m1j28 _317nsm61 _1srh1l7x _kh951j28 _19lwdgkc _194h1ul7",
188
- expandStylesMixin_experiment_platform_editor_chromeless_expand_fix: "_mklmidpf _nnniidpf",
188
+ expandStylesMixin_chromeless_expand_fix: "_mklmidpf _nnniidpf",
189
189
  expandStylesMixin_fg_platform_editor_nested_dnd_styles_changes: "_109wc7mi _vx27c7mi _15klc7mi _1oymc7mi _smy6idpf _g8xr1b66",
190
190
  expandStylesMixin_fg_platform_visual_refresh_icons: "_1ev7kb7n _1ocgttxp",
191
191
  expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes: "_1w8qq98m _omzvglyw _bqvk1osq _1h9p16ux _19lestnw _14j01n1a _1pm0idpf _1p3gidpf _1d9kt94y _113e1o8l",
@@ -395,7 +395,7 @@ var EditorContentContainerCompiled = exports.EditorContentContainerCompiled = /*
395
395
  // eslint-disable-next-line @atlaskit/platform/no-preconditioning
396
396
  (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp')) && isDense && editorContentStyles.tasksAndDecisionsDenseStyles, editorContentStyles.gridStyles, editorContentStyles.blockMarksStyles, editorContentStyles.dateStyles, editorContentStyles.extensionStyles, (contentMode === 'compact' && (0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) || (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp')) && editorContentStyles.extensionStylesDense, contentMode === 'compact' && (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && !(0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) && !(0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp') && editorContentStyles.extensionStylesLegacyDense, (0, _expValEquals.expValEquals)('platform_editor_bodiedextension_layoutshift_fix', 'isEnabled', true) && editorContentStyles.bodiedExtensionLayoutShiftFix, editorContentStyles.extensionDiffStyles, editorContentStyles.expandStylesBase, !useStandardNodeWidth && editorContentStyles.expandStyles, contentMode === 'compact' && ((0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) ||
397
397
  // eslint-disable-next-line @atlaskit/platform/no-preconditioning
398
- (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp')) && isDense && editorContentStyles.expandDenseStyles, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? editorContentStyles.expandStylesMixin_fg_platform_editor_nested_dnd_styles_changes : editorContentStyles.expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes, editorContentStyles.expandStylesMixin_fg_platform_visual_refresh_icons, isChromeless && (0, _expValEquals.expValEquals)('platform_editor_chromeless_expand_fix', 'isEnabled', true) && editorContentStyles.expandStylesMixin_experiment_platform_editor_chromeless_expand_fix, (0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? editorContentStyles.findReplaceStylesNewWithA11Y : editorContentStyles.findReplaceStyles, (0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) && editorContentStyles.findReplaceStylesNewWithCodeblockColorContrastFix, !(0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) && editorContentStyles.findReplaceStylesWithCodeblockColorContrastFix, (0, _experiments.editorExperiment)('platform_synced_block', true) && editorContentStyles.findReplaceStylesWithRefSyncBlock, editorContentStyles.textHighlightStyle, editorContentStyles.decisionStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_blocktaskitem_node_tenantid', 'isEnabled', true) ? editorContentStyles.taskItemStylesWithBlockTaskItem : editorContentStyles.taskItemStyles, editorContentStyles.taskItemCheckboxStyles, editorContentStyles.decisionIconWithVisualRefresh, editorContentStyles.statusStyles, (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') ? editorContentStyles.statusStylesTeam26 : (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? editorContentStyles.statusStylesMixin_fg_platform_component_visual_refresh_with_search_match : editorContentStyles.statusStylesMixin_fg_platform_component_visual_refresh : (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? editorContentStyles.statusStylesMixin_without_fg_platform_component_visual_refresh_with_search_match : editorContentStyles.statusStylesMixin_without_fg_platform_component_visual_refresh, colorMode === 'dark' && (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') && editorContentStyles.statusStylesTeam26DarkMode, editorContentStyles.annotationStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? (0, _experiments.editorExperiment)('platform_editor_block_menu', true) ? editorContentStyles.smartCardStylesWithSearchMatchAndBlockMenuDangerStyles : editorContentStyles.smartCardStylesWithSearchMatch : editorContentStyles.smartCardStyles, (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true) && editorContentStyles.smartCardStylesWithSearchMatchAndPreviewPanelResponsiveness, ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_controls', 'cohort', 'variant1') || (0, _experiments.editorExperiment)('platform_editor_preview_panel_linking_exp', true)) && editorContentStyles.editorControlsSmartCardStyles, editorContentStyles.embedCardStyles, editorContentStyles.unsupportedStyles, editorContentStyles.resizerStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('cc-maui-experiment', 'isEnabled', true) && (0, _expValEquals.expValEquals)('databases-native-embeds-v2', 'isEnabled', true) && editorContentStyles.resizerBottomHandleStyles, editorContentStyles.layoutBaseStyles, (0, _expValEquals.expValEquals)('platform_editor_table_excerpts_fix', 'isEnabled', true) && editorContentStyles.layoutBaseStylesWithTableExcerptsFix, (0, _platformFeatureFlags.fg)('platform_editor_fix_media_in_renderer') && editorContentStyles.alignMultipleWrappedImageInLayoutStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && editorContentStyles.syncBlockStylesBase, (0, _experiments.editorExperiment)('platform_synced_block', true) &&
398
+ (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp')) && isDense && editorContentStyles.expandDenseStyles, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? editorContentStyles.expandStylesMixin_fg_platform_editor_nested_dnd_styles_changes : editorContentStyles.expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes, editorContentStyles.expandStylesMixin_fg_platform_visual_refresh_icons, isChromeless && editorContentStyles.expandStylesMixin_chromeless_expand_fix, (0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? editorContentStyles.findReplaceStylesNewWithA11Y : editorContentStyles.findReplaceStyles, (0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) && editorContentStyles.findReplaceStylesNewWithCodeblockColorContrastFix, !(0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) && editorContentStyles.findReplaceStylesWithCodeblockColorContrastFix, (0, _experiments.editorExperiment)('platform_synced_block', true) && editorContentStyles.findReplaceStylesWithRefSyncBlock, editorContentStyles.textHighlightStyle, editorContentStyles.decisionStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_blocktaskitem_node_tenantid', 'isEnabled', true) ? editorContentStyles.taskItemStylesWithBlockTaskItem : editorContentStyles.taskItemStyles, editorContentStyles.taskItemCheckboxStyles, editorContentStyles.decisionIconWithVisualRefresh, editorContentStyles.statusStyles, (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') ? editorContentStyles.statusStylesTeam26 : (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? editorContentStyles.statusStylesMixin_fg_platform_component_visual_refresh_with_search_match : editorContentStyles.statusStylesMixin_fg_platform_component_visual_refresh : (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? editorContentStyles.statusStylesMixin_without_fg_platform_component_visual_refresh_with_search_match : editorContentStyles.statusStylesMixin_without_fg_platform_component_visual_refresh, colorMode === 'dark' && (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') && editorContentStyles.statusStylesTeam26DarkMode, editorContentStyles.annotationStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? (0, _experiments.editorExperiment)('platform_editor_block_menu', true) ? editorContentStyles.smartCardStylesWithSearchMatchAndBlockMenuDangerStyles : editorContentStyles.smartCardStylesWithSearchMatch : editorContentStyles.smartCardStyles, (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true) && editorContentStyles.smartCardStylesWithSearchMatchAndPreviewPanelResponsiveness, ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_controls', 'cohort', 'variant1') || (0, _experiments.editorExperiment)('platform_editor_preview_panel_linking_exp', true)) && editorContentStyles.editorControlsSmartCardStyles, editorContentStyles.embedCardStyles, editorContentStyles.unsupportedStyles, editorContentStyles.resizerStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('cc-maui-experiment', 'isEnabled', true) && (0, _expValEquals.expValEquals)('databases-native-embeds-v2', 'isEnabled', true) && editorContentStyles.resizerBottomHandleStyles, editorContentStyles.layoutBaseStyles, (0, _expValEquals.expValEquals)('platform_editor_table_excerpts_fix', 'isEnabled', true) && editorContentStyles.layoutBaseStylesWithTableExcerptsFix, (0, _platformFeatureFlags.fg)('platform_editor_fix_media_in_renderer') && editorContentStyles.alignMultipleWrappedImageInLayoutStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && editorContentStyles.syncBlockStylesBase, (0, _experiments.editorExperiment)('platform_synced_block', true) &&
399
399
  // Apply sync block delta styles conditionally based on useStandardNodeWidth (negative margins or not)
400
400
  !useStandardNodeWidth && editorContentStyles.syncBlockStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && editorContentStyles.syncBlockOverflowStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && editorContentStyles.syncBlockFirstNodeStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && (0, _platformFeatureFlags.fg)('platform_synced_block_patch_14') && editorContentStyles.syncBlockTextSelectionStyles, (0, _experiments.editorExperiment)('advanced_layouts', true) && editorContentStyles.layoutBaseStylesAdvanced, (0, _experiments.editorExperiment)('advanced_layouts', true) ? editorContentStyles.layoutSectionStylesAdvanced : editorContentStyles.layoutSectionStylesNotAdvanced, (0, _experiments.editorExperiment)('advanced_layouts', true) && (0, _experiments.editorExperiment)('platform_editor_layout_column_resize_handle', true) && editorContentStyles.layoutColumnDividerStyles, (0, _experiments.editorExperiment)('advanced_layouts', true) && (0, _experiments.editorExperiment)('platform_editor_layout_column_resize_handle', true) && (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && editorContentStyles.layoutColumnDividerStylesNestedDnD, (0, _experiments.editorExperiment)('advanced_layouts', true) ? editorContentStyles.layoutColumnStylesAdvanced : editorContentStyles.layoutColumnStylesNotAdvanced, (0, _experiments.editorExperiment)('advanced_layouts', true) && (0, _experiments.editorExperiment)('platform_editor_layout_column_resize_handle', true) && editorContentStyles.layoutColumnResizeStyles, (0, _experiments.editorExperiment)('advanced_layouts', true) ? editorContentStyles.layoutSelectedStylesAdvanced : editorContentStyles.layoutSelectedStylesNotAdvanced, (0, _experiments.editorExperiment)('platform_synced_block', true) && editorContentStyles.layoutSelectedStylesAdvancedFix, (0, _experiments.editorExperiment)('advanced_layouts', true) && editorContentStyles.layoutColumnResponsiveStyles, (0, _experiments.editorExperiment)('advanced_layouts', true) && editorContentStyles.layoutResponsiveBaseStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && editorContentStyles.layoutBaseStylesFixesUnderNestedDnDFGExcludingBodiedSync, !(0, _experiments.editorExperiment)('platform_synced_block', true) && (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && editorContentStyles.layoutBaseStylesFixesUnderNestedDnDFG, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? editorContentStyles.layoutColumnMartinTopFixesNew : editorContentStyles.layoutColumnMartinTopFixesOld, editorContentStyles.smartLinksInLivePagesStyles, editorContentStyles.linkingVisualRefreshV1Styles, editorContentStyles.dateVanillaStyles, (0, _platformFeatureFlags.fg)('platform_editor_typography_ugc') ? contentMode === 'compact' && ((0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) ||
401
401
  // eslint-disable-next-line @atlaskit/platform/no-preconditioning
@@ -315,9 +315,9 @@ var EditorContentContainerEmotion = exports.EditorContentContainerEmotion = /*#_
315
315
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
316
316
  _expandStyles.expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes,
317
317
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
318
- _expandStyles.expandStylesMixin_fg_platform_visual_refresh_icons, isChromeless && (0, _expValEquals.expValEquals)('platform_editor_chromeless_expand_fix', 'isEnabled', true) &&
318
+ _expandStyles.expandStylesMixin_fg_platform_visual_refresh_icons, isChromeless &&
319
319
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
320
- _expandStyles.expandStylesMixin_experiment_platform_editor_chromeless_expand_fix, (0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ?
320
+ _expandStyles.expandStylesMixin_chromeless_expand_fix, (0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ?
321
321
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
322
322
  _findReplaceStyles.findReplaceStylesNewWithA11Y :
323
323
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.getDenseExpandTitleStyles = exports.expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes = exports.expandStylesMixin_fg_platform_visual_refresh_icons = exports.expandStylesMixin_fg_platform_editor_nested_dnd_styles_changes = exports.expandStylesMixin_experiment_platform_editor_chromeless_expand_fix = exports.expandStylesBase = exports.expandStyles = void 0;
6
+ exports.getDenseExpandTitleStyles = exports.expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes = exports.expandStylesMixin_fg_platform_visual_refresh_icons = exports.expandStylesMixin_fg_platform_editor_nested_dnd_styles_changes = exports.expandStylesMixin_chromeless_expand_fix = exports.expandStylesBase = exports.expandStyles = void 0;
7
7
  var _react = require("@emotion/react");
8
8
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
9
9
  /* eslint-disable @atlaskit/ui-styling-standard/use-compiled,
@@ -347,7 +347,7 @@ var expandStylesMixin_fg_platform_editor_nested_dnd_styles_changes = exports.exp
347
347
  * See EDITOR-7600 for more details: https://hello.jira.atlassian.cloud/jira/browse/EDITOR-7600
348
348
  */
349
349
  // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
350
- var expandStylesMixin_experiment_platform_editor_chromeless_expand_fix = exports.expandStylesMixin_experiment_platform_editor_chromeless_expand_fix = (0, _react.css)({
350
+ var expandStylesMixin_chromeless_expand_fix = exports.expandStylesMixin_chromeless_expand_fix = (0, _react.css)({
351
351
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
352
352
  '.ProseMirror > .ak-editor-expand': {
353
353
  marginLeft: 0,
@@ -6,4 +6,4 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.version = exports.name = void 0;
7
7
  var name = exports.name = "@atlaskit/editor-core";
8
8
  // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
9
- var version = exports.version = "221.2.0";
9
+ var version = exports.version = "221.3.0";
@@ -21,6 +21,8 @@ import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
21
21
  import { EditorState, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
22
22
  import { EditorView } from '@atlaskit/editor-prosemirror/view';
23
23
  import { EditorSSRRenderer } from '@atlaskit/editor-ssr-renderer';
24
+ import { createSSREditorState } from '@atlaskit/editor-ssr-renderer/create-ssr-editor-state';
25
+ import { createSSRPMPlugins } from '@atlaskit/editor-ssr-renderer/create-ssr-pm-plugins';
24
26
  import { fg } from '@atlaskit/platform-feature-flags';
25
27
  import { getInteractionId } from '@atlaskit/react-ufo/interaction-id-context';
26
28
  import { abortAll, getActiveInteraction } from '@atlaskit/react-ufo/interaction-metrics';
@@ -87,7 +89,12 @@ export function ReactEditorView(props) {
87
89
  onEditorCreated,
88
90
  onEditorDestroyed
89
91
  } = props;
90
- const ssrEditorStateRef = useRef(undefined);
92
+
93
+ // Holds the best available EditorState before the ProseMirror EditorView has mounted.
94
+ // On SSR: set to the SSR-rendered state so toolbar plugins can read it via getEditorState().
95
+ // On client first render: set to initialEditorState for the same reason.
96
+ // Cleared to undefined once createEditorView runs and viewRef.current becomes available.
97
+ const preMountEditorStateRef = useRef(undefined);
91
98
  const editorRef = useRef(null);
92
99
  const viewRef = useRef();
93
100
  const focusTimeoutId = useRef();
@@ -111,8 +118,8 @@ export function ReactEditorView(props) {
111
118
  const contentTransformer = useRef(undefined);
112
119
  const featureFlags = useMemo(() => createFeatureFlagsFromProps(editorPropFeatureFlags), [editorPropFeatureFlags]);
113
120
  const getEditorState = useCallback(() => {
114
- var _ssrEditorStateRef$cu, _viewRef$current;
115
- return (_ssrEditorStateRef$cu = ssrEditorStateRef.current) !== null && _ssrEditorStateRef$cu !== void 0 ? _ssrEditorStateRef$cu : (_viewRef$current = viewRef.current) === null || _viewRef$current === void 0 ? void 0 : _viewRef$current.state;
121
+ var _preMountEditorStateR, _viewRef$current;
122
+ return (_preMountEditorStateR = preMountEditorStateRef.current) !== null && _preMountEditorStateR !== void 0 ? _preMountEditorStateR : (_viewRef$current = viewRef.current) === null || _viewRef$current === void 0 ? void 0 : _viewRef$current.state;
116
123
  }, []);
117
124
  const getEditorView = useCallback(() => viewRef.current, []);
118
125
  const dispatch = useMemo(() => createDispatch(eventDispatcher), [eventDispatcher]);
@@ -228,12 +235,17 @@ export function ReactEditorView(props) {
228
235
  // so we can save some CPU time here.
229
236
  return undefined;
230
237
  }
231
- return createEditorState({
238
+ const state = createEditorState({
232
239
  props,
233
240
  doc: defaultValue,
234
241
  // ED-4759: Don't set selection at end for full-page editor - should be at start.
235
242
  selectionAtStart: isFullPage(nextAppearance)
236
243
  });
244
+ if (expValEquals('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true)) {
245
+ // CSR only, synchronously set preMountEditorStateRef so it's ready to be consumed by children including toolbar
246
+ preMountEditorStateRef.current = state;
247
+ }
248
+ return state;
237
249
  },
238
250
  // This is only used for the initial state - afterwards we will have `viewRef` available for use
239
251
  // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -622,6 +634,10 @@ export function ReactEditorView(props) {
622
634
  mount: node
623
635
  }, getDirectEditorProps());
624
636
  viewRef.current = view;
637
+ if (expValEquals('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true)) {
638
+ // clears pre-mount state as soon as the final view is mounted
639
+ preMountEditorStateRef.current = undefined;
640
+ }
625
641
  measureRender(measurements.PROSEMIRROR_RENDERED, ({
626
642
  duration,
627
643
  startTime,
@@ -960,18 +976,51 @@ export function ReactEditorView(props) {
960
976
  const schema = profileSSROperation(`${SSR_TRACE_SEGMENT_NAME}/createSchema`, doCreateSchema, onSSRMeasure);
961
977
  const doBuildDoc = () => buildDoc(schema);
962
978
  const doc = profileSSROperation(`${SSR_TRACE_SEGMENT_NAME}/buildDoc`, doBuildDoc, onSSRMeasure);
979
+
980
+ // When the platform_editor_ssr_toolbar_optimistic is on, we create SSR-safe PM plugins and EditorState
981
+ // HERE in ssrDeps — before any children render — so that FullPageToolbarNext can read correct
982
+ // plugin state via useSharedPluginStateWithSelector → currentState() → getEditorState().
983
+ //
984
+ // We also pass these pre-built pmPlugins and editorState to EditorSSRRenderer so it can
985
+ // skip redundant creation (avoids double createPluginsList + EditorState.create).
986
+ if (expValEquals('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true)) {
987
+ const ssrPMPlugins = profileSSROperation(`${SSR_TRACE_SEGMENT_NAME}/createSSRPMPlugins`, () => createSSRPMPlugins({
988
+ plugins,
989
+ schema,
990
+ portalProviderAPI: props.portalProviderAPI,
991
+ getIntl: () => props.intl
992
+ }), onSSRMeasure);
993
+ const ssrState = profileSSROperation(`${SSR_TRACE_SEGMENT_NAME}/createSSREditorState`, () => createSSREditorState({
994
+ doc,
995
+ schema,
996
+ pmPlugins: ssrPMPlugins
997
+ }), onSSRMeasure);
998
+ return {
999
+ plugins,
1000
+ schema,
1001
+ doc,
1002
+ ssrPMPlugins,
1003
+ ssrEditorState: ssrState
1004
+ };
1005
+ }
963
1006
  return {
964
1007
  plugins,
965
1008
  schema,
966
- doc
1009
+ doc,
1010
+ ssrPMPlugins: undefined,
1011
+ ssrEditorState: undefined
967
1012
  };
968
- }, [allowBlockType, buildDoc, props.preset, onSSRMeasure]);
1013
+ }, [allowBlockType, buildDoc, props.preset, onSSRMeasure, props.portalProviderAPI, props.intl]);
1014
+ // SSR only, synchronously set preMountEditorStateRef so it's ready to be consumed by children including toolbar
1015
+ if (ssrDeps !== null && ssrDeps !== void 0 && ssrDeps.ssrEditorState) {
1016
+ preMountEditorStateRef.current = ssrDeps.ssrEditorState;
1017
+ }
969
1018
  const {
970
1019
  assistiveLabel,
971
1020
  assistiveDescribedBy
972
1021
  } = props.editorProps;
973
1022
  const handleSsrEditorStateChanged = useCallback(state => {
974
- ssrEditorStateRef.current = state;
1023
+ preMountEditorStateRef.current = state;
975
1024
  // Notify listeners about the initial SSR state
976
1025
  pluginInjectionAPI.current.onEditorViewUpdated({
977
1026
  newEditorState: state,
@@ -1016,11 +1065,13 @@ export function ReactEditorView(props) {
1016
1065
  id: EDIT_AREA_ID,
1017
1066
  "aria-describedby": assistiveDescribedBy,
1018
1067
  "data-editor-id": editorId.current,
1019
- onSSRMeasure: onSSRMeasure
1068
+ onSSRMeasure: onSSRMeasure,
1069
+ prebuiltPMPlugins: ssrDeps.ssrPMPlugins,
1070
+ prebuiltEditorState: ssrDeps.ssrEditorState
1020
1071
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
1021
1072
  ,
1022
1073
  onEditorStateChanged: expValEquals('platform_editor_perf_lint_cleanup', 'isEnabled', true) ? handleSsrEditorStateChanged : state => {
1023
- ssrEditorStateRef.current = state;
1074
+ preMountEditorStateRef.current = state;
1024
1075
  // Notify listeners about the initial SSR state
1025
1076
  pluginInjectionAPI.current.onEditorViewUpdated({
1026
1077
  newEditorState: state,
@@ -154,7 +154,7 @@ export const FullPageEditor = props => {
154
154
  FULL_PAGE_EDITOR_TOOLBAR_HEIGHT(isToolbarAIFCEnabled)
155
155
  }
156
156
  }, !isEditorToolbarHidden && (isToolbarAIFCEnabled ? /*#__PURE__*/React.createElement(FullPageToolbarNext, {
157
- disabled: !!props.disabled || !hasHadInteraction && expValEquals('platform_editor_default_toolbar_state', 'isEnabled', true),
157
+ disabled: expValEquals('platform_editor_ssr_toolbar_optimistic', 'isEnabled', true) ? !hasHadInteraction ? false : !!props.disabled : !!props.disabled || !hasHadInteraction && expValEquals('platform_editor_default_toolbar_state', 'isEnabled', true),
158
158
  disabledWithoutInteractionLogic: !!props.disabled,
159
159
  toolbarDockingPosition: (_toolbarDockingPositi = toolbarDockingPosition) !== null && _toolbarDockingPositi !== void 0 ? _toolbarDockingPositi : toolbarDocking,
160
160
  beforeIcon: props.primaryToolbarIconBefore,