@atlaskit/editor-core 213.5.6 → 213.6.0
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.
- package/CHANGELOG.md +18 -0
- package/dist/cjs/ui/Appearance/Comment/Comment.js +5 -12
- package/dist/cjs/ui/Appearance/Comment/Toolbar.js +5 -24
- package/dist/cjs/ui/Appearance/FullPage/CustomToolbarWrapper.js +5 -42
- package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js +5 -136
- package/dist/cjs/ui/Appearance/FullPage/MainToolbar.js +1 -55
- package/dist/cjs/ui/Appearance/FullPage/MainToolbarWrapper.js +2 -31
- package/dist/cjs/ui/Appearance/FullPage/StyledComponents.js +1 -25
- package/dist/cjs/ui/Toolbar/ToolbarWithSizeDetector.js +4 -70
- package/dist/cjs/utils/validateNodes.js +1 -46
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/ui/Appearance/Comment/Comment.js +1 -23
- package/dist/es2019/ui/Appearance/Comment/Toolbar.js +2 -72
- package/dist/es2019/ui/Appearance/FullPage/CustomToolbarWrapper.js +3 -34
- package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js +7 -134
- package/dist/es2019/ui/Appearance/FullPage/MainToolbar.js +1 -58
- package/dist/es2019/ui/Appearance/FullPage/MainToolbarWrapper.js +3 -31
- package/dist/es2019/ui/Appearance/FullPage/StyledComponents.js +0 -24
- package/dist/es2019/ui/Toolbar/ToolbarWithSizeDetector.js +3 -65
- package/dist/es2019/utils/validateNodes.js +1 -43
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/ui/Appearance/Comment/Comment.js +1 -11
- package/dist/esm/ui/Appearance/Comment/Toolbar.js +2 -23
- package/dist/esm/ui/Appearance/FullPage/CustomToolbarWrapper.js +5 -42
- package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js +7 -138
- package/dist/esm/ui/Appearance/FullPage/MainToolbar.js +1 -55
- package/dist/esm/ui/Appearance/FullPage/MainToolbarWrapper.js +3 -32
- package/dist/esm/ui/Appearance/FullPage/StyledComponents.js +0 -24
- package/dist/esm/ui/Toolbar/ToolbarWithSizeDetector.js +4 -70
- package/dist/esm/utils/validateNodes.js +1 -47
- package/dist/esm/version-wrapper.js +1 -1
- package/dist/types/ui/Appearance/FullPage/CustomToolbarWrapper.d.ts +3 -2
- package/dist/types/ui/Appearance/FullPage/MainToolbar.d.ts +0 -1
- package/dist/types/ui/Appearance/FullPage/MainToolbarWrapper.d.ts +2 -8
- package/dist/types/ui/Appearance/FullPage/StyledComponents.d.ts +0 -1
- package/dist/types/ui/Toolbar/ToolbarWithSizeDetector.d.ts +2 -6
- package/dist/types-ts4.5/ui/Appearance/FullPage/CustomToolbarWrapper.d.ts +3 -2
- package/dist/types-ts4.5/ui/Appearance/FullPage/MainToolbar.d.ts +0 -1
- package/dist/types-ts4.5/ui/Appearance/FullPage/MainToolbarWrapper.d.ts +2 -8
- package/dist/types-ts4.5/ui/Appearance/FullPage/StyledComponents.d.ts +0 -1
- package/dist/types-ts4.5/ui/Toolbar/ToolbarWithSizeDetector.d.ts +2 -6
- package/package.json +11 -27
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,23 @@
|
|
|
1
1
|
# @atlaskit/editor-core
|
|
2
2
|
|
|
3
|
+
## 213.6.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`9af8b5101d35f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9af8b5101d35f) -
|
|
8
|
+
[https://product-fabric.atlassian.net/browse/ED-29411](ED-29411) - clean up
|
|
9
|
+
platform_editor_memoized_node_check experiment
|
|
10
|
+
- [`687c1b8fa7801`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/687c1b8fa7801) -
|
|
11
|
+
EDITOR-1566 bump adf-schema + update validator
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [`2c4405f422ac7`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2c4405f422ac7) -
|
|
16
|
+
clean up feature flag for static emotion
|
|
17
|
+
- [`a11b4fec9c5d4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a11b4fec9c5d4) -
|
|
18
|
+
[FD-90806] Clean up platform_editor_remove_drag_handle_fix
|
|
19
|
+
- Updated dependencies
|
|
20
|
+
|
|
3
21
|
## 213.5.6
|
|
4
22
|
|
|
5
23
|
### Patch Changes
|
|
@@ -8,7 +8,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
8
8
|
exports.CommentEditorWithIntl = void 0;
|
|
9
9
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
10
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
12
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
12
|
var _react2 = require("@emotion/react");
|
|
14
13
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
@@ -20,7 +19,6 @@ var _messages = _interopRequireDefault(require("@atlaskit/editor-common/messages
|
|
|
20
19
|
var _ui = require("@atlaskit/editor-common/ui");
|
|
21
20
|
var _uiMenu = require("@atlaskit/editor-common/ui-menu");
|
|
22
21
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
23
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
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");
|
|
@@ -31,15 +29,17 @@ var _ToolbarWithSizeDetector = require("../../Toolbar/ToolbarWithSizeDetector");
|
|
|
31
29
|
var _WithFlash = _interopRequireDefault(require("../../WithFlash"));
|
|
32
30
|
var _CommentToolbar = require("./CommentToolbar");
|
|
33
31
|
var _Toolbar = require("./Toolbar");
|
|
34
|
-
var
|
|
32
|
+
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); }
|
|
35
33
|
/**
|
|
36
34
|
* @jsxRuntime classic
|
|
37
35
|
* @jsx jsx
|
|
38
36
|
*/
|
|
37
|
+
|
|
39
38
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
39
|
+
|
|
40
40
|
// Ignored via go/ees005
|
|
41
41
|
// eslint-disable-next-line import/no-named-as-default
|
|
42
|
-
|
|
42
|
+
|
|
43
43
|
var MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = 490;
|
|
44
44
|
var commentEditorStyles = (0, _react2.css)({
|
|
45
45
|
display: 'flex',
|
|
@@ -65,12 +65,6 @@ var secondaryToolbarStyles = (0, _react2.css)({
|
|
|
65
65
|
display: 'flex',
|
|
66
66
|
padding: "var(--ds-space-150, 12px)".concat(" ", "var(--ds-space-025, 2px)")
|
|
67
67
|
});
|
|
68
|
-
var mainToolbarCustomComponentsSlotStyle = function mainToolbarCustomComponentsSlotStyle() {
|
|
69
|
-
var isTwoLineEditorToolbar = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
70
|
-
return (// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
|
|
71
|
-
(0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t\tdisplay: flex;\n\t\tjustify-content: flex-end;\n\t\talign-items: center;\n\t\tflex-grow: 1;\n\t\tpadding-right: ", ";\n\t\t> div {\n\t\t\tdisplay: flex;\n\t\t\tflex-shrink: 0;\n\t\t}\n\t\t", "\n\t"])), "var(--ds-space-250, 20px)", isTwoLineEditorToolbar && "\n @media (max-width: ".concat(MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT, "px) {\n {\n padding-right: 0;\n }\n }\n "))
|
|
72
|
-
);
|
|
73
|
-
};
|
|
74
68
|
var mainToolbarCustomComponentsSlotStyleNew = (0, _react2.css)({
|
|
75
69
|
display: 'flex',
|
|
76
70
|
justifyContent: 'flex-end',
|
|
@@ -176,8 +170,7 @@ var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEdit
|
|
|
176
170
|
primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
|
|
177
171
|
}
|
|
178
172
|
var customToolbarSlot = (0, _react2.jsx)("div", {
|
|
179
|
-
css:
|
|
180
|
-
mainToolbarCustomComponentsSlotStyle(isTwoLineToolbarEnabled)
|
|
173
|
+
css: [mainToolbarCustomComponentsSlotStyleNew, isTwoLineToolbarEnabled && mainToolbarCustomComponentsSlotStyleTwoLineToolbarNew]
|
|
181
174
|
}, customPrimaryToolbarComponents);
|
|
182
175
|
var isToolbarAIFCEnabled = Boolean(editorAPI === null || editorAPI === void 0 ? void 0 : editorAPI.toolbar) && (0, _experiments.editorExperiment)('platform_editor_toolbar_aifc', true);
|
|
183
176
|
return (0, _react2.jsx)(_WithFlash.default, {
|
|
@@ -10,26 +10,20 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
|
|
|
10
10
|
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
11
11
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
12
12
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
-
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
14
13
|
var _react = _interopRequireWildcard(require("react"));
|
|
15
14
|
var _react2 = require("@emotion/react");
|
|
16
15
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
17
|
-
var
|
|
18
|
-
var _templateObject, _templateObject2;
|
|
16
|
+
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" != _typeof3(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); }
|
|
19
17
|
/**
|
|
20
18
|
* @jsxRuntime classic
|
|
21
19
|
* @jsx jsx
|
|
22
20
|
*/
|
|
21
|
+
|
|
23
22
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
24
|
-
|
|
23
|
+
|
|
25
24
|
var MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = 490;
|
|
26
25
|
var akEditorMenuZIndex = 500;
|
|
27
26
|
var akEditorToolbarKeylineHeight = 2;
|
|
28
|
-
var mainToolbarWrapperStyle = function mainToolbarWrapperStyle() {
|
|
29
|
-
var isTwoLineEditorToolbar = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
30
|
-
var isToolbarAifcEnabled = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
31
|
-
return (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tposition: relative;\n\talign-items: center;\n\tpadding: ", " ", " 0;\n\tdisplay: flex;\n\theight: auto;\n\tbackground-color: ", ";\n\tbox-shadow: none;\n\t", "\n\n\t& > div {\n\t\t> :first-child:not(style),\n\t\t> style:first-child + * {\n\t\t\tmargin-left: 0;\n\t\t}\n\t\t", "\n\t}\n\n\t.block-type-btn {\n\t\tpadding-left: 0;\n\t}\n\n\t", "\n"])), "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-surface, white)", isToolbarAifcEnabled ? '' : "padding-left: ".concat("var(--ds-space-250, 20px)", ";"), isTwoLineEditorToolbar && "\n @media (max-width: ".concat(MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT, "px) {\n flex-direction: column-reverse;\n align-items: end;\n display: flex;\n justify-content: flex-end;\n }\n\n /* make this more explicit for a toolbar */\n > *:nth-child(1) {\n @media (max-width: ").concat(MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT, "px) {\n > div:nth-child(2) {\n justify-content: flex-end;\n display: flex;\n }\n }\n }\n "), (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && 'span svg { max-width: 100%; }');
|
|
32
|
-
};
|
|
33
27
|
var mainToolbarWrapperStyleNew = (0, _react2.css)({
|
|
34
28
|
position: 'relative',
|
|
35
29
|
alignItems: 'center',
|
|
@@ -77,11 +71,6 @@ var mainToolbarWrapperStylesVisualRefresh = (0, _react2.css)({
|
|
|
77
71
|
maxWidth: '100%'
|
|
78
72
|
}
|
|
79
73
|
});
|
|
80
|
-
|
|
81
|
-
/* eslint-enable @atlaskit/platform/ensure-feature-flag-registration */
|
|
82
|
-
|
|
83
|
-
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
84
|
-
var stickyToolbarWrapperStyle = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t/* stylelint-disable declaration-block-no-duplicate-properties */\n\tposition: relative;\n\tposition: sticky;\n\t/* stylelint-enable declaration-block-no-duplicate-properties */\n\tpadding-bottom: ", ";\n\tz-index: ", ";\n\ttransition: box-shadow ease-in-out 0.2s;\n\t&.show-keyline {\n\t\tbox-shadow: 0 ", "px 0 0\n\t\t\t", ";\n\t}\n"])), "var(--ds-space-100, 8px)", akEditorMenuZIndex, akEditorToolbarKeylineHeight, "var(--ds-background-accent-gray-subtlest, #F1F2F4)");
|
|
85
74
|
var stickyToolbarWrapperStyleNew = (0, _react2.css)({
|
|
86
75
|
position: 'sticky',
|
|
87
76
|
paddingBottom: "var(--ds-space-100, 8px)",
|
|
@@ -112,11 +101,7 @@ var StickyToolbar = function StickyToolbar(props) {
|
|
|
112
101
|
return (
|
|
113
102
|
// eslint-disable-next-line @atlaskit/design-system/prefer-primitives
|
|
114
103
|
(0, _react2.jsx)("div", {
|
|
115
|
-
css:
|
|
116
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
117
|
-
mainToolbarWrapperStyle(props.twoLineEditorToolbar,
|
|
118
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
119
|
-
props.isNewToolbarEnabled), stickyToolbarWrapperStyle]
|
|
104
|
+
css: [mainToolbarWrapperStyleNew, props.twoLineEditorToolbar && mainToolbarTwoLineStylesNew, (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && mainToolbarWrapperStylesVisualRefresh, stickyToolbarWrapperStyleNew, props.isNewToolbarEnabled && mainToolbarWithoutLeftPadding]
|
|
120
105
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
121
106
|
,
|
|
122
107
|
style: {
|
|
@@ -133,11 +118,7 @@ var FixedToolbar = function FixedToolbar(props) {
|
|
|
133
118
|
return (
|
|
134
119
|
// eslint-disable-next-line @atlaskit/design-system/prefer-primitives
|
|
135
120
|
(0, _react2.jsx)("div", {
|
|
136
|
-
css:
|
|
137
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
138
|
-
mainToolbarWrapperStyle(props.twoLineEditorToolbar,
|
|
139
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
140
|
-
props.isNewToolbarEnabled),
|
|
121
|
+
css: [mainToolbarWrapperStyleNew, props.twoLineEditorToolbar && mainToolbarTwoLineStylesNew, (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && mainToolbarWrapperStylesVisualRefresh, props.isNewToolbarEnabled && mainToolbarWithoutLeftPadding],
|
|
141
122
|
"data-testid": "ak-editor-main-toolbar"
|
|
142
123
|
}, props.children)
|
|
143
124
|
);
|
|
@@ -7,9 +7,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.MainToolbarForSecondChildWrapper = exports.MainToolbarForFirstChildWrapper = void 0;
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
var _react2 = require("@emotion/react");
|
|
10
|
-
var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
|
|
11
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
12
|
-
var _MainToolbar = require("./MainToolbar");
|
|
13
10
|
/**
|
|
14
11
|
* @jsxRuntime classic
|
|
15
12
|
* @jsx jsx
|
|
@@ -55,7 +52,7 @@ var secondChildStaticTwoLine = (0, _react2.css)({
|
|
|
55
52
|
});
|
|
56
53
|
|
|
57
54
|
// ---------------- First child wrapper ----------------
|
|
58
|
-
var
|
|
55
|
+
var MainToolbarForFirstChildWrapper = exports.MainToolbarForFirstChildWrapper = function MainToolbarForFirstChildWrapper(_ref) {
|
|
59
56
|
var twoLineEditorToolbar = _ref.twoLineEditorToolbar,
|
|
60
57
|
children = _ref.children,
|
|
61
58
|
role = _ref.role,
|
|
@@ -68,52 +65,18 @@ var FirstChildWrapperStatic = function FirstChildWrapperStatic(_ref) {
|
|
|
68
65
|
"data-testid": testId
|
|
69
66
|
}, children);
|
|
70
67
|
};
|
|
71
|
-
|
|
68
|
+
|
|
69
|
+
// ---------------- Second child wrapper ----------------
|
|
70
|
+
var MainToolbarForSecondChildWrapper = exports.MainToolbarForSecondChildWrapper = function MainToolbarForSecondChildWrapper(_ref2) {
|
|
72
71
|
var twoLineEditorToolbar = _ref2.twoLineEditorToolbar,
|
|
73
72
|
children = _ref2.children,
|
|
74
73
|
role = _ref2.role,
|
|
75
74
|
ariaLabel = _ref2['aria-label'],
|
|
76
75
|
testId = _ref2['data-testid'];
|
|
77
|
-
return (0, _react2.jsx)("div", {
|
|
78
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage
|
|
79
|
-
css: (0, _MainToolbar.mainToolbarFirstChildStyle)(twoLineEditorToolbar),
|
|
80
|
-
role: role,
|
|
81
|
-
"aria-label": ariaLabel,
|
|
82
|
-
"data-testid": testId
|
|
83
|
-
}, children);
|
|
84
|
-
};
|
|
85
|
-
var MainToolbarForFirstChildWrapper = exports.MainToolbarForFirstChildWrapper = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
|
|
86
|
-
return (0, _expValEquals.expValEquals)('platform_editor_core_static_emotion_non_central', 'isEnabled', true);
|
|
87
|
-
}, FirstChildWrapperStatic, FirstChildWrapperDynamic);
|
|
88
|
-
|
|
89
|
-
// ---------------- Second child wrapper ----------------
|
|
90
|
-
var SecondChildWrapperStatic = function SecondChildWrapperStatic(_ref3) {
|
|
91
|
-
var twoLineEditorToolbar = _ref3.twoLineEditorToolbar,
|
|
92
|
-
children = _ref3.children,
|
|
93
|
-
role = _ref3.role,
|
|
94
|
-
ariaLabel = _ref3['aria-label'],
|
|
95
|
-
testId = _ref3['data-testid'];
|
|
96
76
|
return (0, _react2.jsx)("div", {
|
|
97
77
|
css: [secondChildStaticBase, twoLineEditorToolbar && secondChildStaticTwoLine],
|
|
98
78
|
role: role,
|
|
99
79
|
"aria-label": ariaLabel,
|
|
100
80
|
"data-testid": testId
|
|
101
81
|
}, children);
|
|
102
|
-
};
|
|
103
|
-
var SecondChildWrapperDynamic = function SecondChildWrapperDynamic(_ref4) {
|
|
104
|
-
var twoLineEditorToolbar = _ref4.twoLineEditorToolbar,
|
|
105
|
-
children = _ref4.children,
|
|
106
|
-
role = _ref4.role,
|
|
107
|
-
ariaLabel = _ref4['aria-label'],
|
|
108
|
-
testId = _ref4['data-testid'];
|
|
109
|
-
return (0, _react2.jsx)("div", {
|
|
110
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage
|
|
111
|
-
css: (0, _MainToolbar.mainToolbarSecondChildStyle)(twoLineEditorToolbar),
|
|
112
|
-
role: role,
|
|
113
|
-
"aria-label": ariaLabel,
|
|
114
|
-
"data-testid": testId
|
|
115
|
-
}, children);
|
|
116
|
-
};
|
|
117
|
-
var MainToolbarForSecondChildWrapper = exports.MainToolbarForSecondChildWrapper = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
|
|
118
|
-
return (0, _expValEquals.expValEquals)('platform_editor_core_static_emotion_non_central', 'isEnabled', true);
|
|
119
|
-
}, SecondChildWrapperStatic, SecondChildWrapperDynamic);
|
|
82
|
+
};
|
|
@@ -7,17 +7,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.FullPageContentArea = exports.EDITOR_CONTAINER = exports.CONTENT_AREA_TEST_ID = void 0;
|
|
9
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
|
-
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
11
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
12
11
|
var _react2 = require("@emotion/react");
|
|
13
12
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
14
13
|
var _reactIntlNext = require("react-intl-next");
|
|
15
14
|
var _adfSchema = require("@atlaskit/adf-schema");
|
|
16
15
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
17
|
-
var _commonStyles = require("@atlaskit/editor-plugins/table/ui/common-styles");
|
|
18
16
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
19
17
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
20
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
21
18
|
var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
|
|
22
19
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
23
20
|
var _expVal = require("@atlaskit/tmp-editor-statsig/expVal");
|
|
@@ -47,104 +44,6 @@ var AK_NESTED_DND_GUTTER_OFFSET = 8;
|
|
|
47
44
|
var getTotalPadding = function getTotalPadding() {
|
|
48
45
|
return (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() * 2;
|
|
49
46
|
};
|
|
50
|
-
|
|
51
|
-
// old styles - to be deleted when cleaning up experiment `platform_editor_core_static_emotion_non_central`
|
|
52
|
-
var editorContentAreaStyle = function editorContentAreaStyle(_ref) {
|
|
53
|
-
var layoutMaxWidth = _ref.layoutMaxWidth,
|
|
54
|
-
fullWidthMode = _ref.fullWidthMode,
|
|
55
|
-
isEditorToolbarHidden = _ref.isEditorToolbarHidden;
|
|
56
|
-
return [editorContentArea, editorContentAreaProsemirrorStyle, fullWidthNonChromelessBreakoutBlockTableStyle, !fullWidthMode && editorContentAreaWithLayoutWith(layoutMaxWidth),
|
|
57
|
-
// for breakout resizing, there's no need to restrict the width of codeblocks as they're always wrapped in a breakout mark
|
|
58
|
-
(0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_breakout_resizing', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_width_changes') ? editorContentAreaContainerStyleExcludeCodeBlock() : editorContentAreaContainerStyle()].concat((0, _toConsumableArray2.default)((0, _platformFeatureFlags.fg)('platform_editor_controls_no_toolbar_space') ? [] : [(0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') &&
|
|
59
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
|
|
60
|
-
contentAreaReducedHeaderSpace, isEditorToolbarHidden && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') &&
|
|
61
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
|
|
62
|
-
contentAreaReservedPrimaryToolbarSpace]));
|
|
63
|
-
};
|
|
64
|
-
var editorContentAreaWithLayoutWith = function editorContentAreaWithLayoutWith(layoutMaxWidth) {
|
|
65
|
-
return (0, _react2.css)({
|
|
66
|
-
// this restricts max width
|
|
67
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
68
|
-
maxWidth: "".concat(layoutMaxWidth + getTotalPadding(), "px")
|
|
69
|
-
});
|
|
70
|
-
};
|
|
71
|
-
|
|
72
|
-
/* Prevent horizontal scroll on page in full width mode */
|
|
73
|
-
var editorContentAreaContainerStyleExcludeCodeBlock = function editorContentAreaContainerStyleExcludeCodeBlock() {
|
|
74
|
-
return (0, _react2.css)({
|
|
75
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
76
|
-
'.fabric-editor--full-width-mode': {
|
|
77
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
78
|
-
'.extension-container, .multiBodiedExtension--container': {
|
|
79
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
80
|
-
maxWidth: "calc(100% - ".concat(tableMarginFullWidthMode * 2, "px)")
|
|
81
|
-
},
|
|
82
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
83
|
-
'.extension-container.inline': {
|
|
84
|
-
maxWidth: '100%'
|
|
85
|
-
},
|
|
86
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
87
|
-
'td .extension-container.inline': {
|
|
88
|
-
maxWidth: 'inherit'
|
|
89
|
-
},
|
|
90
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
91
|
-
'[data-layout-section]': {
|
|
92
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
93
|
-
maxWidth: "calc(100% + ".concat((akLayoutGutterOffset + ((0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0)) * 2, "px)")
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
});
|
|
97
|
-
};
|
|
98
|
-
|
|
99
|
-
/* Prevent horizontal scroll on page in full width mode */
|
|
100
|
-
var editorContentAreaContainerStyle = function editorContentAreaContainerStyle() {
|
|
101
|
-
return (0, _react2.css)({
|
|
102
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
103
|
-
'.fabric-editor--full-width-mode': {
|
|
104
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
105
|
-
'.code-block, .extension-container, .multiBodiedExtension--container': {
|
|
106
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
107
|
-
maxWidth: "calc(100% - ".concat(tableMarginFullWidthMode * 2, "px)")
|
|
108
|
-
},
|
|
109
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
110
|
-
'.extension-container.inline': {
|
|
111
|
-
maxWidth: '100%'
|
|
112
|
-
},
|
|
113
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
114
|
-
'td .extension-container.inline': {
|
|
115
|
-
maxWidth: 'inherit'
|
|
116
|
-
},
|
|
117
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
118
|
-
'[data-layout-section]': {
|
|
119
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
120
|
-
maxWidth: "calc(100% + ".concat((akLayoutGutterOffset + ((0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0)) * 2, "px)")
|
|
121
|
-
}
|
|
122
|
-
}
|
|
123
|
-
});
|
|
124
|
-
};
|
|
125
|
-
var editorContentArea = (0, _react2.css)({
|
|
126
|
-
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
127
|
-
lineHeight: '24px',
|
|
128
|
-
paddingTop: "var(--ds-space-600, 48px)",
|
|
129
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
130
|
-
'.ak-editor-content-area-no-toolbar &': {
|
|
131
|
-
// When the toolbar is hidden, we don't want content to jump up
|
|
132
|
-
// the extra 1px is to account for the border on the toolbar
|
|
133
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
|
|
134
|
-
paddingTop: "calc(".concat("var(--ds-space-600, 48px)", " + ", (0, _editorSharedStyles.FULL_PAGE_EDITOR_TOOLBAR_HEIGHT)(), " + 1px)")
|
|
135
|
-
},
|
|
136
|
-
paddingBottom: "var(--ds-space-600, 48px)",
|
|
137
|
-
height: 'calc( 100% - 105px )',
|
|
138
|
-
width: '100%',
|
|
139
|
-
margin: 'auto',
|
|
140
|
-
flexDirection: 'column',
|
|
141
|
-
flexGrow: 1,
|
|
142
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
143
|
-
maxWidth: "".concat(akEditorFullWidthLayoutWidth + getTotalPadding(), "px"),
|
|
144
|
-
transition: "max-width ".concat(SWOOP_ANIMATION)
|
|
145
|
-
},
|
|
146
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
147
|
-
_commonStyles.tableFullPageEditorStyles);
|
|
148
47
|
var editorContentAreaProsemirrorStyle = (0, _react2.css)({
|
|
149
48
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
150
49
|
'& .ProseMirror': (0, _defineProperty2.default)((0, _defineProperty2.default)({
|
|
@@ -190,26 +89,6 @@ var contentAreaReservedPrimaryToolbarSpace = (0, _react2.css)({
|
|
|
190
89
|
var contentAreaReducedHeaderSpace = (0, _react2.css)({
|
|
191
90
|
paddingTop: "var(--ds-space-400, 32px)"
|
|
192
91
|
});
|
|
193
|
-
var editorContentGutterStyle = function editorContentGutterStyle() {
|
|
194
|
-
if ((0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
|
|
195
|
-
exposure: true
|
|
196
|
-
})) {
|
|
197
|
-
return (0, _react2.css)((0, _defineProperty2.default)({
|
|
198
|
-
boxSizing: 'border-box',
|
|
199
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
200
|
-
padding: "0 ".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px")
|
|
201
|
-
}, "@container editor-area (max-width: ".concat(_editorSharedStyles.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(_editorSharedStyles.akEditorGutterPaddingReduced, "px")
|
|
204
|
-
}));
|
|
205
|
-
} else {
|
|
206
|
-
return (0, _react2.css)({
|
|
207
|
-
boxSizing: 'border-box',
|
|
208
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
209
|
-
padding: "0 ".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px")
|
|
210
|
-
});
|
|
211
|
-
}
|
|
212
|
-
};
|
|
213
92
|
|
|
214
93
|
// new styles
|
|
215
94
|
var editorContentAreaNew = (0, _react2.css)({
|
|
@@ -366,11 +245,7 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
366
245
|
return (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
|
|
367
246
|
};
|
|
368
247
|
return (0, _react2.jsx)("div", {
|
|
369
|
-
css:
|
|
370
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
371
|
-
_StyledComponents.contentArea,
|
|
372
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
373
|
-
props.isEditorToolbarHidden && contentAreaHeightNoToolbar],
|
|
248
|
+
css: [contentAreaNew, props.isEditorToolbarHidden && contentAreaHeightNoToolbar],
|
|
374
249
|
"data-testid": CONTENT_AREA_TEST_ID,
|
|
375
250
|
ref: containerRef
|
|
376
251
|
}, (0, _react2.jsx)("div", {
|
|
@@ -392,13 +267,9 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
392
267
|
editorView: props.editorView,
|
|
393
268
|
editorDisabled: props.disabled
|
|
394
269
|
}, (0, _react2.jsx)("div", {
|
|
395
|
-
css:
|
|
270
|
+
css: [editorContentAreaNew, editorContentAreaProsemirrorStyle, tableFullPageEditorStylesNew, fullWidthNonChromelessBreakoutBlockTableStyle,
|
|
396
271
|
// for breakout resizing, there's no need to restrict the width of codeblocks as they're always wrapped in a breakout mark
|
|
397
|
-
(0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_breakout_resizing', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_width_changes') ? editorContentAreaContainerStyleExcludeCodeBlockNew : editorContentAreaContainerStyleNew, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && editorContentAreaContainerNestedDndStyle, !(0, _platformFeatureFlags.fg)('platform_editor_controls_no_toolbar_space') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && contentAreaReducedHeaderSpace, !(0, _platformFeatureFlags.fg)('platform_editor_controls_no_toolbar_space') && props.isEditorToolbarHidden && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && contentAreaReservedPrimaryToolbarSpace]
|
|
398
|
-
fullWidthMode: fullWidthMode,
|
|
399
|
-
layoutMaxWidth: theme.layoutMaxWidth,
|
|
400
|
-
isEditorToolbarHidden: props.isEditorToolbarHidden
|
|
401
|
-
})),
|
|
272
|
+
(0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_breakout_resizing', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_width_changes') ? editorContentAreaContainerStyleExcludeCodeBlockNew : editorContentAreaContainerStyleNew, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && editorContentAreaContainerNestedDndStyle, !(0, _platformFeatureFlags.fg)('platform_editor_controls_no_toolbar_space') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && contentAreaReducedHeaderSpace, !(0, _platformFeatureFlags.fg)('platform_editor_controls_no_toolbar_space') && props.isEditorToolbarHidden && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && contentAreaReservedPrimaryToolbarSpace],
|
|
402
273
|
style: {
|
|
403
274
|
'--ak-editor-content-area-max-width': !fullWidthMode ? "".concat(theme.layoutMaxWidth + getTotalPadding(), "px") : "".concat(akEditorFullWidthLayoutWidth + getTotalPadding(), "px")
|
|
404
275
|
}
|
|
@@ -411,13 +282,11 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
411
282
|
"aria-label": props.intl.formatMessage(_messages.fullPageMessages.editableContentLabel),
|
|
412
283
|
ref: contentAreaRef
|
|
413
284
|
}, (0, _react2.jsx)("div", {
|
|
414
|
-
css:
|
|
285
|
+
css: [editorContentGutterStyles,
|
|
415
286
|
// eslint-disable-next-line @atlaskit/platform/no-preconditioning
|
|
416
287
|
(0, _platformFeatureFlags.fg)('platform_editor_controls_increase_full_page_gutter') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && editorContentGutterStyleFG, (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
|
|
417
288
|
exposure: true
|
|
418
|
-
}) && editorContentReducedGutterStyles]
|
|
419
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
420
|
-
editorContentGutterStyle()]
|
|
289
|
+
}) && editorContentReducedGutterStyles]
|
|
421
290
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
422
291
|
,
|
|
423
292
|
className: (0, _classnames.default)('ak-editor-content-area', 'appearance-full-page', {
|
|
@@ -4,68 +4,14 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.nonCustomToolbarWrapperStyle = exports.
|
|
7
|
+
exports.nonCustomToolbarWrapperStyle = exports.mainToolbarSecondChildStyle = exports.mainToolbarIconBeforeStyle = exports.mainToolbarFirstChildStyle = exports.customToolbarWrapperStyle = exports.MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _react = require("@emotion/react");
|
|
10
10
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
11
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
12
11
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
13
12
|
|
|
14
13
|
var MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = exports.MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = 868;
|
|
15
14
|
|
|
16
|
-
// box-shadow is overriden by the mainToolbar
|
|
17
|
-
var mainToolbarWithKeyline = (0, _react.css)({
|
|
18
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
19
|
-
boxShadow: "var(--ds-shadow-overflow, 0px 0px 8px #091E4228, 0px 0px 1px #091E421e)"
|
|
20
|
-
});
|
|
21
|
-
var mainToolbarTwoLineStyle = function mainToolbarTwoLineStyle() {
|
|
22
|
-
var editorToolbarHeight = (0, _editorSharedStyles.FULL_PAGE_EDITOR_TOOLBAR_HEIGHT)();
|
|
23
|
-
return (0, _react.css)((0, _defineProperty2.default)({}, "@media (max-width: ".concat(MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT, "px)"), {
|
|
24
|
-
flexWrap: 'wrap',
|
|
25
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
26
|
-
height: "calc(".concat(editorToolbarHeight, " * 2)")
|
|
27
|
-
}));
|
|
28
|
-
};
|
|
29
|
-
var flexibleIconSize = (0, _react.css)({
|
|
30
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
31
|
-
'& span svg': {
|
|
32
|
-
maxWidth: '100%'
|
|
33
|
-
}
|
|
34
|
-
});
|
|
35
|
-
var mainToolbar = function mainToolbar() {
|
|
36
|
-
var editorToolbarHeight = (0, _editorSharedStyles.FULL_PAGE_EDITOR_TOOLBAR_HEIGHT)();
|
|
37
|
-
return (0, _react.css)((0, _defineProperty2.default)({
|
|
38
|
-
position: 'relative',
|
|
39
|
-
alignItems: 'center',
|
|
40
|
-
boxShadow: 'none',
|
|
41
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
42
|
-
borderBottom: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #091E4224)"),
|
|
43
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
44
|
-
transition: "box-shadow 200ms ".concat(_editorSharedStyles.akEditorSwoopCubicBezier),
|
|
45
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
46
|
-
zIndex: _editorSharedStyles.akEditorFloatingDialogZIndex,
|
|
47
|
-
display: 'flex',
|
|
48
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
49
|
-
height: editorToolbarHeight,
|
|
50
|
-
flexShrink: 0,
|
|
51
|
-
backgroundColor: "var(--ds-surface, white)",
|
|
52
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
53
|
-
'& object': {
|
|
54
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
|
|
55
|
-
height: '0 !important'
|
|
56
|
-
}
|
|
57
|
-
}, "@media (max-width: ".concat(_editorSharedStyles.akEditorMobileMaxWidth, "px)"), {
|
|
58
|
-
display: 'grid',
|
|
59
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
60
|
-
height: "calc(".concat(editorToolbarHeight, " * 2)")
|
|
61
|
-
}),
|
|
62
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/platform/ensure-feature-flag-registration, @atlaskit/ui-styling-standard/no-unsafe-values
|
|
63
|
-
(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && flexibleIconSize);
|
|
64
|
-
};
|
|
65
|
-
var mainToolbarStyle = exports.mainToolbarStyle = function mainToolbarStyle(showKeyline, twoLineEditorToolbar) {
|
|
66
|
-
return [mainToolbar, showKeyline && mainToolbarWithKeyline, twoLineEditorToolbar && mainToolbarTwoLineStyle];
|
|
67
|
-
};
|
|
68
|
-
|
|
69
15
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
70
16
|
var mainToolbarIconBeforeStyle = exports.mainToolbarIconBeforeStyle = (0, _react.css)((0, _defineProperty2.default)({
|
|
71
17
|
margin: "var(--ds-space-200, 16px)",
|
|
@@ -10,8 +10,6 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
10
10
|
var _react2 = require("@emotion/react");
|
|
11
11
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
12
12
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
13
|
-
var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
|
|
14
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
15
13
|
var _MainToolbar = require("./MainToolbar");
|
|
16
14
|
/**
|
|
17
15
|
* @jsxRuntime classic
|
|
@@ -57,7 +55,7 @@ var mainToolbarTwoLineStyle = (0, _react2.css)((0, _defineProperty2.default)({},
|
|
|
57
55
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
58
56
|
height: "calc(var(--ak-editor-fullpage-toolbar-height) * 2)"
|
|
59
57
|
}));
|
|
60
|
-
var
|
|
58
|
+
var MainToolbarWrapper = exports.MainToolbarWrapper = function MainToolbarWrapper(_ref) {
|
|
61
59
|
var showKeyline = _ref.showKeyline,
|
|
62
60
|
twoLineEditorToolbar = _ref.twoLineEditorToolbar,
|
|
63
61
|
children = _ref.children,
|
|
@@ -67,31 +65,4 @@ var MainToolbarWrapperNext = function MainToolbarWrapperNext(_ref) {
|
|
|
67
65
|
css: [baseToolbarStyles, (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && flexibleIconSize, showKeyline && mainToolbarWithKeyline, twoLineEditorToolbar && mainToolbarTwoLineStyle],
|
|
68
66
|
"data-testid": testId
|
|
69
67
|
}, children);
|
|
70
|
-
};
|
|
71
|
-
|
|
72
|
-
/**
|
|
73
|
-
* Original version of the toolbar wrapper using dynamic styles
|
|
74
|
-
*/
|
|
75
|
-
var MainToolbarWrapperOld = function MainToolbarWrapperOld(_ref2) {
|
|
76
|
-
var showKeyline = _ref2.showKeyline,
|
|
77
|
-
twoLineEditorToolbar = _ref2.twoLineEditorToolbar,
|
|
78
|
-
children = _ref2.children,
|
|
79
|
-
testId = _ref2['data-testid'];
|
|
80
|
-
return (0, _react2.jsx)("div", {
|
|
81
|
-
css:
|
|
82
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
|
|
83
|
-
(0, _MainToolbar.mainToolbarStyle)(showKeyline, twoLineEditorToolbar),
|
|
84
|
-
"data-testid": testId
|
|
85
|
-
}, children);
|
|
86
|
-
};
|
|
87
|
-
|
|
88
|
-
/**
|
|
89
|
-
* Wrapper component for the main toolbar that handles feature flag based styling
|
|
90
|
-
* @example
|
|
91
|
-
* <MainToolbarWrapper showKeyline={true} twoLineEditorToolbar={false}>
|
|
92
|
-
* <ToolbarContent />
|
|
93
|
-
* </MainToolbarWrapper>
|
|
94
|
-
*/
|
|
95
|
-
var MainToolbarWrapper = exports.MainToolbarWrapper = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
|
|
96
|
-
return (0, _expValEquals.expValEquals)('platform_editor_core_static_emotion_non_central', 'isEnabled', true);
|
|
97
|
-
}, MainToolbarWrapperNext, MainToolbarWrapperOld);
|
|
68
|
+
};
|
|
@@ -3,9 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.sidebarArea = exports.fullPageEditorWrapper = exports.editorContentAreaHideContainer = exports.contentAreaWrapper =
|
|
6
|
+
exports.sidebarArea = exports.fullPageEditorWrapper = exports.editorContentAreaHideContainer = exports.contentAreaWrapper = void 0;
|
|
7
7
|
var _react = require("@emotion/react");
|
|
8
|
-
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
9
8
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
10
9
|
|
|
11
10
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
@@ -17,29 +16,6 @@ var fullPageEditorWrapper = exports.fullPageEditorWrapper = (0, _react.css)({
|
|
|
17
16
|
boxSizing: 'border-box'
|
|
18
17
|
});
|
|
19
18
|
|
|
20
|
-
// delete when cleaning up experiment `platform_editor_core_static_emotion_non_central`
|
|
21
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
22
|
-
var contentArea = exports.contentArea = function contentArea() {
|
|
23
|
-
var editorToolbarHeight = (0, _editorSharedStyles.FULL_PAGE_EDITOR_TOOLBAR_HEIGHT)();
|
|
24
|
-
return (0, _react.css)({
|
|
25
|
-
display: 'flex',
|
|
26
|
-
flexDirection: 'row',
|
|
27
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
28
|
-
height: "calc(100% - ".concat(editorToolbarHeight, ")"),
|
|
29
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
|
|
30
|
-
'&.ak-editor-content-area-no-toolbar': {
|
|
31
|
-
// The editor toolbar height is 1px off (from the border) -- so we need to add 1px to the height
|
|
32
|
-
// to match the toolbar height
|
|
33
|
-
height: "calc(100% + 1px)"
|
|
34
|
-
},
|
|
35
|
-
boxSizing: 'border-box',
|
|
36
|
-
margin: 0,
|
|
37
|
-
padding: 0,
|
|
38
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
39
|
-
transition: "padding 0ms ".concat(_editorSharedStyles.akEditorSwoopCubicBezier)
|
|
40
|
-
});
|
|
41
|
-
};
|
|
42
|
-
|
|
43
19
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
44
20
|
var contentAreaWrapper = exports.contentAreaWrapper = (0, _react.css)({
|
|
45
21
|
width: '100%',
|