@atlaskit/editor-core 207.14.1 → 207.14.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +22 -0
- package/dist/cjs/presets/universal.js +3 -1
- package/dist/cjs/ui/ContentStyles/index.js +6 -18
- package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js +5 -7
- package/dist/cjs/ui/EditorContentContainer/styles/firstBlockNodeStyles.js +1 -14
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/presets/universal.js +3 -1
- package/dist/es2019/ui/ContentStyles/index.js +1 -37
- package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js +3 -12
- package/dist/es2019/ui/EditorContentContainer/styles/firstBlockNodeStyles.js +0 -18
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/presets/universal.js +3 -1
- package/dist/esm/ui/ContentStyles/index.js +5 -17
- package/dist/esm/ui/EditorContentContainer/EditorContentContainer.js +6 -8
- package/dist/esm/ui/EditorContentContainer/styles/firstBlockNodeStyles.js +0 -13
- package/dist/esm/version-wrapper.js +1 -1
- package/dist/types/ui/ContentStyles/index.d.ts +0 -5
- package/dist/types/ui/EditorContentContainer/styles/firstBlockNodeStyles.d.ts +0 -1
- package/dist/types-ts4.5/ui/ContentStyles/index.d.ts +0 -5
- package/dist/types-ts4.5/ui/EditorContentContainer/styles/firstBlockNodeStyles.d.ts +0 -1
- package/package.json +5 -12
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,27 @@
|
|
|
1
1
|
# @atlaskit/editor-core
|
|
2
2
|
|
|
3
|
+
## 207.14.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#163976](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/163976)
|
|
8
|
+
[`e1f24a28eb731`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e1f24a28eb731) -
|
|
9
|
+
[ED-28113] add integration test for resizing to the fullwidth guideline in the
|
|
10
|
+
platform_editor_breakout_resizing resizing experience
|
|
11
|
+
- [#163378](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/163378)
|
|
12
|
+
[`8d7ed16b4071a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8d7ed16b4071a) -
|
|
13
|
+
Cleanup of FG editor_request_to_edit_task
|
|
14
|
+
- Updated dependencies
|
|
15
|
+
|
|
16
|
+
## 207.14.2
|
|
17
|
+
|
|
18
|
+
### Patch Changes
|
|
19
|
+
|
|
20
|
+
- [#164239](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/164239)
|
|
21
|
+
[`c60b974cf14cf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c60b974cf14cf) -
|
|
22
|
+
tidy up hr styles fix for first block node
|
|
23
|
+
- Updated dependencies
|
|
24
|
+
|
|
3
25
|
## 207.14.1
|
|
4
26
|
|
|
5
27
|
### Patch Changes
|
|
@@ -118,7 +118,9 @@ function createUniversalPresetInternal(_ref) {
|
|
|
118
118
|
appearance: appearance,
|
|
119
119
|
allowInteractiveExpand: typeof props.allowExpand === 'boolean' ? props.allowExpand : Boolean(props.allowExpand && props.allowExpand.allowInteractiveExpand !== false),
|
|
120
120
|
__livePage: props.__livePage
|
|
121
|
-
}], Boolean(props.allowExpand)).maybeAdd(_guideline.guidelinePlugin, Boolean(!isComment && !isChromeless && (props.media || props.allowTables))
|
|
121
|
+
}], Boolean(props.allowExpand)).maybeAdd(_guideline.guidelinePlugin, Boolean(!isComment && !isChromeless && (props.media || props.allowTables) || (0, _experiments.editorExperiment)('platform_editor_breakout_resizing', true, {
|
|
122
|
+
exposure: true
|
|
123
|
+
}) && (props.allowExpand || props.allowLayouts || props.codeBlock))).maybeAdd([_grid.gridPlugin, {
|
|
122
124
|
shouldCalcBreakoutGridLines: isFullPage
|
|
123
125
|
}], Boolean(props.media)).maybeAdd([_annotation.annotationPlugin, props.annotationProviders], Boolean(props.annotationProviders)).maybeAdd([_media.mediaPlugin, _objectSpread(_objectSpread({}, props.media), {}, {
|
|
124
126
|
allowLazyLoading: true,
|
|
@@ -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.placeholderStyles = exports.linkStyles = exports.
|
|
8
|
+
exports.placeholderStyles = exports.linkStyles = exports.default = exports.createEditorContentStyle = void 0;
|
|
9
9
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
11
|
var _react2 = require("@emotion/react");
|
|
@@ -35,7 +35,7 @@ var _media = require("./media");
|
|
|
35
35
|
var _panel2 = require("./panel");
|
|
36
36
|
var _status = require("./status");
|
|
37
37
|
var _tasksAndDecisions = require("./tasks-and-decisions");
|
|
38
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10
|
|
38
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10;
|
|
39
39
|
/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
|
|
40
40
|
/* eslint-disable react-hooks/rules-of-hooks */
|
|
41
41
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Requires manual remediation over time due to use of unsafe nested mixins */
|
|
@@ -134,19 +134,7 @@ var placeholderWrapStyles = (0, _react2.css)({
|
|
|
134
134
|
whiteSpace: 'nowrap'
|
|
135
135
|
}
|
|
136
136
|
});
|
|
137
|
-
var
|
|
138
|
-
var firstBlockNodeStylesNew = (0, _react2.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> div[data-task-list-local-id],\n\t\t> div[data-layout-section],\n\t\t> .", " {\n\t\t\t&:first-child {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t> hr:first-child,\n\t\t> .ProseMirror-widget:first-child + hr {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n"])), _panel.PanelSharedCssClassName.prefix, _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, _styles.SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, _styles.expandClassNames.prefix);
|
|
139
|
-
|
|
140
|
-
/**
|
|
141
|
-
* fix layout issue of first block node
|
|
142
|
-
* @example
|
|
143
|
-
*/
|
|
144
|
-
var fixBlockControlStylesSSR = exports.fixBlockControlStylesSSR = function fixBlockControlStylesSSR() {
|
|
145
|
-
if ((0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_6')) {
|
|
146
|
-
return firstBlockNodeStylesNew;
|
|
147
|
-
}
|
|
148
|
-
return firstBlockNodeStyles;
|
|
149
|
-
};
|
|
137
|
+
var firstBlockNodeStylesNew = (0, _react2.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> div[data-task-list-local-id],\n\t\t> div[data-layout-section],\n\t\t> .", " {\n\t\t\t&:first-child {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t> hr:first-child,\n\t\t> .ProseMirror-widget:first-child + hr {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n"])), _panel.PanelSharedCssClassName.prefix, _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, _styles.SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, _styles.expandClassNames.prefix);
|
|
150
138
|
|
|
151
139
|
// The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
|
|
152
140
|
var akEditorBreakpointForSmallDevice = "1266px";
|
|
@@ -156,9 +144,9 @@ var akEditorBreakpointForSmallDevice = "1266px";
|
|
|
156
144
|
// Under editor experiment platform_editor_core_static_emotion
|
|
157
145
|
// If you are making changes to this file, please make sure to update in EditorContentContainer.tsx as well
|
|
158
146
|
var legacyContentStyles = function legacyContentStyles(props) {
|
|
159
|
-
return (0, _react2.css)(
|
|
147
|
+
return (0, _react2.css)(_templateObject9 || (_templateObject9 = (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--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.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\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.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 * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\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\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 ", "\n ", "\n /* Switch between the two icons based on the visual refresh feature gate */\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\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, _editorSharedStyles.editorFontSize)({
|
|
160
148
|
theme: props.theme
|
|
161
|
-
}), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('
|
|
149
|
+
}), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (0, _react2.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, (0, _experiments.editorExperiment)('platform_editor_advanced_code_blocks', true) ? (0, _react2.css)(_templateObject1 || (_templateObject1 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", _styles5.placeholderTextStyles, placeholderStyles, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(props.typographyTheme), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, (0, _styles.backgroundColorStyles)(), listsStyles, ruleStyles(), (0, _media.mediaStyles)(), (0, _layout.layoutStyles)(props.viewMode), (0, _platformFeatureFlags.fg)('confluence_team_presence_scroll_to_pointer') ? _collab.telepointerStyle : _collab.telepointerStyleWithInitialOnly, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
162
150
|
exposure: false
|
|
163
151
|
}) && vanillaMentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
164
152
|
exposure: false
|
|
@@ -172,7 +160,7 @@ var legacyContentStyles = function legacyContentStyles(props) {
|
|
|
172
160
|
exposure: false
|
|
173
161
|
}) && (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithVisualRefresh, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
174
162
|
exposure: false
|
|
175
|
-
}) && !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithoutVisualRefresh, _status.statusStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? (0, _status.vanillaStatusStyles)() : null, (0, _styles.annotationSharedStyles)(), (0, _styles.smartCardStyles)(), (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') ? (0, _styles.getSmartCardSharedStyles)() : _styles.smartCardSharedStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? _date.dateVanillaStyles : null, _date.dateStyles, (0, _styles.embedCardStyles)(), _styles.unsupportedStyles, _styles.resizerStyles, (0, _styles.pragmaticResizerStyles)(), (0, _aiPanels.aiPanelStyles)(props.colorMode),
|
|
163
|
+
}) && !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithoutVisualRefresh, _status.statusStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? (0, _status.vanillaStatusStyles)() : null, (0, _styles.annotationSharedStyles)(), (0, _styles.smartCardStyles)(), (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') ? (0, _styles.getSmartCardSharedStyles)() : _styles.smartCardSharedStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? _date.dateVanillaStyles : null, _date.dateStyles, (0, _styles.embedCardStyles)(), _styles.unsupportedStyles, _styles.resizerStyles, (0, _styles.pragmaticResizerStyles)(), (0, _aiPanels.aiPanelStyles)(props.colorMode), firstBlockNodeStylesNew, _styles.MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? (0, _react2.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
|
|
176
164
|
};
|
|
177
165
|
var listLayoutShiftFix = (0, _react2.css)({
|
|
178
166
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
@@ -55,7 +55,7 @@ var _telepointerStyles = require("./styles/telepointerStyles");
|
|
|
55
55
|
var _textColorStyles = require("./styles/textColorStyles");
|
|
56
56
|
var _unsupportedStyles = require("./styles/unsupportedStyles");
|
|
57
57
|
var _whitespaceStyles = require("./styles/whitespaceStyles");
|
|
58
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4
|
|
58
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
59
59
|
/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
|
|
60
60
|
/* eslint-disable react-hooks/rules-of-hooks */
|
|
61
61
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Requires manual remediation over time due to use of unsafe nested mixins */
|
|
@@ -105,7 +105,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
|
|
|
105
105
|
|
|
106
106
|
// jest warning: JSDOM version (22) doesn't support the new @container CSS rule
|
|
107
107
|
var contentStyles = function contentStyles() {
|
|
108
|
-
return (0, _react2.css)(_templateObject || (_templateObject = (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--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.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\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.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: var(--ak-editor-base-font-size);\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\t}\n\n\t
|
|
108
|
+
return (0, _react2.css)(_templateObject || (_templateObject = (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--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.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\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.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: var(--ak-editor-base-font-size);\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\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 * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\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\n\t", "\n\n\t", "\n\n\t", "\n\n\t", "\n\n\t", "\n\t", "\n \t", "\n\n\n \t", "\n\n\t", "\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n /* This needs to be after telepointer styles as some overlapping rules have equal specificity, and so the order is significant */\n ", "\n\n ", ";\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n // Switch between the two icons based on the visual refresh feature gate\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n\t.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\t// Related code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\t// In 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\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n\t 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, _whitespaceStyles.whitespaceStyles, _indentationStyles.indentationStyles, _shadowStyles.shadowStyles, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, (0, _experiments.editorExperiment)('platform_editor_advanced_code_blocks', true) ? (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", _styles4.placeholderTextStyles, placeholderStyles, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, _codeBlockStyles.codeBlockStyles, !(0, _platformFeatureFlags.fg)('platform_editor_typography_ugc') && _editorUGCTokenStyles.editorUGCTokensDefault,
|
|
109
109
|
// eslint-disable-next-line @atlaskit/platform/no-preconditioning
|
|
110
110
|
(0, _platformFeatureFlags.fg)('platform_editor_typography_ugc') && ( /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
|
|
111
111
|
(0, _platformFeatureFlags.fg)('platform-dst-jira-web-fonts') || (0, _platformFeatureFlags.fg)('confluence_typography_refreshed') || (0, _platformFeatureFlags.fg)('atlas_editor_typography_refreshed')) && _editorUGCTokenStyles.editorUGCTokensRefreshed
|
|
@@ -121,7 +121,7 @@ var contentStyles = function contentStyles() {
|
|
|
121
121
|
exposure: false
|
|
122
122
|
}) && (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithVisualRefresh, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
123
123
|
exposure: false
|
|
124
|
-
}) && !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithoutVisualRefresh, _status.statusStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? (0, _status.vanillaStatusStyles)() : null, _annotationStyles.annotationStyles, _smartCardStyles.smartCardStyles, _embedCardStyles.embedCardStyles, _unsupportedStyles.unsupportedStyles, _resizerStyles.resizerStyles, !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? (0, _react2.css)(
|
|
124
|
+
}) && !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithoutVisualRefresh, _status.statusStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? (0, _status.vanillaStatusStyles)() : null, _annotationStyles.annotationStyles, _smartCardStyles.smartCardStyles, _embedCardStyles.embedCardStyles, _unsupportedStyles.unsupportedStyles, _resizerStyles.resizerStyles, !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? (0, _react2.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
|
|
125
125
|
};
|
|
126
126
|
var CommentEditorMargin = 14;
|
|
127
127
|
|
|
@@ -225,11 +225,9 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
|
|
|
225
225
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
226
226
|
_codeBlockStyles.firstCodeBlockWithNoMargin :
|
|
227
227
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
228
|
-
_codeBlockStyles.firstCodeBlockWithNoMarginOld,
|
|
228
|
+
_codeBlockStyles.firstCodeBlockWithNoMarginOld,
|
|
229
229
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
230
|
-
_firstBlockNodeStyles.firstBlockNodeStyles
|
|
231
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
232
|
-
_firstBlockNodeStyles.firstBlockNodeStylesOld, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
230
|
+
_firstBlockNodeStyles.firstBlockNodeStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
233
231
|
exposure: false
|
|
234
232
|
}) &&
|
|
235
233
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.
|
|
7
|
+
exports.firstBlockNodeStyles = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _react = require("@emotion/react");
|
|
10
10
|
var _panel = require("@atlaskit/editor-common/panel");
|
|
@@ -12,19 +12,6 @@ var _styles = require("@atlaskit/editor-common/styles");
|
|
|
12
12
|
var _codeBlockStyles = require("./codeBlockStyles");
|
|
13
13
|
// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
|
|
14
14
|
|
|
15
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
16
|
-
var firstBlockNodeStylesOld = exports.firstBlockNodeStylesOld = (0, _react.css)({
|
|
17
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
18
|
-
'.ProseMirror': (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "> .".concat(_panel.PanelSharedCssClassName.prefix, ", > .").concat(_codeBlockStyles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, ", > .").concat(_styles.SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, ", > div[data-task-list-local-id], > div[data-layout-section], > .").concat(_styles.expandClassNames.prefix), {
|
|
19
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
20
|
-
'&:first-child': {
|
|
21
|
-
marginTop: 0
|
|
22
|
-
}
|
|
23
|
-
}), '> hr:first-of-type', {
|
|
24
|
-
marginTop: 0
|
|
25
|
-
})
|
|
26
|
-
});
|
|
27
|
-
|
|
28
15
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
29
16
|
var firstBlockNodeStyles = exports.firstBlockNodeStyles = (0, _react.css)({
|
|
30
17
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
@@ -108,7 +108,9 @@ export default function createUniversalPresetInternal({
|
|
|
108
108
|
appearance: appearance,
|
|
109
109
|
allowInteractiveExpand: typeof props.allowExpand === 'boolean' ? props.allowExpand : Boolean(props.allowExpand && props.allowExpand.allowInteractiveExpand !== false),
|
|
110
110
|
__livePage: props.__livePage
|
|
111
|
-
}], Boolean(props.allowExpand)).maybeAdd(guidelinePlugin, Boolean(!isComment && !isChromeless && (props.media || props.allowTables)
|
|
111
|
+
}], Boolean(props.allowExpand)).maybeAdd(guidelinePlugin, Boolean(!isComment && !isChromeless && (props.media || props.allowTables) || editorExperiment('platform_editor_breakout_resizing', true, {
|
|
112
|
+
exposure: true
|
|
113
|
+
}) && (props.allowExpand || props.allowLayouts || props.codeBlock))).maybeAdd([gridPlugin, {
|
|
112
114
|
shouldCalcBreakoutGridLines: isFullPage
|
|
113
115
|
}], Boolean(props.media)).maybeAdd([annotationPlugin, props.annotationProviders], Boolean(props.annotationProviders)).maybeAdd([mediaPlugin, {
|
|
114
116
|
...props.media,
|
|
@@ -249,24 +249,6 @@ const placeholderWrapStyles = css({
|
|
|
249
249
|
whiteSpace: 'nowrap'
|
|
250
250
|
}
|
|
251
251
|
});
|
|
252
|
-
const firstBlockNodeStyles = css`
|
|
253
|
-
.ProseMirror {
|
|
254
|
-
> .${PanelSharedCssClassName.prefix},
|
|
255
|
-
> .${CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER},
|
|
256
|
-
> .${SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER},
|
|
257
|
-
> div[data-task-list-local-id],
|
|
258
|
-
> div[data-layout-section],
|
|
259
|
-
> .${expandClassNames.prefix} {
|
|
260
|
-
&:first-child {
|
|
261
|
-
margin-top: 0;
|
|
262
|
-
}
|
|
263
|
-
}
|
|
264
|
-
|
|
265
|
-
> hr:first-of-type {
|
|
266
|
-
margin-top: 0;
|
|
267
|
-
}
|
|
268
|
-
}
|
|
269
|
-
`;
|
|
270
252
|
const firstBlockNodeStylesNew = css`
|
|
271
253
|
.ProseMirror {
|
|
272
254
|
> .${PanelSharedCssClassName.prefix},
|
|
@@ -287,17 +269,6 @@ const firstBlockNodeStylesNew = css`
|
|
|
287
269
|
}
|
|
288
270
|
`;
|
|
289
271
|
|
|
290
|
-
/**
|
|
291
|
-
* fix layout issue of first block node
|
|
292
|
-
* @example
|
|
293
|
-
*/
|
|
294
|
-
export const fixBlockControlStylesSSR = () => {
|
|
295
|
-
if (fg('platform_editor_element_dnd_nested_fix_patch_6')) {
|
|
296
|
-
return firstBlockNodeStylesNew;
|
|
297
|
-
}
|
|
298
|
-
return firstBlockNodeStyles;
|
|
299
|
-
};
|
|
300
|
-
|
|
301
272
|
// The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
|
|
302
273
|
const akEditorBreakpointForSmallDevice = `1266px`;
|
|
303
274
|
|
|
@@ -357,13 +328,6 @@ const legacyContentStyles = props => css`
|
|
|
357
328
|
${InlineNodeViewSharedStyles};
|
|
358
329
|
}
|
|
359
330
|
|
|
360
|
-
${fg('editor_request_to_edit_task') ? null : css`
|
|
361
|
-
.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {
|
|
362
|
-
pointer-events: none;
|
|
363
|
-
opacity: 0.7;
|
|
364
|
-
}
|
|
365
|
-
`}
|
|
366
|
-
|
|
367
331
|
.ProseMirror-hideselection *::selection {
|
|
368
332
|
background: transparent;
|
|
369
333
|
}
|
|
@@ -471,7 +435,7 @@ const legacyContentStyles = props => css`
|
|
|
471
435
|
${resizerStyles}
|
|
472
436
|
${pragmaticResizerStyles()}
|
|
473
437
|
${aiPanelStyles(props.colorMode)}
|
|
474
|
-
${
|
|
438
|
+
${firstBlockNodeStylesNew}
|
|
475
439
|
|
|
476
440
|
.panelView-content-wrap {
|
|
477
441
|
box-sizing: border-box;
|
|
@@ -38,7 +38,7 @@ import { dateStyles, dateVanillaStyles } from './styles/dateStyles';
|
|
|
38
38
|
import { editorUGCTokensDefault, editorUGCTokensModernized, editorUGCTokensRefreshed } from './styles/editorUGCTokenStyles';
|
|
39
39
|
import { embedCardStyles } from './styles/embedCardStyles';
|
|
40
40
|
import { reactEmojiStyles, vanillaEmojiStyles } from './styles/emoji';
|
|
41
|
-
import { firstBlockNodeStyles
|
|
41
|
+
import { firstBlockNodeStyles } from './styles/firstBlockNodeStyles';
|
|
42
42
|
import { gridStyles } from './styles/gridStyles';
|
|
43
43
|
import { indentationStyles } from './styles/indentationStyles';
|
|
44
44
|
import { layoutBaseStyles, layoutViewStyles } from './styles/layout';
|
|
@@ -148,13 +148,6 @@ const contentStyles = () => css`
|
|
|
148
148
|
${InlineNodeViewSharedStyles};
|
|
149
149
|
}
|
|
150
150
|
|
|
151
|
-
${fg('editor_request_to_edit_task') ? null : css`
|
|
152
|
-
.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {
|
|
153
|
-
pointer-events: none;
|
|
154
|
-
opacity: 0.7;
|
|
155
|
-
}
|
|
156
|
-
`}
|
|
157
|
-
|
|
158
151
|
.ProseMirror-hideselection *::selection {
|
|
159
152
|
background: transparent;
|
|
160
153
|
}
|
|
@@ -471,11 +464,9 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
471
464
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
472
465
|
firstCodeBlockWithNoMargin :
|
|
473
466
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
474
|
-
firstCodeBlockWithNoMarginOld,
|
|
475
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
476
|
-
firstBlockNodeStyles :
|
|
467
|
+
firstCodeBlockWithNoMarginOld,
|
|
477
468
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
478
|
-
|
|
469
|
+
firstBlockNodeStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
479
470
|
exposure: false
|
|
480
471
|
}) &&
|
|
481
472
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
@@ -4,24 +4,6 @@ import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
|
|
|
4
4
|
import { expandClassNames, SmartCardSharedCssClassName } from '@atlaskit/editor-common/styles';
|
|
5
5
|
import { CodeBlockSharedCssClassName } from './codeBlockStyles';
|
|
6
6
|
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
8
|
-
export const firstBlockNodeStylesOld = css({
|
|
9
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
10
|
-
'.ProseMirror': {
|
|
11
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values,@atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
12
|
-
[`> .${PanelSharedCssClassName.prefix}, > .${CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER}, > .${SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER}, > div[data-task-list-local-id], > div[data-layout-section], > .${expandClassNames.prefix}`]: {
|
|
13
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
14
|
-
'&:first-child': {
|
|
15
|
-
marginTop: 0
|
|
16
|
-
}
|
|
17
|
-
},
|
|
18
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
19
|
-
'> hr:first-of-type': {
|
|
20
|
-
marginTop: 0
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
|
|
25
7
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
26
8
|
export const firstBlockNodeStyles = css({
|
|
27
9
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export const name = "@atlaskit/editor-core";
|
|
2
|
-
export const version = "207.14.
|
|
2
|
+
export const version = "207.14.3";
|
|
@@ -111,7 +111,9 @@ export default function createUniversalPresetInternal(_ref) {
|
|
|
111
111
|
appearance: appearance,
|
|
112
112
|
allowInteractiveExpand: typeof props.allowExpand === 'boolean' ? props.allowExpand : Boolean(props.allowExpand && props.allowExpand.allowInteractiveExpand !== false),
|
|
113
113
|
__livePage: props.__livePage
|
|
114
|
-
}], Boolean(props.allowExpand)).maybeAdd(guidelinePlugin, Boolean(!isComment && !isChromeless && (props.media || props.allowTables)
|
|
114
|
+
}], Boolean(props.allowExpand)).maybeAdd(guidelinePlugin, Boolean(!isComment && !isChromeless && (props.media || props.allowTables) || editorExperiment('platform_editor_breakout_resizing', true, {
|
|
115
|
+
exposure: true
|
|
116
|
+
}) && (props.allowExpand || props.allowLayouts || props.codeBlock))).maybeAdd([gridPlugin, {
|
|
115
117
|
shouldCalcBreakoutGridLines: isFullPage
|
|
116
118
|
}], Boolean(props.media)).maybeAdd([annotationPlugin, props.annotationProviders], Boolean(props.annotationProviders)).maybeAdd([mediaPlugin, _objectSpread(_objectSpread({}, props.media), {}, {
|
|
117
119
|
allowLazyLoading: true,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
|
2
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10
|
|
2
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10;
|
|
3
3
|
/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
|
|
4
4
|
/* eslint-disable react-hooks/rules-of-hooks */
|
|
5
5
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Requires manual remediation over time due to use of unsafe nested mixins */
|
|
@@ -127,19 +127,7 @@ var placeholderWrapStyles = css({
|
|
|
127
127
|
whiteSpace: 'nowrap'
|
|
128
128
|
}
|
|
129
129
|
});
|
|
130
|
-
var
|
|
131
|
-
var firstBlockNodeStylesNew = css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> div[data-task-list-local-id],\n\t\t> div[data-layout-section],\n\t\t> .", " {\n\t\t\t&:first-child {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t> hr:first-child,\n\t\t> .ProseMirror-widget:first-child + hr {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n"])), PanelSharedCssClassName.prefix, CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, expandClassNames.prefix);
|
|
132
|
-
|
|
133
|
-
/**
|
|
134
|
-
* fix layout issue of first block node
|
|
135
|
-
* @example
|
|
136
|
-
*/
|
|
137
|
-
export var fixBlockControlStylesSSR = function fixBlockControlStylesSSR() {
|
|
138
|
-
if (fg('platform_editor_element_dnd_nested_fix_patch_6')) {
|
|
139
|
-
return firstBlockNodeStylesNew;
|
|
140
|
-
}
|
|
141
|
-
return firstBlockNodeStyles;
|
|
142
|
-
};
|
|
130
|
+
var firstBlockNodeStylesNew = css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> div[data-task-list-local-id],\n\t\t> div[data-layout-section],\n\t\t> .", " {\n\t\t\t&:first-child {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t> hr:first-child,\n\t\t> .ProseMirror-widget:first-child + hr {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n"])), PanelSharedCssClassName.prefix, CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, expandClassNames.prefix);
|
|
143
131
|
|
|
144
132
|
// The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
|
|
145
133
|
var akEditorBreakpointForSmallDevice = "1266px";
|
|
@@ -149,9 +137,9 @@ var akEditorBreakpointForSmallDevice = "1266px";
|
|
|
149
137
|
// Under editor experiment platform_editor_core_static_emotion
|
|
150
138
|
// If you are making changes to this file, please make sure to update in EditorContentContainer.tsx as well
|
|
151
139
|
var legacyContentStyles = function legacyContentStyles(props) {
|
|
152
|
-
return css(
|
|
140
|
+
return css(_templateObject9 || (_templateObject9 = _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--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.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\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.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 * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\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\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 ", "\n ", "\n /* Switch between the two icons based on the visual refresh feature gate */\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\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, editorFontSize({
|
|
153
141
|
theme: props.theme
|
|
154
|
-
}), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('
|
|
142
|
+
}), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject1 || (_templateObject1 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", placeholderTextStyles, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(props.typographyTheme), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles(), listsStyles, ruleStyles(), mediaStyles(), layoutStyles(props.viewMode), fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
155
143
|
exposure: false
|
|
156
144
|
}) && vanillaMentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
157
145
|
exposure: false
|
|
@@ -165,7 +153,7 @@ var legacyContentStyles = function legacyContentStyles(props) {
|
|
|
165
153
|
exposure: false
|
|
166
154
|
}) && fg('platform-visual-refresh-icons') && vanillaDecisionIconWithVisualRefresh, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
167
155
|
exposure: false
|
|
168
|
-
}) && !fg('platform-visual-refresh-icons') && vanillaDecisionIconWithoutVisualRefresh, statusStyles, editorExperiment('platform_editor_vanilla_dom', true) ? vanillaStatusStyles() : null, annotationSharedStyles(), smartCardStyles(), fg('platform-linking-visual-refresh-v1') ? getSmartCardSharedStyles() : smartCardSharedStyles, editorExperiment('platform_editor_vanilla_dom', true) ? dateVanillaStyles : null, dateStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), aiPanelStyles(props.colorMode),
|
|
156
|
+
}) && !fg('platform-visual-refresh-icons') && vanillaDecisionIconWithoutVisualRefresh, statusStyles, editorExperiment('platform_editor_vanilla_dom', true) ? vanillaStatusStyles() : null, annotationSharedStyles(), smartCardStyles(), fg('platform-linking-visual-refresh-v1') ? getSmartCardSharedStyles() : smartCardSharedStyles, editorExperiment('platform_editor_vanilla_dom', true) ? dateVanillaStyles : null, dateStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), aiPanelStyles(props.colorMode), firstBlockNodeStylesNew, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !fg('platform-visual-refresh-icons') ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
|
|
169
157
|
};
|
|
170
158
|
var listLayoutShiftFix = css({
|
|
171
159
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
|
2
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4
|
|
2
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
3
3
|
/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
|
|
4
4
|
/* eslint-disable react-hooks/rules-of-hooks */
|
|
5
5
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Requires manual remediation over time due to use of unsafe nested mixins */
|
|
@@ -40,7 +40,7 @@ import { dateStyles, dateVanillaStyles } from './styles/dateStyles';
|
|
|
40
40
|
import { editorUGCTokensDefault, editorUGCTokensModernized, editorUGCTokensRefreshed } from './styles/editorUGCTokenStyles';
|
|
41
41
|
import { embedCardStyles } from './styles/embedCardStyles';
|
|
42
42
|
import { reactEmojiStyles, vanillaEmojiStyles } from './styles/emoji';
|
|
43
|
-
import { firstBlockNodeStyles
|
|
43
|
+
import { firstBlockNodeStyles } from './styles/firstBlockNodeStyles';
|
|
44
44
|
import { gridStyles } from './styles/gridStyles';
|
|
45
45
|
import { indentationStyles } from './styles/indentationStyles';
|
|
46
46
|
import { layoutBaseStyles, layoutViewStyles } from './styles/layout';
|
|
@@ -99,7 +99,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
|
|
|
99
99
|
|
|
100
100
|
// jest warning: JSDOM version (22) doesn't support the new @container CSS rule
|
|
101
101
|
var contentStyles = function contentStyles() {
|
|
102
|
-
return css(_templateObject || (_templateObject = _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--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.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\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.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: var(--ak-editor-base-font-size);\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\t}\n\n\t
|
|
102
|
+
return css(_templateObject || (_templateObject = _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--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.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\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.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: var(--ak-editor-base-font-size);\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\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 * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\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\n\t", "\n\n\t", "\n\n\t", "\n\n\t", "\n\n\t", "\n\t", "\n \t", "\n\n\n \t", "\n\n\t", "\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n /* This needs to be after telepointer styles as some overlapping rules have equal specificity, and so the order is significant */\n ", "\n\n ", ";\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n // Switch between the two icons based on the visual refresh feature gate\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n\t.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\t// Related code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\t// In 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\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n\t is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, whitespaceStyles, indentationStyles, shadowStyles, InlineNodeViewSharedStyles, fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", placeholderTextStyles, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles, !fg('platform_editor_typography_ugc') && editorUGCTokensDefault,
|
|
103
103
|
// eslint-disable-next-line @atlaskit/platform/no-preconditioning
|
|
104
104
|
fg('platform_editor_typography_ugc') && ( /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
|
|
105
105
|
fg('platform-dst-jira-web-fonts') || fg('confluence_typography_refreshed') || fg('atlas_editor_typography_refreshed')) && editorUGCTokensRefreshed
|
|
@@ -115,7 +115,7 @@ var contentStyles = function contentStyles() {
|
|
|
115
115
|
exposure: false
|
|
116
116
|
}) && fg('platform-visual-refresh-icons') && vanillaDecisionIconWithVisualRefresh, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
117
117
|
exposure: false
|
|
118
|
-
}) && !fg('platform-visual-refresh-icons') && vanillaDecisionIconWithoutVisualRefresh, statusStyles, editorExperiment('platform_editor_vanilla_dom', true) ? vanillaStatusStyles() : null, annotationStyles, smartCardStyles, embedCardStyles, unsupportedStyles, resizerStyles, !fg('platform-visual-refresh-icons') ? css(
|
|
118
|
+
}) && !fg('platform-visual-refresh-icons') && vanillaDecisionIconWithoutVisualRefresh, statusStyles, editorExperiment('platform_editor_vanilla_dom', true) ? vanillaStatusStyles() : null, annotationStyles, smartCardStyles, embedCardStyles, unsupportedStyles, resizerStyles, !fg('platform-visual-refresh-icons') ? css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
|
|
119
119
|
};
|
|
120
120
|
var CommentEditorMargin = 14;
|
|
121
121
|
|
|
@@ -219,11 +219,9 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
|
|
|
219
219
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
220
220
|
firstCodeBlockWithNoMargin :
|
|
221
221
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
222
|
-
firstCodeBlockWithNoMarginOld,
|
|
222
|
+
firstCodeBlockWithNoMarginOld,
|
|
223
223
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
224
|
-
firstBlockNodeStyles
|
|
225
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
226
|
-
firstBlockNodeStylesOld, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
224
|
+
firstBlockNodeStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
227
225
|
exposure: false
|
|
228
226
|
}) &&
|
|
229
227
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
@@ -5,19 +5,6 @@ import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
|
|
|
5
5
|
import { expandClassNames, SmartCardSharedCssClassName } from '@atlaskit/editor-common/styles';
|
|
6
6
|
import { CodeBlockSharedCssClassName } from './codeBlockStyles';
|
|
7
7
|
|
|
8
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
9
|
-
export var firstBlockNodeStylesOld = css({
|
|
10
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
11
|
-
'.ProseMirror': _defineProperty(_defineProperty({}, "> .".concat(PanelSharedCssClassName.prefix, ", > .").concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, ", > .").concat(SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, ", > div[data-task-list-local-id], > div[data-layout-section], > .").concat(expandClassNames.prefix), {
|
|
12
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
13
|
-
'&:first-child': {
|
|
14
|
-
marginTop: 0
|
|
15
|
-
}
|
|
16
|
-
}), '> hr:first-of-type', {
|
|
17
|
-
marginTop: 0
|
|
18
|
-
})
|
|
19
|
-
});
|
|
20
|
-
|
|
21
8
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
22
9
|
export var firstBlockNodeStyles = css({
|
|
23
10
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export var name = "@atlaskit/editor-core";
|
|
2
|
-
export var version = "207.14.
|
|
2
|
+
export var version = "207.14.3";
|
|
@@ -17,11 +17,6 @@ type ContentStylesProps = {
|
|
|
17
17
|
appearance?: EditorAppearance;
|
|
18
18
|
};
|
|
19
19
|
export declare const placeholderStyles: SerializedStyles;
|
|
20
|
-
/**
|
|
21
|
-
* fix layout issue of first block node
|
|
22
|
-
* @example
|
|
23
|
-
*/
|
|
24
|
-
export declare const fixBlockControlStylesSSR: () => SerializedStyles;
|
|
25
20
|
type Props = ContentStylesProps & React.HTMLProps<HTMLDivElement>;
|
|
26
21
|
export declare const createEditorContentStyle: (styles?: SerializedStyles) => React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
27
22
|
declare const _default: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -17,11 +17,6 @@ type ContentStylesProps = {
|
|
|
17
17
|
appearance?: EditorAppearance;
|
|
18
18
|
};
|
|
19
19
|
export declare const placeholderStyles: SerializedStyles;
|
|
20
|
-
/**
|
|
21
|
-
* fix layout issue of first block node
|
|
22
|
-
* @example
|
|
23
|
-
*/
|
|
24
|
-
export declare const fixBlockControlStylesSSR: () => SerializedStyles;
|
|
25
20
|
type Props = ContentStylesProps & React.HTMLProps<HTMLDivElement>;
|
|
26
21
|
export declare const createEditorContentStyle: (styles?: SerializedStyles) => React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
27
22
|
declare const _default: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-core",
|
|
3
|
-
"version": "207.14.
|
|
3
|
+
"version": "207.14.3",
|
|
4
4
|
"description": "A package contains Atlassian editor core functionality",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
"@atlaskit/activity-provider": "^2.5.0",
|
|
43
43
|
"@atlaskit/adf-schema": "^47.6.0",
|
|
44
44
|
"@atlaskit/analytics-namespaced-context": "^7.0.0",
|
|
45
|
-
"@atlaskit/analytics-next": "^11.
|
|
45
|
+
"@atlaskit/analytics-next": "^11.1.0",
|
|
46
46
|
"@atlaskit/analytics-next-stable-react-context": "1.0.1",
|
|
47
47
|
"@atlaskit/button": "^23.2.0",
|
|
48
48
|
"@atlaskit/css": "^0.10.0",
|
|
@@ -62,8 +62,8 @@
|
|
|
62
62
|
"@atlaskit/platform-feature-flags-react": "^0.2.0",
|
|
63
63
|
"@atlaskit/react-ufo": "^3.13.0",
|
|
64
64
|
"@atlaskit/task-decision": "^19.2.0",
|
|
65
|
-
"@atlaskit/tmp-editor-statsig": "^5.
|
|
66
|
-
"@atlaskit/tokens": "^
|
|
65
|
+
"@atlaskit/tmp-editor-statsig": "^5.8.0",
|
|
66
|
+
"@atlaskit/tokens": "^5.0.0",
|
|
67
67
|
"@atlaskit/tooltip": "^20.2.0",
|
|
68
68
|
"@atlaskit/width-detector": "^5.0.0",
|
|
69
69
|
"@babel/runtime": "^7.0.0",
|
|
@@ -96,7 +96,7 @@
|
|
|
96
96
|
"@atlaskit/editor-plugin-list": "^4.2.0",
|
|
97
97
|
"@atlaskit/editor-plugin-paste": "^3.3.0",
|
|
98
98
|
"@atlaskit/link-provider": "^3.2.0",
|
|
99
|
-
"@atlaskit/logo": "^
|
|
99
|
+
"@atlaskit/logo": "^19.0.0",
|
|
100
100
|
"@atlaskit/media-core": "^36.1.0",
|
|
101
101
|
"@atlaskit/media-integration-test-helpers": "workspace:^",
|
|
102
102
|
"@atlaskit/media-test-helpers": "^36.0.0",
|
|
@@ -218,9 +218,6 @@
|
|
|
218
218
|
"type": "boolean",
|
|
219
219
|
"referenceOnly": true
|
|
220
220
|
},
|
|
221
|
-
"editor_request_to_edit_task": {
|
|
222
|
-
"type": "boolean"
|
|
223
|
-
},
|
|
224
221
|
"editor_load_conf_collab_docs_without_checks": {
|
|
225
222
|
"type": "boolean"
|
|
226
223
|
},
|
|
@@ -414,10 +411,6 @@
|
|
|
414
411
|
"type": "boolean",
|
|
415
412
|
"referenceOnly": true
|
|
416
413
|
},
|
|
417
|
-
"platform_editor_non_macros_copy_and_paste_fix": {
|
|
418
|
-
"type": "boolean",
|
|
419
|
-
"referenceOnly": true
|
|
420
|
-
},
|
|
421
414
|
"platform_editor_nbm_backspace_fixes": {
|
|
422
415
|
"type": "boolean",
|
|
423
416
|
"referenceOnly": true
|