@atlaskit/editor-core 205.3.0 → 205.3.2
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 +19 -0
- package/dist/cjs/composable-editor/core-editor.js +7 -2
- package/dist/cjs/ui/Appearance/FullPage/StyledComponents.js +1 -3
- package/dist/cjs/ui/ContentStyles/index.js +1 -1
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/composable-editor/core-editor.js +7 -1
- package/dist/es2019/ui/Appearance/FullPage/StyledComponents.js +1 -4
- package/dist/es2019/ui/ContentStyles/index.js +3 -3
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/composable-editor/core-editor.js +7 -2
- package/dist/esm/ui/Appearance/FullPage/StyledComponents.js +1 -3
- package/dist/esm/ui/ContentStyles/index.js +3 -3
- package/dist/esm/version-wrapper.js +1 -1
- package/package.json +6 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,24 @@
|
|
|
1
1
|
# @atlaskit/editor-core
|
|
2
2
|
|
|
3
|
+
## 205.3.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#140996](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/140996)
|
|
8
|
+
[`f24f59a665aaf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f24f59a665aaf) -
|
|
9
|
+
Added a temporary experiment to aid editor controls experiment set up
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
12
|
+
## 205.3.1
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- [#137211](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/137211)
|
|
17
|
+
[`d00cb55d6fa4b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d00cb55d6fa4b) -
|
|
18
|
+
[ux] ED27118 Increase pull page editor gutter to allow more space for new floating insert button -
|
|
19
|
+
https://hello.atlassian.net/wiki/spaces/EDITOR/pages/5120694962/Editor+DACI+New+insert+button+and+full-width+screens+2.0
|
|
20
|
+
- Updated dependencies
|
|
21
|
+
|
|
3
22
|
## 205.3.0
|
|
4
23
|
|
|
5
24
|
### Minor Changes
|
|
@@ -18,6 +18,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
|
|
|
18
18
|
var _performanceMeasures = require("@atlaskit/editor-common/performance-measures");
|
|
19
19
|
var _analytics2 = require("@atlaskit/editor-common/utils/analytics");
|
|
20
20
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
21
|
+
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
21
22
|
var _actions = _interopRequireDefault(require("../actions"));
|
|
22
23
|
var _EditorContext = require("../ui/EditorContext");
|
|
23
24
|
var _featureFlagsFromProps = require("../utils/feature-flags-from-props");
|
|
@@ -115,13 +116,17 @@ var useMemoEditorFeatureFlags = function useMemoEditorFeatureFlags(featureFlags)
|
|
|
115
116
|
function CoreEditor(props) {
|
|
116
117
|
var editorSessionId = (0, _react.useRef)((0, _v.default)());
|
|
117
118
|
var data = (0, _react.useMemo)(function () {
|
|
118
|
-
return {
|
|
119
|
+
return _objectSpread({
|
|
119
120
|
packageName: _versionWrapper.name,
|
|
120
121
|
packageVersion: _versionWrapper.version,
|
|
121
122
|
componentName: 'editorCore',
|
|
122
123
|
appearance: (0, _analytics2.getAnalyticsAppearance)(props.appearance),
|
|
123
124
|
editorSessionId: editorSessionId.current
|
|
124
|
-
}
|
|
125
|
+
}, (0, _experiments.editorExperiment)('platform_editor_controls_shadow', 'variant1', {
|
|
126
|
+
exposure: true
|
|
127
|
+
}) ? {
|
|
128
|
+
tmpControlsShadow: true
|
|
129
|
+
} : {});
|
|
125
130
|
}, [props.appearance]);
|
|
126
131
|
var memodEditorFeatureFlags = useMemoEditorFeatureFlags(props.featureFlags);
|
|
127
132
|
return (0, _react2.jsx)(_analyticsNamespacedContext.FabricEditorAnalyticsContext
|
|
@@ -220,12 +220,10 @@ _commonStyles.tableFullPageEditorStyles, {
|
|
|
220
220
|
|
|
221
221
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
222
222
|
var editorContentGutterStyle = exports.editorContentGutterStyle = function editorContentGutterStyle() {
|
|
223
|
-
var padding = (0, _platformFeatureFlags.fg)('platform_editor_core_increase_full_page_guttering') ? // there is no space token for 52px
|
|
224
|
-
"0 52px" : "0 ".concat("var(--ds-space-400, 32px)");
|
|
225
223
|
return (0, _react.css)({
|
|
226
224
|
boxSizing: 'border-box',
|
|
227
225
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
228
|
-
padding:
|
|
226
|
+
padding: "0 ".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px")
|
|
229
227
|
});
|
|
230
228
|
};
|
|
231
229
|
|
|
@@ -154,7 +154,7 @@ var fixBlockControlStylesSSR = exports.fixBlockControlStylesSSR = function fixBl
|
|
|
154
154
|
// The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
|
|
155
155
|
var akEditorBreakpointForSmallDevice = "1266px";
|
|
156
156
|
var contentStyles = function contentStyles(props) {
|
|
157
|
-
return (0, _react2.css)(_templateObject10 || (_templateObject10 = (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:
|
|
157
|
+
return (0, _react2.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: ", "px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t", "\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t *\n\t * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n // Switch between the two icons based on the visual refresh feature gate\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\n .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.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), _editorSharedStyles.akEditorGutterPadding, (0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), _editorSharedStyles.akEditorDefaultLayoutWidth, _editorSharedStyles.akEditorFullWidthLayoutWidth, _editorSharedStyles.akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, _editorSharedStyles.akEditorCalculatedWideLayoutWidth, (0, _editorSharedStyles.editorFontSize)({
|
|
158
158
|
theme: props.theme
|
|
159
159
|
}), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('editor_request_to_edit_task') ? null : (0, _react2.css)(_templateObject11 || (_templateObject11 = (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)(_templateObject12 || (_templateObject12 = (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)(_templateObject13 || (_templateObject13 = (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_controls_patch_3') ? placeholderWrapStyles : null, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(props.typographyTheme), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, (0, _styles.backgroundColorStyles)(), listsStyles, ruleStyles(), (0, _media.mediaStyles)(), (0, _layout.layoutStyles)(props.viewMode), _collab.telepointerStyle, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
160
160
|
exposure: false
|
|
@@ -15,6 +15,7 @@ import { ACTION, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
|
|
|
15
15
|
import { startMeasure, stopMeasure } from '@atlaskit/editor-common/performance-measures';
|
|
16
16
|
import { getAnalyticsAppearance } from '@atlaskit/editor-common/utils/analytics';
|
|
17
17
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
18
|
+
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
18
19
|
import EditorActions from '../actions';
|
|
19
20
|
import { useEditorContext } from '../ui/EditorContext';
|
|
20
21
|
import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
|
|
@@ -118,7 +119,12 @@ export function CoreEditor(props) {
|
|
|
118
119
|
packageVersion: version,
|
|
119
120
|
componentName: 'editorCore',
|
|
120
121
|
appearance: getAnalyticsAppearance(props.appearance),
|
|
121
|
-
editorSessionId: editorSessionId.current
|
|
122
|
+
editorSessionId: editorSessionId.current,
|
|
123
|
+
...(editorExperiment('platform_editor_controls_shadow', 'variant1', {
|
|
124
|
+
exposure: true
|
|
125
|
+
}) ? {
|
|
126
|
+
tmpControlsShadow: true
|
|
127
|
+
} : {})
|
|
122
128
|
};
|
|
123
129
|
}, [props.appearance]);
|
|
124
130
|
const memodEditorFeatureFlags = useMemoEditorFeatureFlags(props.featureFlags);
|
|
@@ -208,13 +208,10 @@ tableFullPageEditorStyles, {
|
|
|
208
208
|
|
|
209
209
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
210
210
|
export const editorContentGutterStyle = () => {
|
|
211
|
-
const padding = fg('platform_editor_core_increase_full_page_guttering') ?
|
|
212
|
-
// there is no space token for 52px
|
|
213
|
-
`0 52px` : `0 ${"var(--ds-space-400, 32px)"}`;
|
|
214
211
|
return css({
|
|
215
212
|
boxSizing: 'border-box',
|
|
216
213
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
217
|
-
padding:
|
|
214
|
+
padding: `0 ${akEditorGutterPaddingDynamic()}px`
|
|
218
215
|
});
|
|
219
216
|
};
|
|
220
217
|
|
|
@@ -17,12 +17,12 @@ import { EmojiSharedCssClassName, defaultEmojiHeight } from '@atlaskit/editor-co
|
|
|
17
17
|
import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
|
|
18
18
|
import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
|
|
19
19
|
import { gapCursorStyles } from '@atlaskit/editor-common/selection';
|
|
20
|
-
import { annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix,
|
|
20
|
+
import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, ruleSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
|
|
21
21
|
import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
|
|
22
22
|
import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
|
|
23
23
|
import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
|
|
24
24
|
import { placeholderTextStyles } from '@atlaskit/editor-plugins/placeholder-text/styles';
|
|
25
|
-
import { akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles
|
|
25
|
+
import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
|
|
26
26
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
27
27
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
28
28
|
import { useThemeObserver } from '@atlaskit/tokens';
|
|
@@ -305,7 +305,7 @@ const akEditorBreakpointForSmallDevice = `1266px`;
|
|
|
305
305
|
const contentStyles = props => css`
|
|
306
306
|
--ak-editor--default-gutter-padding: ${akEditorGutterPadding}px;
|
|
307
307
|
/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */
|
|
308
|
-
--ak-editor--large-gutter-padding:
|
|
308
|
+
--ak-editor--large-gutter-padding: ${akEditorGutterPaddingDynamic()}px;
|
|
309
309
|
--ak-editor--default-layout-width: ${akEditorDefaultLayoutWidth}px;
|
|
310
310
|
--ak-editor--full-width-layout-width: ${akEditorFullWidthLayoutWidth}px;
|
|
311
311
|
/* calculate editor line length, 100cqw is the editor container width */
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export const name = "@atlaskit/editor-core";
|
|
2
|
-
export const version = "205.3.
|
|
2
|
+
export const version = "205.3.2";
|
|
@@ -18,6 +18,7 @@ import { ACTION, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
|
|
|
18
18
|
import { startMeasure, stopMeasure } from '@atlaskit/editor-common/performance-measures';
|
|
19
19
|
import { getAnalyticsAppearance } from '@atlaskit/editor-common/utils/analytics';
|
|
20
20
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
21
|
+
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
21
22
|
import EditorActions from '../actions';
|
|
22
23
|
import { useEditorContext } from '../ui/EditorContext';
|
|
23
24
|
import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
|
|
@@ -111,13 +112,17 @@ var useMemoEditorFeatureFlags = function useMemoEditorFeatureFlags(featureFlags)
|
|
|
111
112
|
export function CoreEditor(props) {
|
|
112
113
|
var editorSessionId = useRef(uuid());
|
|
113
114
|
var data = useMemo(function () {
|
|
114
|
-
return {
|
|
115
|
+
return _objectSpread({
|
|
115
116
|
packageName: name,
|
|
116
117
|
packageVersion: version,
|
|
117
118
|
componentName: 'editorCore',
|
|
118
119
|
appearance: getAnalyticsAppearance(props.appearance),
|
|
119
120
|
editorSessionId: editorSessionId.current
|
|
120
|
-
}
|
|
121
|
+
}, editorExperiment('platform_editor_controls_shadow', 'variant1', {
|
|
122
|
+
exposure: true
|
|
123
|
+
}) ? {
|
|
124
|
+
tmpControlsShadow: true
|
|
125
|
+
} : {});
|
|
121
126
|
}, [props.appearance]);
|
|
122
127
|
var memodEditorFeatureFlags = useMemoEditorFeatureFlags(props.featureFlags);
|
|
123
128
|
return jsx(FabricEditorAnalyticsContext
|
|
@@ -213,12 +213,10 @@ tableFullPageEditorStyles, {
|
|
|
213
213
|
|
|
214
214
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
215
215
|
export var editorContentGutterStyle = function editorContentGutterStyle() {
|
|
216
|
-
var padding = fg('platform_editor_core_increase_full_page_guttering') ? // there is no space token for 52px
|
|
217
|
-
"0 52px" : "0 ".concat("var(--ds-space-400, 32px)");
|
|
218
216
|
return css({
|
|
219
217
|
boxSizing: 'border-box',
|
|
220
218
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
221
|
-
padding:
|
|
219
|
+
padding: "0 ".concat(akEditorGutterPaddingDynamic(), "px")
|
|
222
220
|
});
|
|
223
221
|
};
|
|
224
222
|
|
|
@@ -19,12 +19,12 @@ import { EmojiSharedCssClassName, defaultEmojiHeight } from '@atlaskit/editor-co
|
|
|
19
19
|
import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
|
|
20
20
|
import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
|
|
21
21
|
import { gapCursorStyles } from '@atlaskit/editor-common/selection';
|
|
22
|
-
import { annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix,
|
|
22
|
+
import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, ruleSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
|
|
23
23
|
import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
|
|
24
24
|
import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
|
|
25
25
|
import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
|
|
26
26
|
import { placeholderTextStyles } from '@atlaskit/editor-plugins/placeholder-text/styles';
|
|
27
|
-
import { akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles
|
|
27
|
+
import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
|
|
28
28
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
29
29
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
30
30
|
import { useThemeObserver } from '@atlaskit/tokens';
|
|
@@ -146,7 +146,7 @@ export var fixBlockControlStylesSSR = function fixBlockControlStylesSSR() {
|
|
|
146
146
|
// The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
|
|
147
147
|
var akEditorBreakpointForSmallDevice = "1266px";
|
|
148
148
|
var contentStyles = function contentStyles(props) {
|
|
149
|
-
return css(_templateObject10 || (_templateObject10 = _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:
|
|
149
|
+
return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: ", "px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t", "\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t *\n\t * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n // Switch between the two icons based on the visual refresh feature gate\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\n .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.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, editorFontSize({
|
|
150
150
|
theme: props.theme
|
|
151
151
|
}), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('editor_request_to_edit_task') ? null : css(_templateObject11 || (_templateObject11 = _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(_templateObject12 || (_templateObject12 = _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(_templateObject13 || (_templateObject13 = _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_controls_patch_3') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(props.typographyTheme), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles(), listsStyles, ruleStyles(), mediaStyles(), layoutStyles(props.viewMode), telepointerStyle, gapCursorStyles, panelStyles(), mentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
152
152
|
exposure: false
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export var name = "@atlaskit/editor-core";
|
|
2
|
-
export var version = "205.3.
|
|
2
|
+
export var version = "205.3.2";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-core",
|
|
3
|
-
"version": "205.3.
|
|
3
|
+
"version": "205.3.2",
|
|
4
4
|
"description": "A package contains Atlassian editor core functionality",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"@atlaskit/platform-feature-flags-react": "^0.1.0",
|
|
62
62
|
"@atlaskit/react-ufo": "^3.5.0",
|
|
63
63
|
"@atlaskit/task-decision": "^19.1.0",
|
|
64
|
-
"@atlaskit/tmp-editor-statsig": "^4.
|
|
64
|
+
"@atlaskit/tmp-editor-statsig": "^4.7.0",
|
|
65
65
|
"@atlaskit/tokens": "^4.7.0",
|
|
66
66
|
"@atlaskit/tooltip": "^20.0.0",
|
|
67
67
|
"@atlaskit/width-detector": "^5.0.0",
|
|
@@ -204,9 +204,6 @@
|
|
|
204
204
|
"platform_editor_track_dangerous_append_plugins": {
|
|
205
205
|
"type": "boolean"
|
|
206
206
|
},
|
|
207
|
-
"platform_editor_core_increase_full_page_guttering": {
|
|
208
|
-
"type": "boolean"
|
|
209
|
-
},
|
|
210
207
|
"platform_editor_element_drag_and_drop_ed_23873": {
|
|
211
208
|
"type": "boolean",
|
|
212
209
|
"referenceOnly": true
|
|
@@ -643,6 +640,10 @@
|
|
|
643
640
|
"platform_renderer_triple_click_selects_paragraph": {
|
|
644
641
|
"type": "boolean",
|
|
645
642
|
"referenceOnly": true
|
|
643
|
+
},
|
|
644
|
+
"platform_editor_controls_patch_4": {
|
|
645
|
+
"type": "boolean",
|
|
646
|
+
"referenceOnly": true
|
|
646
647
|
}
|
|
647
648
|
},
|
|
648
649
|
"stricter": {
|