@atlaskit/editor-core 212.0.0 → 212.0.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 (28) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/ui/Appearance/Chromeless.js +5 -66
  3. package/dist/cjs/ui/Appearance/Comment/Comment.js +1 -32
  4. package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js +2 -25
  5. package/dist/cjs/ui/ContentStyles/index.js +6 -4
  6. package/dist/cjs/ui/Toolbar/ToolbarWithSizeDetector.js +2 -2
  7. package/dist/cjs/version-wrapper.js +1 -1
  8. package/dist/es2019/index.js +8 -1
  9. package/dist/es2019/ui/Appearance/Chromeless.js +3 -62
  10. package/dist/es2019/ui/Appearance/Comment/Comment.js +1 -30
  11. package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js +1 -22
  12. package/dist/es2019/ui/ContentStyles/index.js +6 -4
  13. package/dist/es2019/ui/Toolbar/ToolbarWithSizeDetector.js +2 -2
  14. package/dist/es2019/version-wrapper.js +1 -1
  15. package/dist/esm/index.js +8 -1
  16. package/dist/esm/ui/Appearance/Chromeless.js +3 -65
  17. package/dist/esm/ui/Appearance/Comment/Comment.js +1 -32
  18. package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js +1 -24
  19. package/dist/esm/ui/ContentStyles/index.js +6 -4
  20. package/dist/esm/ui/Toolbar/ToolbarWithSizeDetector.js +2 -2
  21. package/dist/esm/version-wrapper.js +1 -1
  22. package/dist/types/index.d.ts +7 -1
  23. package/dist/types/ui/Appearance/Chromeless.d.ts +2 -11
  24. package/dist/types/ui/Appearance/FullPage/FullPageContentArea.d.ts +0 -10
  25. package/dist/types-ts4.5/index.d.ts +7 -1
  26. package/dist/types-ts4.5/ui/Appearance/Chromeless.d.ts +2 -11
  27. package/dist/types-ts4.5/ui/Appearance/FullPage/FullPageContentArea.d.ts +0 -10
  28. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-core
2
2
 
3
+ ## 212.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`88eddbfa8aadd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/88eddbfa8aadd) -
8
+ clean up FF of static emotion for editor
9
+ - Updated dependencies
10
+
3
11
  ## 212.0.0
4
12
 
5
13
  ### Patch Changes
@@ -5,7 +5,8 @@ var _typeof = require("@babel/runtime/helpers/typeof");
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.default = exports.ContentArea = exports.ChromelessEditorContainer = void 0;
8
+ exports.ChromelessEditorContainer = ChromelessEditorContainer;
9
+ exports.default = void 0;
9
10
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
10
11
  var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
11
12
  var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
@@ -15,12 +16,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
15
16
  var _react = _interopRequireWildcard(require("react"));
16
17
  var _react2 = require("@emotion/react");
17
18
  var _hooks = require("@atlaskit/editor-common/hooks");
18
- var _scrollbar = require("@atlaskit/editor-shared-styles/scrollbar");
19
19
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
20
- var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
21
- var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
22
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
23
- var _ContentStyles = require("../ContentStyles");
24
20
  var _EditorContentContainer = _interopRequireDefault(require("../EditorContentContainer/EditorContentContainer"));
25
21
  var _PluginSlot = _interopRequireDefault(require("../PluginSlot"));
26
22
  var _WithFlash = _interopRequireDefault(require("../WithFlash"));
@@ -50,30 +46,6 @@ var scrollbarStylesNew = (0, _react2.css)({
50
46
  backgroundColor: "var(--ds-background-neutral-bold-hovered, #2C3E5D)"
51
47
  }
52
48
  });
53
- var chromelessEditorStyles = (0, _react2.css)({
54
- // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
55
- lineHeight: '20px',
56
- height: 'auto',
57
- overflowX: 'hidden',
58
- overflowY: 'auto'
59
- },
60
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
61
- _scrollbar.scrollbarStyles, {
62
- maxWidth: 'inherit',
63
- boxSizing: 'border-box',
64
- wordWrap: 'break-word',
65
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
66
- 'div > .ProseMirror': {
67
- outline: 'none',
68
- whiteSpace: 'pre-wrap',
69
- padding: 0,
70
- margin: 0,
71
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
72
- '& > :last-child': {
73
- paddingBottom: "var(--ds-space-100, 0.5em)"
74
- }
75
- }
76
- });
77
49
  var chromelessEditorStylesNew = (0, _react2.css)({
78
50
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
79
51
  lineHeight: '20px',
@@ -104,14 +76,6 @@ var extraSpaceLastLineFix = (0, _react2.css)({
104
76
  }
105
77
  }
106
78
  });
107
- var ContentArea = exports.ContentArea = (0, _ContentStyles.createEditorContentStyle)();
108
- ContentArea.displayName = 'ContentArea';
109
- var EditorContainer = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
110
- return (0, _experiments.editorExperiment)('platform_editor_core_static_emotion', true, {
111
- exposure: true
112
- });
113
- }, _EditorContentContainer.default, ContentArea);
114
-
115
79
  /**
116
80
  * Render the editor in a chromeless appearance.
117
81
  * Example use is the inline comment editor, which doesn't have editor toolbar
@@ -161,7 +125,7 @@ var Editor = exports.default = /*#__PURE__*/function (_React$Component) {
161
125
  containerRef: function containerRef(ref) {
162
126
  return _this.containerElement = ref;
163
127
  }
164
- }, (0, _react2.jsx)(EditorContainer
128
+ }, (0, _react2.jsx)(_EditorContentContainer.default
165
129
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
166
130
  , {
167
131
  className: "ak-editor-content-area",
@@ -213,7 +177,7 @@ function RenderWithPluginState(_ref2) {
213
177
  maxContentSize: maxContentSize
214
178
  }));
215
179
  }
216
- function ChromelessEditorContainerNext(_ref3) {
180
+ function ChromelessEditorContainer(_ref3) {
217
181
  var maxHeight = _ref3.maxHeight,
218
182
  minHeight = _ref3.minHeight,
219
183
  children = _ref3.children,
@@ -228,29 +192,4 @@ function ChromelessEditorContainerNext(_ref3) {
228
192
  id: "chromeless-editor",
229
193
  ref: containerRef
230
194
  }, children);
231
- }
232
- function ChromelessEditorContainerOld(_ref4) {
233
- var maxHeight = _ref4.maxHeight,
234
- minHeight = _ref4.minHeight,
235
- children = _ref4.children,
236
- containerRef = _ref4.containerRef;
237
- return (0, _react2.jsx)("div", {
238
- css: [chromelessEditorStyles, maxHeight &&
239
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
240
- (0, _react2.css)({
241
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
242
- maxHeight: "".concat(maxHeight, "px")
243
- }),
244
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
245
- (0, _react2.css)({
246
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
247
- minHeight: "".concat(minHeight, "px")
248
- }), (0, _platformFeatureFlags.fg)('platform_fix_extra_space_last_line_comment_editor') && extraSpaceLastLineFix],
249
- "data-testid": "chromeless-editor",
250
- id: "chromeless-editor",
251
- ref: containerRef
252
- }, children);
253
- }
254
- var ChromelessEditorContainer = exports.ChromelessEditorContainer = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
255
- return (0, _expValEquals.expValEquals)('platform_editor_core_static_emotion', 'isEnabled', true);
256
- }, ChromelessEditorContainerNext, ChromelessEditorContainerOld);
195
+ }
@@ -17,17 +17,13 @@ var _buttonGroup = _interopRequireDefault(require("@atlaskit/button/button-group
17
17
  var _new = _interopRequireDefault(require("@atlaskit/button/new"));
18
18
  var _hooks = require("@atlaskit/editor-common/hooks");
19
19
  var _messages = _interopRequireDefault(require("@atlaskit/editor-common/messages"));
20
- var _styles = require("@atlaskit/editor-common/styles");
21
20
  var _ui = require("@atlaskit/editor-common/ui");
22
21
  var _uiMenu = require("@atlaskit/editor-common/ui-menu");
23
- var _commonStyles = require("@atlaskit/editor-plugins/table/ui/common-styles");
24
22
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
25
- var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
26
23
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
27
24
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
28
25
  var _ClickAreaBlock = _interopRequireDefault(require("../../Addon/ClickAreaBlock"));
29
26
  var _contentComponentWrapper = require("../../Addon/ClickAreaBlock/contentComponentWrapper");
30
- var _ContentStyles = require("../../ContentStyles");
31
27
  var _EditorContentContainer = _interopRequireDefault(require("../../EditorContentContainer/EditorContentContainer"));
32
28
  var _PluginSlot = _interopRequireDefault(require("../../PluginSlot"));
33
29
  var _getPrimaryToolbarComponents = require("../../Toolbar/getPrimaryToolbarComponents");
@@ -44,7 +40,6 @@ var _templateObject;
44
40
  // Ignored via go/ees005
45
41
  // eslint-disable-next-line import/no-named-as-default
46
42
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
47
- var CommentEditorMargin = 14;
48
43
  var MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = 490;
49
44
  var commentEditorStyles = (0, _react2.css)({
50
45
  display: 'flex',
@@ -63,27 +58,6 @@ var commentEditorStyles = (0, _react2.css)({
63
58
  maxWidth: 'inherit',
64
59
  wordWrap: 'break-word'
65
60
  });
66
- var ContentArea = (0, _ContentStyles.createEditorContentStyle)((0, _react2.css)({
67
- flexGrow: 1,
68
- overflowX: 'clip',
69
- // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
70
- lineHeight: '24px',
71
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
72
- '.ProseMirror': {
73
- margin: "var(--ds-space-150, 12px)"
74
- },
75
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
76
- '.gridParent': {
77
- marginLeft: "var(--ds-space-025, 2px)",
78
- marginRight: "var(--ds-space-025, 2px)",
79
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
80
- width: "calc(100% + ".concat(CommentEditorMargin - _styles.GRID_GUTTER, "px)")
81
- },
82
- padding: "var(--ds-space-250, 20px)"
83
- },
84
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
85
- _commonStyles.tableCommentEditorStyles));
86
- ContentArea.displayName = 'ContentArea';
87
61
  var secondaryToolbarStyles = (0, _react2.css)({
88
62
  boxSizing: 'border-box',
89
63
  justifyContent: 'flex-end',
@@ -113,11 +87,6 @@ var mainToolbarCustomComponentsSlotStyleTwoLineToolbarNew = (0, _react2.css)((0,
113
87
  paddingRight: 0
114
88
  }));
115
89
  var appearance = 'comment';
116
- var EditorContainer = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
117
- return (0, _experiments.editorExperiment)('platform_editor_core_static_emotion', true, {
118
- exposure: true
119
- });
120
- }, _EditorContentContainer.default, ContentArea);
121
90
  var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEditorWithIntl(props) {
122
91
  var editorAPI = props.editorAPI;
123
92
  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(editorAPI, ['maxContentSize', 'primaryToolbar', 'editorViewMode'], function (states) {
@@ -268,7 +237,7 @@ var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEdit
268
237
  editorDisabled: disabled
269
238
  }, (0, _react2.jsx)(_ui.WidthConsumer, null, function (_ref) {
270
239
  var width = _ref.width;
271
- return (0, _react2.jsx)(EditorContainer, {
240
+ return (0, _react2.jsx)(_EditorContentContainer.default, {
272
241
  ref: containerElement,
273
242
  css: [maxHeight ?
274
243
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.ScrollContainer = exports.FullPageContentArea = exports.EDITOR_CONTAINER = exports.CONTENT_AREA_TEST_ID = void 0;
8
+ exports.FullPageContentArea = exports.EDITOR_CONTAINER = exports.CONTENT_AREA_TEST_ID = void 0;
9
9
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
10
  var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
11
11
  var _react = _interopRequireWildcard(require("react"));
@@ -16,15 +16,12 @@ var _adfSchema = require("@atlaskit/adf-schema");
16
16
  var _messages = require("@atlaskit/editor-common/messages");
17
17
  var _commonStyles = require("@atlaskit/editor-plugins/table/ui/common-styles");
18
18
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
19
- var _scrollbar = require("@atlaskit/editor-shared-styles/scrollbar");
20
19
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
21
- var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
22
20
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
23
21
  var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
24
22
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
25
23
  var _ClickAreaBlock = _interopRequireDefault(require("../../Addon/ClickAreaBlock"));
26
24
  var _contentComponentWrapper = require("../../Addon/ClickAreaBlock/contentComponentWrapper");
27
- var _ContentStyles = require("../../ContentStyles");
28
25
  var _ContextPanel = require("../../ContextPanel");
29
26
  var _EditorContentContainer = _interopRequireDefault(require("../../EditorContentContainer/EditorContentContainer"));
30
27
  var _PluginSlot = _interopRequireDefault(require("../../PluginSlot"));
@@ -331,26 +328,6 @@ var contentAreaHeightNoToolbar = (0, _react2.css)({
331
328
  });
332
329
  var CONTENT_AREA_TEST_ID = exports.CONTENT_AREA_TEST_ID = 'ak-editor-fp-content-area';
333
330
  var EDITOR_CONTAINER = exports.EDITOR_CONTAINER = 'ak-editor-container';
334
- var scrollStyles = (0, _react2.css)({
335
- flexGrow: 1,
336
- height: '100%',
337
- overflowY: 'scroll',
338
- position: 'relative',
339
- display: 'flex',
340
- flexDirection: 'column',
341
- scrollBehavior: 'smooth'
342
- },
343
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
344
- _scrollbar.scrollbarStyles);
345
-
346
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
347
- var ScrollContainer = exports.ScrollContainer = (0, _ContentStyles.createEditorContentStyle)(scrollStyles);
348
- ScrollContainer.displayName = 'ScrollContainer';
349
- var EditorContainer = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
350
- return (0, _experiments.editorExperiment)('platform_editor_core_static_emotion', true, {
351
- exposure: true
352
- });
353
- }, _EditorContentContainer.default, ScrollContainer);
354
331
  var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
355
332
  var _contentAreaRef$curre;
356
333
  var theme = (0, _react2.useTheme)();
@@ -395,7 +372,7 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
395
372
  _StyledComponents.contentAreaWrapper,
396
373
  "data-testid": EDITOR_CONTAINER,
397
374
  "data-editor-container": 'true'
398
- }, (0, _react2.jsx)(EditorContainer
375
+ }, (0, _react2.jsx)(_EditorContentContainer.default
399
376
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
400
377
  , {
401
378
  className: "fabric-editor-popup-scroll-parent",
@@ -164,10 +164,12 @@ var firstFloatingToolbarButtonStyles = (0, _react2.css)({
164
164
  // The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
165
165
  var akEditorBreakpointForSmallDevice = "1266px";
166
166
 
167
- // We are going to deprecate this in near future
168
- // Currently, we are migrating content styles in packages/editor/editor-core/src/ui/EditorContentContainer.tsx
169
- // Under editor experiment platform_editor_core_static_emotion
170
- // If you are making changes to this file, please make sure to update in EditorContentContainer.tsx as well
167
+ // eslint-disable-next-line @repo/internal/deprecations/deprecation-ticket-required
168
+ /**
169
+ * @deprecated
170
+ * DO NOT USE THIS WILL BE REMOVED SOON.
171
+ * use this instead: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
172
+ */
171
173
  var legacyContentStyles = function legacyContentStyles(props) {
172
174
  return (0, _react2.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: ", "px;\n\t--ak-editor--resizer-handle-spacing: 12px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-padding)\n\t);\n\t--ak-editor--breakout-min-width: 100%;\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\n\t\t--ak-editor--breakout-min-width: 0px;\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t", "\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t */\n\t.ProseMirror-hideselection {\n\t\tcaret-color: transparent;\n\t}\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n /* Switch between the two icons based on the visual refresh feature gate */\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n\n .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t/* For FullPage only when inside a table\n\tRelated code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\tIn the \"editorContentAreaContainerStyle\" function */\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), _editorSharedStyles.akEditorGutterPadding, (0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), _editorSharedStyles.akEditorDefaultLayoutWidth, _editorSharedStyles.akEditorFullWidthLayoutWidth, _editorSharedStyles.akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, _editorSharedStyles.akEditorCalculatedWideLayoutWidth, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? (0, _react2.css)(_templateObject1 || (_templateObject1 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t\t\t\t@container editor-area (max-width: ", "px) {\n\t\t\t\t\t--ak-editor--large-gutter-padding: ", "px;\n\t\t\t\t}\n\t\t\t"])), _editorSharedStyles.akEditorFullPageNarrowBreakout, _editorSharedStyles.akEditorGutterPaddingReduced) : null, (0, _editorSharedStyles.editorFontSize)({
173
175
  theme: props.theme
@@ -29,7 +29,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
29
29
 
30
30
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
31
31
 
32
- // Remove when platform_editor_core_static_emotion is cleaned up
32
+ // Remove when platform_editor_core_static_emotion_non_central is cleaned up
33
33
  var toolbar = (0, _react2.css)((0, _defineProperty2.default)({
34
34
  width: '100%',
35
35
  position: 'relative'
@@ -40,7 +40,7 @@ var toolbar = (0, _react2.css)((0, _defineProperty2.default)({
40
40
  margin: "0 ".concat("var(--ds-space-200, 16px)")
41
41
  }));
42
42
 
43
- // Rename to toolbar when platform_editor_core_static_emotion is cleaned up
43
+ // Rename to toolbar when platform_editor_core_static_emotion_non_central is cleaned up
44
44
  var staticToolbar = (0, _react2.css)({
45
45
  width: '100%',
46
46
  position: 'relative'
@@ -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 = "211.2.11";
8
+ var version = exports.version = "212.0.0";
@@ -36,6 +36,13 @@ export { getNodesCount } from './utils/getNodesCount';
36
36
  export { default as measurements } from './utils/performance/measure-enum';
37
37
  export { createFeatureFlagsFromProps } from './utils/feature-flags-from-props';
38
38
  export { default as EditorActions } from './actions';
39
- export { createEditorContentStyle } from './ui/ContentStyles';
39
+ export {
40
+ // eslint-disable-next-line @repo/internal/deprecations/deprecation-ticket-required
41
+ /**
42
+ * @deprecated
43
+ * DO NOT USE THIS WILL BE REMOVED SOON.
44
+ * use this instead: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
45
+ */
46
+ createEditorContentStyle } from './ui/ContentStyles';
40
47
  export { getDefaultPresetOptionsFromEditorProps } from './create-editor/create-plugins-list';
41
48
  export { ReactEditorView } from './create-editor/ReactEditorView';
@@ -8,12 +8,7 @@ import React, { Fragment } from 'react';
8
8
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
9
9
  import { css, jsx } from '@emotion/react';
10
10
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
11
- import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
12
11
  import { fg } from '@atlaskit/platform-feature-flags';
13
- import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
14
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
15
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
16
- import { createEditorContentStyle } from '../ContentStyles';
17
12
  import EditorContentContainer from '../EditorContentContainer/EditorContentContainer';
18
13
  import PluginSlot from '../PluginSlot';
19
14
  import WithFlash from '../WithFlash';
@@ -37,30 +32,6 @@ const scrollbarStylesNew = css({
37
32
  backgroundColor: "var(--ds-background-neutral-bold-hovered, #2C3E5D)"
38
33
  }
39
34
  });
40
- const chromelessEditorStyles = css({
41
- // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
42
- lineHeight: '20px',
43
- height: 'auto',
44
- overflowX: 'hidden',
45
- overflowY: 'auto'
46
- },
47
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
48
- scrollbarStyles, {
49
- maxWidth: 'inherit',
50
- boxSizing: 'border-box',
51
- wordWrap: 'break-word',
52
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
53
- 'div > .ProseMirror': {
54
- outline: 'none',
55
- whiteSpace: 'pre-wrap',
56
- padding: 0,
57
- margin: 0,
58
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
59
- '& > :last-child': {
60
- paddingBottom: "var(--ds-space-100, 0.5em)"
61
- }
62
- }
63
- });
64
35
  const chromelessEditorStylesNew = css({
65
36
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
66
37
  lineHeight: '20px',
@@ -91,12 +62,6 @@ const extraSpaceLastLineFix = css({
91
62
  }
92
63
  }
93
64
  });
94
- export const ContentArea = createEditorContentStyle();
95
- ContentArea.displayName = 'ContentArea';
96
- const EditorContainer = componentWithCondition(() => editorExperiment('platform_editor_core_static_emotion', true, {
97
- exposure: true
98
- }), EditorContentContainer, ContentArea);
99
-
100
65
  /**
101
66
  * Render the editor in a chromeless appearance.
102
67
  * Example use is the inline comment editor, which doesn't have editor toolbar
@@ -140,7 +105,7 @@ export default class Editor extends React.Component {
140
105
  maxHeight: maxHeight,
141
106
  minHeight: minHeight,
142
107
  containerRef: ref => this.containerElement = ref
143
- }, jsx(EditorContainer
108
+ }, jsx(EditorContentContainer
144
109
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
145
110
  , {
146
111
  className: "ak-editor-content-area",
@@ -188,7 +153,7 @@ function RenderWithPluginState({
188
153
  maxContentSize
189
154
  }));
190
155
  }
191
- function ChromelessEditorContainerNext({
156
+ export function ChromelessEditorContainer({
192
157
  maxHeight,
193
158
  minHeight,
194
159
  children,
@@ -204,28 +169,4 @@ function ChromelessEditorContainerNext({
204
169
  id: "chromeless-editor",
205
170
  ref: containerRef
206
171
  }, children);
207
- }
208
- function ChromelessEditorContainerOld({
209
- maxHeight,
210
- minHeight,
211
- children,
212
- containerRef
213
- }) {
214
- return jsx("div", {
215
- css: [chromelessEditorStyles, maxHeight &&
216
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
217
- css({
218
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
219
- maxHeight: `${maxHeight}px`
220
- }),
221
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
222
- css({
223
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
224
- minHeight: `${minHeight}px`
225
- }), fg('platform_fix_extra_space_last_line_comment_editor') && extraSpaceLastLineFix],
226
- "data-testid": "chromeless-editor",
227
- id: "chromeless-editor",
228
- ref: containerRef
229
- }, children);
230
- }
231
- export const ChromelessEditorContainer = componentWithCondition(() => expValEquals('platform_editor_core_static_emotion', 'isEnabled', true), ChromelessEditorContainerNext, ChromelessEditorContainerOld);
172
+ }
@@ -12,19 +12,15 @@ import ButtonGroup from '@atlaskit/button/button-group';
12
12
  import Button from '@atlaskit/button/new';
13
13
  import { useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
14
14
  import messages from '@atlaskit/editor-common/messages';
15
- import { GRID_GUTTER } from '@atlaskit/editor-common/styles';
16
15
  import { WidthConsumer, WidthProvider } from '@atlaskit/editor-common/ui';
17
16
  import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
18
- import { tableCommentEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
19
17
  import { akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
20
- import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
21
18
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
22
19
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
23
20
  // Ignored via go/ees005
24
21
  // eslint-disable-next-line import/no-named-as-default
25
22
  import ClickAreaBlock from '../../Addon/ClickAreaBlock';
26
23
  import { contentComponentClickWrapper } from '../../Addon/ClickAreaBlock/contentComponentWrapper';
27
- import { createEditorContentStyle } from '../../ContentStyles';
28
24
  import EditorContentContainer from '../../EditorContentContainer/EditorContentContainer';
29
25
  import PluginSlot from '../../PluginSlot';
30
26
  import { getPrimaryToolbarComponents } from '../../Toolbar/getPrimaryToolbarComponents';
@@ -32,7 +28,6 @@ import { ToolbarWithSizeDetector as Toolbar } from '../../Toolbar/ToolbarWithSiz
32
28
  import WithFlash from '../../WithFlash';
33
29
  import { CommentToolbar } from './CommentToolbar';
34
30
  import { MainToolbar } from './Toolbar';
35
- const CommentEditorMargin = 14;
36
31
  const MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = 490;
37
32
  const commentEditorStyles = css({
38
33
  display: 'flex',
@@ -51,27 +46,6 @@ const commentEditorStyles = css({
51
46
  maxWidth: 'inherit',
52
47
  wordWrap: 'break-word'
53
48
  });
54
- const ContentArea = createEditorContentStyle(css({
55
- flexGrow: 1,
56
- overflowX: 'clip',
57
- // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
58
- lineHeight: '24px',
59
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
60
- '.ProseMirror': {
61
- margin: "var(--ds-space-150, 12px)"
62
- },
63
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
64
- '.gridParent': {
65
- marginLeft: "var(--ds-space-025, 2px)",
66
- marginRight: "var(--ds-space-025, 2px)",
67
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
68
- width: `calc(100% + ${CommentEditorMargin - GRID_GUTTER}px)`
69
- },
70
- padding: "var(--ds-space-250, 20px)"
71
- },
72
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
73
- tableCommentEditorStyles));
74
- ContentArea.displayName = 'ContentArea';
75
49
  const secondaryToolbarStyles = css({
76
50
  boxSizing: 'border-box',
77
51
  justifyContent: 'flex-end',
@@ -118,9 +92,6 @@ const mainToolbarCustomComponentsSlotStyleTwoLineToolbarNew = css({
118
92
  }
119
93
  });
120
94
  const appearance = 'comment';
121
- const EditorContainer = componentWithCondition(() => editorExperiment('platform_editor_core_static_emotion', true, {
122
- exposure: true
123
- }), EditorContentContainer, ContentArea);
124
95
  export const CommentEditorWithIntl = props => {
125
96
  const {
126
97
  editorAPI
@@ -270,7 +241,7 @@ export const CommentEditorWithIntl = props => {
270
241
  }, jsx(WidthConsumer, null, ({
271
242
  width
272
243
  }) => {
273
- return jsx(EditorContainer, {
244
+ return jsx(EditorContentContainer, {
274
245
  ref: containerElement,
275
246
  css: [maxHeight ?
276
247
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -13,9 +13,7 @@ import { decisionListSelector, taskListSelector } from '@atlaskit/adf-schema';
13
13
  import { fullPageMessages as messages } from '@atlaskit/editor-common/messages';
14
14
  import { tableFullPageEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
15
15
  import { FULL_PAGE_EDITOR_TOOLBAR_HEIGHT, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
16
- import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
17
16
  import { fg } from '@atlaskit/platform-feature-flags';
18
- import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
19
17
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
20
18
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
21
19
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -23,7 +21,6 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
23
21
  // eslint-disable-next-line import/no-named-as-default
24
22
  import ClickAreaBlock from '../../Addon/ClickAreaBlock';
25
23
  import { contentComponentClickWrapper } from '../../Addon/ClickAreaBlock/contentComponentWrapper';
26
- import { createEditorContentStyle } from '../../ContentStyles';
27
24
  import { ContextPanel } from '../../ContextPanel';
28
25
  import EditorContentContainer from '../../EditorContentContainer/EditorContentContainer';
29
26
  import PluginSlot from '../../PluginSlot';
@@ -319,24 +316,6 @@ const contentAreaHeightNoToolbar = css({
319
316
  });
320
317
  export const CONTENT_AREA_TEST_ID = 'ak-editor-fp-content-area';
321
318
  export const EDITOR_CONTAINER = 'ak-editor-container';
322
- const scrollStyles = css({
323
- flexGrow: 1,
324
- height: '100%',
325
- overflowY: 'scroll',
326
- position: 'relative',
327
- display: 'flex',
328
- flexDirection: 'column',
329
- scrollBehavior: 'smooth'
330
- },
331
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
332
- scrollbarStyles);
333
-
334
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
335
- export const ScrollContainer = createEditorContentStyle(scrollStyles);
336
- ScrollContainer.displayName = 'ScrollContainer';
337
- const EditorContainer = componentWithCondition(() => editorExperiment('platform_editor_core_static_emotion', true, {
338
- exposure: true
339
- }), EditorContentContainer, ScrollContainer);
340
319
  const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
341
320
  var _contentAreaRef$curre;
342
321
  const theme = useTheme();
@@ -379,7 +358,7 @@ const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
379
358
  contentAreaWrapper,
380
359
  "data-testid": EDITOR_CONTAINER,
381
360
  "data-editor-container": 'true'
382
- }, jsx(EditorContainer
361
+ }, jsx(EditorContentContainer
383
362
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
384
363
  , {
385
364
  className: "fabric-editor-popup-scroll-parent",
@@ -326,10 +326,12 @@ const firstFloatingToolbarButtonStyles = css({
326
326
  // The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
327
327
  const akEditorBreakpointForSmallDevice = `1266px`;
328
328
 
329
- // We are going to deprecate this in near future
330
- // Currently, we are migrating content styles in packages/editor/editor-core/src/ui/EditorContentContainer.tsx
331
- // Under editor experiment platform_editor_core_static_emotion
332
- // If you are making changes to this file, please make sure to update in EditorContentContainer.tsx as well
329
+ // eslint-disable-next-line @repo/internal/deprecations/deprecation-ticket-required
330
+ /**
331
+ * @deprecated
332
+ * DO NOT USE THIS WILL BE REMOVED SOON.
333
+ * use this instead: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
334
+ */
333
335
  const legacyContentStyles = props => css`
334
336
  --ak-editor--default-gutter-padding: ${akEditorGutterPadding}px;
335
337
  /* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */
@@ -17,7 +17,7 @@ import { isFullPage } from '../../utils/is-full-page';
17
17
  import { useElementWidth } from './hooks';
18
18
  import { Toolbar } from './Toolbar';
19
19
  import { toolbarSizeToWidth, widthToToolbarSize } from './toolbar-size';
20
- // Remove when platform_editor_core_static_emotion is cleaned up
20
+ // Remove when platform_editor_core_static_emotion_non_central is cleaned up
21
21
  const toolbar = css({
22
22
  width: '100%',
23
23
  position: 'relative',
@@ -30,7 +30,7 @@ const toolbar = css({
30
30
  }
31
31
  });
32
32
 
33
- // Rename to toolbar when platform_editor_core_static_emotion is cleaned up
33
+ // Rename to toolbar when platform_editor_core_static_emotion_non_central is cleaned up
34
34
  const staticToolbar = css({
35
35
  width: '100%',
36
36
  position: 'relative'
@@ -1,2 +1,2 @@
1
1
  export const name = "@atlaskit/editor-core";
2
- export const version = "211.2.11";
2
+ export const version = "212.0.0";
package/dist/esm/index.js CHANGED
@@ -36,6 +36,13 @@ export { getNodesCount } from './utils/getNodesCount';
36
36
  export { default as measurements } from './utils/performance/measure-enum';
37
37
  export { createFeatureFlagsFromProps } from './utils/feature-flags-from-props';
38
38
  export { default as EditorActions } from './actions';
39
- export { createEditorContentStyle } from './ui/ContentStyles';
39
+ export {
40
+ // eslint-disable-next-line @repo/internal/deprecations/deprecation-ticket-required
41
+ /**
42
+ * @deprecated
43
+ * DO NOT USE THIS WILL BE REMOVED SOON.
44
+ * use this instead: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
45
+ */
46
+ createEditorContentStyle } from './ui/ContentStyles';
40
47
  export { getDefaultPresetOptionsFromEditorProps } from './create-editor/create-plugins-list';
41
48
  export { ReactEditorView } from './create-editor/ReactEditorView';
@@ -15,12 +15,7 @@ import React, { Fragment } 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 { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
18
- import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
19
18
  import { fg } from '@atlaskit/platform-feature-flags';
20
- import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
21
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
22
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
23
- import { createEditorContentStyle } from '../ContentStyles';
24
19
  import EditorContentContainer from '../EditorContentContainer/EditorContentContainer';
25
20
  import PluginSlot from '../PluginSlot';
26
21
  import WithFlash from '../WithFlash';
@@ -44,30 +39,6 @@ var scrollbarStylesNew = css({
44
39
  backgroundColor: "var(--ds-background-neutral-bold-hovered, #2C3E5D)"
45
40
  }
46
41
  });
47
- var chromelessEditorStyles = css({
48
- // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
49
- lineHeight: '20px',
50
- height: 'auto',
51
- overflowX: 'hidden',
52
- overflowY: 'auto'
53
- },
54
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
55
- scrollbarStyles, {
56
- maxWidth: 'inherit',
57
- boxSizing: 'border-box',
58
- wordWrap: 'break-word',
59
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
60
- 'div > .ProseMirror': {
61
- outline: 'none',
62
- whiteSpace: 'pre-wrap',
63
- padding: 0,
64
- margin: 0,
65
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
66
- '& > :last-child': {
67
- paddingBottom: "var(--ds-space-100, 0.5em)"
68
- }
69
- }
70
- });
71
42
  var chromelessEditorStylesNew = css({
72
43
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
73
44
  lineHeight: '20px',
@@ -98,14 +69,6 @@ var extraSpaceLastLineFix = css({
98
69
  }
99
70
  }
100
71
  });
101
- export var ContentArea = createEditorContentStyle();
102
- ContentArea.displayName = 'ContentArea';
103
- var EditorContainer = componentWithCondition(function () {
104
- return editorExperiment('platform_editor_core_static_emotion', true, {
105
- exposure: true
106
- });
107
- }, EditorContentContainer, ContentArea);
108
-
109
72
  /**
110
73
  * Render the editor in a chromeless appearance.
111
74
  * Example use is the inline comment editor, which doesn't have editor toolbar
@@ -155,7 +118,7 @@ var Editor = /*#__PURE__*/function (_React$Component) {
155
118
  containerRef: function containerRef(ref) {
156
119
  return _this.containerElement = ref;
157
120
  }
158
- }, jsx(EditorContainer
121
+ }, jsx(EditorContentContainer
159
122
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
160
123
  , {
161
124
  className: "ak-editor-content-area",
@@ -208,7 +171,7 @@ function RenderWithPluginState(_ref2) {
208
171
  maxContentSize: maxContentSize
209
172
  }));
210
173
  }
211
- function ChromelessEditorContainerNext(_ref3) {
174
+ export function ChromelessEditorContainer(_ref3) {
212
175
  var maxHeight = _ref3.maxHeight,
213
176
  minHeight = _ref3.minHeight,
214
177
  children = _ref3.children,
@@ -223,29 +186,4 @@ function ChromelessEditorContainerNext(_ref3) {
223
186
  id: "chromeless-editor",
224
187
  ref: containerRef
225
188
  }, children);
226
- }
227
- function ChromelessEditorContainerOld(_ref4) {
228
- var maxHeight = _ref4.maxHeight,
229
- minHeight = _ref4.minHeight,
230
- children = _ref4.children,
231
- containerRef = _ref4.containerRef;
232
- return jsx("div", {
233
- css: [chromelessEditorStyles, maxHeight &&
234
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
235
- css({
236
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
237
- maxHeight: "".concat(maxHeight, "px")
238
- }),
239
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
240
- css({
241
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
242
- minHeight: "".concat(minHeight, "px")
243
- }), fg('platform_fix_extra_space_last_line_comment_editor') && extraSpaceLastLineFix],
244
- "data-testid": "chromeless-editor",
245
- id: "chromeless-editor",
246
- ref: containerRef
247
- }, children);
248
- }
249
- export var ChromelessEditorContainer = componentWithCondition(function () {
250
- return expValEquals('platform_editor_core_static_emotion', 'isEnabled', true);
251
- }, ChromelessEditorContainerNext, ChromelessEditorContainerOld);
189
+ }
@@ -16,19 +16,15 @@ import ButtonGroup from '@atlaskit/button/button-group';
16
16
  import Button from '@atlaskit/button/new';
17
17
  import { useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
18
18
  import messages from '@atlaskit/editor-common/messages';
19
- import { GRID_GUTTER } from '@atlaskit/editor-common/styles';
20
19
  import { WidthConsumer, WidthProvider } from '@atlaskit/editor-common/ui';
21
20
  import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
22
- import { tableCommentEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
23
21
  import { akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
24
- import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
25
22
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
26
23
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
27
24
  // Ignored via go/ees005
28
25
  // eslint-disable-next-line import/no-named-as-default
29
26
  import ClickAreaBlock from '../../Addon/ClickAreaBlock';
30
27
  import { contentComponentClickWrapper } from '../../Addon/ClickAreaBlock/contentComponentWrapper';
31
- import { createEditorContentStyle } from '../../ContentStyles';
32
28
  import EditorContentContainer from '../../EditorContentContainer/EditorContentContainer';
33
29
  import PluginSlot from '../../PluginSlot';
34
30
  import { getPrimaryToolbarComponents } from '../../Toolbar/getPrimaryToolbarComponents';
@@ -36,7 +32,6 @@ import { ToolbarWithSizeDetector as Toolbar } from '../../Toolbar/ToolbarWithSiz
36
32
  import WithFlash from '../../WithFlash';
37
33
  import { CommentToolbar } from './CommentToolbar';
38
34
  import { MainToolbar } from './Toolbar';
39
- var CommentEditorMargin = 14;
40
35
  var MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = 490;
41
36
  var commentEditorStyles = css({
42
37
  display: 'flex',
@@ -55,27 +50,6 @@ var commentEditorStyles = css({
55
50
  maxWidth: 'inherit',
56
51
  wordWrap: 'break-word'
57
52
  });
58
- var ContentArea = createEditorContentStyle(css({
59
- flexGrow: 1,
60
- overflowX: 'clip',
61
- // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
62
- lineHeight: '24px',
63
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
64
- '.ProseMirror': {
65
- margin: "var(--ds-space-150, 12px)"
66
- },
67
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
68
- '.gridParent': {
69
- marginLeft: "var(--ds-space-025, 2px)",
70
- marginRight: "var(--ds-space-025, 2px)",
71
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
72
- width: "calc(100% + ".concat(CommentEditorMargin - GRID_GUTTER, "px)")
73
- },
74
- padding: "var(--ds-space-250, 20px)"
75
- },
76
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
77
- tableCommentEditorStyles));
78
- ContentArea.displayName = 'ContentArea';
79
53
  var secondaryToolbarStyles = css({
80
54
  boxSizing: 'border-box',
81
55
  justifyContent: 'flex-end',
@@ -105,11 +79,6 @@ var mainToolbarCustomComponentsSlotStyleTwoLineToolbarNew = css(_defineProperty(
105
79
  paddingRight: 0
106
80
  }));
107
81
  var appearance = 'comment';
108
- var EditorContainer = componentWithCondition(function () {
109
- return editorExperiment('platform_editor_core_static_emotion', true, {
110
- exposure: true
111
- });
112
- }, EditorContentContainer, ContentArea);
113
82
  export var CommentEditorWithIntl = function CommentEditorWithIntl(props) {
114
83
  var editorAPI = props.editorAPI;
115
84
  var _useSharedPluginState = useSharedPluginStateWithSelector(editorAPI, ['maxContentSize', 'primaryToolbar', 'editorViewMode'], function (states) {
@@ -260,7 +229,7 @@ export var CommentEditorWithIntl = function CommentEditorWithIntl(props) {
260
229
  editorDisabled: disabled
261
230
  }, jsx(WidthConsumer, null, function (_ref) {
262
231
  var width = _ref.width;
263
- return jsx(EditorContainer, {
232
+ return jsx(EditorContentContainer, {
264
233
  ref: containerElement,
265
234
  css: [maxHeight ?
266
235
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -15,9 +15,7 @@ import { decisionListSelector, taskListSelector } from '@atlaskit/adf-schema';
15
15
  import { fullPageMessages as messages } from '@atlaskit/editor-common/messages';
16
16
  import { tableFullPageEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
17
17
  import { FULL_PAGE_EDITOR_TOOLBAR_HEIGHT, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
18
- import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
19
18
  import { fg } from '@atlaskit/platform-feature-flags';
20
- import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
21
19
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
22
20
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
23
21
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -25,7 +23,6 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
25
23
  // eslint-disable-next-line import/no-named-as-default
26
24
  import ClickAreaBlock from '../../Addon/ClickAreaBlock';
27
25
  import { contentComponentClickWrapper } from '../../Addon/ClickAreaBlock/contentComponentWrapper';
28
- import { createEditorContentStyle } from '../../ContentStyles';
29
26
  import { ContextPanel } from '../../ContextPanel';
30
27
  import EditorContentContainer from '../../EditorContentContainer/EditorContentContainer';
31
28
  import PluginSlot from '../../PluginSlot';
@@ -321,26 +318,6 @@ var contentAreaHeightNoToolbar = css({
321
318
  });
322
319
  export var CONTENT_AREA_TEST_ID = 'ak-editor-fp-content-area';
323
320
  export var EDITOR_CONTAINER = 'ak-editor-container';
324
- var scrollStyles = css({
325
- flexGrow: 1,
326
- height: '100%',
327
- overflowY: 'scroll',
328
- position: 'relative',
329
- display: 'flex',
330
- flexDirection: 'column',
331
- scrollBehavior: 'smooth'
332
- },
333
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
334
- scrollbarStyles);
335
-
336
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
337
- export var ScrollContainer = createEditorContentStyle(scrollStyles);
338
- ScrollContainer.displayName = 'ScrollContainer';
339
- var EditorContainer = componentWithCondition(function () {
340
- return editorExperiment('platform_editor_core_static_emotion', true, {
341
- exposure: true
342
- });
343
- }, EditorContentContainer, ScrollContainer);
344
321
  var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
345
322
  var _contentAreaRef$curre;
346
323
  var theme = useTheme();
@@ -385,7 +362,7 @@ var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
385
362
  contentAreaWrapper,
386
363
  "data-testid": EDITOR_CONTAINER,
387
364
  "data-editor-container": 'true'
388
- }, jsx(EditorContainer
365
+ }, jsx(EditorContentContainer
389
366
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
390
367
  , {
391
368
  className: "fabric-editor-popup-scroll-parent",
@@ -158,10 +158,12 @@ var firstFloatingToolbarButtonStyles = css({
158
158
  // The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
159
159
  var akEditorBreakpointForSmallDevice = "1266px";
160
160
 
161
- // We are going to deprecate this in near future
162
- // Currently, we are migrating content styles in packages/editor/editor-core/src/ui/EditorContentContainer.tsx
163
- // Under editor experiment platform_editor_core_static_emotion
164
- // If you are making changes to this file, please make sure to update in EditorContentContainer.tsx as well
161
+ // eslint-disable-next-line @repo/internal/deprecations/deprecation-ticket-required
162
+ /**
163
+ * @deprecated
164
+ * DO NOT USE THIS WILL BE REMOVED SOON.
165
+ * use this instead: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
166
+ */
165
167
  var legacyContentStyles = function legacyContentStyles(props) {
166
168
  return css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: ", "px;\n\t--ak-editor--resizer-handle-spacing: 12px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-padding)\n\t);\n\t--ak-editor--breakout-min-width: 100%;\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\n\t\t--ak-editor--breakout-min-width: 0px;\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t", "\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t */\n\t.ProseMirror-hideselection {\n\t\tcaret-color: transparent;\n\t}\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n /* Switch between the two icons based on the visual refresh feature gate */\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n\n .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t/* For FullPage only when inside a table\n\tRelated code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\tIn the \"editorContentAreaContainerStyle\" function */\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, expValEqualsNoExposure('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? css(_templateObject1 || (_templateObject1 = _taggedTemplateLiteral(["\n\t\t\t\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t\t\t\t@container editor-area (max-width: ", "px) {\n\t\t\t\t\t--ak-editor--large-gutter-padding: ", "px;\n\t\t\t\t}\n\t\t\t"])), akEditorFullPageNarrowBreakout, akEditorGutterPaddingReduced) : null, editorFontSize({
167
169
  theme: props.theme
@@ -19,7 +19,7 @@ import { isFullPage } from '../../utils/is-full-page';
19
19
  import { useElementWidth } from './hooks';
20
20
  import { Toolbar } from './Toolbar';
21
21
  import { toolbarSizeToWidth, widthToToolbarSize } from './toolbar-size';
22
- // Remove when platform_editor_core_static_emotion is cleaned up
22
+ // Remove when platform_editor_core_static_emotion_non_central is cleaned up
23
23
  var toolbar = css(_defineProperty({
24
24
  width: '100%',
25
25
  position: 'relative'
@@ -30,7 +30,7 @@ var toolbar = css(_defineProperty({
30
30
  margin: "0 ".concat("var(--ds-space-200, 16px)")
31
31
  }));
32
32
 
33
- // Rename to toolbar when platform_editor_core_static_emotion is cleaned up
33
+ // Rename to toolbar when platform_editor_core_static_emotion_non_central is cleaned up
34
34
  var staticToolbar = css({
35
35
  width: '100%',
36
36
  position: 'relative'
@@ -1,2 +1,2 @@
1
1
  export var name = "@atlaskit/editor-core";
2
- export var version = "211.2.11";
2
+ export var version = "212.0.0";
@@ -28,6 +28,12 @@ export { default as measurements } from './utils/performance/measure-enum';
28
28
  export { createFeatureFlagsFromProps } from './utils/feature-flags-from-props';
29
29
  export type { Command, EditorProps, EditorInstance, CommandDispatch } from './types';
30
30
  export { default as EditorActions } from './actions';
31
- export { createEditorContentStyle } from './ui/ContentStyles';
31
+ export {
32
+ /**
33
+ * @deprecated
34
+ * DO NOT USE THIS WILL BE REMOVED SOON.
35
+ * use this instead: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
36
+ */
37
+ createEditorContentStyle, } from './ui/ContentStyles';
32
38
  export { getDefaultPresetOptionsFromEditorProps } from './create-editor/create-plugins-list';
33
39
  export { ReactEditorView } from './create-editor/ReactEditorView';
@@ -4,19 +4,10 @@
4
4
  */
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
- import type { EditorAppearance, OptionalPlugin } from '@atlaskit/editor-common/types';
7
+ import type { OptionalPlugin } from '@atlaskit/editor-common/types';
8
8
  import type { EditorViewModePlugin } from '@atlaskit/editor-plugins/editor-viewmode';
9
9
  import type { MaxContentSizePlugin } from '@atlaskit/editor-plugins/max-content-size';
10
10
  import type { EditorAppearanceComponentProps } from '../../types';
11
- export declare const ContentArea: React.ForwardRefExoticComponent<Omit<{
12
- appearance?: EditorAppearance;
13
- colorMode?: "light" | "dark";
14
- featureFlags?: import("@atlaskit/editor-common/types").FeatureFlags;
15
- isScrollable?: boolean;
16
- theme?: import("@emotion/react").Theme;
17
- typographyTheme?: "typography" | "typography-adg3" | "typography-modernized" | "typography-refreshed";
18
- viewMode?: "view" | "edit";
19
- } & React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
20
11
  type AppearanceProps = EditorAppearanceComponentProps<[
21
12
  OptionalPlugin<MaxContentSizePlugin>,
22
13
  OptionalPlugin<EditorViewModePlugin>
@@ -38,5 +29,5 @@ interface ChromelessEditorContainerProps {
38
29
  maxHeight?: number;
39
30
  minHeight: number;
40
31
  }
41
- export declare const ChromelessEditorContainer: React.FC<ChromelessEditorContainerProps>;
32
+ export declare function ChromelessEditorContainer({ maxHeight, minHeight, children, containerRef, }: ChromelessEditorContainerProps): jsx.JSX.Element;
42
33
  export {};
@@ -4,7 +4,6 @@
4
4
  */
5
5
  import type { ReactElement } from 'react';
6
6
  import React from 'react';
7
- import { type Theme } from '@emotion/react';
8
7
  import type { WrappedComponentProps } from 'react-intl-next';
9
8
  import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
10
9
  import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
@@ -41,15 +40,6 @@ interface FullPageEditorContentAreaProps {
41
40
  }
42
41
  export declare const CONTENT_AREA_TEST_ID = "ak-editor-fp-content-area";
43
42
  export declare const EDITOR_CONTAINER = "ak-editor-container";
44
- export declare const ScrollContainer: React.ForwardRefExoticComponent<Omit<{
45
- appearance?: EditorAppearance;
46
- colorMode?: "light" | "dark";
47
- featureFlags?: FeatureFlags;
48
- isScrollable?: boolean;
49
- theme?: Theme;
50
- typographyTheme?: "typography" | "typography-adg3" | "typography-modernized" | "typography-refreshed";
51
- viewMode?: "view" | "edit";
52
- } & React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
53
43
  export declare const FullPageContentArea: React.ForwardRefExoticComponent<Omit<import("react-intl-next").WithIntlProps<React.PropsWithChildren<FullPageEditorContentAreaProps & WrappedComponentProps & React.RefAttributes<ScrollContainerRefs>>>, "ref"> & React.RefAttributes<any>> & {
54
44
  WrappedComponent: React.ComponentType<FullPageEditorContentAreaProps & WrappedComponentProps & React.RefAttributes<ScrollContainerRefs>>;
55
45
  };
@@ -28,6 +28,12 @@ export { default as measurements } from './utils/performance/measure-enum';
28
28
  export { createFeatureFlagsFromProps } from './utils/feature-flags-from-props';
29
29
  export type { Command, EditorProps, EditorInstance, CommandDispatch } from './types';
30
30
  export { default as EditorActions } from './actions';
31
- export { createEditorContentStyle } from './ui/ContentStyles';
31
+ export {
32
+ /**
33
+ * @deprecated
34
+ * DO NOT USE THIS WILL BE REMOVED SOON.
35
+ * use this instead: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
36
+ */
37
+ createEditorContentStyle, } from './ui/ContentStyles';
32
38
  export { getDefaultPresetOptionsFromEditorProps } from './create-editor/create-plugins-list';
33
39
  export { ReactEditorView } from './create-editor/ReactEditorView';
@@ -4,19 +4,10 @@
4
4
  */
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
- import type { EditorAppearance, OptionalPlugin } from '@atlaskit/editor-common/types';
7
+ import type { OptionalPlugin } from '@atlaskit/editor-common/types';
8
8
  import type { EditorViewModePlugin } from '@atlaskit/editor-plugins/editor-viewmode';
9
9
  import type { MaxContentSizePlugin } from '@atlaskit/editor-plugins/max-content-size';
10
10
  import type { EditorAppearanceComponentProps } from '../../types';
11
- export declare const ContentArea: React.ForwardRefExoticComponent<Omit<{
12
- appearance?: EditorAppearance;
13
- colorMode?: "light" | "dark";
14
- featureFlags?: import("@atlaskit/editor-common/types").FeatureFlags;
15
- isScrollable?: boolean;
16
- theme?: import("@emotion/react").Theme;
17
- typographyTheme?: "typography" | "typography-adg3" | "typography-modernized" | "typography-refreshed";
18
- viewMode?: "view" | "edit";
19
- } & React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
20
11
  type AppearanceProps = EditorAppearanceComponentProps<[
21
12
  OptionalPlugin<MaxContentSizePlugin>,
22
13
  OptionalPlugin<EditorViewModePlugin>
@@ -38,5 +29,5 @@ interface ChromelessEditorContainerProps {
38
29
  maxHeight?: number;
39
30
  minHeight: number;
40
31
  }
41
- export declare const ChromelessEditorContainer: React.FC<ChromelessEditorContainerProps>;
32
+ export declare function ChromelessEditorContainer({ maxHeight, minHeight, children, containerRef, }: ChromelessEditorContainerProps): jsx.JSX.Element;
42
33
  export {};
@@ -4,7 +4,6 @@
4
4
  */
5
5
  import type { ReactElement } from 'react';
6
6
  import React from 'react';
7
- import { type Theme } from '@emotion/react';
8
7
  import type { WrappedComponentProps } from 'react-intl-next';
9
8
  import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
10
9
  import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
@@ -43,15 +42,6 @@ interface FullPageEditorContentAreaProps {
43
42
  }
44
43
  export declare const CONTENT_AREA_TEST_ID = "ak-editor-fp-content-area";
45
44
  export declare const EDITOR_CONTAINER = "ak-editor-container";
46
- export declare const ScrollContainer: React.ForwardRefExoticComponent<Omit<{
47
- appearance?: EditorAppearance;
48
- colorMode?: "light" | "dark";
49
- featureFlags?: FeatureFlags;
50
- isScrollable?: boolean;
51
- theme?: Theme;
52
- typographyTheme?: "typography" | "typography-adg3" | "typography-modernized" | "typography-refreshed";
53
- viewMode?: "view" | "edit";
54
- } & React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
55
45
  export declare const FullPageContentArea: React.ForwardRefExoticComponent<Omit<import("react-intl-next").WithIntlProps<React.PropsWithChildren<FullPageEditorContentAreaProps & WrappedComponentProps & React.RefAttributes<ScrollContainerRefs>>>, "ref"> & React.RefAttributes<any>> & {
56
46
  WrappedComponent: React.ComponentType<FullPageEditorContentAreaProps & WrappedComponentProps & React.RefAttributes<ScrollContainerRefs>>;
57
47
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-core",
3
- "version": "212.0.0",
3
+ "version": "212.0.1",
4
4
  "description": "A package contains Atlassian editor core functionality",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"