@atlaskit/editor-core 219.9.6 → 219.9.8
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 +20 -0
- package/dist/cjs/ui/Addon/ClickAreaBlock/clickAreaBlock-compiled.compiled.css +2 -0
- package/dist/cjs/ui/Addon/ClickAreaBlock/clickAreaBlock-compiled.js +31 -0
- package/dist/cjs/ui/Addon/ClickAreaBlock/clickAreaBlock-emotion.js +36 -0
- package/dist/cjs/ui/Addon/ClickAreaBlock/index.js +8 -14
- package/dist/cjs/ui/Appearance/Chromeless-compiled.compiled.css +27 -0
- package/dist/cjs/ui/Appearance/Chromeless-compiled.js +40 -0
- package/dist/cjs/ui/Appearance/Chromeless-emotion.js +91 -0
- package/dist/cjs/ui/Appearance/Chromeless.js +21 -81
- package/dist/cjs/ui/EditorContentContainer/EditorContentContainer-emotion.js +1 -1
- package/dist/cjs/ui/PluginSlot/PluginSlot-compiled.compiled.css +1 -0
- package/dist/cjs/ui/PluginSlot/PluginSlot-compiled.js +33 -0
- package/dist/cjs/ui/PluginSlot/PluginSlot-emotion.js +35 -0
- package/dist/cjs/ui/PluginSlot/index.js +10 -15
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/ui/Addon/ClickAreaBlock/clickAreaBlock-compiled.compiled.css +2 -0
- package/dist/es2019/ui/Addon/ClickAreaBlock/clickAreaBlock-compiled.js +19 -0
- package/dist/es2019/ui/Addon/ClickAreaBlock/clickAreaBlock-emotion.js +26 -0
- package/dist/es2019/ui/Addon/ClickAreaBlock/index.js +6 -13
- package/dist/es2019/ui/Appearance/Chromeless-compiled.compiled.css +27 -0
- package/dist/es2019/ui/Appearance/Chromeless-compiled.js +32 -0
- package/dist/es2019/ui/Appearance/Chromeless-emotion.js +82 -0
- package/dist/es2019/ui/Appearance/Chromeless.js +17 -82
- package/dist/es2019/ui/EditorContentContainer/EditorContentContainer-emotion.js +1 -1
- package/dist/es2019/ui/PluginSlot/PluginSlot-compiled.compiled.css +1 -0
- package/dist/es2019/ui/PluginSlot/PluginSlot-compiled.js +21 -0
- package/dist/es2019/ui/PluginSlot/PluginSlot-emotion.js +25 -0
- package/dist/es2019/ui/PluginSlot/index.js +8 -14
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/ui/Addon/ClickAreaBlock/clickAreaBlock-compiled.compiled.css +2 -0
- package/dist/esm/ui/Addon/ClickAreaBlock/clickAreaBlock-compiled.js +22 -0
- package/dist/esm/ui/Addon/ClickAreaBlock/clickAreaBlock-emotion.js +30 -0
- package/dist/esm/ui/Addon/ClickAreaBlock/index.js +8 -13
- package/dist/esm/ui/Appearance/Chromeless-compiled.compiled.css +27 -0
- package/dist/esm/ui/Appearance/Chromeless-compiled.js +33 -0
- package/dist/esm/ui/Appearance/Chromeless-emotion.js +85 -0
- package/dist/esm/ui/Appearance/Chromeless.js +19 -81
- package/dist/esm/ui/EditorContentContainer/EditorContentContainer-emotion.js +1 -1
- package/dist/esm/ui/PluginSlot/PluginSlot-compiled.compiled.css +1 -0
- package/dist/esm/ui/PluginSlot/PluginSlot-compiled.js +24 -0
- package/dist/esm/ui/PluginSlot/PluginSlot-emotion.js +29 -0
- package/dist/esm/ui/PluginSlot/index.js +10 -14
- package/dist/esm/version-wrapper.js +1 -1
- package/dist/types/ui/Addon/ClickAreaBlock/clickAreaBlock-compiled.d.ts +10 -0
- package/dist/types/ui/Addon/ClickAreaBlock/clickAreaBlock-emotion.d.ts +12 -0
- package/dist/types/ui/Addon/ClickAreaBlock/index.d.ts +1 -6
- package/dist/types/ui/Appearance/Chromeless-compiled.d.ts +18 -0
- package/dist/types/ui/Appearance/Chromeless-emotion.d.ts +18 -0
- package/dist/types/ui/Appearance/Chromeless.d.ts +10 -14
- package/dist/types/ui/PluginSlot/PluginSlot-compiled.d.ts +12 -0
- package/dist/types/ui/PluginSlot/PluginSlot-emotion.d.ts +12 -0
- package/dist/types/ui/PluginSlot/index.d.ts +0 -4
- package/dist/types-ts4.5/ui/Addon/ClickAreaBlock/clickAreaBlock-compiled.d.ts +10 -0
- package/dist/types-ts4.5/ui/Addon/ClickAreaBlock/clickAreaBlock-emotion.d.ts +12 -0
- package/dist/types-ts4.5/ui/Addon/ClickAreaBlock/index.d.ts +1 -6
- package/dist/types-ts4.5/ui/Appearance/Chromeless-compiled.d.ts +18 -0
- package/dist/types-ts4.5/ui/Appearance/Chromeless-emotion.d.ts +18 -0
- package/dist/types-ts4.5/ui/Appearance/Chromeless.d.ts +10 -14
- package/dist/types-ts4.5/ui/PluginSlot/PluginSlot-compiled.d.ts +12 -0
- package/dist/types-ts4.5/ui/PluginSlot/PluginSlot-emotion.d.ts +12 -0
- package/dist/types-ts4.5/ui/PluginSlot/index.d.ts +0 -4
- package/editor-core.docs.tsx +55 -53
- package/package.json +12 -12
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
/**
|
|
3
|
+
* @jsxRuntime classic
|
|
4
|
+
* @jsx jsx
|
|
5
|
+
*/
|
|
6
|
+
/**
|
|
7
|
+
* Emotion fallback branch of the `platform_editor_core_non_ecc_static_css` experiment.
|
|
8
|
+
* Used via `componentWithCondition` in `index.tsx`.
|
|
9
|
+
*
|
|
10
|
+
* Cleanup: delete this file once the experiment has shipped.
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- intentional: emotion fallback for compiled migration
|
|
14
|
+
import { css, jsx } from '@emotion/react';
|
|
15
|
+
const clickWrapperEmotionStyles = css({
|
|
16
|
+
flexGrow: 1,
|
|
17
|
+
height: '100%'
|
|
18
|
+
});
|
|
19
|
+
export const ClickAreaBlockContainerEmotion = ({
|
|
20
|
+
children,
|
|
21
|
+
...rest
|
|
22
|
+
}) =>
|
|
23
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
24
|
+
jsx("div", _extends({
|
|
25
|
+
css: clickWrapperEmotionStyles
|
|
26
|
+
}, rest), children);
|
|
@@ -1,16 +1,10 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
1
|
import React from 'react';
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
import { css, jsx } from '@emotion/react';
|
|
2
|
+
import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
|
|
3
|
+
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
9
4
|
import { clickAreaClickHandler } from '../click-area-helper';
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
});
|
|
5
|
+
import { ClickAreaBlockContainerCompiled } from './clickAreaBlock-compiled';
|
|
6
|
+
import { ClickAreaBlockContainerEmotion } from './clickAreaBlock-emotion';
|
|
7
|
+
const ClickAreaBlockContainerMigration = componentWithCondition(() => expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true), ClickAreaBlockContainerCompiled, ClickAreaBlockContainerEmotion);
|
|
14
8
|
export const ClickAreaBlock = ({
|
|
15
9
|
editorView,
|
|
16
10
|
editorDisabled,
|
|
@@ -24,10 +18,9 @@ export const ClickAreaBlock = ({
|
|
|
24
18
|
clickAreaClickHandler(editorView, event);
|
|
25
19
|
}
|
|
26
20
|
}, [editorView, editorDisabled]);
|
|
27
|
-
return
|
|
21
|
+
return /*#__PURE__*/React.createElement(ClickAreaBlockContainerMigration, {
|
|
28
22
|
"data-editor-click-wrapper": true,
|
|
29
23
|
"data-testid": "click-wrapper",
|
|
30
|
-
css: clickWrapper,
|
|
31
24
|
onMouseDown: handleMouseDown
|
|
32
25
|
// This div is a presentational container that captures mouse events
|
|
33
26
|
// for programmatic editor focus management, not user interaction.
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
|
|
2
|
+
._1khk1mok:hover::-webkit-scrollbar-thumb{border-radius:var(--ds-radius-large,8px)}._123b1aqn:hover::-webkit-scrollbar-thumb{background-color:var(--ds-background-neutral-bold,#292a2e)}
|
|
3
|
+
._15gyze3t .ProseMirror>p:last-of-type{margin-bottom:var(--ds-space-0,0)}
|
|
4
|
+
._18m91wug{overflow-y:auto}
|
|
5
|
+
._1awku2gc div>.ProseMirror>:last-child{padding-bottom:var(--ds-space-100,8px)}
|
|
6
|
+
._1fpfolhs{ms-overflow-style:-ms-autohiding-scrollbar}
|
|
7
|
+
._1gfdidpf div>.ProseMirror{margin-bottom:0}
|
|
8
|
+
._1itkidpf div>.ProseMirror{margin-left:0}
|
|
9
|
+
._1nhbidpf div>.ProseMirror{margin-top:0}
|
|
10
|
+
._1q5yidpf div>.ProseMirror{margin-right:0}
|
|
11
|
+
._1reo15vq{overflow-x:hidden}
|
|
12
|
+
._1yt4idpf div>.ProseMirror{padding-top:0}
|
|
13
|
+
._4t3i1wug{height:auto}
|
|
14
|
+
._7fa7idpf div>.ProseMirror{padding-bottom:0}
|
|
15
|
+
._7fkv1jtm div>.ProseMirror{white-space:pre-wrap}
|
|
16
|
+
._8wn3idpf div>.ProseMirror{padding-left:0}
|
|
17
|
+
._aaynsm61::-webkit-scrollbar-thumb{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
18
|
+
._fpqb1r31 div>.ProseMirror{outline-color:currentColor}
|
|
19
|
+
._jaboglyw::-webkit-scrollbar-corner{display:none}
|
|
20
|
+
._l5dlglyw div>.ProseMirror{outline-style:none}
|
|
21
|
+
._p12f1kw7{max-width:inherit}
|
|
22
|
+
._slp31hna{word-wrap:break-word}
|
|
23
|
+
._tjxn1o36 div>.ProseMirror{outline-width:medium}
|
|
24
|
+
._vchhusvi{box-sizing:border-box}
|
|
25
|
+
._vwz4gktf{line-height:20px}
|
|
26
|
+
._y826idpf div>.ProseMirror{padding-right:0}
|
|
27
|
+
._1ogl1ibz::-webkit-scrollbar-thumb:hover{background-color:var(--ds-background-neutral-bold-hovered,#3b3d42)}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/* Chromeless-compiled.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
/**
|
|
3
|
+
* Compiled branch of the `platform_editor_core_non_ecc_static_css` experiment.
|
|
4
|
+
* Used via `componentWithCondition` in `Chromeless.tsx`.
|
|
5
|
+
*
|
|
6
|
+
* Cleanup: delete this file once the experiment has shipped.
|
|
7
|
+
*/
|
|
8
|
+
import "./Chromeless-compiled.compiled.css";
|
|
9
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
10
|
+
import React from 'react';
|
|
11
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
12
|
+
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
13
|
+
const chromelessStyles = {
|
|
14
|
+
scrollbar: "_1fpfolhs _1khk1mok _123b1aqn _jaboglyw _aaynsm61 _1ogl1ibz",
|
|
15
|
+
editor: "_vwz4gktf _4t3i1wug _1reo15vq _18m91wug _p12f1kw7 _vchhusvi _slp31hna _fpqb1r31 _l5dlglyw _tjxn1o36 _1yt4idpf _y826idpf _7fa7idpf _8wn3idpf _1nhbidpf _1q5yidpf _1gfdidpf _1itkidpf _7fkv1jtm _1awku2gc _15gyze3t"
|
|
16
|
+
};
|
|
17
|
+
export const ChromelessEditorContainerCompiled = ({
|
|
18
|
+
children,
|
|
19
|
+
containerRef,
|
|
20
|
+
maxHeight,
|
|
21
|
+
minHeight
|
|
22
|
+
}) => /*#__PURE__*/React.createElement("div", {
|
|
23
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
24
|
+
className: ax([chromelessStyles.editor, chromelessStyles.scrollbar, fg('platform_editor_chromeless_akeditor_class') || expValEquals('create_work_item_modernization_exp', 'isEnabled', true) ? 'akEditor' : undefined]),
|
|
25
|
+
style: {
|
|
26
|
+
maxHeight: maxHeight ? `${maxHeight}px` : undefined,
|
|
27
|
+
minHeight: `${minHeight}px`
|
|
28
|
+
},
|
|
29
|
+
ref: containerRef,
|
|
30
|
+
"data-testid": "chromeless-editor",
|
|
31
|
+
id: "chromeless-editor"
|
|
32
|
+
}, children);
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @jsxRuntime classic
|
|
3
|
+
* @jsx jsx
|
|
4
|
+
*/
|
|
5
|
+
/**
|
|
6
|
+
* Emotion fallback branch of the `platform_editor_core_non_ecc_static_css` experiment.
|
|
7
|
+
* Used via `componentWithCondition` in `Chromeless.tsx`.
|
|
8
|
+
*
|
|
9
|
+
* Cleanup: delete this file once the experiment has shipped.
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- intentional: emotion fallback; jsx required at runtime for @jsxRuntime classic
|
|
13
|
+
import { css, jsx } from '@emotion/react';
|
|
14
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
15
|
+
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
16
|
+
const scrollbarStylesNew = css({
|
|
17
|
+
msOverflowStyle: '-ms-autohiding-scrollbar',
|
|
18
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
19
|
+
'&::-webkit-scrollbar-corner': {
|
|
20
|
+
display: 'none'
|
|
21
|
+
},
|
|
22
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
23
|
+
'&::-webkit-scrollbar-thumb': {
|
|
24
|
+
backgroundColor: "var(--ds-background-neutral-subtle, #00000000)"
|
|
25
|
+
},
|
|
26
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
27
|
+
'&:hover::-webkit-scrollbar-thumb': {
|
|
28
|
+
backgroundColor: "var(--ds-background-neutral-bold, #292A2E)",
|
|
29
|
+
borderRadius: "var(--ds-radius-large, 8px)"
|
|
30
|
+
},
|
|
31
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
32
|
+
'&::-webkit-scrollbar-thumb:hover': {
|
|
33
|
+
backgroundColor: "var(--ds-background-neutral-bold-hovered, #3B3D42)"
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
const chromelessEditorStylesNew = css({
|
|
37
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
38
|
+
lineHeight: '20px',
|
|
39
|
+
height: 'auto',
|
|
40
|
+
overflowX: 'hidden',
|
|
41
|
+
overflowY: 'auto',
|
|
42
|
+
maxWidth: 'inherit',
|
|
43
|
+
boxSizing: 'border-box',
|
|
44
|
+
wordWrap: 'break-word',
|
|
45
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
46
|
+
'div > .ProseMirror': {
|
|
47
|
+
outline: 'none',
|
|
48
|
+
whiteSpace: 'pre-wrap',
|
|
49
|
+
padding: 0,
|
|
50
|
+
margin: 0,
|
|
51
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
52
|
+
'& > :last-child': {
|
|
53
|
+
paddingBottom: "var(--ds-space-100, 8px)"
|
|
54
|
+
}
|
|
55
|
+
},
|
|
56
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
57
|
+
'.ProseMirror': {
|
|
58
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
59
|
+
'& > p:last-of-type': {
|
|
60
|
+
marginBottom: "var(--ds-space-0, 0px)"
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
export const ChromelessEditorContainerEmotion = ({
|
|
65
|
+
children,
|
|
66
|
+
containerRef,
|
|
67
|
+
maxHeight,
|
|
68
|
+
minHeight,
|
|
69
|
+
...rest
|
|
70
|
+
}) => jsx("div", {
|
|
71
|
+
css: [chromelessEditorStylesNew, scrollbarStylesNew]
|
|
72
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
73
|
+
,
|
|
74
|
+
className: fg('platform_editor_chromeless_akeditor_class') || expValEquals('create_work_item_modernization_exp', 'isEnabled', true) ? 'akEditor' : undefined,
|
|
75
|
+
style: {
|
|
76
|
+
maxHeight: maxHeight ? `${maxHeight}px` : undefined,
|
|
77
|
+
minHeight: `${minHeight}px`
|
|
78
|
+
},
|
|
79
|
+
ref: containerRef,
|
|
80
|
+
"data-testid": "chromeless-editor",
|
|
81
|
+
id: "chromeless-editor"
|
|
82
|
+
}, children);
|
|
@@ -1,66 +1,13 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
/**
|
|
3
|
-
* @jsxRuntime classic
|
|
4
|
-
* @jsx jsx
|
|
5
|
-
*/
|
|
6
2
|
import React, { Fragment } from 'react';
|
|
7
|
-
|
|
8
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic
|
|
9
|
-
import { css, jsx } from '@emotion/react';
|
|
10
3
|
import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
|
|
11
|
-
import {
|
|
4
|
+
import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
|
|
12
5
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
13
6
|
import EditorContentContainer from '../EditorContentContainer/EditorContentContainer';
|
|
14
7
|
import PluginSlot from '../PluginSlot';
|
|
15
8
|
import WithFlash from '../WithFlash';
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
19
|
-
'&::-webkit-scrollbar-corner': {
|
|
20
|
-
display: 'none'
|
|
21
|
-
},
|
|
22
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
23
|
-
'&::-webkit-scrollbar-thumb': {
|
|
24
|
-
backgroundColor: "var(--ds-background-neutral-subtle, #00000000)"
|
|
25
|
-
},
|
|
26
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
27
|
-
'&:hover::-webkit-scrollbar-thumb': {
|
|
28
|
-
backgroundColor: "var(--ds-background-neutral-bold, #292A2E)",
|
|
29
|
-
borderRadius: "var(--ds-radius-large, 8px)"
|
|
30
|
-
},
|
|
31
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
|
|
32
|
-
'&::-webkit-scrollbar-thumb:hover': {
|
|
33
|
-
backgroundColor: "var(--ds-background-neutral-bold-hovered, #3B3D42)"
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
const chromelessEditorStylesNew = css({
|
|
37
|
-
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
38
|
-
lineHeight: '20px',
|
|
39
|
-
height: 'auto',
|
|
40
|
-
overflowX: 'hidden',
|
|
41
|
-
overflowY: 'auto',
|
|
42
|
-
maxWidth: 'inherit',
|
|
43
|
-
boxSizing: 'border-box',
|
|
44
|
-
wordWrap: 'break-word',
|
|
45
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
46
|
-
'div > .ProseMirror': {
|
|
47
|
-
outline: 'none',
|
|
48
|
-
whiteSpace: 'pre-wrap',
|
|
49
|
-
padding: 0,
|
|
50
|
-
margin: 0,
|
|
51
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
52
|
-
'& > :last-child': {
|
|
53
|
-
paddingBottom: "var(--ds-space-100, 8px)"
|
|
54
|
-
}
|
|
55
|
-
},
|
|
56
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
57
|
-
'.ProseMirror': {
|
|
58
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
59
|
-
'& > p:last-of-type': {
|
|
60
|
-
marginBottom: "var(--ds-space-0, 0px)"
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
});
|
|
9
|
+
import { ChromelessEditorContainerCompiled } from './Chromeless-compiled';
|
|
10
|
+
import { ChromelessEditorContainerEmotion } from './Chromeless-emotion';
|
|
64
11
|
/**
|
|
65
12
|
* Render the editor in a chromeless appearance.
|
|
66
13
|
* Example use is the inline comment editor, which doesn't have editor toolbar
|
|
@@ -102,20 +49,20 @@ export default class Editor extends React.Component {
|
|
|
102
49
|
return states === null || states === void 0 ? void 0 : (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode;
|
|
103
50
|
});
|
|
104
51
|
const containerRef = expValEquals('platform_editor_perf_lint_cleanup', 'isEnabled', true) ? this.setContainerElement : ref => this.containerElement = ref;
|
|
105
|
-
return
|
|
52
|
+
return /*#__PURE__*/React.createElement(WithFlash, {
|
|
106
53
|
animate: maxContentSizeReached
|
|
107
|
-
},
|
|
54
|
+
}, /*#__PURE__*/React.createElement(ChromelessEditorContainer, {
|
|
108
55
|
maxHeight: maxHeight,
|
|
109
56
|
minHeight: minHeight,
|
|
110
57
|
containerRef: containerRef
|
|
111
|
-
},
|
|
58
|
+
}, /*#__PURE__*/React.createElement(EditorContentContainer
|
|
112
59
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
|
|
113
60
|
, {
|
|
114
61
|
className: "ak-editor-content-area",
|
|
115
62
|
featureFlags: featureFlags,
|
|
116
63
|
viewMode: editorViewMode,
|
|
117
64
|
appearance: this.appearance
|
|
118
|
-
}, customContentComponents && 'before' in customContentComponents ? customContentComponents.before : customContentComponents,
|
|
65
|
+
}, customContentComponents && 'before' in customContentComponents ? customContentComponents.before : customContentComponents, /*#__PURE__*/React.createElement(PluginSlot, {
|
|
119
66
|
editorView: editorView,
|
|
120
67
|
editorActions: editorActions,
|
|
121
68
|
eventDispatcher: eventDispatcher,
|
|
@@ -134,7 +81,7 @@ export default class Editor extends React.Component {
|
|
|
134
81
|
});
|
|
135
82
|
}
|
|
136
83
|
render() {
|
|
137
|
-
return
|
|
84
|
+
return /*#__PURE__*/React.createElement(RenderWithPluginState, {
|
|
138
85
|
editorAPI: this.props.editorAPI,
|
|
139
86
|
renderChrome: this.renderChrome
|
|
140
87
|
});
|
|
@@ -155,27 +102,15 @@ function RenderWithPluginState({
|
|
|
155
102
|
const maxContentSize = maxContentSizeReached === undefined ? undefined : {
|
|
156
103
|
maxContentSizeReached
|
|
157
104
|
};
|
|
158
|
-
return
|
|
105
|
+
return /*#__PURE__*/React.createElement(Fragment, null, renderChrome({
|
|
159
106
|
maxContentSize
|
|
160
107
|
}));
|
|
161
108
|
}
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
171
|
-
,
|
|
172
|
-
className: fg('platform_editor_chromeless_akeditor_class') || expValEquals('create_work_item_modernization_exp', 'isEnabled', true) ? 'akEditor' : undefined,
|
|
173
|
-
style: {
|
|
174
|
-
maxHeight: maxHeight ? `${maxHeight}px` : undefined,
|
|
175
|
-
minHeight: `${minHeight}px`
|
|
176
|
-
},
|
|
177
|
-
"data-testid": "chromeless-editor",
|
|
178
|
-
id: "chromeless-editor",
|
|
179
|
-
ref: containerRef
|
|
180
|
-
}, children);
|
|
181
|
-
}
|
|
109
|
+
|
|
110
|
+
/**
|
|
111
|
+
* Container for the chromeless editor appearance. This is used to set the max and min height
|
|
112
|
+
* of the editor content area, and to provide a ref to the container element for the popups.
|
|
113
|
+
* @param param0 props for the chromeless editor container
|
|
114
|
+
* @returns JSX element representing the chromeless editor container
|
|
115
|
+
*/
|
|
116
|
+
export const ChromelessEditorContainer = componentWithCondition(() => expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true), ChromelessEditorContainerCompiled, ChromelessEditorContainerEmotion);
|
|
@@ -369,7 +369,7 @@ export const EditorContentContainerEmotion = /*#__PURE__*/React.forwardRef((prop
|
|
|
369
369
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
370
370
|
unsupportedStyles,
|
|
371
371
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
372
|
-
resizerStyles, expValEquals('databases-native-embeds-v2', 'isEnabled', true) &&
|
|
372
|
+
resizerStyles, expValEqualsNoExposure('cc-maui-experiment', 'isEnabled', true) && expValEquals('databases-native-embeds-v2', 'isEnabled', true) &&
|
|
373
373
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
374
374
|
resizerBottomHandleStyles,
|
|
375
375
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._1e0c1txw{display:flex}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/* PluginSlot-compiled.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
import "./PluginSlot-compiled.compiled.css";
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
6
|
+
/**
|
|
7
|
+
* Compiled branch of the `platform_editor_core_non_ecc_static_css` experiment.
|
|
8
|
+
* Used via `componentWithCondition` in `index.tsx`.
|
|
9
|
+
*
|
|
10
|
+
* Cleanup: delete this file once the experiment has shipped.
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
const pluginsComponentsWrapperCompiledStyles = {
|
|
14
|
+
root: "_1e0c1txw"
|
|
15
|
+
};
|
|
16
|
+
export const PluginsComponentsWrapperCompiled = ({
|
|
17
|
+
children,
|
|
18
|
+
...rest
|
|
19
|
+
}) => /*#__PURE__*/React.createElement("div", _extends({}, rest, {
|
|
20
|
+
className: ax([pluginsComponentsWrapperCompiledStyles.root])
|
|
21
|
+
}), children);
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
/**
|
|
3
|
+
* @jsxRuntime classic
|
|
4
|
+
* @jsx jsx
|
|
5
|
+
*/
|
|
6
|
+
/**
|
|
7
|
+
* Emotion fallback branch of the `platform_editor_core_non_ecc_static_css` experiment.
|
|
8
|
+
* Used via `componentWithCondition` in `index.tsx`.
|
|
9
|
+
*
|
|
10
|
+
* Cleanup: delete this file once the experiment has shipped.
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- intentional: emotion fallback for compiled migration
|
|
14
|
+
import { css, jsx } from '@emotion/react';
|
|
15
|
+
const pluginsComponentsWrapperEmotionStyles = css({
|
|
16
|
+
display: 'flex'
|
|
17
|
+
});
|
|
18
|
+
export const PluginsComponentsWrapperEmotion = ({
|
|
19
|
+
children,
|
|
20
|
+
...rest
|
|
21
|
+
}) =>
|
|
22
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
23
|
+
jsx("div", _extends({
|
|
24
|
+
css: pluginsComponentsWrapperEmotionStyles
|
|
25
|
+
}, rest), children);
|
|
@@ -1,18 +1,13 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
1
|
import React from 'react';
|
|
6
|
-
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic
|
|
8
|
-
import { css, jsx } from '@emotion/react';
|
|
9
2
|
import isEqual from 'lodash/isEqual';
|
|
10
3
|
import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
|
|
4
|
+
import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
|
|
5
|
+
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
11
6
|
import { ErrorBoundary } from '../ErrorBoundary';
|
|
12
7
|
import { MountPluginHooks } from './mount-plugin-hooks';
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
8
|
+
import { PluginsComponentsWrapperCompiled } from './PluginSlot-compiled';
|
|
9
|
+
import { PluginsComponentsWrapperEmotion } from './PluginSlot-emotion';
|
|
10
|
+
const PluginsComponentsWrapperMigration = componentWithCondition(() => expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true), PluginsComponentsWrapperCompiled, PluginsComponentsWrapperEmotion);
|
|
16
11
|
const PluginSlot = ({
|
|
17
12
|
items,
|
|
18
13
|
editorView,
|
|
@@ -32,15 +27,14 @@ const PluginSlot = ({
|
|
|
32
27
|
if (!items && !pluginHooks) {
|
|
33
28
|
return null;
|
|
34
29
|
}
|
|
35
|
-
return
|
|
30
|
+
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
36
31
|
component: ACTION_SUBJECT.PLUGIN_SLOT,
|
|
37
32
|
fallbackComponent: null
|
|
38
|
-
},
|
|
33
|
+
}, /*#__PURE__*/React.createElement(MountPluginHooks, {
|
|
39
34
|
editorView: editorView,
|
|
40
35
|
pluginHooks: pluginHooks,
|
|
41
36
|
containerElement: containerElement
|
|
42
|
-
}),
|
|
43
|
-
css: pluginsComponentsWrapper,
|
|
37
|
+
}), /*#__PURE__*/React.createElement(PluginsComponentsWrapperMigration, {
|
|
44
38
|
"data-testid": "plugins-components-wrapper"
|
|
45
39
|
}, items === null || items === void 0 ? void 0 : items.map((component, key) => {
|
|
46
40
|
const props = {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export const name = "@atlaskit/editor-core";
|
|
2
|
-
export const version = "219.9.
|
|
2
|
+
export const version = "219.9.7";
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/* clickAreaBlock-compiled.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
+
var _excluded = ["children"];
|
|
5
|
+
import "./clickAreaBlock-compiled.compiled.css";
|
|
6
|
+
import * as React from 'react';
|
|
7
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
8
|
+
/**
|
|
9
|
+
* Compiled branch of the `platform_editor_core_non_ecc_static_css` experiment.
|
|
10
|
+
* Used via `componentWithCondition` in `index.tsx`.
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
var clickWrapperCompiledStyles = {
|
|
14
|
+
root: "_16jlkb7n _4t3i1osq"
|
|
15
|
+
};
|
|
16
|
+
export var ClickAreaBlockContainerCompiled = function ClickAreaBlockContainerCompiled(_ref) {
|
|
17
|
+
var children = _ref.children,
|
|
18
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
19
|
+
return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
|
|
20
|
+
className: ax([clickWrapperCompiledStyles.root])
|
|
21
|
+
}), children);
|
|
22
|
+
};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
+
var _excluded = ["children"];
|
|
4
|
+
/**
|
|
5
|
+
* @jsxRuntime classic
|
|
6
|
+
* @jsx jsx
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* Emotion fallback branch of the `platform_editor_core_non_ecc_static_css` experiment.
|
|
10
|
+
* Used via `componentWithCondition` in `index.tsx`.
|
|
11
|
+
*
|
|
12
|
+
* Cleanup: delete this file once the experiment has shipped.
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- intentional: emotion fallback for compiled migration
|
|
16
|
+
import { css, jsx } from '@emotion/react';
|
|
17
|
+
var clickWrapperEmotionStyles = css({
|
|
18
|
+
flexGrow: 1,
|
|
19
|
+
height: '100%'
|
|
20
|
+
});
|
|
21
|
+
export var ClickAreaBlockContainerEmotion = function ClickAreaBlockContainerEmotion(_ref) {
|
|
22
|
+
var children = _ref.children,
|
|
23
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
24
|
+
return (
|
|
25
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
26
|
+
jsx("div", _extends({
|
|
27
|
+
css: clickWrapperEmotionStyles
|
|
28
|
+
}, rest), children)
|
|
29
|
+
);
|
|
30
|
+
};
|
|
@@ -1,16 +1,12 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
1
|
import React from 'react';
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
import { css, jsx } from '@emotion/react';
|
|
2
|
+
import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
|
|
3
|
+
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
9
4
|
import { clickAreaClickHandler } from '../click-area-helper';
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
5
|
+
import { ClickAreaBlockContainerCompiled } from './clickAreaBlock-compiled';
|
|
6
|
+
import { ClickAreaBlockContainerEmotion } from './clickAreaBlock-emotion';
|
|
7
|
+
var ClickAreaBlockContainerMigration = componentWithCondition(function () {
|
|
8
|
+
return expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true);
|
|
9
|
+
}, ClickAreaBlockContainerCompiled, ClickAreaBlockContainerEmotion);
|
|
14
10
|
export var ClickAreaBlock = function ClickAreaBlock(_ref) {
|
|
15
11
|
var editorView = _ref.editorView,
|
|
16
12
|
editorDisabled = _ref.editorDisabled,
|
|
@@ -23,10 +19,9 @@ export var ClickAreaBlock = function ClickAreaBlock(_ref) {
|
|
|
23
19
|
clickAreaClickHandler(editorView, event);
|
|
24
20
|
}
|
|
25
21
|
}, [editorView, editorDisabled]);
|
|
26
|
-
return
|
|
22
|
+
return /*#__PURE__*/React.createElement(ClickAreaBlockContainerMigration, {
|
|
27
23
|
"data-editor-click-wrapper": true,
|
|
28
24
|
"data-testid": "click-wrapper",
|
|
29
|
-
css: clickWrapper,
|
|
30
25
|
onMouseDown: handleMouseDown
|
|
31
26
|
// This div is a presentational container that captures mouse events
|
|
32
27
|
// for programmatic editor focus management, not user interaction.
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
|
|
2
|
+
._1khk1mok:hover::-webkit-scrollbar-thumb{border-radius:var(--ds-radius-large,8px)}._123b1aqn:hover::-webkit-scrollbar-thumb{background-color:var(--ds-background-neutral-bold,#292a2e)}
|
|
3
|
+
._15gyze3t .ProseMirror>p:last-of-type{margin-bottom:var(--ds-space-0,0)}
|
|
4
|
+
._18m91wug{overflow-y:auto}
|
|
5
|
+
._1awku2gc div>.ProseMirror>:last-child{padding-bottom:var(--ds-space-100,8px)}
|
|
6
|
+
._1fpfolhs{ms-overflow-style:-ms-autohiding-scrollbar}
|
|
7
|
+
._1gfdidpf div>.ProseMirror{margin-bottom:0}
|
|
8
|
+
._1itkidpf div>.ProseMirror{margin-left:0}
|
|
9
|
+
._1nhbidpf div>.ProseMirror{margin-top:0}
|
|
10
|
+
._1q5yidpf div>.ProseMirror{margin-right:0}
|
|
11
|
+
._1reo15vq{overflow-x:hidden}
|
|
12
|
+
._1yt4idpf div>.ProseMirror{padding-top:0}
|
|
13
|
+
._4t3i1wug{height:auto}
|
|
14
|
+
._7fa7idpf div>.ProseMirror{padding-bottom:0}
|
|
15
|
+
._7fkv1jtm div>.ProseMirror{white-space:pre-wrap}
|
|
16
|
+
._8wn3idpf div>.ProseMirror{padding-left:0}
|
|
17
|
+
._aaynsm61::-webkit-scrollbar-thumb{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
18
|
+
._fpqb1r31 div>.ProseMirror{outline-color:currentColor}
|
|
19
|
+
._jaboglyw::-webkit-scrollbar-corner{display:none}
|
|
20
|
+
._l5dlglyw div>.ProseMirror{outline-style:none}
|
|
21
|
+
._p12f1kw7{max-width:inherit}
|
|
22
|
+
._slp31hna{word-wrap:break-word}
|
|
23
|
+
._tjxn1o36 div>.ProseMirror{outline-width:medium}
|
|
24
|
+
._vchhusvi{box-sizing:border-box}
|
|
25
|
+
._vwz4gktf{line-height:20px}
|
|
26
|
+
._y826idpf div>.ProseMirror{padding-right:0}
|
|
27
|
+
._1ogl1ibz::-webkit-scrollbar-thumb:hover{background-color:var(--ds-background-neutral-bold-hovered,#3b3d42)}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
/* Chromeless-compiled.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
/**
|
|
3
|
+
* Compiled branch of the `platform_editor_core_non_ecc_static_css` experiment.
|
|
4
|
+
* Used via `componentWithCondition` in `Chromeless.tsx`.
|
|
5
|
+
*
|
|
6
|
+
* Cleanup: delete this file once the experiment has shipped.
|
|
7
|
+
*/
|
|
8
|
+
import "./Chromeless-compiled.compiled.css";
|
|
9
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
10
|
+
import React from 'react';
|
|
11
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
12
|
+
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
13
|
+
var chromelessStyles = {
|
|
14
|
+
scrollbar: "_1fpfolhs _1khk1mok _123b1aqn _jaboglyw _aaynsm61 _1ogl1ibz",
|
|
15
|
+
editor: "_vwz4gktf _4t3i1wug _1reo15vq _18m91wug _p12f1kw7 _vchhusvi _slp31hna _fpqb1r31 _l5dlglyw _tjxn1o36 _1yt4idpf _y826idpf _7fa7idpf _8wn3idpf _1nhbidpf _1q5yidpf _1gfdidpf _1itkidpf _7fkv1jtm _1awku2gc _15gyze3t"
|
|
16
|
+
};
|
|
17
|
+
export var ChromelessEditorContainerCompiled = function ChromelessEditorContainerCompiled(_ref) {
|
|
18
|
+
var children = _ref.children,
|
|
19
|
+
containerRef = _ref.containerRef,
|
|
20
|
+
maxHeight = _ref.maxHeight,
|
|
21
|
+
minHeight = _ref.minHeight;
|
|
22
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
23
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
24
|
+
className: ax([chromelessStyles.editor, chromelessStyles.scrollbar, fg('platform_editor_chromeless_akeditor_class') || expValEquals('create_work_item_modernization_exp', 'isEnabled', true) ? 'akEditor' : undefined]),
|
|
25
|
+
style: {
|
|
26
|
+
maxHeight: maxHeight ? "".concat(maxHeight, "px") : undefined,
|
|
27
|
+
minHeight: "".concat(minHeight, "px")
|
|
28
|
+
},
|
|
29
|
+
ref: containerRef,
|
|
30
|
+
"data-testid": "chromeless-editor",
|
|
31
|
+
id: "chromeless-editor"
|
|
32
|
+
}, children);
|
|
33
|
+
};
|