@atlaskit/editor-core 207.11.2 → 207.12.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +22 -0
- package/dist/cjs/ui/Appearance/FullPage/FullPageToolbar.js +2 -2
- package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js +1 -1
- package/dist/cjs/ui/EditorContentContainer/styles/list.js +116 -15
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/ui/Appearance/FullPage/FullPageToolbar.js +2 -2
- package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js +2 -4
- package/dist/es2019/ui/EditorContentContainer/styles/list.js +117 -16
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/ui/Appearance/FullPage/FullPageToolbar.js +2 -2
- package/dist/esm/ui/EditorContentContainer/EditorContentContainer.js +2 -2
- package/dist/esm/ui/EditorContentContainer/styles/list.js +117 -16
- package/dist/esm/version-wrapper.js +1 -1
- package/package.json +3 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,27 @@
|
|
|
1
1
|
# @atlaskit/editor-core
|
|
2
2
|
|
|
3
|
+
## 207.12.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#161914](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/161914)
|
|
8
|
+
[`b1a7ef0ae8d44`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b1a7ef0ae8d44) -
|
|
9
|
+
Switches text formatting options optimisation from FG to Experiment flag
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
12
|
+
## 207.12.0
|
|
13
|
+
|
|
14
|
+
### Minor Changes
|
|
15
|
+
|
|
16
|
+
- [#161680](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/161680)
|
|
17
|
+
[`8d9e4eea33298`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8d9e4eea33298) -
|
|
18
|
+
[https://product-fabric.atlassian.net/browse/ED-27746](ED-27746) - rewrite editor lists CSS in
|
|
19
|
+
static emotion
|
|
20
|
+
|
|
21
|
+
### Patch Changes
|
|
22
|
+
|
|
23
|
+
- Updated dependencies
|
|
24
|
+
|
|
3
25
|
## 207.11.2
|
|
4
26
|
|
|
5
27
|
### Patch Changes
|
|
@@ -104,7 +104,7 @@ var EditorToolbar = exports.EditorToolbar = /*#__PURE__*/_react.default.memo(fun
|
|
|
104
104
|
return event.altKey && (event.key === 'F9' || event.keyCode === 120);
|
|
105
105
|
};
|
|
106
106
|
var isShortcutToFocusToolbarMemoized = (0, _react.useCallback)(isShortcutToFocusToolbarRaw, []);
|
|
107
|
-
var isShortcutToFocusToolbar = (0,
|
|
107
|
+
var isShortcutToFocusToolbar = (0, _experiments.editorExperiment)('platform_editor_toolbar_rerender_optimization_exp', true) ? isShortcutToFocusToolbarMemoized : isShortcutToFocusToolbarRaw;
|
|
108
108
|
var handleEscapeRaw = function handleEscapeRaw(event) {
|
|
109
109
|
var _props$editorView;
|
|
110
110
|
if (!((_props$editorView = props.editorView) !== null && _props$editorView !== void 0 && _props$editorView.hasFocus())) {
|
|
@@ -123,7 +123,7 @@ var EditorToolbar = exports.EditorToolbar = /*#__PURE__*/_react.default.memo(fun
|
|
|
123
123
|
event.preventDefault();
|
|
124
124
|
event.stopPropagation();
|
|
125
125
|
}, [props.editorView]);
|
|
126
|
-
var handleEscape = (0,
|
|
126
|
+
var handleEscape = (0, _experiments.editorExperiment)('platform_editor_toolbar_rerender_optimization_exp', true) ? handleEscapeMemoized : handleEscapeRaw;
|
|
127
127
|
return (0, _react2.jsx)(_ui.ContextPanelConsumer, null, function (_ref2) {
|
|
128
128
|
var contextPanelWidth = _ref2.width;
|
|
129
129
|
return (0, _react2.jsx)(_uiMenu.ToolbarArrowKeyNavigationProvider, {
|
|
@@ -104,7 +104,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
|
|
|
104
104
|
|
|
105
105
|
// jest warning: JSDOM version (22) doesn't support the new @container CSS rule
|
|
106
106
|
var contentStyles = function contentStyles() {
|
|
107
|
-
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\
|
|
107
|
+
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", "\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 ", "\n\n ", "\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)('editor_request_to_edit_task') ? null : (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\topacity: 0.7;\n\t\t\t\t}\n\t\t\t"]))), (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (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, (0, _experiments.editorExperiment)('platform_editor_advanced_code_blocks', true) ? (0, _react2.css)(_templateObject4 || (_templateObject4 = (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, _codeBlockStyles.codeBlockStyles, (0, _styles2.blocktypeStyles)(), _codeMarkStyles.codeMarkStyles, _textColorStyles.textColorStyles, _backgroundColorStyles.backgroundColorStyles, _list.listsStyles, _rule.ruleStyles, _mediaStyles.mediaStyles, (0, _platformFeatureFlags.fg)('confluence_team_presence_scroll_to_pointer') ? _telepointerStyles.telepointerStyle : _telepointerStyles.telepointerStyleWithInitialOnly, _telepointerStyles.telepointerColorAndCommonStyle, _selection.gapCursorStyles, (0, _panel.panelStyles)(), _mentions.mentionsStyles, _tasksAndDecisionsStyles.tasksAndDecisionsStyles, _gridStyles.gridStyles, _blockMarksStyles.blockMarksStyles, _dateStyles.dateStyles, _extension.extensionStyles, (0, _expand.expandStyles)(), _styles3.findReplaceStyles, _styles4.textHighlightStyle, _tasksAndDecisions.taskDecisionStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
108
108
|
exposure: false
|
|
109
109
|
}) && _tasksAndDecisions.vanillaTaskItemStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
110
110
|
exposure: false
|
|
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.listsStylesSafariFix = exports.listsStyles = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _react = require("@emotion/react");
|
|
10
|
-
// eslint-disable-
|
|
10
|
+
// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
|
|
11
11
|
|
|
12
12
|
// copied from packages/editor/editor-shared-styles/src/consts/consts.ts
|
|
13
13
|
var akEditorLineHeight = 1.714;
|
|
@@ -19,20 +19,121 @@ var blockNodesVerticalMargin = '0.75rem';
|
|
|
19
19
|
|
|
20
20
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
21
21
|
var listsStyles = exports.listsStyles = (0, _react.css)({
|
|
22
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
23
|
-
'.ProseMirror
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
//
|
|
34
|
-
|
|
35
|
-
|
|
22
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
23
|
+
'.ProseMirror': {
|
|
24
|
+
/* =============== INDENTATION SPACING ========= */
|
|
25
|
+
|
|
26
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
27
|
+
'ul, ol': {
|
|
28
|
+
boxSizing: 'border-box',
|
|
29
|
+
paddingLeft: "var(--ed--list--item-counter--padding, 24px)"
|
|
30
|
+
},
|
|
31
|
+
// Firefox does not handle empty block element inside li tag.
|
|
32
|
+
// If there is not block element inside li tag, then firefox sets inherited height to li
|
|
33
|
+
// However, if there is any block element and if it's empty (or has empty inline element) then
|
|
34
|
+
// firefox sets li tag height to zero.
|
|
35
|
+
//
|
|
36
|
+
// More details at
|
|
37
|
+
// https://product-fabric.atlassian.net/wiki/spaces/~455502413/pages/3149365890/ED-14110+Investigation
|
|
38
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
39
|
+
'&.ua-firefox': {
|
|
40
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
41
|
+
'ul, ol': {
|
|
42
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
43
|
+
'li p:empty, li p > span:empty': {
|
|
44
|
+
display: 'inline-block'
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
},
|
|
48
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
49
|
+
'.ak-ol, .ak-ul': {
|
|
50
|
+
// Ensures list item content adheres to the list's margin instead
|
|
51
|
+
// of filling the entire block row. This is important to allow
|
|
52
|
+
// clicking interactive elements which are floated next to a list.
|
|
53
|
+
//
|
|
54
|
+
// For some history and context on this block, see PRs related to tickets.:
|
|
55
|
+
// @see ED-6551 - original issue.
|
|
56
|
+
// @see ED-7015 - follow up issue.
|
|
57
|
+
// @see ED-7447 - flow-root change.
|
|
58
|
+
//
|
|
59
|
+
// @see https://css-tricks.com/display-flow-root/
|
|
60
|
+
//
|
|
61
|
+
// For older browsers the do not support flow-root. */
|
|
62
|
+
// stylelint-disable declaration-block-no-duplicate-properties */
|
|
63
|
+
display: 'flow-root'
|
|
64
|
+
/* stylelint-enable declaration-block-no-duplicate-properties */
|
|
65
|
+
},
|
|
66
|
+
/* =============== INDENTATION AESTHETICS ========= */
|
|
67
|
+
|
|
68
|
+
// We support nested lists up to six levels deep.
|
|
69
|
+
|
|
70
|
+
/* ======== LEGACY LISTS ======== */
|
|
71
|
+
|
|
72
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
73
|
+
'ul, ul ul ul ul': {
|
|
74
|
+
listStyleType: 'disc'
|
|
75
|
+
},
|
|
76
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
77
|
+
'ul ul, ul ul ul ul ul': {
|
|
78
|
+
listStyleType: 'circle'
|
|
79
|
+
},
|
|
80
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
81
|
+
'ul ul ul, ul ul ul ul ul ul': {
|
|
82
|
+
listStyleType: 'square'
|
|
83
|
+
},
|
|
84
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
85
|
+
'ol, ol ol ol ol': {
|
|
86
|
+
listStyleType: 'decimal'
|
|
87
|
+
},
|
|
88
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
89
|
+
'ol ol, ol ol ol ol ol': {
|
|
90
|
+
listStyleType: 'lower-alpha'
|
|
91
|
+
},
|
|
92
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
93
|
+
'ol ol ol, ol ol ol ol ol ol': {
|
|
94
|
+
listStyleType: 'lower-roman'
|
|
95
|
+
},
|
|
96
|
+
/* ======== PREDICTABLE LISTS ======== */
|
|
97
|
+
|
|
98
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
99
|
+
"ol[data-indent-level='1'], ol[data-indent-level='4']": {
|
|
100
|
+
listStyleType: 'decimal'
|
|
101
|
+
},
|
|
102
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
103
|
+
"ol[data-indent-level='2'], ol[data-indent-level='5']": {
|
|
104
|
+
listStyleType: 'lower-alpha'
|
|
105
|
+
},
|
|
106
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
107
|
+
"ol[data-indent-level='3'], ol[data-indent-level='6']": {
|
|
108
|
+
listStyleType: 'lower-roman'
|
|
109
|
+
},
|
|
110
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
111
|
+
"ul[data-indent-level='1'], ul[data-indent-level='4']": {
|
|
112
|
+
listStyleType: 'disc'
|
|
113
|
+
},
|
|
114
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
115
|
+
"ul[data-indent-level='2'], ul[data-indent-level='5']": {
|
|
116
|
+
listStyleType: 'circle'
|
|
117
|
+
},
|
|
118
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
119
|
+
"ul[data-indent-level='3'], ul[data-indent-level='6']": {
|
|
120
|
+
listStyleType: 'square'
|
|
121
|
+
},
|
|
122
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
123
|
+
li: {
|
|
124
|
+
position: 'relative',
|
|
125
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
126
|
+
'& > p:not(:first-child)': {
|
|
127
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
128
|
+
margin: "var(--ds-space-050, 4px)".concat(" 0 0 0")
|
|
129
|
+
},
|
|
130
|
+
/* In SSR the above rule will apply to all p tags because first-child would be a style tag.
|
|
131
|
+
The following rule resets the first p tag back to its original margin
|
|
132
|
+
defined in packages/editor/editor-common/src/styles/shared/paragraph.ts */
|
|
133
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
134
|
+
'& > style:first-child + p': {
|
|
135
|
+
marginTop: blockNodesVerticalMargin
|
|
136
|
+
}
|
|
36
137
|
}
|
|
37
138
|
}
|
|
38
139
|
});
|
|
@@ -91,7 +91,7 @@ export const EditorToolbar = /*#__PURE__*/React.memo(props => {
|
|
|
91
91
|
return event.altKey && (event.key === 'F9' || event.keyCode === 120);
|
|
92
92
|
};
|
|
93
93
|
const isShortcutToFocusToolbarMemoized = useCallback(isShortcutToFocusToolbarRaw, []);
|
|
94
|
-
const isShortcutToFocusToolbar =
|
|
94
|
+
const isShortcutToFocusToolbar = editorExperiment('platform_editor_toolbar_rerender_optimization_exp', true) ? isShortcutToFocusToolbarMemoized : isShortcutToFocusToolbarRaw;
|
|
95
95
|
const handleEscapeRaw = event => {
|
|
96
96
|
var _props$editorView;
|
|
97
97
|
if (!((_props$editorView = props.editorView) !== null && _props$editorView !== void 0 && _props$editorView.hasFocus())) {
|
|
@@ -110,7 +110,7 @@ export const EditorToolbar = /*#__PURE__*/React.memo(props => {
|
|
|
110
110
|
event.preventDefault();
|
|
111
111
|
event.stopPropagation();
|
|
112
112
|
}, [props.editorView]);
|
|
113
|
-
const handleEscape =
|
|
113
|
+
const handleEscape = editorExperiment('platform_editor_toolbar_rerender_optimization_exp', true) ? handleEscapeMemoized : handleEscapeRaw;
|
|
114
114
|
return jsx(ContextPanelConsumer, null, ({
|
|
115
115
|
width: contextPanelWidth
|
|
116
116
|
}) => jsx(ToolbarArrowKeyNavigationProvider, {
|
|
@@ -11,7 +11,7 @@ import React from 'react';
|
|
|
11
11
|
import { css, jsx, useTheme } from '@emotion/react';
|
|
12
12
|
import { browser } from '@atlaskit/editor-common/browser';
|
|
13
13
|
import { gapCursorStyles } from '@atlaskit/editor-common/selection';
|
|
14
|
-
import { GRID_GUTTER
|
|
14
|
+
import { GRID_GUTTER } from '@atlaskit/editor-common/styles';
|
|
15
15
|
import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
|
|
16
16
|
import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
|
|
17
17
|
import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
|
|
@@ -140,8 +140,6 @@ const contentStyles = () => css`
|
|
|
140
140
|
|
|
141
141
|
${whitespaceStyles};
|
|
142
142
|
|
|
143
|
-
${listsSharedStyles};
|
|
144
|
-
|
|
145
143
|
${indentationStyles};
|
|
146
144
|
|
|
147
145
|
${shadowStyles};
|
|
@@ -283,7 +281,7 @@ const contentStyles = () => css`
|
|
|
283
281
|
|
|
284
282
|
${resizerStyles}
|
|
285
283
|
|
|
286
|
-
|
|
284
|
+
.panelView-content-wrap {
|
|
287
285
|
box-sizing: border-box;
|
|
288
286
|
}
|
|
289
287
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// eslint-disable-
|
|
2
|
-
|
|
1
|
+
import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
|
|
2
|
+
|
|
3
3
|
// copied from packages/editor/editor-shared-styles/src/consts/consts.ts
|
|
4
4
|
const akEditorLineHeight = 1.714;
|
|
5
5
|
// copied from packages/editor/editor-common/src/styles/shared/smart-card.ts
|
|
@@ -10,20 +10,121 @@ const blockNodesVerticalMargin = '0.75rem';
|
|
|
10
10
|
|
|
11
11
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
12
12
|
export const listsStyles = css({
|
|
13
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
14
|
-
'.ProseMirror
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
//
|
|
25
|
-
|
|
26
|
-
|
|
13
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
14
|
+
'.ProseMirror': {
|
|
15
|
+
/* =============== INDENTATION SPACING ========= */
|
|
16
|
+
|
|
17
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
18
|
+
'ul, ol': {
|
|
19
|
+
boxSizing: 'border-box',
|
|
20
|
+
paddingLeft: `var(--ed--list--item-counter--padding, 24px)`
|
|
21
|
+
},
|
|
22
|
+
// Firefox does not handle empty block element inside li tag.
|
|
23
|
+
// If there is not block element inside li tag, then firefox sets inherited height to li
|
|
24
|
+
// However, if there is any block element and if it's empty (or has empty inline element) then
|
|
25
|
+
// firefox sets li tag height to zero.
|
|
26
|
+
//
|
|
27
|
+
// More details at
|
|
28
|
+
// https://product-fabric.atlassian.net/wiki/spaces/~455502413/pages/3149365890/ED-14110+Investigation
|
|
29
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
30
|
+
'&.ua-firefox': {
|
|
31
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
32
|
+
'ul, ol': {
|
|
33
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
34
|
+
'li p:empty, li p > span:empty': {
|
|
35
|
+
display: 'inline-block'
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
40
|
+
'.ak-ol, .ak-ul': {
|
|
41
|
+
// Ensures list item content adheres to the list's margin instead
|
|
42
|
+
// of filling the entire block row. This is important to allow
|
|
43
|
+
// clicking interactive elements which are floated next to a list.
|
|
44
|
+
//
|
|
45
|
+
// For some history and context on this block, see PRs related to tickets.:
|
|
46
|
+
// @see ED-6551 - original issue.
|
|
47
|
+
// @see ED-7015 - follow up issue.
|
|
48
|
+
// @see ED-7447 - flow-root change.
|
|
49
|
+
//
|
|
50
|
+
// @see https://css-tricks.com/display-flow-root/
|
|
51
|
+
//
|
|
52
|
+
// For older browsers the do not support flow-root. */
|
|
53
|
+
// stylelint-disable declaration-block-no-duplicate-properties */
|
|
54
|
+
display: 'flow-root'
|
|
55
|
+
/* stylelint-enable declaration-block-no-duplicate-properties */
|
|
56
|
+
},
|
|
57
|
+
/* =============== INDENTATION AESTHETICS ========= */
|
|
58
|
+
|
|
59
|
+
// We support nested lists up to six levels deep.
|
|
60
|
+
|
|
61
|
+
/* ======== LEGACY LISTS ======== */
|
|
62
|
+
|
|
63
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
64
|
+
'ul, ul ul ul ul': {
|
|
65
|
+
listStyleType: 'disc'
|
|
66
|
+
},
|
|
67
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
68
|
+
'ul ul, ul ul ul ul ul': {
|
|
69
|
+
listStyleType: 'circle'
|
|
70
|
+
},
|
|
71
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
72
|
+
'ul ul ul, ul ul ul ul ul ul': {
|
|
73
|
+
listStyleType: 'square'
|
|
74
|
+
},
|
|
75
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
76
|
+
'ol, ol ol ol ol': {
|
|
77
|
+
listStyleType: 'decimal'
|
|
78
|
+
},
|
|
79
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
80
|
+
'ol ol, ol ol ol ol ol': {
|
|
81
|
+
listStyleType: 'lower-alpha'
|
|
82
|
+
},
|
|
83
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
84
|
+
'ol ol ol, ol ol ol ol ol ol': {
|
|
85
|
+
listStyleType: 'lower-roman'
|
|
86
|
+
},
|
|
87
|
+
/* ======== PREDICTABLE LISTS ======== */
|
|
88
|
+
|
|
89
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
90
|
+
"ol[data-indent-level='1'], ol[data-indent-level='4']": {
|
|
91
|
+
listStyleType: 'decimal'
|
|
92
|
+
},
|
|
93
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
94
|
+
"ol[data-indent-level='2'], ol[data-indent-level='5']": {
|
|
95
|
+
listStyleType: 'lower-alpha'
|
|
96
|
+
},
|
|
97
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
98
|
+
"ol[data-indent-level='3'], ol[data-indent-level='6']": {
|
|
99
|
+
listStyleType: 'lower-roman'
|
|
100
|
+
},
|
|
101
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
102
|
+
"ul[data-indent-level='1'], ul[data-indent-level='4']": {
|
|
103
|
+
listStyleType: 'disc'
|
|
104
|
+
},
|
|
105
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
106
|
+
"ul[data-indent-level='2'], ul[data-indent-level='5']": {
|
|
107
|
+
listStyleType: 'circle'
|
|
108
|
+
},
|
|
109
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
110
|
+
"ul[data-indent-level='3'], ul[data-indent-level='6']": {
|
|
111
|
+
listStyleType: 'square'
|
|
112
|
+
},
|
|
113
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
114
|
+
li: {
|
|
115
|
+
position: 'relative',
|
|
116
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
117
|
+
'& > p:not(:first-child)': {
|
|
118
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
119
|
+
margin: `${"var(--ds-space-050, 4px)"} 0 0 0`
|
|
120
|
+
},
|
|
121
|
+
/* In SSR the above rule will apply to all p tags because first-child would be a style tag.
|
|
122
|
+
The following rule resets the first p tag back to its original margin
|
|
123
|
+
defined in packages/editor/editor-common/src/styles/shared/paragraph.ts */
|
|
124
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
125
|
+
'& > style:first-child + p': {
|
|
126
|
+
marginTop: blockNodesVerticalMargin
|
|
127
|
+
}
|
|
27
128
|
}
|
|
28
129
|
}
|
|
29
130
|
});
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export const name = "@atlaskit/editor-core";
|
|
2
|
-
export const version = "207.
|
|
2
|
+
export const version = "207.12.1";
|
|
@@ -94,7 +94,7 @@ export var EditorToolbar = /*#__PURE__*/React.memo(function (props) {
|
|
|
94
94
|
return event.altKey && (event.key === 'F9' || event.keyCode === 120);
|
|
95
95
|
};
|
|
96
96
|
var isShortcutToFocusToolbarMemoized = useCallback(isShortcutToFocusToolbarRaw, []);
|
|
97
|
-
var isShortcutToFocusToolbar =
|
|
97
|
+
var isShortcutToFocusToolbar = editorExperiment('platform_editor_toolbar_rerender_optimization_exp', true) ? isShortcutToFocusToolbarMemoized : isShortcutToFocusToolbarRaw;
|
|
98
98
|
var handleEscapeRaw = function handleEscapeRaw(event) {
|
|
99
99
|
var _props$editorView;
|
|
100
100
|
if (!((_props$editorView = props.editorView) !== null && _props$editorView !== void 0 && _props$editorView.hasFocus())) {
|
|
@@ -113,7 +113,7 @@ export var EditorToolbar = /*#__PURE__*/React.memo(function (props) {
|
|
|
113
113
|
event.preventDefault();
|
|
114
114
|
event.stopPropagation();
|
|
115
115
|
}, [props.editorView]);
|
|
116
|
-
var handleEscape =
|
|
116
|
+
var handleEscape = editorExperiment('platform_editor_toolbar_rerender_optimization_exp', true) ? handleEscapeMemoized : handleEscapeRaw;
|
|
117
117
|
return jsx(ContextPanelConsumer, null, function (_ref2) {
|
|
118
118
|
var contextPanelWidth = _ref2.width;
|
|
119
119
|
return jsx(ToolbarArrowKeyNavigationProvider, {
|
|
@@ -13,7 +13,7 @@ import React from 'react';
|
|
|
13
13
|
import { css, jsx, useTheme } from '@emotion/react';
|
|
14
14
|
import { browser } from '@atlaskit/editor-common/browser';
|
|
15
15
|
import { gapCursorStyles } from '@atlaskit/editor-common/selection';
|
|
16
|
-
import { GRID_GUTTER
|
|
16
|
+
import { GRID_GUTTER } from '@atlaskit/editor-common/styles';
|
|
17
17
|
import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
|
|
18
18
|
import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
|
|
19
19
|
import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
|
|
@@ -98,7 +98,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
|
|
|
98
98
|
|
|
99
99
|
// jest warning: JSDOM version (22) doesn't support the new @container CSS rule
|
|
100
100
|
var contentStyles = function contentStyles() {
|
|
101
|
-
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\
|
|
101
|
+
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", "\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 ", "\n\n ", "\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('editor_request_to_edit_task') ? null : css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\topacity: 0.7;\n\t\t\t\t}\n\t\t\t"]))), fg('platform_editor_hide_cursor_when_pm_hideselection') ? 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, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject4 || (_templateObject4 = _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(), codeMarkStyles, textColorStyles, backgroundColorStyles, listsStyles, ruleStyles, mediaStyles, fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, telepointerColorAndCommonStyle, gapCursorStyles, panelStyles(), mentionsStyles, tasksAndDecisionsStyles, gridStyles, blockMarksStyles, dateStyles, extensionStyles, expandStyles(), findReplaceStyles, textHighlightStyle, taskDecisionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
102
102
|
exposure: false
|
|
103
103
|
}) && vanillaTaskItemStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
104
104
|
exposure: false
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
// eslint-disable-
|
|
3
|
-
|
|
2
|
+
import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
|
|
3
|
+
|
|
4
4
|
// copied from packages/editor/editor-shared-styles/src/consts/consts.ts
|
|
5
5
|
var akEditorLineHeight = 1.714;
|
|
6
6
|
// copied from packages/editor/editor-common/src/styles/shared/smart-card.ts
|
|
@@ -11,20 +11,121 @@ var blockNodesVerticalMargin = '0.75rem';
|
|
|
11
11
|
|
|
12
12
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
13
13
|
export var listsStyles = css({
|
|
14
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
15
|
-
'.ProseMirror
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
//
|
|
26
|
-
|
|
27
|
-
|
|
14
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
15
|
+
'.ProseMirror': {
|
|
16
|
+
/* =============== INDENTATION SPACING ========= */
|
|
17
|
+
|
|
18
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
19
|
+
'ul, ol': {
|
|
20
|
+
boxSizing: 'border-box',
|
|
21
|
+
paddingLeft: "var(--ed--list--item-counter--padding, 24px)"
|
|
22
|
+
},
|
|
23
|
+
// Firefox does not handle empty block element inside li tag.
|
|
24
|
+
// If there is not block element inside li tag, then firefox sets inherited height to li
|
|
25
|
+
// However, if there is any block element and if it's empty (or has empty inline element) then
|
|
26
|
+
// firefox sets li tag height to zero.
|
|
27
|
+
//
|
|
28
|
+
// More details at
|
|
29
|
+
// https://product-fabric.atlassian.net/wiki/spaces/~455502413/pages/3149365890/ED-14110+Investigation
|
|
30
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
31
|
+
'&.ua-firefox': {
|
|
32
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
33
|
+
'ul, ol': {
|
|
34
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
35
|
+
'li p:empty, li p > span:empty': {
|
|
36
|
+
display: 'inline-block'
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
41
|
+
'.ak-ol, .ak-ul': {
|
|
42
|
+
// Ensures list item content adheres to the list's margin instead
|
|
43
|
+
// of filling the entire block row. This is important to allow
|
|
44
|
+
// clicking interactive elements which are floated next to a list.
|
|
45
|
+
//
|
|
46
|
+
// For some history and context on this block, see PRs related to tickets.:
|
|
47
|
+
// @see ED-6551 - original issue.
|
|
48
|
+
// @see ED-7015 - follow up issue.
|
|
49
|
+
// @see ED-7447 - flow-root change.
|
|
50
|
+
//
|
|
51
|
+
// @see https://css-tricks.com/display-flow-root/
|
|
52
|
+
//
|
|
53
|
+
// For older browsers the do not support flow-root. */
|
|
54
|
+
// stylelint-disable declaration-block-no-duplicate-properties */
|
|
55
|
+
display: 'flow-root'
|
|
56
|
+
/* stylelint-enable declaration-block-no-duplicate-properties */
|
|
57
|
+
},
|
|
58
|
+
/* =============== INDENTATION AESTHETICS ========= */
|
|
59
|
+
|
|
60
|
+
// We support nested lists up to six levels deep.
|
|
61
|
+
|
|
62
|
+
/* ======== LEGACY LISTS ======== */
|
|
63
|
+
|
|
64
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
65
|
+
'ul, ul ul ul ul': {
|
|
66
|
+
listStyleType: 'disc'
|
|
67
|
+
},
|
|
68
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
69
|
+
'ul ul, ul ul ul ul ul': {
|
|
70
|
+
listStyleType: 'circle'
|
|
71
|
+
},
|
|
72
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
73
|
+
'ul ul ul, ul ul ul ul ul ul': {
|
|
74
|
+
listStyleType: 'square'
|
|
75
|
+
},
|
|
76
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
77
|
+
'ol, ol ol ol ol': {
|
|
78
|
+
listStyleType: 'decimal'
|
|
79
|
+
},
|
|
80
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
81
|
+
'ol ol, ol ol ol ol ol': {
|
|
82
|
+
listStyleType: 'lower-alpha'
|
|
83
|
+
},
|
|
84
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
85
|
+
'ol ol ol, ol ol ol ol ol ol': {
|
|
86
|
+
listStyleType: 'lower-roman'
|
|
87
|
+
},
|
|
88
|
+
/* ======== PREDICTABLE LISTS ======== */
|
|
89
|
+
|
|
90
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
91
|
+
"ol[data-indent-level='1'], ol[data-indent-level='4']": {
|
|
92
|
+
listStyleType: 'decimal'
|
|
93
|
+
},
|
|
94
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
95
|
+
"ol[data-indent-level='2'], ol[data-indent-level='5']": {
|
|
96
|
+
listStyleType: 'lower-alpha'
|
|
97
|
+
},
|
|
98
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
99
|
+
"ol[data-indent-level='3'], ol[data-indent-level='6']": {
|
|
100
|
+
listStyleType: 'lower-roman'
|
|
101
|
+
},
|
|
102
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
103
|
+
"ul[data-indent-level='1'], ul[data-indent-level='4']": {
|
|
104
|
+
listStyleType: 'disc'
|
|
105
|
+
},
|
|
106
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
107
|
+
"ul[data-indent-level='2'], ul[data-indent-level='5']": {
|
|
108
|
+
listStyleType: 'circle'
|
|
109
|
+
},
|
|
110
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
111
|
+
"ul[data-indent-level='3'], ul[data-indent-level='6']": {
|
|
112
|
+
listStyleType: 'square'
|
|
113
|
+
},
|
|
114
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
115
|
+
li: {
|
|
116
|
+
position: 'relative',
|
|
117
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
118
|
+
'& > p:not(:first-child)': {
|
|
119
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
|
|
120
|
+
margin: "var(--ds-space-050, 4px)".concat(" 0 0 0")
|
|
121
|
+
},
|
|
122
|
+
/* In SSR the above rule will apply to all p tags because first-child would be a style tag.
|
|
123
|
+
The following rule resets the first p tag back to its original margin
|
|
124
|
+
defined in packages/editor/editor-common/src/styles/shared/paragraph.ts */
|
|
125
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
126
|
+
'& > style:first-child + p': {
|
|
127
|
+
marginTop: blockNodesVerticalMargin
|
|
128
|
+
}
|
|
28
129
|
}
|
|
29
130
|
}
|
|
30
131
|
});
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export var name = "@atlaskit/editor-core";
|
|
2
|
-
export var version = "207.
|
|
2
|
+
export var version = "207.12.1";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-core",
|
|
3
|
-
"version": "207.
|
|
3
|
+
"version": "207.12.1",
|
|
4
4
|
"description": "A package contains Atlassian editor core functionality",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -46,7 +46,7 @@
|
|
|
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",
|
|
49
|
-
"@atlaskit/editor-common": "^
|
|
49
|
+
"@atlaskit/editor-common": "^106.0.0",
|
|
50
50
|
"@atlaskit/editor-json-transformer": "^8.24.0",
|
|
51
51
|
"@atlaskit/editor-performance-metrics": "^2.1.0",
|
|
52
52
|
"@atlaskit/editor-plugin-quick-insert": "^2.5.0",
|
|
@@ -62,7 +62,7 @@
|
|
|
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.
|
|
65
|
+
"@atlaskit/tmp-editor-statsig": "^5.3.0",
|
|
66
66
|
"@atlaskit/tokens": "^4.9.0",
|
|
67
67
|
"@atlaskit/tooltip": "^20.2.0",
|
|
68
68
|
"@atlaskit/width-detector": "^5.0.0",
|
|
@@ -671,9 +671,6 @@
|
|
|
671
671
|
},
|
|
672
672
|
"atlas_editor_typography_refreshed": {
|
|
673
673
|
"type": "boolean"
|
|
674
|
-
},
|
|
675
|
-
"platform_editor_toolbar_rerender_optimization": {
|
|
676
|
-
"type": "boolean"
|
|
677
674
|
}
|
|
678
675
|
},
|
|
679
676
|
"stricter": {
|