@atlaskit/editor-core 207.11.2 → 207.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- 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/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/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 +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @atlaskit/editor-core
|
|
2
2
|
|
|
3
|
+
## 207.12.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#161680](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/161680)
|
|
8
|
+
[`8d9e4eea33298`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8d9e4eea33298) -
|
|
9
|
+
[https://product-fabric.atlassian.net/browse/ED-27746](ED-27746) - rewrite editor lists CSS in
|
|
10
|
+
static emotion
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- Updated dependencies
|
|
15
|
+
|
|
3
16
|
## 207.11.2
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
|
@@ -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
|
});
|
|
@@ -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.0";
|
|
@@ -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.0";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-core",
|
|
3
|
-
"version": "207.
|
|
3
|
+
"version": "207.12.0",
|
|
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",
|