@atlaskit/editor-core 221.3.2 → 221.3.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 (35) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/ui/Appearance/Comment/Comment.js +344 -6
  3. package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js +402 -10
  4. package/dist/cjs/version-wrapper.js +1 -1
  5. package/dist/es2019/ui/Appearance/Comment/Comment.js +337 -4
  6. package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js +400 -8
  7. package/dist/es2019/version-wrapper.js +1 -1
  8. package/dist/esm/ui/Appearance/Comment/Comment.js +339 -6
  9. package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js +398 -10
  10. package/dist/esm/version-wrapper.js +1 -1
  11. package/dist/types/ui/Appearance/Comment/Comment.d.ts +20 -2
  12. package/dist/types/ui/Appearance/FullPage/FullPageContentArea.d.ts +54 -6
  13. package/package.json +3 -3
  14. package/dist/cjs/ui/Appearance/Comment/Comment-compiled.compiled.css +0 -30
  15. package/dist/cjs/ui/Appearance/Comment/Comment-compiled.js +0 -275
  16. package/dist/cjs/ui/Appearance/Comment/Comment-emotion.js +0 -357
  17. package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea-compiled.compiled.css +0 -96
  18. package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea-compiled.js +0 -190
  19. package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea-emotion.js +0 -413
  20. package/dist/es2019/ui/Appearance/Comment/Comment-compiled.compiled.css +0 -30
  21. package/dist/es2019/ui/Appearance/Comment/Comment-compiled.js +0 -262
  22. package/dist/es2019/ui/Appearance/Comment/Comment-emotion.js +0 -344
  23. package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea-compiled.compiled.css +0 -96
  24. package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea-compiled.js +0 -179
  25. package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea-emotion.js +0 -405
  26. package/dist/esm/ui/Appearance/Comment/Comment-compiled.compiled.css +0 -30
  27. package/dist/esm/ui/Appearance/Comment/Comment-compiled.js +0 -268
  28. package/dist/esm/ui/Appearance/Comment/Comment-emotion.js +0 -346
  29. package/dist/esm/ui/Appearance/FullPage/FullPageContentArea-compiled.compiled.css +0 -96
  30. package/dist/esm/ui/Appearance/FullPage/FullPageContentArea-compiled.js +0 -183
  31. package/dist/esm/ui/Appearance/FullPage/FullPageContentArea-emotion.js +0 -403
  32. package/dist/types/ui/Appearance/Comment/Comment-compiled.d.ts +0 -30
  33. package/dist/types/ui/Appearance/Comment/Comment-emotion.d.ts +0 -20
  34. package/dist/types/ui/Appearance/FullPage/FullPageContentArea-compiled.d.ts +0 -56
  35. package/dist/types/ui/Appearance/FullPage/FullPageContentArea-emotion.d.ts +0 -56
@@ -1,403 +0,0 @@
1
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- /**
3
- * @jsxRuntime classic
4
- * @jsx jsx
5
- */
6
-
7
- import React, { useImperativeHandle, useRef } from 'react';
8
-
9
- /* eslint-disable @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
10
- import { css, jsx, useTheme } from '@emotion/react';
11
- import classnames from 'classnames';
12
- import { injectIntl } from 'react-intl';
13
- import { decisionListSelector, taskListSelector } from '@atlaskit/adf-schema';
14
- import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
15
- import { fullPageMessages as messages } from '@atlaskit/editor-common/messages';
16
- import { akEditorFullPageNarrowBreakout, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
17
- import { fg } from '@atlaskit/platform-feature-flags';
18
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
19
- import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
20
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
21
- // Ignored via go/ees005
22
- // eslint-disable-next-line import/no-named-as-default
23
- import ClickAreaBlock from '../../Addon/ClickAreaBlock';
24
- import { contentComponentClickWrapper } from '../../Addon/ClickAreaBlock/contentComponentWrapper';
25
- import { ContextPanel } from '../../ContextPanel';
26
- import EditorContentContainer from '../../EditorContentContainer/EditorContentContainer';
27
- import PluginSlot from '../../PluginSlot';
28
- import { contentAreaWrapper, sidebarArea } from './StyledComponents';
29
- var akEditorFullWidthLayoutWidth = 1800;
30
- var akEditorUltraWideLayoutWidth = 4000;
31
- var akEditorSwoopCubicBezier = "cubic-bezier(0.15, 1, 0.3, 1)";
32
- var tableMarginFullWidthMode = 2;
33
- var akLayoutGutterOffset = 12;
34
- var SWOOP_ANIMATION = "0.5s ".concat(akEditorSwoopCubicBezier);
35
- var AK_NESTED_DND_GUTTER_OFFSET = 8;
36
- var getTotalPadding = function getTotalPadding() {
37
- return akEditorGutterPaddingDynamic() * 2;
38
- };
39
- var editorContentAreaProsemirrorStyle = css({
40
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
41
- '& .ProseMirror': _defineProperty(_defineProperty({
42
- flexGrow: 1,
43
- boxSizing: 'border-box',
44
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
45
- '& > *': {
46
- clear: 'both'
47
- }
48
- }, "> p, > ul, > ol:not(".concat(taskListSelector, "):not(").concat(decisionListSelector, "), > h1, > h2, > h3, > h4, > h5, > h6"), {
49
- clear: 'none'
50
- }), '> p:last-child', {
51
- marginBottom: "var(--ds-space-300, 24px)"
52
- })
53
- });
54
-
55
- /*
56
- EDITOR-7249: Scope to the main editor's ProseMirror (direct child) so nested
57
- editors like the footer page-comment composer aren't hidden in Syntax view.
58
- */
59
- var hideEditorContentAreaProsemirrorWithAttributeStyle = css({
60
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
61
- '&[data-markdown-mode-hide-prosemirror="true"] > .ak-editor-content-area > .ProseMirror': {
62
- display: 'none'
63
- }
64
- });
65
- var hideEditorContentAreaScrollGutterWithAttributeStyle = css({
66
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
67
- '&[data-markdown-mode-hide-scroll-gutter="true"] > .ak-editor-content-area > [data-vc="scroll-gutter"]': {
68
- display: 'none'
69
- }
70
- });
71
- var hideEditorScrollGutterStyle = css({
72
- display: 'none'
73
- });
74
- var fullWidthNonChromelessBreakoutBlockTableStyle = css({
75
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-1
76
- '.fabric-editor--full-width-mode:not(:has(#chromeless-editor))': {
77
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
78
- '.fabric-editor-breakout-mark, .extension-container.block, .pm-table-container': {
79
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
80
- width: '100% !important'
81
- },
82
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
83
- '.fabric-editor-breakout-mark': {
84
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
85
- marginLeft: 'unset !important',
86
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
87
- transform: 'none !important'
88
- }
89
- }
90
- });
91
-
92
- // An additional spacing applied at the top of the content area reserving space when the primary toolbar
93
- // is hidden – this avoids layout shift when the toolbar is toggled under the editor controls feature
94
- var contentAreaReservedPrimaryToolbarSpace = css({
95
- // extra 1px to account for the bottom border on the toolbar
96
- marginTop: "calc(".concat("var(--ds-space-500, 40px)", " + 1px)")
97
- });
98
-
99
- // A reduced top spacing applied to the content area to compensate for the reserved space at the top
100
- // of the page when the primary toolbar is hidden under the editor controls feature
101
- var contentAreaReducedHeaderSpace = css({
102
- paddingTop: "var(--ds-space-400, 32px)"
103
- });
104
-
105
- // new styles
106
- var editorContentAreaNew = css({
107
- // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
108
- lineHeight: '24px',
109
- paddingTop: "var(--ds-space-600, 48px)",
110
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
111
- '.ak-editor-content-area-no-toolbar &': {
112
- // When the toolbar is hidden, we don't want content to jump up
113
- // the extra 1px is to account for the border on the toolbar
114
- paddingTop: "calc(".concat("var(--ds-space-600, 48px)", " + var(--ak-editor-fullpage-toolbar-height) + 1px)")
115
- },
116
- paddingBottom: "var(--ds-space-600, 48px)",
117
- height: 'calc( 100% - 105px )',
118
- width: '100%',
119
- margin: 'auto',
120
- flexDirection: 'column',
121
- flexGrow: 1,
122
- maxWidth: 'var(--ak-editor-content-area-max-width)',
123
- transition: "max-width ".concat(SWOOP_ANIMATION)
124
- });
125
- var tableFullPageEditorStylesNew = css({
126
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
127
- '.ProseMirror .pm-table-wrapper > table': {
128
- marginLeft: 0,
129
- /* 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212 */
130
- // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
131
- marginRight: '-1px',
132
- width: '100%'
133
- }
134
- });
135
- var editorContentAreaContainerNestedDndStyle = css({
136
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
137
- '.fabric-editor--full-width-mode': {
138
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
139
- '[data-layout-section]': {
140
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
141
- maxWidth: "calc(100% + ".concat((akLayoutGutterOffset + AK_NESTED_DND_GUTTER_OFFSET) * 2, "px)")
142
- }
143
- }
144
- });
145
-
146
- /* Prevent horizontal scroll on page in full width mode */
147
- var editorContentAreaContainerStyleExcludeCodeBlockNew = css({
148
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
149
- '.fabric-editor--full-width-mode': {
150
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
151
- '.extension-container, .multiBodiedExtension--container': {
152
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
153
- maxWidth: "calc(100% - ".concat(tableMarginFullWidthMode * 2, "px)")
154
- },
155
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
156
- '.extension-container.inline': {
157
- maxWidth: '100%'
158
- },
159
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
160
- 'td .extension-container.inline': {
161
- maxWidth: 'inherit'
162
- },
163
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
164
- '[data-layout-section]': {
165
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
166
- maxWidth: "calc(100% + ".concat(akLayoutGutterOffset * 2, "px)")
167
- }
168
- }
169
- });
170
-
171
- /* Prevent horizontal scroll on page in full width mode */
172
- var editorContentAreaContainerStyleNew = css({
173
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
174
- '.fabric-editor--full-width-mode': {
175
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
176
- '.code-block, .extension-container, .multiBodiedExtension--container': {
177
- maxWidth: "calc(100% - ".concat(tableMarginFullWidthMode * 2, "px)")
178
- },
179
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
180
- '.extension-container.inline': {
181
- maxWidth: '100%'
182
- },
183
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
184
- 'td .extension-container.inline': {
185
- maxWidth: 'inherit'
186
- },
187
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
188
- '[data-layout-section]': {
189
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
190
- maxWidth: "calc(100% + ".concat(akLayoutGutterOffset * 2, "px)")
191
- }
192
- }
193
- });
194
- var editorContentGutterStyleFG = css({
195
- padding: '0 72px'
196
- });
197
- var editorContentGutterStyles = css({
198
- boxSizing: 'border-box',
199
- padding: '0 52px'
200
- });
201
- var editorContentReducedGutterStyles = css(_defineProperty({}, "@container editor-area (max-width: ".concat(akEditorFullPageNarrowBreakout, "px)"), {
202
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
203
- padding: "0 ".concat(akEditorGutterPaddingReduced, "px")
204
- }));
205
- var contentAreaNew = css({
206
- display: 'flex',
207
- flexDirection: 'row',
208
- height: "calc(100% - var(--ak-editor-fullpage-toolbar-height))",
209
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
210
- '&.ak-editor-content-area-no-toolbar': {
211
- // The editor toolbar height is 1px off (from the border) -- so we need to add 1px to the height
212
- // to match the toolbar height
213
- height: "calc(100% + 1px)"
214
- },
215
- boxSizing: 'border-box',
216
- margin: 0,
217
- padding: 0,
218
- transition: "padding 0ms ".concat(akEditorSwoopCubicBezier)
219
- });
220
- var contentAreaHeightNoToolbar = css({
221
- height: '100%'
222
- });
223
-
224
- // When the markdown source view is shown (markdown mode toggled on and not in
225
- // the WYSIWYG "preview" view) we tint the whole editor container with the
226
- // sunken surface so the source editor reads as a distinct, inset surface.
227
- var markdownModeContainerBackgroundStyle = css({
228
- backgroundColor: "var(--ds-surface-sunken, #F8F8F8)"
229
- });
230
- var markdownModeContentAreaStyle = css({
231
- boxSizing: 'border-box',
232
- height: '100%',
233
- margin: 0,
234
- maxWidth: 'none',
235
- minWidth: 0,
236
- paddingBottom: 0,
237
- paddingTop: 0,
238
- width: '100%',
239
- // The markdown source view is rendered through PluginSlot. Stretch those
240
- // intermediate wrappers so its in-flow footer can sit at the bottom without
241
- // overlaying the CodeMirror scrollbar.
242
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
243
- '> .ak-editor-content-area': {
244
- boxSizing: 'border-box',
245
- display: 'flex',
246
- flexDirection: 'column',
247
- height: '100%',
248
- minHeight: 0,
249
- minWidth: 0,
250
- padding: 0,
251
- width: '100%'
252
- },
253
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
254
- '> .ak-editor-content-area > [data-testid="plugins-components-wrapper"]': {
255
- display: 'flex',
256
- flex: '1 1 auto',
257
- minHeight: 0,
258
- minWidth: 0,
259
- width: '100%'
260
- }
261
- });
262
- export var CONTENT_AREA_TEST_ID = 'ak-editor-fp-content-area';
263
- // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
264
- export var EDITOR_CONTAINER = 'ak-editor-container';
265
- var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
266
- var _props$editorAPI, _props$editorAPI$bloc, _props$editorAPI2, _contentAreaRef$curre, _allowScrollGutter$gu, _allowScrollGutter$gu2;
267
- var theme = useTheme();
268
- var fullWidthMode = props.appearance === 'full-width';
269
- var maxWidthMode = props.appearance === 'max';
270
- var scrollContainerRef = useRef(null);
271
- var contentAreaRef = useRef(null);
272
- var containerRef = useRef(null);
273
- var allowScrollGutter = (_props$editorAPI = props.editorAPI) === null || _props$editorAPI === void 0 || (_props$editorAPI = _props$editorAPI.base) === null || _props$editorAPI === void 0 || (_props$editorAPI = _props$editorAPI.sharedState.currentState()) === null || _props$editorAPI === void 0 ? void 0 : _props$editorAPI.allowScrollGutter;
274
- var contentAreaMaxWidth = getTotalPadding() + (!fullWidthMode ? maxWidthMode ? akEditorUltraWideLayoutWidth : expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true) || expValEquals('platform_editor_core_static_css', 'isEnabled', true) ? akEditorDefaultLayoutWidth : theme.layoutMaxWidth : akEditorFullWidthLayoutWidth);
275
-
276
- // Get useStandardNodeWidth from block menu plugin shared state
277
- // Only access editorAPI when the experiment is enabled to avoid performance impact
278
- var useStandardNodeWidth = editorExperiment('platform_editor_controls', 'variant1') && ((_props$editorAPI$bloc = (_props$editorAPI2 = props.editorAPI) === null || _props$editorAPI2 === void 0 || (_props$editorAPI2 = _props$editorAPI2.blockMenu) === null || _props$editorAPI2 === void 0 || (_props$editorAPI2 = _props$editorAPI2.sharedState) === null || _props$editorAPI2 === void 0 || (_props$editorAPI2 = _props$editorAPI2.currentState()) === null || _props$editorAPI2 === void 0 ? void 0 : _props$editorAPI2.useStandardNodeWidth) !== null && _props$editorAPI$bloc !== void 0 ? _props$editorAPI$bloc : false);
279
- useImperativeHandle(ref, function () {
280
- return {
281
- get scrollContainer() {
282
- return scrollContainerRef.current;
283
- },
284
- get contentArea() {
285
- return contentAreaRef.current;
286
- },
287
- get containerArea() {
288
- return containerRef.current;
289
- }
290
- };
291
- }, []);
292
- var markdownPluginCurrentView = useSharedPluginStateWithSelector(props.editorAPI, ['markdownMode'], function (states) {
293
- var _states$markdownModeS;
294
- return (_states$markdownModeS = states.markdownModeState) === null || _states$markdownModeS === void 0 ? void 0 : _states$markdownModeS.view;
295
- });
296
- var markdownPluginCurrentIsMarkdownMode = useSharedPluginStateWithSelector(props.editorAPI, ['markdownMode'], function (states) {
297
- var _states$markdownModeS2;
298
- return (_states$markdownModeS2 = states.markdownModeState) === null || _states$markdownModeS2 === void 0 ? void 0 : _states$markdownModeS2.isMarkdownMode;
299
- });
300
- var isMarkdownModeExperimentEnabled = expValEqualsNoExposure('cc-markdown-mode', 'isEnabled', true);
301
- var shouldHideProseMirrorForMarkdownMode = isMarkdownModeExperimentEnabled && markdownPluginCurrentView !== 'preview' && markdownPluginCurrentIsMarkdownMode;
302
- var shouldHideScrollGutterForMarkdownMode = isMarkdownModeExperimentEnabled && markdownPluginCurrentIsMarkdownMode;
303
- var shouldUseMarkdownModeMvpLayout = shouldHideProseMirrorForMarkdownMode && fg('platform_editor_md_mvp_layout');
304
- return jsx("div", {
305
- css: [contentAreaNew, props.isEditorToolbarHidden && contentAreaHeightNoToolbar],
306
- "data-testid": CONTENT_AREA_TEST_ID,
307
- ref: containerRef
308
- }, jsx("div", {
309
- css: [
310
- // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
311
- contentAreaWrapper, shouldUseMarkdownModeMvpLayout && markdownModeContainerBackgroundStyle],
312
- "data-testid": EDITOR_CONTAINER,
313
- "data-editor-container": 'true'
314
- }, jsx(EditorContentContainer
315
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
316
- , {
317
- className: "fabric-editor-popup-scroll-parent",
318
- featureFlags: props.featureFlags,
319
- ref: scrollContainerRef,
320
- viewMode: props === null || props === void 0 ? void 0 : props.viewMode,
321
- isScrollable: true,
322
- appearance: props.appearance,
323
- contentMode: props.contentMode,
324
- useStandardNodeWidth: useStandardNodeWidth
325
- }, jsx(ClickAreaBlock, {
326
- editorView: props.editorView,
327
- editorDisabled: props.disabled
328
- }, jsx("div", {
329
- "data-markdown-mode-hide-prosemirror": shouldHideProseMirrorForMarkdownMode ? 'true' : undefined,
330
- "data-markdown-mode-hide-scroll-gutter": shouldHideScrollGutterForMarkdownMode ? 'true' : undefined,
331
- css: [editorContentAreaNew, editorContentAreaProsemirrorStyle,
332
- // EDITOR-6558: hide ProseMirror when the markdown-mode plugin
333
- // reports a non-WYSIWYG view.
334
- shouldHideProseMirrorForMarkdownMode && hideEditorContentAreaProsemirrorWithAttributeStyle, shouldHideScrollGutterForMarkdownMode && hideEditorContentAreaScrollGutterWithAttributeStyle, shouldUseMarkdownModeMvpLayout && markdownModeContentAreaStyle, tableFullPageEditorStylesNew, fullWidthNonChromelessBreakoutBlockTableStyle,
335
- // for breakout resizing, there's no need to restrict the width of codeblocks as they're always wrapped in a breakout mark
336
- expValEqualsNoExposure('platform_editor_breakout_resizing', 'isEnabled', true) ? editorContentAreaContainerStyleExcludeCodeBlockNew : editorContentAreaContainerStyleNew, fg('platform_editor_nested_dnd_styles_changes') && editorContentAreaContainerNestedDndStyle, !fg('platform_editor_controls_no_toolbar_space') && editorExperiment('platform_editor_controls', 'variant1') && contentAreaReducedHeaderSpace, !fg('platform_editor_controls_no_toolbar_space') && props.isEditorToolbarHidden && editorExperiment('platform_editor_controls', 'variant1') && contentAreaReservedPrimaryToolbarSpace],
337
- style: {
338
- '--ak-editor-content-area-max-width': "".concat(contentAreaMaxWidth, "px")
339
- }
340
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
341
- ,
342
- className: "ak-editor-content-area-region",
343
- "data-editor-editable-content": true,
344
- role: "region",
345
- "aria-label": props.intl.formatMessage(messages.editableContentLabel),
346
- ref: contentAreaRef,
347
- "data-vc": "editor-content-area-region"
348
- }, jsx("div", {
349
- css: [editorContentGutterStyles,
350
- // eslint-disable-next-line @atlaskit/platform/no-preconditioning
351
- fg('platform_editor_controls_increase_full_page_gutter') && editorExperiment('platform_editor_controls', 'variant1') && editorContentGutterStyleFG, editorExperiment('platform_editor_preview_panel_responsiveness', true, {
352
- exposure: true
353
- }) && editorContentReducedGutterStyles]
354
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
355
- ,
356
- className: classnames('ak-editor-content-area', 'appearance-full-page', {
357
- 'fabric-editor--full-width-mode': fullWidthMode,
358
- 'fabric-editor--max-width-mode': Boolean(maxWidthMode)
359
- }),
360
- ref: contentAreaRef
361
- }, !!props.customContentComponents && 'before' in props.customContentComponents ? contentComponentClickWrapper(props.customContentComponents.before) : contentComponentClickWrapper(props.customContentComponents), jsx(PluginSlot, {
362
- editorView: props.editorView,
363
- editorActions: props.editorActions,
364
- eventDispatcher: props.eventDispatcher,
365
- providerFactory: props.providerFactory,
366
- appearance: props.appearance,
367
- items: props.contentComponents,
368
- pluginHooks: props.pluginHooks,
369
- contentArea: (_contentAreaRef$curre = contentAreaRef.current) !== null && _contentAreaRef$curre !== void 0 ? _contentAreaRef$curre : undefined,
370
- popupsMountPoint: props.popupsMountPoint,
371
- popupsBoundariesElement: props.popupsBoundariesElement,
372
- popupsScrollableElement: props.popupsScrollableElement,
373
- disabled: !!props.disabled,
374
- containerElement: scrollContainerRef.current,
375
- dispatchAnalyticsEvent: props.dispatchAnalyticsEvent,
376
- wrapperElement: props.wrapperElement
377
- }), props.editorDOMElement, !!props.customContentComponents && 'after' in props.customContentComponents ? contentComponentClickWrapper(props.customContentComponents.after) : null, allowScrollGutter && (editorExperiment('platform_editor_blocks', true) ? jsx("div", {
378
- id: "editor-scroll-gutter",
379
- css: shouldHideScrollGutterForMarkdownMode && hideEditorScrollGutterStyle,
380
- style: {
381
- paddingBottom: "".concat((_allowScrollGutter$gu = allowScrollGutter.gutterSize) !== null && _allowScrollGutter$gu !== void 0 ? _allowScrollGutter$gu : '120', "px")
382
- },
383
- "data-vc": "scroll-gutter",
384
- "data-editor-scroll-gutter": "true"
385
- }) : jsx("div", {
386
- id: "editor-scroll-gutter",
387
- css: shouldHideScrollGutterForMarkdownMode && hideEditorScrollGutterStyle,
388
- style: {
389
- paddingBottom: "".concat((_allowScrollGutter$gu2 = allowScrollGutter.gutterSize) !== null && _allowScrollGutter$gu2 !== void 0 ? _allowScrollGutter$gu2 : '120', "px")
390
- },
391
- "data-vc": "scroll-gutter"
392
- }))))))), jsx("div", {
393
- css: sidebarArea
394
- }, props.contextPanel || jsx(ContextPanel, {
395
- editorAPI: props.editorAPI,
396
- visible: false
397
- })));
398
- });
399
-
400
- // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
401
- export var FullPageContentAreaEmotion = injectIntl(Content, {
402
- forwardRef: true
403
- });
@@ -1,30 +0,0 @@
1
- /**
2
- * @jsxRuntime classic
3
- * @jsx jsx
4
- */
5
- /**
6
- * Compiled branch of the `platform_editor_core_non_ecc_static_css` experiment.
7
- * Used via `componentWithCondition` in `Comment.tsx`.
8
- *
9
- * Cleanup: delete this file once the experiment has shipped.
10
- */
11
- import React from 'react';
12
- import type { OptionalPlugin } from '@atlaskit/editor-common/types';
13
- import type { BlockMenuPlugin } from '@atlaskit/editor-plugin-block-menu';
14
- import type { MaxContentSizePlugin } from '@atlaskit/editor-plugins/max-content-size';
15
- import type { MediaPlugin } from '@atlaskit/editor-plugins/media';
16
- import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugins/primary-toolbar';
17
- import type { ToolbarPlugin } from '@atlaskit/editor-plugins/toolbar';
18
- import type { EditorAppearanceComponentProps } from '../../../types/editor-appearance-component';
19
- type ComponentProps = EditorAppearanceComponentProps<[
20
- OptionalPlugin<MediaPlugin>,
21
- OptionalPlugin<MaxContentSizePlugin>,
22
- OptionalPlugin<PrimaryToolbarPlugin>,
23
- OptionalPlugin<ToolbarPlugin>,
24
- OptionalPlugin<BlockMenuPlugin>
25
- ]>;
26
- export declare const CommentEditorWithIntlCompiled: {
27
- (props: ComponentProps): React.JSX.Element;
28
- displayName: string;
29
- };
30
- export {};
@@ -1,20 +0,0 @@
1
- import { jsx } from '@emotion/react';
2
- import type { OptionalPlugin } from '@atlaskit/editor-common/types';
3
- import type { BlockMenuPlugin } from '@atlaskit/editor-plugin-block-menu';
4
- import type { MaxContentSizePlugin } from '@atlaskit/editor-plugins/max-content-size';
5
- import type { MediaPlugin } from '@atlaskit/editor-plugins/media';
6
- import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugins/primary-toolbar';
7
- import type { ToolbarPlugin } from '@atlaskit/editor-plugins/toolbar';
8
- import type { EditorAppearanceComponentProps } from '../../../types/editor-appearance-component';
9
- type ComponentProps = EditorAppearanceComponentProps<[
10
- OptionalPlugin<MediaPlugin>,
11
- OptionalPlugin<MaxContentSizePlugin>,
12
- OptionalPlugin<PrimaryToolbarPlugin>,
13
- OptionalPlugin<ToolbarPlugin>,
14
- OptionalPlugin<BlockMenuPlugin>
15
- ]>;
16
- export declare const CommentEditorWithIntlEmotion: {
17
- (props: ComponentProps): jsx.JSX.Element;
18
- displayName: string;
19
- };
20
- export {};
@@ -1,56 +0,0 @@
1
- /**
2
- * @jsxRuntime classic
3
- * @jsx jsx
4
- */
5
- import type { ReactElement } from 'react';
6
- import React from 'react';
7
- import type { WithIntlProps, WrappedComponentProps } from 'react-intl';
8
- import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
9
- import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
10
- import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
11
- import type { EditorAppearance, EditorContentMode, FeatureFlags, OptionalPlugin, PublicPluginAPI, ReactHookFactory, UIComponentFactory } from '@atlaskit/editor-common/types';
12
- import type { BasePlugin } from '@atlaskit/editor-plugins/base';
13
- import type { BlockMenuPlugin } from '@atlaskit/editor-plugins/block-menu';
14
- import type { ContextPanelPlugin } from '@atlaskit/editor-plugins/context-panel';
15
- import type { ViewMode } from '@atlaskit/editor-plugins/editor-viewmode';
16
- import type { EditorView } from '@atlaskit/editor-prosemirror/view';
17
- import type EditorActions from '../../../actions';
18
- import type { ContentComponents, ReactComponents } from '../../../types/editor-props';
19
- import type { MarkdownModePlugin } from '../../../types/markdown-mode';
20
- import type { ScrollContainerRefs } from './types';
21
- type EditorAPI = PublicPluginAPI<[
22
- OptionalPlugin<ContextPanelPlugin>,
23
- BasePlugin,
24
- OptionalPlugin<BlockMenuPlugin>,
25
- OptionalPlugin<MarkdownModePlugin>
26
- ]>;
27
- interface FullPageEditorContentAreaProps {
28
- appearance: EditorAppearance | undefined;
29
- contentComponents: UIComponentFactory[] | undefined;
30
- contentMode: EditorContentMode | undefined;
31
- contextPanel: ReactComponents | undefined;
32
- customContentComponents: ContentComponents | undefined;
33
- disabled: boolean | undefined;
34
- dispatchAnalyticsEvent: DispatchAnalyticsEvent | undefined;
35
- editorActions: EditorActions | undefined;
36
- editorAPI: EditorAPI | undefined;
37
- editorDOMElement: ReactElement;
38
- editorView: EditorView;
39
- eventDispatcher: EventDispatcher | undefined;
40
- featureFlags?: FeatureFlags;
41
- hasHadInteraction?: boolean;
42
- isEditorToolbarHidden?: boolean;
43
- pluginHooks: ReactHookFactory[] | undefined;
44
- popupsBoundariesElement: HTMLElement | undefined;
45
- popupsMountPoint: HTMLElement | undefined;
46
- popupsScrollableElement: HTMLElement | undefined;
47
- providerFactory: ProviderFactory;
48
- viewMode: ViewMode | undefined;
49
- wrapperElement: HTMLElement | null;
50
- }
51
- export declare const CONTENT_AREA_TEST_ID = "ak-editor-fp-content-area";
52
- export declare const EDITOR_CONTAINER = "ak-editor-container";
53
- export declare const FullPageContentAreaCompiled: React.ForwardRefExoticComponent<Omit<WithIntlProps<React.PropsWithChildren<FullPageEditorContentAreaProps & WrappedComponentProps & React.RefAttributes<ScrollContainerRefs>>>, 'ref'> & React.RefAttributes<any>> & {
54
- WrappedComponent: React.ComponentType<FullPageEditorContentAreaProps & WrappedComponentProps & React.RefAttributes<ScrollContainerRefs>>;
55
- };
56
- export {};
@@ -1,56 +0,0 @@
1
- /**
2
- * @jsxRuntime classic
3
- * @jsx jsx
4
- */
5
- import type { ReactElement } from 'react';
6
- import React from 'react';
7
- import type { WithIntlProps, WrappedComponentProps } from 'react-intl';
8
- import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
9
- import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
10
- import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
11
- import type { EditorAppearance, EditorContentMode, FeatureFlags, OptionalPlugin, PublicPluginAPI, ReactHookFactory, UIComponentFactory } from '@atlaskit/editor-common/types';
12
- import type { BasePlugin } from '@atlaskit/editor-plugins/base';
13
- import type { BlockMenuPlugin } from '@atlaskit/editor-plugins/block-menu';
14
- import type { ContextPanelPlugin } from '@atlaskit/editor-plugins/context-panel';
15
- import type { ViewMode } from '@atlaskit/editor-plugins/editor-viewmode';
16
- import type { EditorView } from '@atlaskit/editor-prosemirror/view';
17
- import type EditorActions from '../../../actions';
18
- import type { ContentComponents, ReactComponents } from '../../../types/editor-props';
19
- import type { MarkdownModePlugin } from '../../../types/markdown-mode';
20
- import type { ScrollContainerRefs } from './types';
21
- type EditorAPI = PublicPluginAPI<[
22
- OptionalPlugin<ContextPanelPlugin>,
23
- BasePlugin,
24
- OptionalPlugin<BlockMenuPlugin>,
25
- OptionalPlugin<MarkdownModePlugin>
26
- ]>;
27
- interface FullPageEditorContentAreaProps {
28
- appearance: EditorAppearance | undefined;
29
- contentComponents: UIComponentFactory[] | undefined;
30
- contentMode: EditorContentMode | undefined;
31
- contextPanel: ReactComponents | undefined;
32
- customContentComponents: ContentComponents | undefined;
33
- disabled: boolean | undefined;
34
- dispatchAnalyticsEvent: DispatchAnalyticsEvent | undefined;
35
- editorActions: EditorActions | undefined;
36
- editorAPI: EditorAPI | undefined;
37
- editorDOMElement: ReactElement;
38
- editorView: EditorView;
39
- eventDispatcher: EventDispatcher | undefined;
40
- featureFlags?: FeatureFlags;
41
- hasHadInteraction?: boolean;
42
- isEditorToolbarHidden?: boolean;
43
- pluginHooks: ReactHookFactory[] | undefined;
44
- popupsBoundariesElement: HTMLElement | undefined;
45
- popupsMountPoint: HTMLElement | undefined;
46
- popupsScrollableElement: HTMLElement | undefined;
47
- providerFactory: ProviderFactory;
48
- viewMode: ViewMode | undefined;
49
- wrapperElement: HTMLElement | null;
50
- }
51
- export declare const CONTENT_AREA_TEST_ID = "ak-editor-fp-content-area";
52
- export declare const EDITOR_CONTAINER = "ak-editor-container";
53
- export declare const FullPageContentAreaEmotion: React.ForwardRefExoticComponent<Omit<WithIntlProps<React.PropsWithChildren<FullPageEditorContentAreaProps & WrappedComponentProps & React.RefAttributes<ScrollContainerRefs>>>, 'ref'> & React.RefAttributes<any>> & {
54
- WrappedComponent: React.ComponentType<FullPageEditorContentAreaProps & WrappedComponentProps & React.RefAttributes<ScrollContainerRefs>>;
55
- };
56
- export {};