@atlaskit/editor-core 207.4.0 → 207.5.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 +16 -0
- package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js +11 -1
- package/dist/cjs/ui/ContentStyles/layout.js +1 -1
- package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js +6 -3
- package/dist/cjs/ui/EditorContentContainer/styles/resizerStyles.js +211 -0
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js +11 -1
- package/dist/es2019/ui/ContentStyles/layout.js +1 -2
- package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js +5 -4
- package/dist/es2019/ui/EditorContentContainer/styles/ai-panel.js +1 -1
- package/dist/es2019/ui/EditorContentContainer/styles/layout.js +7 -7
- package/dist/es2019/ui/EditorContentContainer/styles/link.js +1 -1
- package/dist/es2019/ui/EditorContentContainer/styles/resizerStyles.js +256 -0
- package/dist/es2019/ui/EditorContentContainer/styles/rule.js +2 -2
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js +11 -1
- package/dist/esm/ui/ContentStyles/layout.js +1 -1
- package/dist/esm/ui/EditorContentContainer/EditorContentContainer.js +7 -4
- package/dist/esm/ui/EditorContentContainer/styles/ai-panel.js +1 -1
- package/dist/esm/ui/EditorContentContainer/styles/layout.js +7 -7
- package/dist/esm/ui/EditorContentContainer/styles/link.js +1 -1
- package/dist/esm/ui/EditorContentContainer/styles/resizerStyles.js +203 -0
- package/dist/esm/ui/EditorContentContainer/styles/rule.js +2 -2
- package/dist/esm/version-wrapper.js +1 -1
- package/dist/types/ui/EditorContentContainer/styles/resizerStyles.d.ts +10 -0
- package/dist/types-ts4.5/ui/EditorContentContainer/styles/resizerStyles.d.ts +10 -0
- package/package.json +9 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/editor-core
|
|
2
2
|
|
|
3
|
+
## 207.5.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#159938](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/159938)
|
|
8
|
+
[`b89d348f570a5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b89d348f570a5) -
|
|
9
|
+
[https://product-fabric.atlassian.net/browse/ED-27746](ED-27746) - rewrite editor resizer CSS in
|
|
10
|
+
static emotion
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- [#159418](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/159418)
|
|
15
|
+
[`5f1c8497e044e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5f1c8497e044e) -
|
|
16
|
+
[ux] ED-27103 improved method for applying the correct offline banner toolbar position when editor
|
|
17
|
+
toolbar is either docked to top or contextual
|
|
18
|
+
|
|
3
19
|
## 207.4.0
|
|
4
20
|
|
|
5
21
|
### Minor Changes
|
|
@@ -81,6 +81,16 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
81
81
|
if (props.hasHadInteraction && (0, _platformFeatureFlags.fg)('platform_editor_no_cursor_on_live_doc_init')) {
|
|
82
82
|
interactionClassName = props.hasHadInteraction ? 'ak-editor-has-interaction' : 'ak-editor-no-interaction';
|
|
83
83
|
}
|
|
84
|
+
var shouldSetHiddenDataAttribute = function shouldSetHiddenDataAttribute() {
|
|
85
|
+
// When platform_editor_offline_banner_toolbar_position is enabled we use a different method to
|
|
86
|
+
// determine if the toolbar is hidden from outside of the editor, which doesn't require setting
|
|
87
|
+
// data-editor-primary-toolbar-hidden on the content area
|
|
88
|
+
// NOTE: When tidying, this function and the data attribute can be removed
|
|
89
|
+
if (!props.isEditorToolbarHidden || (0, _platformFeatureFlags.fg)('platform_editor_offline_banner_toolbar_position')) {
|
|
90
|
+
return false;
|
|
91
|
+
}
|
|
92
|
+
return (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
|
|
93
|
+
};
|
|
84
94
|
return (0, _react2.jsx)("div", {
|
|
85
95
|
css: [
|
|
86
96
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
@@ -122,7 +132,7 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
122
132
|
,
|
|
123
133
|
className: "ak-editor-content-area-region",
|
|
124
134
|
"data-editor-editable-content": true,
|
|
125
|
-
"data-editor-primary-toolbar-hidden":
|
|
135
|
+
"data-editor-primary-toolbar-hidden": shouldSetHiddenDataAttribute() ? 'true' : undefined,
|
|
126
136
|
role: "region",
|
|
127
137
|
"aria-label": props.intl.formatMessage(_messages.fullPageMessages.editableContentLabel),
|
|
128
138
|
ref: contentAreaRef
|
|
@@ -77,5 +77,5 @@ var layoutResponsiveStyles = function layoutResponsiveStyles(viewMode) {
|
|
|
77
77
|
|
|
78
78
|
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
|
|
79
79
|
var layoutStyles = exports.layoutStyles = function layoutStyles(viewMode) {
|
|
80
|
-
return (0, _react.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t", "\n\t\t[data-layout-section] {\n\t\t\t/* Ignored via go/ees007\n\t\t\tTODO: Migrate away from gridSize\n\t\t\tRecommendation: Replace directly with 7px */\n\t\t\tmargin: ", " -", "px
|
|
80
|
+
return (0, _react.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t", "\n\t\t[data-layout-section] {\n\t\t\t/* Ignored via go/ees007\n\t\t\tTODO: Migrate away from gridSize\n\t\t\tRecommendation: Replace directly with 7px */\n\t\t\tmargin: ", " -", "px 0;\n\t\t\ttransition: border-color 0.3s ", ";\n\t\t\tcursor: ", ";\n\n\t\t\t/* Inner cursor located 26px from left */\n\t\t\t[data-layout-column] {\n\t\t\t\tflex: 1;\n\t\t\t\tposition: relative;\n\n\t\t\t\tmin-width: 0;\n\t\t\t\t/* disable 4 borders when in view mode and advanced layouts is on */\n\t\t\t\tborder: ", "px\n\t\t\t\t\tsolid ", ";\n\t\t\t\tborder-radius: 4px;\n\t\t\t\tpadding: ", "px\n\t\t\t\t\t", "px;\n\t\t\t\tbox-sizing: border-box;\n\n\t\t\t\t> div {\n\t\t\t\t\t", "\n\n\t\t\t\t\t> .embedCardView-content-wrap:first-of-type .rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .mediaSingleView-content-wrap:first-of-type .rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .ProseMirror-gapcursor.-right:first-child\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> style:first-child\n\t\t\t\t\t\t+ .ProseMirror-gapcursor.-right\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> .ProseMirror-gapcursor.-right:first-of-type\n\t\t\t\t\t\t+ .embedCardView-content-wrap\n\t\t\t\t\t\t.rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .ProseMirror-gapcursor:first-child\n\t\t\t\t\t\t+ span\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> style:first-child\n\t\t\t\t\t\t+ .ProseMirror-gapcursor\n\t\t\t\t\t\t+ span\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t/* Prevent first DecisionWrapper's margin-top: 8px from shifting decisions down\n and shrinking layout's node selectable area (leniency margin) */\n\t\t\t\t\t> [data-node-type='decisionList'] {\n\t\t\t\t\t\tli:first-of-type [data-decision-wrapper] {\n\t\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t/* Make the 'content' fill the entire height of the layout column to allow click\n handler of layout section nodeview to target only data-layout-column */\n\t\t\t\t[data-layout-content] {\n\t\t\t\t\theight: 100%;\n\t\t\t\t\tcursor: text;\n\t\t\t\t\t.mediaGroupView-content-wrap {\n\t\t\t\t\t\tclear: both;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t", "\n\t\t}\n\n\t\t/* styles to support borders for layout */\n\t\t[data-layout-section],\n\t\t.layoutSectionView-content-wrap {\n\t\t\t", "\n\t\t}\n\t}\n\n\t", "\n\n\t/* hide separator when element is dragging on top of a layout column */\n\t[data-blocks-drop-target-container] ~ [data-layout-column] > [data-layout-content]::before {\n\t\tdisplay: none;\n\t}\n\n\t.fabric-editor--full-width-mode .ProseMirror {\n\t\t[data-layout-section] {\n\t\t\t.", " {\n\t\t\t\tmargin: 0 ", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n"])), layoutSectionStyles(), "var(--ds-space-100, 8px)", _editorSharedStyles.akLayoutGutterOffset + ((0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0), _editorSharedStyles.akEditorSwoopCubicBezier, viewMode === 'view' ? 'default' : 'pointer', viewMode === 'view' || (0, _experiments.editorExperiment)('advanced_layouts', true) ? 0 : _editorSharedStyles.akEditorSelectedBorderSize, "var(--ds-border, #091E4224)", _styles.LAYOUT_COLUMN_PADDING, _styles.LAYOUT_COLUMN_PADDING + ((0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? 8 : 0), firstNodeWithNotMarginTop(), layoutColumnStyles(), (0, _experiments.editorExperiment)('advanced_layouts', true) ? layoutWithSeparatorBorderStyles(viewMode) : layoutBorderStyles(viewMode), (0, _experiments.editorExperiment)('advanced_layouts', true) && layoutResponsiveStyles(viewMode), _types.TableCssClassName.TABLE_CONTAINER, _consts.tableMarginFullWidthMode, (0, _experiments.editorExperiment)('advanced_layouts', false) && (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && ".ak-editor-content-area.appearance-full-page .ProseMirror [data-layout-section] {\n\t\t\t\tmargin: ".concat("var(--ds-space-100, 8px)", " -", _editorSharedStyles.akLayoutGutterOffset + 8, "px 0;\n\t\t\t\t}"));
|
|
81
81
|
};
|
|
@@ -40,6 +40,7 @@ var _embedCardStyles = require("./styles/embedCardStyles");
|
|
|
40
40
|
var _layout = require("./styles/layout");
|
|
41
41
|
var _link = require("./styles/link");
|
|
42
42
|
var _mediaStyles = require("./styles/mediaStyles");
|
|
43
|
+
var _resizerStyles = require("./styles/resizerStyles");
|
|
43
44
|
var _rule = require("./styles/rule");
|
|
44
45
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
|
|
45
46
|
/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
|
|
@@ -147,7 +148,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
|
|
|
147
148
|
|
|
148
149
|
// jest warning: JSDOM version (22) doesn't support the new @container CSS rule
|
|
149
150
|
var contentStyles = function contentStyles() {
|
|
150
|
-
return (0, _react2.css)(_templateObject8 || (_templateObject8 = (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\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\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 ", "\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\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n
|
|
151
|
+
return (0, _react2.css)(_templateObject8 || (_templateObject8 = (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\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\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 ", "\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\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t// For FullPage only when inside a table\n\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, _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('editor_request_to_edit_task') ? null : (0, _react2.css)(_templateObject9 || (_templateObject9 = (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)(_templateObject10 || (_templateObject10 = (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)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", _styles5.placeholderTextStyles, placeholderStyles, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, _backgroundColorStyles.backgroundColorStyles, listsStyles, _rule.ruleStyles, _mediaStyles.mediaStyles, (0, _platformFeatureFlags.fg)('confluence_team_presence_scroll_to_pointer') ? _collab.telepointerStyle : _collab.telepointerStyleWithInitialOnly, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
151
152
|
exposure: false
|
|
152
153
|
}) && vanillaMentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
153
154
|
exposure: false
|
|
@@ -161,7 +162,7 @@ var contentStyles = function contentStyles() {
|
|
|
161
162
|
exposure: false
|
|
162
163
|
}) && (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithVisualRefresh, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
|
|
163
164
|
exposure: false
|
|
164
|
-
}) && !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithoutVisualRefresh, _status.statusStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? (0, _status.vanillaStatusStyles)() : null, _annotationStyles.annotationStyles, (0, _styles.smartCardStyles)(), (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') ? (0, _styles.getSmartCardSharedStyles)() : _styles.smartCardSharedStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? _date.dateVanillaStyles : null, _date.dateStyles, _embedCardStyles.embedCardStyles, _styles.unsupportedStyles,
|
|
165
|
+
}) && !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.vanillaTaskDecisionIconWithoutVisualRefresh, _status.statusStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? (0, _status.vanillaStatusStyles)() : null, _annotationStyles.annotationStyles, (0, _styles.smartCardStyles)(), (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') ? (0, _styles.getSmartCardSharedStyles)() : _styles.smartCardSharedStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true) ? _date.dateVanillaStyles : null, _date.dateStyles, _embedCardStyles.embedCardStyles, _styles.unsupportedStyles, _resizerStyles.resizerStyles, fixBlockControlStylesSSR(), !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? (0, _react2.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
|
|
165
166
|
};
|
|
166
167
|
var CommentEditorMargin = 14;
|
|
167
168
|
|
|
@@ -233,7 +234,9 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
|
|
|
233
234
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
234
235
|
(0, _layout.layoutBaseStyles)(),
|
|
235
236
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
236
|
-
(0, _platformFeatureFlags.fg)('platform_editor_hyperlink_underline') ? _link.linkStyles : _link.linkStylesOld,
|
|
237
|
+
(0, _platformFeatureFlags.fg)('platform_editor_hyperlink_underline') ? _link.linkStyles : _link.linkStylesOld, (0, _experiments.editorExperiment)('platform_editor_breakout_resizing', true) &&
|
|
238
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
239
|
+
_resizerStyles.pragmaticResizerStyles,
|
|
237
240
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
238
241
|
_aiPanel.aiPanelBaseStyles,
|
|
239
242
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
@@ -0,0 +1,211 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.resizerStyles = exports.resizerItemClassName = exports.resizerHoverZoneClassName = exports.resizerHandleTrackClassName = exports.resizerHandleThumbClassName = exports.resizerHandleClassName = exports.resizerExtendedZone = exports.resizerDangerClassName = exports.pragmaticResizerStyles = exports.handleWrapperClass = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
+
var _react = require("@emotion/react");
|
|
10
|
+
// eslint-disable-line
|
|
11
|
+
|
|
12
|
+
var resizerItemClassName = exports.resizerItemClassName = 'resizer-item';
|
|
13
|
+
var resizerHoverZoneClassName = exports.resizerHoverZoneClassName = 'resizer-hover-zone';
|
|
14
|
+
var resizerExtendedZone = exports.resizerExtendedZone = 'resizer-is-extended';
|
|
15
|
+
var resizerHandleClassName = exports.resizerHandleClassName = 'resizer-handle';
|
|
16
|
+
var resizerHandleTrackClassName = exports.resizerHandleTrackClassName = "".concat(resizerHandleClassName, "-track");
|
|
17
|
+
var resizerHandleThumbClassName = exports.resizerHandleThumbClassName = "".concat(resizerHandleClassName, "-thumb");
|
|
18
|
+
var resizerDangerClassName = exports.resizerDangerClassName = "".concat(resizerHandleClassName, "-danger");
|
|
19
|
+
var handleWrapperClass = exports.handleWrapperClass = 'resizer-handle-wrapper';
|
|
20
|
+
|
|
21
|
+
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766, Seems perfectly safe to autofix, but comments would be lost…
|
|
22
|
+
var resizerStyles = exports.resizerStyles = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(resizerItemClassName), (0, _defineProperty2.default)({
|
|
23
|
+
willChange: 'width',
|
|
24
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
25
|
+
'&:hover, &.display-handle': (0, _defineProperty2.default)({}, "& > .".concat(handleWrapperClass, " > .").concat(resizerHandleClassName), {
|
|
26
|
+
visibility: 'visible',
|
|
27
|
+
opacity: 1
|
|
28
|
+
}),
|
|
29
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
30
|
+
'&.is-resizing': (0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
31
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
32
|
+
})
|
|
33
|
+
}, "&.".concat(resizerDangerClassName), (0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
34
|
+
transition: 'none',
|
|
35
|
+
background: "var(--ds-icon-danger, #C9372C)"
|
|
36
|
+
}))), ".".concat(resizerHandleClassName), {
|
|
37
|
+
display: 'flex',
|
|
38
|
+
visibility: 'hidden',
|
|
39
|
+
opacity: 0,
|
|
40
|
+
flexDirection: 'column',
|
|
41
|
+
justifyContent: 'center',
|
|
42
|
+
alignItems: 'center',
|
|
43
|
+
width: 7,
|
|
44
|
+
transition: 'visibility 0.2s, opacity 0.2s',
|
|
45
|
+
// NOTE: The below style is targeted at the div element added by the tooltip. We don't have any means of injecting styles
|
|
46
|
+
// into the tooltip
|
|
47
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
48
|
+
"& div[role='presentation']": {
|
|
49
|
+
width: '100%',
|
|
50
|
+
height: '100%',
|
|
51
|
+
display: 'flex',
|
|
52
|
+
flexDirection: 'column',
|
|
53
|
+
justifyContent: 'center',
|
|
54
|
+
alignItems: 'center',
|
|
55
|
+
marginTop: "var(--ds-space-negative-200, -16px)",
|
|
56
|
+
whiteSpace: 'normal'
|
|
57
|
+
},
|
|
58
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
59
|
+
'&.left': {
|
|
60
|
+
alignItems: 'flex-start'
|
|
61
|
+
},
|
|
62
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
63
|
+
'&.right': {
|
|
64
|
+
alignItems: 'flex-end'
|
|
65
|
+
},
|
|
66
|
+
// Handle Sizing
|
|
67
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
68
|
+
'&.small': (0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
69
|
+
height: 43
|
|
70
|
+
}),
|
|
71
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
72
|
+
'&.medium': (0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
73
|
+
height: 64
|
|
74
|
+
}),
|
|
75
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
76
|
+
'&.large': (0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
77
|
+
height: 96
|
|
78
|
+
}),
|
|
79
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
80
|
+
'&.clamped': (0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
81
|
+
height: 'clamp(43px, calc(100% - 32px), 96px)'
|
|
82
|
+
}),
|
|
83
|
+
// Handle Alignment
|
|
84
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
85
|
+
'&.sticky': (0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
86
|
+
position: 'sticky',
|
|
87
|
+
top: "var(--ds-space-150, 12px)",
|
|
88
|
+
bottom: "var(--ds-space-150, 12px)"
|
|
89
|
+
}),
|
|
90
|
+
'&:hover': (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
91
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
92
|
+
}), "& .".concat(resizerHandleTrackClassName), {
|
|
93
|
+
visibility: 'visible',
|
|
94
|
+
opacity: 0.5
|
|
95
|
+
})
|
|
96
|
+
}), ".".concat(resizerHandleThumbClassName), {
|
|
97
|
+
content: "' '",
|
|
98
|
+
display: 'flex',
|
|
99
|
+
width: 3,
|
|
100
|
+
margin: "0 ".concat("var(--ds-space-025, 2px)"),
|
|
101
|
+
height: 64,
|
|
102
|
+
transition: 'background-color 0.2s',
|
|
103
|
+
borderRadius: 6,
|
|
104
|
+
border: 0,
|
|
105
|
+
padding: 0,
|
|
106
|
+
zIndex: 2,
|
|
107
|
+
outline: 'none',
|
|
108
|
+
minHeight: 24,
|
|
109
|
+
background: "var(--ds-border, #091E4224)",
|
|
110
|
+
'&:hover': {
|
|
111
|
+
cursor: 'col-resize'
|
|
112
|
+
},
|
|
113
|
+
'&:focus': {
|
|
114
|
+
background: "var(--ds-border-selected, #0C66E4)",
|
|
115
|
+
'&::after': {
|
|
116
|
+
content: "''",
|
|
117
|
+
position: 'absolute',
|
|
118
|
+
top: "var(--ds-space-negative-050, -4px)",
|
|
119
|
+
right: "var(--ds-space-negative-050, -4px)",
|
|
120
|
+
bottom: "var(--ds-space-negative-050, -4px)",
|
|
121
|
+
left: "var(--ds-space-negative-050, -4px)",
|
|
122
|
+
border: "2px solid ".concat("var(--ds-border-focused, #388BFF)"),
|
|
123
|
+
borderRadius: 'inherit',
|
|
124
|
+
zIndex: -1
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
}), ".".concat(resizerHandleTrackClassName), {
|
|
128
|
+
visibility: 'hidden',
|
|
129
|
+
position: 'absolute',
|
|
130
|
+
width: 7,
|
|
131
|
+
height: 'calc(100% - 40px)',
|
|
132
|
+
borderRadius: 4,
|
|
133
|
+
opacity: 0,
|
|
134
|
+
transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
|
|
135
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
136
|
+
'&.none': {
|
|
137
|
+
background: 'none'
|
|
138
|
+
},
|
|
139
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
140
|
+
'&.shadow': {
|
|
141
|
+
background: "var(--ds-background-selected, #E9F2FF)"
|
|
142
|
+
},
|
|
143
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
144
|
+
'&.full-height': {
|
|
145
|
+
background: "var(--ds-background-selected, #E9F2FF)",
|
|
146
|
+
height: '100%',
|
|
147
|
+
minHeight: 36
|
|
148
|
+
}
|
|
149
|
+
}), '.ak-editor-selected-node', (0, _defineProperty2.default)({}, "& .".concat(resizerHandleThumbClassName), {
|
|
150
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
151
|
+
})), ".ak-editor-no-interaction .ak-editor-selected-node .".concat(resizerHandleClassName, ":not(:hover) .").concat(resizerHandleThumbClassName), {
|
|
152
|
+
background: "var(--ds-border, #091E4224)"
|
|
153
|
+
}), ".".concat(resizerHoverZoneClassName), (0, _defineProperty2.default)({
|
|
154
|
+
position: 'relative',
|
|
155
|
+
display: 'inline-block',
|
|
156
|
+
width: '100%'
|
|
157
|
+
}, "&.".concat(resizerExtendedZone), {
|
|
158
|
+
padding: "0 ".concat("var(--ds-space-150, 12px)"),
|
|
159
|
+
left: "var(--ds-space-negative-150, -12px)"
|
|
160
|
+
})), "table .".concat(resizerHoverZoneClassName, ", table .").concat(resizerHoverZoneClassName, ".").concat(resizerExtendedZone), {
|
|
161
|
+
padding: 'unset',
|
|
162
|
+
left: 'unset'
|
|
163
|
+
}));
|
|
164
|
+
|
|
165
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
166
|
+
var pragmaticResizerStyles = exports.pragmaticResizerStyles = (0, _react.css)({
|
|
167
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
168
|
+
'.pm-breakout-resize-handle': {
|
|
169
|
+
position: 'relative',
|
|
170
|
+
display: 'flex',
|
|
171
|
+
alignItems: 'center',
|
|
172
|
+
justifyContent: 'center',
|
|
173
|
+
height: '100%',
|
|
174
|
+
width: 7,
|
|
175
|
+
alignSelf: 'center',
|
|
176
|
+
gridRow: 1,
|
|
177
|
+
gridColumn: 1,
|
|
178
|
+
cursor: 'col-resize',
|
|
179
|
+
borderRadius: 4,
|
|
180
|
+
transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
|
|
181
|
+
'&:hover': {
|
|
182
|
+
background: "var(--ds-background-selected, #E9F2FF)",
|
|
183
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
184
|
+
'.pm-breakout-resize-handle-inner': {
|
|
185
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
186
|
+
}
|
|
187
|
+
}
|
|
188
|
+
},
|
|
189
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
190
|
+
'.pm-breakout-resize-handle-left': {
|
|
191
|
+
justifySelf: 'start',
|
|
192
|
+
left: -20
|
|
193
|
+
},
|
|
194
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
195
|
+
'.pm-breakout-resize-handle-right': {
|
|
196
|
+
justifySelf: 'end',
|
|
197
|
+
right: -20
|
|
198
|
+
},
|
|
199
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
200
|
+
'.pm-breakout-resize-handle-inner': {
|
|
201
|
+
minWidth: 3,
|
|
202
|
+
// copied from resizeStyles.clamped
|
|
203
|
+
height: 'clamp(27px, calc(100% - 32px), 96px)',
|
|
204
|
+
background: "var(--ds-border, #091E4224)",
|
|
205
|
+
borderRadius: 6,
|
|
206
|
+
// sticky styles
|
|
207
|
+
position: 'sticky',
|
|
208
|
+
top: "var(--ds-space-150, 12px)",
|
|
209
|
+
bottom: "var(--ds-space-150, 12px)"
|
|
210
|
+
}
|
|
211
|
+
});
|
|
@@ -65,6 +65,16 @@ const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
65
65
|
if (props.hasHadInteraction && fg('platform_editor_no_cursor_on_live_doc_init')) {
|
|
66
66
|
interactionClassName = props.hasHadInteraction ? 'ak-editor-has-interaction' : 'ak-editor-no-interaction';
|
|
67
67
|
}
|
|
68
|
+
const shouldSetHiddenDataAttribute = () => {
|
|
69
|
+
// When platform_editor_offline_banner_toolbar_position is enabled we use a different method to
|
|
70
|
+
// determine if the toolbar is hidden from outside of the editor, which doesn't require setting
|
|
71
|
+
// data-editor-primary-toolbar-hidden on the content area
|
|
72
|
+
// NOTE: When tidying, this function and the data attribute can be removed
|
|
73
|
+
if (!props.isEditorToolbarHidden || fg('platform_editor_offline_banner_toolbar_position')) {
|
|
74
|
+
return false;
|
|
75
|
+
}
|
|
76
|
+
return editorExperiment('platform_editor_controls', 'variant1');
|
|
77
|
+
};
|
|
68
78
|
return jsx("div", {
|
|
69
79
|
css: [
|
|
70
80
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
@@ -108,7 +118,7 @@ const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
108
118
|
,
|
|
109
119
|
className: "ak-editor-content-area-region",
|
|
110
120
|
"data-editor-editable-content": true,
|
|
111
|
-
"data-editor-primary-toolbar-hidden":
|
|
121
|
+
"data-editor-primary-toolbar-hidden": shouldSetHiddenDataAttribute() ? 'true' : undefined,
|
|
112
122
|
role: "region",
|
|
113
123
|
"aria-label": props.intl.formatMessage(messages.editableContentLabel),
|
|
114
124
|
ref: contentAreaRef
|
|
@@ -283,8 +283,7 @@ export const layoutStyles = viewMode => css`
|
|
|
283
283
|
/* Ignored via go/ees007
|
|
284
284
|
TODO: Migrate away from gridSize
|
|
285
285
|
Recommendation: Replace directly with 7px */
|
|
286
|
-
margin: ${"var(--ds-space-100, 8px)"} -${akLayoutGutterOffset + (fg('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0)}px
|
|
287
|
-
0;
|
|
286
|
+
margin: ${"var(--ds-space-100, 8px)"} -${akLayoutGutterOffset + (fg('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0)}px 0;
|
|
288
287
|
transition: border-color 0.3s ${akEditorSwoopCubicBezier};
|
|
289
288
|
cursor: ${viewMode === 'view' ? 'default' : 'pointer'};
|
|
290
289
|
|
|
@@ -15,7 +15,7 @@ import { EmojiSharedCssClassName, defaultEmojiHeight } from '@atlaskit/editor-co
|
|
|
15
15
|
import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
|
|
16
16
|
import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
|
|
17
17
|
import { gapCursorStyles } from '@atlaskit/editor-common/selection';
|
|
18
|
-
import { CodeBlockSharedCssClassName, GRID_GUTTER, SmartCardSharedCssClassName, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, listsSharedStyles, paragraphSharedStyles,
|
|
18
|
+
import { CodeBlockSharedCssClassName, GRID_GUTTER, SmartCardSharedCssClassName, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, listsSharedStyles, paragraphSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
|
|
19
19
|
import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
|
|
20
20
|
import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
|
|
21
21
|
import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
|
|
@@ -41,6 +41,7 @@ import { embedCardStyles } from './styles/embedCardStyles';
|
|
|
41
41
|
import { layoutBaseStyles, layoutViewStyles } from './styles/layout';
|
|
42
42
|
import { linkStyles, linkStylesOld } from './styles/link';
|
|
43
43
|
import { mediaStyles } from './styles/mediaStyles';
|
|
44
|
+
import { resizerStyles, pragmaticResizerStyles } from './styles/resizerStyles';
|
|
44
45
|
import { ruleStyles } from './styles/rule';
|
|
45
46
|
const vanillaMentionsStyles = css({
|
|
46
47
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
@@ -485,8 +486,6 @@ const contentStyles = () => css`
|
|
|
485
486
|
|
|
486
487
|
${resizerStyles}
|
|
487
488
|
|
|
488
|
-
${pragmaticResizerStyles()}
|
|
489
|
-
|
|
490
489
|
${fixBlockControlStylesSSR()}
|
|
491
490
|
|
|
492
491
|
.panelView-content-wrap {
|
|
@@ -628,7 +627,9 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
628
627
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
629
628
|
layoutBaseStyles(),
|
|
630
629
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
631
|
-
fg('platform_editor_hyperlink_underline') ? linkStyles : linkStylesOld,
|
|
630
|
+
fg('platform_editor_hyperlink_underline') ? linkStyles : linkStylesOld, editorExperiment('platform_editor_breakout_resizing', true) &&
|
|
631
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
632
|
+
pragmaticResizerStyles,
|
|
632
633
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
633
634
|
aiPanelBaseStyles,
|
|
634
635
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
2
|
-
import { css, keyframes } from
|
|
2
|
+
import { css, keyframes } from '@emotion/react';
|
|
3
3
|
/**
|
|
4
4
|
* aiPanelStyles
|
|
5
5
|
* was imported from packages/editor/editor-core/src/ui/ContentStyles/ai-panels.ts
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
2
|
-
import { css } from
|
|
3
|
-
import { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from
|
|
4
|
-
import { TableCssClassName } from
|
|
5
|
-
import { tableMarginFullWidthMode } from
|
|
6
|
-
import { gridMediumMaxWidth, akEditorSelectedNodeClassName, getSelectionStyles, SelectionStyle, akEditorSelectedBorderSize, akEditorDeleteBackground, akEditorDeleteBorder, akLayoutGutterOffset, akEditorSwoopCubicBezier } from
|
|
7
|
-
import { fg } from
|
|
8
|
-
import { editorExperiment } from
|
|
2
|
+
import { css } from '@emotion/react';
|
|
3
|
+
import { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from '@atlaskit/editor-common/styles';
|
|
4
|
+
import { TableCssClassName } from '@atlaskit/editor-plugins/table/types';
|
|
5
|
+
import { tableMarginFullWidthMode } from '@atlaskit/editor-plugins/table/ui/consts';
|
|
6
|
+
import { gridMediumMaxWidth, akEditorSelectedNodeClassName, getSelectionStyles, SelectionStyle, akEditorSelectedBorderSize, akEditorDeleteBackground, akEditorDeleteBorder, akLayoutGutterOffset, akEditorSwoopCubicBezier } from '@atlaskit/editor-shared-styles';
|
|
7
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
|
+
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
9
9
|
const columnLayoutSharedStyle = css({
|
|
10
10
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
11
11
|
'[data-layout-section]': {
|
|
@@ -0,0 +1,256 @@
|
|
|
1
|
+
import { css } from '@emotion/react'; // eslint-disable-line
|
|
2
|
+
|
|
3
|
+
export const resizerItemClassName = 'resizer-item';
|
|
4
|
+
export const resizerHoverZoneClassName = 'resizer-hover-zone';
|
|
5
|
+
export const resizerExtendedZone = 'resizer-is-extended';
|
|
6
|
+
export const resizerHandleClassName = 'resizer-handle';
|
|
7
|
+
export const resizerHandleTrackClassName = `${resizerHandleClassName}-track`;
|
|
8
|
+
export const resizerHandleThumbClassName = `${resizerHandleClassName}-thumb`;
|
|
9
|
+
export const resizerDangerClassName = `${resizerHandleClassName}-danger`;
|
|
10
|
+
export const handleWrapperClass = 'resizer-handle-wrapper';
|
|
11
|
+
|
|
12
|
+
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766, Seems perfectly safe to autofix, but comments would be lost…
|
|
13
|
+
export const resizerStyles = css({
|
|
14
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
15
|
+
[`.${resizerItemClassName}`]: {
|
|
16
|
+
willChange: 'width',
|
|
17
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
18
|
+
'&:hover, &.display-handle': {
|
|
19
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
20
|
+
[`& > .${handleWrapperClass} > .${resizerHandleClassName}`]: {
|
|
21
|
+
visibility: 'visible',
|
|
22
|
+
opacity: 1
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
26
|
+
'&.is-resizing': {
|
|
27
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
28
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
29
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
33
|
+
[`&.${resizerDangerClassName}`]: {
|
|
34
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
35
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
36
|
+
transition: 'none',
|
|
37
|
+
background: "var(--ds-icon-danger, #C9372C)"
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
42
|
+
[`.${resizerHandleClassName}`]: {
|
|
43
|
+
display: 'flex',
|
|
44
|
+
visibility: 'hidden',
|
|
45
|
+
opacity: 0,
|
|
46
|
+
flexDirection: 'column',
|
|
47
|
+
justifyContent: 'center',
|
|
48
|
+
alignItems: 'center',
|
|
49
|
+
width: 7,
|
|
50
|
+
transition: 'visibility 0.2s, opacity 0.2s',
|
|
51
|
+
// NOTE: The below style is targeted at the div element added by the tooltip. We don't have any means of injecting styles
|
|
52
|
+
// into the tooltip
|
|
53
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
54
|
+
"& div[role='presentation']": {
|
|
55
|
+
width: '100%',
|
|
56
|
+
height: '100%',
|
|
57
|
+
display: 'flex',
|
|
58
|
+
flexDirection: 'column',
|
|
59
|
+
justifyContent: 'center',
|
|
60
|
+
alignItems: 'center',
|
|
61
|
+
marginTop: "var(--ds-space-negative-200, -16px)",
|
|
62
|
+
whiteSpace: 'normal'
|
|
63
|
+
},
|
|
64
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
65
|
+
'&.left': {
|
|
66
|
+
alignItems: 'flex-start'
|
|
67
|
+
},
|
|
68
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
69
|
+
'&.right': {
|
|
70
|
+
alignItems: 'flex-end'
|
|
71
|
+
},
|
|
72
|
+
// Handle Sizing
|
|
73
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
74
|
+
'&.small': {
|
|
75
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
76
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
77
|
+
height: 43
|
|
78
|
+
}
|
|
79
|
+
},
|
|
80
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
81
|
+
'&.medium': {
|
|
82
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
83
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
84
|
+
height: 64
|
|
85
|
+
}
|
|
86
|
+
},
|
|
87
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
88
|
+
'&.large': {
|
|
89
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
90
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
91
|
+
height: 96
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
95
|
+
'&.clamped': {
|
|
96
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
97
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
98
|
+
height: 'clamp(43px, calc(100% - 32px), 96px)'
|
|
99
|
+
}
|
|
100
|
+
},
|
|
101
|
+
// Handle Alignment
|
|
102
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
103
|
+
'&.sticky': {
|
|
104
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
105
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
106
|
+
position: 'sticky',
|
|
107
|
+
top: "var(--ds-space-150, 12px)",
|
|
108
|
+
bottom: "var(--ds-space-150, 12px)"
|
|
109
|
+
}
|
|
110
|
+
},
|
|
111
|
+
'&:hover': {
|
|
112
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
113
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
114
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
115
|
+
},
|
|
116
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
117
|
+
[`& .${resizerHandleTrackClassName}`]: {
|
|
118
|
+
visibility: 'visible',
|
|
119
|
+
opacity: 0.5
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
},
|
|
123
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
124
|
+
[`.${resizerHandleThumbClassName}`]: {
|
|
125
|
+
content: "' '",
|
|
126
|
+
display: 'flex',
|
|
127
|
+
width: 3,
|
|
128
|
+
margin: `0 ${"var(--ds-space-025, 2px)"}`,
|
|
129
|
+
height: 64,
|
|
130
|
+
transition: 'background-color 0.2s',
|
|
131
|
+
borderRadius: 6,
|
|
132
|
+
border: 0,
|
|
133
|
+
padding: 0,
|
|
134
|
+
zIndex: 2,
|
|
135
|
+
outline: 'none',
|
|
136
|
+
minHeight: 24,
|
|
137
|
+
background: "var(--ds-border, #091E4224)",
|
|
138
|
+
'&:hover': {
|
|
139
|
+
cursor: 'col-resize'
|
|
140
|
+
},
|
|
141
|
+
'&:focus': {
|
|
142
|
+
background: "var(--ds-border-selected, #0C66E4)",
|
|
143
|
+
'&::after': {
|
|
144
|
+
content: "''",
|
|
145
|
+
position: 'absolute',
|
|
146
|
+
top: "var(--ds-space-negative-050, -4px)",
|
|
147
|
+
right: "var(--ds-space-negative-050, -4px)",
|
|
148
|
+
bottom: "var(--ds-space-negative-050, -4px)",
|
|
149
|
+
left: "var(--ds-space-negative-050, -4px)",
|
|
150
|
+
border: `2px solid ${"var(--ds-border-focused, #388BFF)"}`,
|
|
151
|
+
borderRadius: 'inherit',
|
|
152
|
+
zIndex: -1
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
},
|
|
156
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
157
|
+
[`.${resizerHandleTrackClassName}`]: {
|
|
158
|
+
visibility: 'hidden',
|
|
159
|
+
position: 'absolute',
|
|
160
|
+
width: 7,
|
|
161
|
+
height: 'calc(100% - 40px)',
|
|
162
|
+
borderRadius: 4,
|
|
163
|
+
opacity: 0,
|
|
164
|
+
transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
|
|
165
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
166
|
+
'&.none': {
|
|
167
|
+
background: 'none'
|
|
168
|
+
},
|
|
169
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
170
|
+
'&.shadow': {
|
|
171
|
+
background: "var(--ds-background-selected, #E9F2FF)"
|
|
172
|
+
},
|
|
173
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
174
|
+
'&.full-height': {
|
|
175
|
+
background: "var(--ds-background-selected, #E9F2FF)",
|
|
176
|
+
height: '100%',
|
|
177
|
+
minHeight: 36
|
|
178
|
+
}
|
|
179
|
+
},
|
|
180
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
181
|
+
'.ak-editor-selected-node': {
|
|
182
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
183
|
+
[`& .${resizerHandleThumbClassName}`]: {
|
|
184
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
185
|
+
}
|
|
186
|
+
},
|
|
187
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
188
|
+
[`.ak-editor-no-interaction .ak-editor-selected-node .${resizerHandleClassName}:not(:hover) .${resizerHandleThumbClassName}`]: {
|
|
189
|
+
background: "var(--ds-border, #091E4224)"
|
|
190
|
+
},
|
|
191
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
192
|
+
[`.${resizerHoverZoneClassName}`]: {
|
|
193
|
+
position: 'relative',
|
|
194
|
+
display: 'inline-block',
|
|
195
|
+
width: '100%',
|
|
196
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
197
|
+
[`&.${resizerExtendedZone}`]: {
|
|
198
|
+
padding: `0 ${"var(--ds-space-150, 12px)"}`,
|
|
199
|
+
left: "var(--ds-space-negative-150, -12px)"
|
|
200
|
+
}
|
|
201
|
+
},
|
|
202
|
+
// This below style is here to make sure the image width is correct when nested in a table
|
|
203
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
|
|
204
|
+
[`table .${resizerHoverZoneClassName}, table .${resizerHoverZoneClassName}.${resizerExtendedZone}`]: {
|
|
205
|
+
padding: 'unset',
|
|
206
|
+
left: 'unset'
|
|
207
|
+
}
|
|
208
|
+
});
|
|
209
|
+
|
|
210
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
211
|
+
export const pragmaticResizerStyles = css({
|
|
212
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
213
|
+
'.pm-breakout-resize-handle': {
|
|
214
|
+
position: 'relative',
|
|
215
|
+
display: 'flex',
|
|
216
|
+
alignItems: 'center',
|
|
217
|
+
justifyContent: 'center',
|
|
218
|
+
height: '100%',
|
|
219
|
+
width: 7,
|
|
220
|
+
alignSelf: 'center',
|
|
221
|
+
gridRow: 1,
|
|
222
|
+
gridColumn: 1,
|
|
223
|
+
cursor: 'col-resize',
|
|
224
|
+
borderRadius: 4,
|
|
225
|
+
transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
|
|
226
|
+
'&:hover': {
|
|
227
|
+
background: "var(--ds-background-selected, #E9F2FF)",
|
|
228
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
229
|
+
'.pm-breakout-resize-handle-inner': {
|
|
230
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
231
|
+
}
|
|
232
|
+
}
|
|
233
|
+
},
|
|
234
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
235
|
+
'.pm-breakout-resize-handle-left': {
|
|
236
|
+
justifySelf: 'start',
|
|
237
|
+
left: -20
|
|
238
|
+
},
|
|
239
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
240
|
+
'.pm-breakout-resize-handle-right': {
|
|
241
|
+
justifySelf: 'end',
|
|
242
|
+
right: -20
|
|
243
|
+
},
|
|
244
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
245
|
+
'.pm-breakout-resize-handle-inner': {
|
|
246
|
+
minWidth: 3,
|
|
247
|
+
// copied from resizeStyles.clamped
|
|
248
|
+
height: 'clamp(27px, calc(100% - 32px), 96px)',
|
|
249
|
+
background: "var(--ds-border, #091E4224)",
|
|
250
|
+
borderRadius: 6,
|
|
251
|
+
// sticky styles
|
|
252
|
+
position: 'sticky',
|
|
253
|
+
top: "var(--ds-space-150, 12px)",
|
|
254
|
+
bottom: "var(--ds-space-150, 12px)"
|
|
255
|
+
}
|
|
256
|
+
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
2
|
-
import { css } from
|
|
3
|
-
import { akEditorSelectedNodeClassName } from
|
|
2
|
+
import { css } from '@emotion/react';
|
|
3
|
+
import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
|
|
4
4
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
5
5
|
export const ruleStyles = css({
|
|
6
6
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export const name = "@atlaskit/editor-core";
|
|
2
|
-
export const version = "207.
|
|
2
|
+
export const version = "207.5.0";
|
|
@@ -70,6 +70,16 @@ var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
70
70
|
if (props.hasHadInteraction && fg('platform_editor_no_cursor_on_live_doc_init')) {
|
|
71
71
|
interactionClassName = props.hasHadInteraction ? 'ak-editor-has-interaction' : 'ak-editor-no-interaction';
|
|
72
72
|
}
|
|
73
|
+
var shouldSetHiddenDataAttribute = function shouldSetHiddenDataAttribute() {
|
|
74
|
+
// When platform_editor_offline_banner_toolbar_position is enabled we use a different method to
|
|
75
|
+
// determine if the toolbar is hidden from outside of the editor, which doesn't require setting
|
|
76
|
+
// data-editor-primary-toolbar-hidden on the content area
|
|
77
|
+
// NOTE: When tidying, this function and the data attribute can be removed
|
|
78
|
+
if (!props.isEditorToolbarHidden || fg('platform_editor_offline_banner_toolbar_position')) {
|
|
79
|
+
return false;
|
|
80
|
+
}
|
|
81
|
+
return editorExperiment('platform_editor_controls', 'variant1');
|
|
82
|
+
};
|
|
73
83
|
return jsx("div", {
|
|
74
84
|
css: [
|
|
75
85
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
@@ -111,7 +121,7 @@ var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
111
121
|
,
|
|
112
122
|
className: "ak-editor-content-area-region",
|
|
113
123
|
"data-editor-editable-content": true,
|
|
114
|
-
"data-editor-primary-toolbar-hidden":
|
|
124
|
+
"data-editor-primary-toolbar-hidden": shouldSetHiddenDataAttribute() ? 'true' : undefined,
|
|
115
125
|
role: "region",
|
|
116
126
|
"aria-label": props.intl.formatMessage(messages.editableContentLabel),
|
|
117
127
|
ref: contentAreaRef
|
|
@@ -71,5 +71,5 @@ var layoutResponsiveStyles = function layoutResponsiveStyles(viewMode) {
|
|
|
71
71
|
|
|
72
72
|
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
|
|
73
73
|
export var layoutStyles = function layoutStyles(viewMode) {
|
|
74
|
-
return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", "\n\t\t[data-layout-section] {\n\t\t\t/* Ignored via go/ees007\n\t\t\tTODO: Migrate away from gridSize\n\t\t\tRecommendation: Replace directly with 7px */\n\t\t\tmargin: ", " -", "px
|
|
74
|
+
return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", "\n\t\t[data-layout-section] {\n\t\t\t/* Ignored via go/ees007\n\t\t\tTODO: Migrate away from gridSize\n\t\t\tRecommendation: Replace directly with 7px */\n\t\t\tmargin: ", " -", "px 0;\n\t\t\ttransition: border-color 0.3s ", ";\n\t\t\tcursor: ", ";\n\n\t\t\t/* Inner cursor located 26px from left */\n\t\t\t[data-layout-column] {\n\t\t\t\tflex: 1;\n\t\t\t\tposition: relative;\n\n\t\t\t\tmin-width: 0;\n\t\t\t\t/* disable 4 borders when in view mode and advanced layouts is on */\n\t\t\t\tborder: ", "px\n\t\t\t\t\tsolid ", ";\n\t\t\t\tborder-radius: 4px;\n\t\t\t\tpadding: ", "px\n\t\t\t\t\t", "px;\n\t\t\t\tbox-sizing: border-box;\n\n\t\t\t\t> div {\n\t\t\t\t\t", "\n\n\t\t\t\t\t> .embedCardView-content-wrap:first-of-type .rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .mediaSingleView-content-wrap:first-of-type .rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .ProseMirror-gapcursor.-right:first-child\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> style:first-child\n\t\t\t\t\t\t+ .ProseMirror-gapcursor.-right\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> .ProseMirror-gapcursor.-right:first-of-type\n\t\t\t\t\t\t+ .embedCardView-content-wrap\n\t\t\t\t\t\t.rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .ProseMirror-gapcursor:first-child\n\t\t\t\t\t\t+ span\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> style:first-child\n\t\t\t\t\t\t+ .ProseMirror-gapcursor\n\t\t\t\t\t\t+ span\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t/* Prevent first DecisionWrapper's margin-top: 8px from shifting decisions down\n and shrinking layout's node selectable area (leniency margin) */\n\t\t\t\t\t> [data-node-type='decisionList'] {\n\t\t\t\t\t\tli:first-of-type [data-decision-wrapper] {\n\t\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t/* Make the 'content' fill the entire height of the layout column to allow click\n handler of layout section nodeview to target only data-layout-column */\n\t\t\t\t[data-layout-content] {\n\t\t\t\t\theight: 100%;\n\t\t\t\t\tcursor: text;\n\t\t\t\t\t.mediaGroupView-content-wrap {\n\t\t\t\t\t\tclear: both;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t", "\n\t\t}\n\n\t\t/* styles to support borders for layout */\n\t\t[data-layout-section],\n\t\t.layoutSectionView-content-wrap {\n\t\t\t", "\n\t\t}\n\t}\n\n\t", "\n\n\t/* hide separator when element is dragging on top of a layout column */\n\t[data-blocks-drop-target-container] ~ [data-layout-column] > [data-layout-content]::before {\n\t\tdisplay: none;\n\t}\n\n\t.fabric-editor--full-width-mode .ProseMirror {\n\t\t[data-layout-section] {\n\t\t\t.", " {\n\t\t\t\tmargin: 0 ", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n"])), layoutSectionStyles(), "var(--ds-space-100, 8px)", akLayoutGutterOffset + (fg('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0), akEditorSwoopCubicBezier, viewMode === 'view' ? 'default' : 'pointer', viewMode === 'view' || editorExperiment('advanced_layouts', true) ? 0 : akEditorSelectedBorderSize, "var(--ds-border, #091E4224)", LAYOUT_COLUMN_PADDING, LAYOUT_COLUMN_PADDING + (fg('platform_editor_nested_dnd_styles_changes') ? 8 : 0), firstNodeWithNotMarginTop(), layoutColumnStyles(), editorExperiment('advanced_layouts', true) ? layoutWithSeparatorBorderStyles(viewMode) : layoutBorderStyles(viewMode), editorExperiment('advanced_layouts', true) && layoutResponsiveStyles(viewMode), TableCssClassName.TABLE_CONTAINER, tableMarginFullWidthMode, editorExperiment('advanced_layouts', false) && fg('platform_editor_nested_dnd_styles_changes') && ".ak-editor-content-area.appearance-full-page .ProseMirror [data-layout-section] {\n\t\t\t\tmargin: ".concat("var(--ds-space-100, 8px)", " -", akLayoutGutterOffset + 8, "px 0;\n\t\t\t\t}"));
|
|
75
75
|
};
|
|
@@ -17,7 +17,7 @@ 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 { CodeBlockSharedCssClassName, GRID_GUTTER, SmartCardSharedCssClassName, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, listsSharedStyles, paragraphSharedStyles,
|
|
20
|
+
import { CodeBlockSharedCssClassName, GRID_GUTTER, SmartCardSharedCssClassName, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, listsSharedStyles, paragraphSharedStyles, 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';
|
|
@@ -43,6 +43,7 @@ import { embedCardStyles } from './styles/embedCardStyles';
|
|
|
43
43
|
import { layoutBaseStyles, layoutViewStyles } from './styles/layout';
|
|
44
44
|
import { linkStyles, linkStylesOld } from './styles/link';
|
|
45
45
|
import { mediaStyles } from './styles/mediaStyles';
|
|
46
|
+
import { resizerStyles, pragmaticResizerStyles } from './styles/resizerStyles';
|
|
46
47
|
import { ruleStyles } from './styles/rule';
|
|
47
48
|
var vanillaMentionsStyles = css({
|
|
48
49
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
@@ -141,7 +142,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
|
|
|
141
142
|
|
|
142
143
|
// jest warning: JSDOM version (22) doesn't support the new @container CSS rule
|
|
143
144
|
var contentStyles = function contentStyles() {
|
|
144
|
-
return css(_templateObject8 || (_templateObject8 = _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\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\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 ", "\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\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n
|
|
145
|
+
return css(_templateObject8 || (_templateObject8 = _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\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\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 ", "\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\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t// For FullPage only when inside a table\n\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, whitespaceSharedStyles, paragraphSharedStyles(), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('editor_request_to_edit_task') ? null : css(_templateObject9 || (_templateObject9 = _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(_templateObject10 || (_templateObject10 = _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(_templateObject11 || (_templateObject11 = _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(), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles, listsStyles, ruleStyles, mediaStyles, fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
145
146
|
exposure: false
|
|
146
147
|
}) && vanillaMentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
147
148
|
exposure: false
|
|
@@ -155,7 +156,7 @@ var contentStyles = function contentStyles() {
|
|
|
155
156
|
exposure: false
|
|
156
157
|
}) && fg('platform-visual-refresh-icons') && vanillaDecisionIconWithVisualRefresh, editorExperiment('platform_editor_vanilla_dom', true, {
|
|
157
158
|
exposure: false
|
|
158
|
-
}) && !fg('platform-visual-refresh-icons') && vanillaDecisionIconWithoutVisualRefresh, statusStyles, editorExperiment('platform_editor_vanilla_dom', true) ? vanillaStatusStyles() : null, annotationStyles, smartCardStyles(), fg('platform-linking-visual-refresh-v1') ? getSmartCardSharedStyles() : smartCardSharedStyles, editorExperiment('platform_editor_vanilla_dom', true) ? dateVanillaStyles : null, dateStyles, embedCardStyles, unsupportedStyles, resizerStyles,
|
|
159
|
+
}) && !fg('platform-visual-refresh-icons') && vanillaDecisionIconWithoutVisualRefresh, statusStyles, editorExperiment('platform_editor_vanilla_dom', true) ? vanillaStatusStyles() : null, annotationStyles, smartCardStyles(), fg('platform-linking-visual-refresh-v1') ? getSmartCardSharedStyles() : smartCardSharedStyles, editorExperiment('platform_editor_vanilla_dom', true) ? dateVanillaStyles : null, dateStyles, embedCardStyles, unsupportedStyles, resizerStyles, fixBlockControlStylesSSR(), !fg('platform-visual-refresh-icons') ? css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
|
|
159
160
|
};
|
|
160
161
|
var CommentEditorMargin = 14;
|
|
161
162
|
|
|
@@ -227,7 +228,9 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
|
|
|
227
228
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
228
229
|
layoutBaseStyles(),
|
|
229
230
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
230
|
-
fg('platform_editor_hyperlink_underline') ? linkStyles : linkStylesOld,
|
|
231
|
+
fg('platform_editor_hyperlink_underline') ? linkStyles : linkStylesOld, editorExperiment('platform_editor_breakout_resizing', true) &&
|
|
232
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
233
|
+
pragmaticResizerStyles,
|
|
231
234
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
232
235
|
aiPanelBaseStyles,
|
|
233
236
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
@@ -4,7 +4,7 @@ var _templateObject, _templateObject2;
|
|
|
4
4
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
5
5
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
6
6
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
7
|
-
import { css, keyframes } from
|
|
7
|
+
import { css, keyframes } from '@emotion/react';
|
|
8
8
|
/**
|
|
9
9
|
* aiPanelStyles
|
|
10
10
|
* was imported from packages/editor/editor-core/src/ui/ContentStyles/ai-panels.ts
|
|
@@ -2,13 +2,13 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
|
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
3
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20;
|
|
4
4
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
5
|
-
import { css } from
|
|
6
|
-
import { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from
|
|
7
|
-
import { TableCssClassName } from
|
|
8
|
-
import { tableMarginFullWidthMode } from
|
|
9
|
-
import { gridMediumMaxWidth, akEditorSelectedNodeClassName, getSelectionStyles, SelectionStyle, akEditorSelectedBorderSize, akEditorDeleteBackground, akEditorDeleteBorder, akLayoutGutterOffset, akEditorSwoopCubicBezier } from
|
|
10
|
-
import { fg } from
|
|
11
|
-
import { editorExperiment } from
|
|
5
|
+
import { css } from '@emotion/react';
|
|
6
|
+
import { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from '@atlaskit/editor-common/styles';
|
|
7
|
+
import { TableCssClassName } from '@atlaskit/editor-plugins/table/types';
|
|
8
|
+
import { tableMarginFullWidthMode } from '@atlaskit/editor-plugins/table/ui/consts';
|
|
9
|
+
import { gridMediumMaxWidth, akEditorSelectedNodeClassName, getSelectionStyles, SelectionStyle, akEditorSelectedBorderSize, akEditorDeleteBackground, akEditorDeleteBorder, akLayoutGutterOffset, akEditorSwoopCubicBezier } from '@atlaskit/editor-shared-styles';
|
|
10
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
11
|
+
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
12
12
|
var columnLayoutSharedStyle = css({
|
|
13
13
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
14
14
|
'[data-layout-section]': _defineProperty({
|
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
import { css } from '@emotion/react'; // eslint-disable-line
|
|
3
|
+
|
|
4
|
+
export var resizerItemClassName = 'resizer-item';
|
|
5
|
+
export var resizerHoverZoneClassName = 'resizer-hover-zone';
|
|
6
|
+
export var resizerExtendedZone = 'resizer-is-extended';
|
|
7
|
+
export var resizerHandleClassName = 'resizer-handle';
|
|
8
|
+
export var resizerHandleTrackClassName = "".concat(resizerHandleClassName, "-track");
|
|
9
|
+
export var resizerHandleThumbClassName = "".concat(resizerHandleClassName, "-thumb");
|
|
10
|
+
export var resizerDangerClassName = "".concat(resizerHandleClassName, "-danger");
|
|
11
|
+
export var handleWrapperClass = 'resizer-handle-wrapper';
|
|
12
|
+
|
|
13
|
+
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766, Seems perfectly safe to autofix, but comments would be lost…
|
|
14
|
+
export var resizerStyles = css(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ".".concat(resizerItemClassName), _defineProperty({
|
|
15
|
+
willChange: 'width',
|
|
16
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
17
|
+
'&:hover, &.display-handle': _defineProperty({}, "& > .".concat(handleWrapperClass, " > .").concat(resizerHandleClassName), {
|
|
18
|
+
visibility: 'visible',
|
|
19
|
+
opacity: 1
|
|
20
|
+
}),
|
|
21
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
22
|
+
'&.is-resizing': _defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
23
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
24
|
+
})
|
|
25
|
+
}, "&.".concat(resizerDangerClassName), _defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
26
|
+
transition: 'none',
|
|
27
|
+
background: "var(--ds-icon-danger, #C9372C)"
|
|
28
|
+
}))), ".".concat(resizerHandleClassName), {
|
|
29
|
+
display: 'flex',
|
|
30
|
+
visibility: 'hidden',
|
|
31
|
+
opacity: 0,
|
|
32
|
+
flexDirection: 'column',
|
|
33
|
+
justifyContent: 'center',
|
|
34
|
+
alignItems: 'center',
|
|
35
|
+
width: 7,
|
|
36
|
+
transition: 'visibility 0.2s, opacity 0.2s',
|
|
37
|
+
// NOTE: The below style is targeted at the div element added by the tooltip. We don't have any means of injecting styles
|
|
38
|
+
// into the tooltip
|
|
39
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
40
|
+
"& div[role='presentation']": {
|
|
41
|
+
width: '100%',
|
|
42
|
+
height: '100%',
|
|
43
|
+
display: 'flex',
|
|
44
|
+
flexDirection: 'column',
|
|
45
|
+
justifyContent: 'center',
|
|
46
|
+
alignItems: 'center',
|
|
47
|
+
marginTop: "var(--ds-space-negative-200, -16px)",
|
|
48
|
+
whiteSpace: 'normal'
|
|
49
|
+
},
|
|
50
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
51
|
+
'&.left': {
|
|
52
|
+
alignItems: 'flex-start'
|
|
53
|
+
},
|
|
54
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
55
|
+
'&.right': {
|
|
56
|
+
alignItems: 'flex-end'
|
|
57
|
+
},
|
|
58
|
+
// Handle Sizing
|
|
59
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
60
|
+
'&.small': _defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
61
|
+
height: 43
|
|
62
|
+
}),
|
|
63
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
64
|
+
'&.medium': _defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
65
|
+
height: 64
|
|
66
|
+
}),
|
|
67
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
68
|
+
'&.large': _defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
69
|
+
height: 96
|
|
70
|
+
}),
|
|
71
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
72
|
+
'&.clamped': _defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
73
|
+
height: 'clamp(43px, calc(100% - 32px), 96px)'
|
|
74
|
+
}),
|
|
75
|
+
// Handle Alignment
|
|
76
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
77
|
+
'&.sticky': _defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
78
|
+
position: 'sticky',
|
|
79
|
+
top: "var(--ds-space-150, 12px)",
|
|
80
|
+
bottom: "var(--ds-space-150, 12px)"
|
|
81
|
+
}),
|
|
82
|
+
'&:hover': _defineProperty(_defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
83
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
84
|
+
}), "& .".concat(resizerHandleTrackClassName), {
|
|
85
|
+
visibility: 'visible',
|
|
86
|
+
opacity: 0.5
|
|
87
|
+
})
|
|
88
|
+
}), ".".concat(resizerHandleThumbClassName), {
|
|
89
|
+
content: "' '",
|
|
90
|
+
display: 'flex',
|
|
91
|
+
width: 3,
|
|
92
|
+
margin: "0 ".concat("var(--ds-space-025, 2px)"),
|
|
93
|
+
height: 64,
|
|
94
|
+
transition: 'background-color 0.2s',
|
|
95
|
+
borderRadius: 6,
|
|
96
|
+
border: 0,
|
|
97
|
+
padding: 0,
|
|
98
|
+
zIndex: 2,
|
|
99
|
+
outline: 'none',
|
|
100
|
+
minHeight: 24,
|
|
101
|
+
background: "var(--ds-border, #091E4224)",
|
|
102
|
+
'&:hover': {
|
|
103
|
+
cursor: 'col-resize'
|
|
104
|
+
},
|
|
105
|
+
'&:focus': {
|
|
106
|
+
background: "var(--ds-border-selected, #0C66E4)",
|
|
107
|
+
'&::after': {
|
|
108
|
+
content: "''",
|
|
109
|
+
position: 'absolute',
|
|
110
|
+
top: "var(--ds-space-negative-050, -4px)",
|
|
111
|
+
right: "var(--ds-space-negative-050, -4px)",
|
|
112
|
+
bottom: "var(--ds-space-negative-050, -4px)",
|
|
113
|
+
left: "var(--ds-space-negative-050, -4px)",
|
|
114
|
+
border: "2px solid ".concat("var(--ds-border-focused, #388BFF)"),
|
|
115
|
+
borderRadius: 'inherit',
|
|
116
|
+
zIndex: -1
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
}), ".".concat(resizerHandleTrackClassName), {
|
|
120
|
+
visibility: 'hidden',
|
|
121
|
+
position: 'absolute',
|
|
122
|
+
width: 7,
|
|
123
|
+
height: 'calc(100% - 40px)',
|
|
124
|
+
borderRadius: 4,
|
|
125
|
+
opacity: 0,
|
|
126
|
+
transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
|
|
127
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
128
|
+
'&.none': {
|
|
129
|
+
background: 'none'
|
|
130
|
+
},
|
|
131
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
132
|
+
'&.shadow': {
|
|
133
|
+
background: "var(--ds-background-selected, #E9F2FF)"
|
|
134
|
+
},
|
|
135
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
136
|
+
'&.full-height': {
|
|
137
|
+
background: "var(--ds-background-selected, #E9F2FF)",
|
|
138
|
+
height: '100%',
|
|
139
|
+
minHeight: 36
|
|
140
|
+
}
|
|
141
|
+
}), '.ak-editor-selected-node', _defineProperty({}, "& .".concat(resizerHandleThumbClassName), {
|
|
142
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
143
|
+
})), ".ak-editor-no-interaction .ak-editor-selected-node .".concat(resizerHandleClassName, ":not(:hover) .").concat(resizerHandleThumbClassName), {
|
|
144
|
+
background: "var(--ds-border, #091E4224)"
|
|
145
|
+
}), ".".concat(resizerHoverZoneClassName), _defineProperty({
|
|
146
|
+
position: 'relative',
|
|
147
|
+
display: 'inline-block',
|
|
148
|
+
width: '100%'
|
|
149
|
+
}, "&.".concat(resizerExtendedZone), {
|
|
150
|
+
padding: "0 ".concat("var(--ds-space-150, 12px)"),
|
|
151
|
+
left: "var(--ds-space-negative-150, -12px)"
|
|
152
|
+
})), "table .".concat(resizerHoverZoneClassName, ", table .").concat(resizerHoverZoneClassName, ".").concat(resizerExtendedZone), {
|
|
153
|
+
padding: 'unset',
|
|
154
|
+
left: 'unset'
|
|
155
|
+
}));
|
|
156
|
+
|
|
157
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
158
|
+
export var pragmaticResizerStyles = css({
|
|
159
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
160
|
+
'.pm-breakout-resize-handle': {
|
|
161
|
+
position: 'relative',
|
|
162
|
+
display: 'flex',
|
|
163
|
+
alignItems: 'center',
|
|
164
|
+
justifyContent: 'center',
|
|
165
|
+
height: '100%',
|
|
166
|
+
width: 7,
|
|
167
|
+
alignSelf: 'center',
|
|
168
|
+
gridRow: 1,
|
|
169
|
+
gridColumn: 1,
|
|
170
|
+
cursor: 'col-resize',
|
|
171
|
+
borderRadius: 4,
|
|
172
|
+
transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
|
|
173
|
+
'&:hover': {
|
|
174
|
+
background: "var(--ds-background-selected, #E9F2FF)",
|
|
175
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
176
|
+
'.pm-breakout-resize-handle-inner': {
|
|
177
|
+
background: "var(--ds-border-focused, #388BFF)"
|
|
178
|
+
}
|
|
179
|
+
}
|
|
180
|
+
},
|
|
181
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
182
|
+
'.pm-breakout-resize-handle-left': {
|
|
183
|
+
justifySelf: 'start',
|
|
184
|
+
left: -20
|
|
185
|
+
},
|
|
186
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
187
|
+
'.pm-breakout-resize-handle-right': {
|
|
188
|
+
justifySelf: 'end',
|
|
189
|
+
right: -20
|
|
190
|
+
},
|
|
191
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
192
|
+
'.pm-breakout-resize-handle-inner': {
|
|
193
|
+
minWidth: 3,
|
|
194
|
+
// copied from resizeStyles.clamped
|
|
195
|
+
height: 'clamp(27px, calc(100% - 32px), 96px)',
|
|
196
|
+
background: "var(--ds-border, #091E4224)",
|
|
197
|
+
borderRadius: 6,
|
|
198
|
+
// sticky styles
|
|
199
|
+
position: 'sticky',
|
|
200
|
+
top: "var(--ds-space-150, 12px)",
|
|
201
|
+
bottom: "var(--ds-space-150, 12px)"
|
|
202
|
+
}
|
|
203
|
+
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
3
|
-
import { css } from
|
|
4
|
-
import { akEditorSelectedNodeClassName } from
|
|
3
|
+
import { css } from '@emotion/react';
|
|
4
|
+
import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
|
|
5
5
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
|
|
6
6
|
export var ruleStyles = css(_defineProperty({
|
|
7
7
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export var name = "@atlaskit/editor-core";
|
|
2
|
-
export var version = "207.
|
|
2
|
+
export var version = "207.5.0";
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export declare const resizerItemClassName = "resizer-item";
|
|
2
|
+
export declare const resizerHoverZoneClassName = "resizer-hover-zone";
|
|
3
|
+
export declare const resizerExtendedZone = "resizer-is-extended";
|
|
4
|
+
export declare const resizerHandleClassName = "resizer-handle";
|
|
5
|
+
export declare const resizerHandleTrackClassName = "resizer-handle-track";
|
|
6
|
+
export declare const resizerHandleThumbClassName = "resizer-handle-thumb";
|
|
7
|
+
export declare const resizerDangerClassName = "resizer-handle-danger";
|
|
8
|
+
export declare const handleWrapperClass = "resizer-handle-wrapper";
|
|
9
|
+
export declare const resizerStyles: import("@emotion/react").SerializedStyles;
|
|
10
|
+
export declare const pragmaticResizerStyles: import("@emotion/react").SerializedStyles;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export declare const resizerItemClassName = "resizer-item";
|
|
2
|
+
export declare const resizerHoverZoneClassName = "resizer-hover-zone";
|
|
3
|
+
export declare const resizerExtendedZone = "resizer-is-extended";
|
|
4
|
+
export declare const resizerHandleClassName = "resizer-handle";
|
|
5
|
+
export declare const resizerHandleTrackClassName = "resizer-handle-track";
|
|
6
|
+
export declare const resizerHandleThumbClassName = "resizer-handle-thumb";
|
|
7
|
+
export declare const resizerDangerClassName = "resizer-handle-danger";
|
|
8
|
+
export declare const handleWrapperClass = "resizer-handle-wrapper";
|
|
9
|
+
export declare const resizerStyles: import("@emotion/react").SerializedStyles;
|
|
10
|
+
export declare const pragmaticResizerStyles: import("@emotion/react").SerializedStyles;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-core",
|
|
3
|
-
"version": "207.
|
|
3
|
+
"version": "207.5.0",
|
|
4
4
|
"description": "A package contains Atlassian editor core functionality",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -79,7 +79,7 @@
|
|
|
79
79
|
"uuid": "^3.1.0"
|
|
80
80
|
},
|
|
81
81
|
"peerDependencies": {
|
|
82
|
-
"@atlaskit/link-provider": "^3.
|
|
82
|
+
"@atlaskit/link-provider": "^3.1.0",
|
|
83
83
|
"@atlaskit/media-core": "^36.1.0",
|
|
84
84
|
"react": "^18.2.0",
|
|
85
85
|
"react-dom": "^18.2.0",
|
|
@@ -95,15 +95,15 @@
|
|
|
95
95
|
"@atlaskit/editor-plugin-card": "^6.3.0",
|
|
96
96
|
"@atlaskit/editor-plugin-list": "^4.2.0",
|
|
97
97
|
"@atlaskit/editor-plugin-paste": "^3.3.0",
|
|
98
|
-
"@atlaskit/link-provider": "^3.
|
|
99
|
-
"@atlaskit/logo": "^18.
|
|
98
|
+
"@atlaskit/link-provider": "^3.1.0",
|
|
99
|
+
"@atlaskit/logo": "^18.1.0",
|
|
100
100
|
"@atlaskit/media-core": "^36.1.0",
|
|
101
101
|
"@atlaskit/media-integration-test-helpers": "workspace:^",
|
|
102
102
|
"@atlaskit/media-test-helpers": "^36.0.0",
|
|
103
103
|
"@atlaskit/modal-dialog": "^14.2.0",
|
|
104
104
|
"@atlaskit/primitives": "^14.8.0",
|
|
105
105
|
"@atlaskit/renderer": "^118.2.0",
|
|
106
|
-
"@atlaskit/smart-card": "^38.
|
|
106
|
+
"@atlaskit/smart-card": "^38.5.0",
|
|
107
107
|
"@atlaskit/synchrony-test-helpers": "workspace:^",
|
|
108
108
|
"@atlaskit/toggle": "^15.0.0",
|
|
109
109
|
"@atlaskit/util-data-test": "^18.0.0",
|
|
@@ -205,6 +205,10 @@
|
|
|
205
205
|
"type": "boolean",
|
|
206
206
|
"referenceOnly": true
|
|
207
207
|
},
|
|
208
|
+
"platform_editor_offline_banner_toolbar_position": {
|
|
209
|
+
"type": "boolean",
|
|
210
|
+
"referenceOnly": true
|
|
211
|
+
},
|
|
208
212
|
"platform_editor_disable_instrumented_plugin": {
|
|
209
213
|
"type": "boolean"
|
|
210
214
|
},
|