@atlaskit/editor-core 208.3.4 → 208.3.5

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.
Files changed (27) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/dist/cjs/ui/ContentStyles/index.js +8 -7
  3. package/dist/cjs/ui/ContentStyles/tasks-and-decisions.js +1 -1
  4. package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js +8 -12
  5. package/dist/cjs/ui/EditorContentContainer/styles/findReplaceStyles.js +82 -1
  6. package/dist/cjs/ui/EditorContentContainer/styles/mentions.js +7 -3
  7. package/dist/cjs/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js +1 -1
  8. package/dist/cjs/version-wrapper.js +1 -1
  9. package/dist/es2019/ui/ContentStyles/index.js +11 -10
  10. package/dist/es2019/ui/ContentStyles/tasks-and-decisions.js +1 -1
  11. package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js +10 -14
  12. package/dist/es2019/ui/EditorContentContainer/styles/findReplaceStyles.js +109 -0
  13. package/dist/es2019/ui/EditorContentContainer/styles/mentions.js +6 -2
  14. package/dist/es2019/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js +1 -1
  15. package/dist/es2019/version-wrapper.js +1 -1
  16. package/dist/esm/ui/ContentStyles/index.js +9 -8
  17. package/dist/esm/ui/ContentStyles/tasks-and-decisions.js +1 -1
  18. package/dist/esm/ui/EditorContentContainer/EditorContentContainer.js +10 -14
  19. package/dist/esm/ui/EditorContentContainer/styles/findReplaceStyles.js +81 -0
  20. package/dist/esm/ui/EditorContentContainer/styles/mentions.js +6 -2
  21. package/dist/esm/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js +1 -1
  22. package/dist/esm/version-wrapper.js +1 -1
  23. package/dist/types/ui/EditorContentContainer/styles/findReplaceStyles.d.ts +1 -0
  24. package/dist/types/ui/EditorContentContainer/styles/mentions.d.ts +2 -2
  25. package/dist/types-ts4.5/ui/EditorContentContainer/styles/findReplaceStyles.d.ts +1 -0
  26. package/dist/types-ts4.5/ui/EditorContentContainer/styles/mentions.d.ts +2 -2
  27. package/package.json +2 -13
package/CHANGELOG.md CHANGED
@@ -1,5 +1,30 @@
1
1
  # @atlaskit/editor-core
2
2
 
3
+ ## 208.3.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [#175895](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/175895)
8
+ [`6165a5dc5b6b1`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6165a5dc5b6b1) -
9
+ Remove deprecated path for react version of mentions
10
+ - [#175471](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/175471)
11
+ [`302b93e537e73`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/302b93e537e73) -
12
+ ff cleanup for platform_editor_scroll_table_flickering_fix (FD-91488)
13
+ - [#175569](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/175569)
14
+ [`3bcbd0cff0437`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3bcbd0cff0437) -
15
+ [ux] ED-27958 extend the find algorithm to search smart cards behind
16
+ platform_editor_find_and_replace_improvements
17
+ - [#176023](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/176023)
18
+ [`d88b8886797ae`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d88b8886797ae) -
19
+ clean up experiment platform_editor_vanilla_dom on task
20
+ - [#175339](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/175339)
21
+ [`d4115e4055a0a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d4115e4055a0a) -
22
+ ED-28314 Cleanup platform_editor_controls_patch_12
23
+ - [#175899](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/175899)
24
+ [`a28d5dc386dbf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a28d5dc386dbf) -
25
+ Clean up platform_editor_fix_floating_toolbar_focus
26
+ - Updated dependencies
27
+
3
28
  ## 208.3.4
4
29
 
5
30
  ### Patch Changes
@@ -22,6 +22,7 @@ var _styles4 = require("@atlaskit/editor-plugins/paste-options-toolbar/styles");
22
22
  var _styles5 = require("@atlaskit/editor-plugins/placeholder-text/styles");
23
23
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
24
24
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
25
+ var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
25
26
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
26
27
  var _tokens = require("@atlaskit/tokens");
27
28
  var _getInlineNodeViewProducer = require("../../nodeviews/getInlineNodeViewProducer.styles");
@@ -51,13 +52,17 @@ var linkStyles = exports.linkStyles = (0, _react2.css)(_templateObject || (_temp
51
52
  var ruleStyles = function ruleStyles() {
52
53
  return (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t", ";\n\n\t\thr {\n\t\t\tcursor: pointer;\n\t\t\tpadding: ", " 0;\n\t\t\tmargin: ", " 0;\n\t\t\tbackground-clip: content-box;\n\n\t\t\t&.", " {\n\t\t\t\toutline: none;\n\t\t\t\tbackground-color: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), (0, _styles.ruleSharedStyles)(), "var(--ds-space-050, 4px)", "var(--ds-space-300, 24px)", _editorSharedStyles.akEditorSelectedNodeClassName, "var(--ds-border-selected, ".concat(_editorSharedStyles.akEditorSelectedBorderColor, ")"));
53
54
  };
54
- var vanillaMentionsStyles = (0, _react2.css)({
55
+ var mentionNodeStyles = (0, _react2.css)({
55
56
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
56
57
  '.editor-mention-primitive': {
57
58
  display: 'inline',
58
59
  borderRadius: '20px',
59
60
  cursor: 'pointer',
60
61
  padding: '0 0.3em 2px 0.23em',
62
+ // To match `packages/elements/mention/src/components/Mention/PrimitiveMention.tsx` implementation
63
+ // we match the line height exactly
64
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
65
+ lineHeight: '1.714',
61
66
  fontWeight: "var(--ds-font-weight-regular, 400)",
62
67
  wordBreak: 'break-word',
63
68
  background: "var(--ds-background-neutral, #091E420F)",
@@ -154,15 +159,11 @@ var akEditorBreakpointForSmallDevice = "1266px";
154
159
  var legacyContentStyles = function legacyContentStyles(props) {
155
160
  return (0, _react2.css)(_templateObject9 || (_templateObject9 = (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--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-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\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t *\n\t * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n /* Switch between the two icons based on the visual refresh feature gate */\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n ", "\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\tRelated code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\tIn the \"editorContentAreaContainerStyle\" function */\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), _editorSharedStyles.akEditorGutterPadding, (0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), _editorSharedStyles.akEditorDefaultLayoutWidth, _editorSharedStyles.akEditorFullWidthLayoutWidth, _editorSharedStyles.akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, _editorSharedStyles.akEditorCalculatedWideLayoutWidth, (0, _editorSharedStyles.editorFontSize)({
156
161
  theme: props.theme
157
- }), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (0, _react2.css)(_templateObject0 || (_templateObject0 = (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)(_templateObject1 || (_templateObject1 = (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)", (0, _platformFeatureFlags.fg)('platform_editor_fix_floating_toolbar_focus') ? firstFloatingToolbarButtonStyles : null, _styles5.placeholderTextStyles, (0, _platformFeatureFlags.fg)('platform_editor_system_fake_text_highlight_colour') && _styles5.placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, 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)(props.typographyTheme), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, (0, _styles.backgroundColorStyles)(), listsStyles, ruleStyles(), (0, _media.mediaStyles)(), (0, _layout.layoutStyles)(props.viewMode), (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, {
158
- exposure: false
159
- }) && vanillaMentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
162
+ }), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (0, _react2.css)(_templateObject0 || (_templateObject0 = (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)(_templateObject1 || (_templateObject1 = (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)", firstFloatingToolbarButtonStyles, _styles5.placeholderTextStyles, (0, _platformFeatureFlags.fg)('platform_editor_system_fake_text_highlight_colour') && _styles5.placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, 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)(props.typographyTheme), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, (0, _styles.backgroundColorStyles)(), listsStyles, ruleStyles(), (0, _media.mediaStyles)(), (0, _layout.layoutStyles)(props.viewMode), (0, _platformFeatureFlags.fg)('confluence_team_presence_scroll_to_pointer') ? _collab.telepointerStyle : _collab.telepointerStyleWithInitialOnly, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, mentionNodeStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
160
163
  exposure: false
161
164
  }) && vanillaSelectionStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
162
165
  exposure: false
163
- }) ? emojiStyles : reactEmojiStyles, emojiStyles, _styles.tasksAndDecisionsStyles, _styles.gridStyles, linkStyles, _styles.blockMarksSharedStyles, _styles.dateSharedStyle, _extension.extensionStyles, (0, _expand.expandStyles)(), _styles3.findReplaceStyles, _styles4.textHighlightStyle, _tasksAndDecisions.taskDecisionStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
164
- exposure: false
165
- }) && _tasksAndDecisions.vanillaTaskItemStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
166
+ }) ? emojiStyles : reactEmojiStyles, emojiStyles, _styles.tasksAndDecisionsStyles, _styles.gridStyles, linkStyles, _styles.blockMarksSharedStyles, _styles.dateSharedStyle, _extension.extensionStyles, (0, _expand.expandStyles)(), (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? _styles3.findReplaceStylesNew : _styles3.findReplaceStyles, _styles4.textHighlightStyle, _tasksAndDecisions.taskDecisionStyles, _tasksAndDecisions.vanillaTaskItemStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
166
167
  exposure: false
167
168
  }) && _tasksAndDecisions.vanillaTaskDecisionStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
168
169
  exposure: false
@@ -159,7 +159,7 @@ var vanillaTaskItemStyles = exports.vanillaTaskItemStyles = (0, _react.css)((0,
159
159
  display: 'none'
160
160
  },
161
161
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
162
- '[data-prosemirror-node-view-type="vanilla"][data-prosemirror-node-name="taskItem"]:has([data-empty]):not(:has([data-type-ahead])) [data-component="placeholder"]': {
162
+ "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='taskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder']": {
163
163
  display: 'block'
164
164
  },
165
165
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -112,7 +112,7 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
112
112
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
113
113
  _cursorStyles.cursorStyles,
114
114
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
115
- (0, _platformFeatureFlags.fg)('platform_editor_fix_floating_toolbar_focus') && _floatingToolbarStyles.firstFloatingToolbarButtonStyles,
115
+ _floatingToolbarStyles.firstFloatingToolbarButtonStyles,
116
116
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
117
117
  _placeholderStyles.placeholderTextStyles, (0, _platformFeatureFlags.fg)('platform_editor_system_fake_text_highlight_colour') &&
118
118
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -188,15 +188,15 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
188
188
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
189
189
  _expandStyles.expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes,
190
190
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
191
- (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _expandStyles.expandStylesMixin_fg_platform_visual_refresh_icons,
191
+ (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _expandStyles.expandStylesMixin_fg_platform_visual_refresh_icons, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ?
192
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
193
+ _findReplaceStyles.findReplaceStylesNew :
192
194
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
193
195
  _findReplaceStyles.findReplaceStyles,
194
196
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
195
197
  _textHighlightStyles.textHighlightStyle,
196
198
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
197
- _tasksAndDecisionsStyles.decisionStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
198
- exposure: false
199
- }) &&
199
+ _tasksAndDecisionsStyles.decisionStyles,
200
200
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
201
201
  _tasksAndDecisionsStyles.vanillaTaskItemStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
202
202
  exposure: false
@@ -318,15 +318,11 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
318
318
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
319
319
  _codeBlockStyles.firstCodeBlockWithNoMarginOld,
320
320
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
321
- _firstBlockNodeStyles.firstBlockNodeStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
322
- exposure: false
323
- }) &&
321
+ _firstBlockNodeStyles.firstBlockNodeStyles,
324
322
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
325
- _mentions.vanillaMentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
326
- exposure: false
327
- }) &&
323
+ _mentions.mentionNodeStyles,
328
324
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
329
- _mentions.vanillaMentionsSelectionStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
325
+ _mentions.mentionsSelectionStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
330
326
  exposure: false
331
327
  }) ?
332
328
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.findReplaceStyles = void 0;
6
+ exports.findReplaceStylesNew = exports.findReplaceStyles = void 0;
7
7
  var _react = require("@emotion/react");
8
8
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
9
9
 
@@ -19,4 +19,85 @@ var findReplaceStyles = exports.findReplaceStyles = (0, _react.css)({
19
19
  '.selected-search-match': {
20
20
  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
21
21
  }
22
+ });
23
+
24
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
25
+ var findReplaceStylesNew = exports.findReplaceStylesNew = (0, _react.css)({
26
+ /** Text match styles */
27
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
28
+ '.search-match': {
29
+ borderRadius: '3px',
30
+ backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
31
+ boxShadow: "var(--ds-shadow-raised, 0 1px 1px 0 rgba(9, 30, 66, 0.25), 0 0 1px 0 rgba(9, 30, 66, 0.31))".concat(", inset 0 0 0 1px ", "var(--ds-border-input, #8590A2)")
32
+ },
33
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
34
+ '.search-match-selected': {
35
+ backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
36
+ },
37
+ /** Block match styles */
38
+
39
+ /** Light mode */
40
+
41
+ /** Without node selection */
42
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
43
+ '.search-match-block': {
44
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
45
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
46
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", "\n\t\t\t")
47
+ }
48
+ },
49
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
50
+ '.search-match-selected.search-match-block': {
51
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
52
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
53
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", "\n\t\t\t")
54
+ }
55
+ },
56
+ /** With node selection */
57
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
58
+ '.search-match-block.ak-editor-selected-node': {
59
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
60
+ '.loader-wrapper>div::after': {
61
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
62
+ }
63
+ },
64
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
65
+ '.search-match-selected.search-match-block.ak-editor-selected-node': {
66
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
67
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
68
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
69
+ }
70
+ },
71
+ /** Dark mode */
72
+
73
+ /** Without node selection */
74
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
75
+ '.search-match-block.search-match-dark': {
76
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
77
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
78
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", "\n\t\t\t")
79
+ }
80
+ },
81
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
82
+ '.search-match-selected.search-match-block.search-match-dark': {
83
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
84
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
85
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "\n\t\t\t")
86
+ }
87
+ },
88
+ /** With node selection */
89
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
90
+ '.search-match-block.search-match-dark.ak-editor-selected-node': {
91
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
92
+ '.loader-wrapper>div::after': {
93
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
94
+ }
95
+ },
96
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
97
+ '.search-match-selected.search-match-block.search-match-dark.ak-editor-selected-node': {
98
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
99
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
100
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
101
+ }
102
+ }
22
103
  });
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.vanillaMentionsStyles = exports.vanillaMentionsSelectionStyles = exports.mentionsStyles = void 0;
7
+ exports.mentionsStyles = exports.mentionsSelectionStyles = exports.mentionNodeStyles = void 0;
8
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
9
  var _react = require("@emotion/react");
10
10
  var _mention = require("@atlaskit/editor-common/mention");
@@ -36,13 +36,17 @@ _selectionStyles.backgroundSelectionStyles, mentionsSelectedColor])), '.danger',
36
36
  })));
37
37
 
38
38
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
39
- var vanillaMentionsStyles = exports.vanillaMentionsStyles = (0, _react.css)({
39
+ var mentionNodeStyles = exports.mentionNodeStyles = (0, _react.css)({
40
40
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
41
41
  '.editor-mention-primitive': {
42
42
  display: 'inline',
43
43
  borderRadius: '20px',
44
44
  cursor: 'pointer',
45
45
  padding: '0 0.3em 2px 0.23em',
46
+ // To match `packages/elements/mention/src/components/Mention/PrimitiveMention.tsx` implementation
47
+ // we match the line height exactly
48
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
49
+ lineHeight: '1.714',
46
50
  fontWeight: "var(--ds-font-weight-regular, 400)",
47
51
  wordBreak: 'break-word',
48
52
  background: "var(--ds-background-neutral, #091E420F)",
@@ -83,7 +87,7 @@ var vanillaMentionsStyles = exports.vanillaMentionsStyles = (0, _react.css)({
83
87
 
84
88
  // This is mentions styles for mentions selection styles based on the vanilla node view
85
89
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
86
- var vanillaMentionsSelectionStyles = exports.vanillaMentionsSelectionStyles = (0, _react.css)((0, _defineProperty2.default)({
90
+ var mentionsSelectionStyles = exports.mentionsSelectionStyles = (0, _react.css)((0, _defineProperty2.default)({
87
91
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
88
92
  '.danger': {
89
93
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -246,7 +246,7 @@ var vanillaTaskItemStyles = exports.vanillaTaskItemStyles = (0, _react.css)((0,
246
246
  display: 'none'
247
247
  },
248
248
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
249
- '[data-prosemirror-node-view-type="vanilla"][data-prosemirror-node-name="taskItem"]:has([data-empty]):not(:has([data-type-ahead])) [data-component="placeholder"]': {
249
+ "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='taskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder']": {
250
250
  display: 'block'
251
251
  },
252
252
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.version = exports.name = void 0;
7
7
  var name = exports.name = "@atlaskit/editor-core";
8
- var version = exports.version = "208.3.3";
8
+ var version = exports.version = "208.3.4";
@@ -19,11 +19,12 @@ import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
19
19
  import { gapCursorStyles } from '@atlaskit/editor-common/selection';
20
20
  import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, pragmaticResizerStyles, pragmaticStylesLayoutFirstNodeResizeHandleFix, pragmaticResizerStylesForTooltip, ruleSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
21
21
  import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
22
- import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
22
+ import { findReplaceStyles, findReplaceStylesNew } from '@atlaskit/editor-plugins/find-replace/styles';
23
23
  import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
24
24
  import { placeholderTextStyles, placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour } from '@atlaskit/editor-plugins/placeholder-text/styles';
25
25
  import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
26
26
  import { fg } from '@atlaskit/platform-feature-flags';
27
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
27
28
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
28
29
  import { useThemeObserver } from '@atlaskit/tokens';
29
30
  import { InlineNodeViewSharedStyles } from '../../nodeviews/getInlineNodeViewProducer.styles';
@@ -60,13 +61,17 @@ const ruleStyles = () => css`
60
61
  }
61
62
  }
62
63
  `;
63
- const vanillaMentionsStyles = css({
64
+ const mentionNodeStyles = css({
64
65
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
65
66
  '.editor-mention-primitive': {
66
67
  display: 'inline',
67
68
  borderRadius: '20px',
68
69
  cursor: 'pointer',
69
70
  padding: '0 0.3em 2px 0.23em',
71
+ // To match `packages/elements/mention/src/components/Mention/PrimitiveMention.tsx` implementation
72
+ // we match the line height exactly
73
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
74
+ lineHeight: '1.714',
70
75
  fontWeight: "var(--ds-font-weight-regular, 400)",
71
76
  wordBreak: 'break-word',
72
77
  background: "var(--ds-background-neutral, #091E420F)",
@@ -386,7 +391,7 @@ const legacyContentStyles = props => css`
386
391
  display: none;
387
392
  }
388
393
 
389
- ${fg('platform_editor_fix_floating_toolbar_focus') ? firstFloatingToolbarButtonStyles : null}
394
+ ${firstFloatingToolbarButtonStyles}
390
395
  ${placeholderTextStyles}
391
396
  ${fg('platform_editor_system_fake_text_highlight_colour') && placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour}
392
397
  ${placeholderStyles}
@@ -407,9 +412,7 @@ const legacyContentStyles = props => css`
407
412
  ${gapCursorStyles};
408
413
  ${panelStyles()}
409
414
  ${mentionsStyles}
410
- ${editorExperiment('platform_editor_vanilla_dom', true, {
411
- exposure: false
412
- }) && vanillaMentionsStyles}
415
+ ${mentionNodeStyles}
413
416
  ${editorExperiment('platform_editor_vanilla_dom', true, {
414
417
  exposure: false
415
418
  }) && vanillaSelectionStyles}
@@ -424,12 +427,10 @@ const legacyContentStyles = props => css`
424
427
  ${dateSharedStyle}
425
428
  ${extensionStyles}
426
429
  ${expandStyles()}
427
- ${findReplaceStyles}
430
+ ${expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? findReplaceStylesNew : findReplaceStyles}
428
431
  ${textHighlightStyle}
429
432
  ${taskDecisionStyles}
430
- ${editorExperiment('platform_editor_vanilla_dom', true, {
431
- exposure: false
432
- }) && vanillaTaskItemStyles}
433
+ ${vanillaTaskItemStyles}
433
434
  ${editorExperiment('platform_editor_vanilla_dom', true, {
434
435
  exposure: false
435
436
  }) && vanillaDecisionStyles}
@@ -171,7 +171,7 @@ export const vanillaTaskItemStyles = css({
171
171
  display: 'none'
172
172
  },
173
173
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
174
- '[data-prosemirror-node-view-type="vanilla"][data-prosemirror-node-name="taskItem"]:has([data-empty]):not(:has([data-type-ahead])) [data-component="placeholder"]': {
174
+ "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='taskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder']": {
175
175
  display: 'block'
176
176
  },
177
177
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -30,7 +30,7 @@ import { embedCardStyles } from './styles/embedCardStyles';
30
30
  import { reactEmojiStyles, vanillaEmojiStyles } from './styles/emoji';
31
31
  import { expandStyles, expandStylesMixin_fg_platform_editor_nested_dnd_styles_changes, expandStylesMixin_fg_platform_visual_refresh_icons, expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes } from './styles/expandStyles';
32
32
  import { extensionStyles } from './styles/extensionStyles';
33
- import { findReplaceStyles } from './styles/findReplaceStyles';
33
+ import { findReplaceStyles, findReplaceStylesNew } from './styles/findReplaceStyles';
34
34
  import { firstBlockNodeStyles } from './styles/firstBlockNodeStyles';
35
35
  import { firstFloatingToolbarButtonStyles } from './styles/floatingToolbarStyles';
36
36
  import { fullPageEditorStyles } from './styles/fullPageEditorStyles';
@@ -42,7 +42,7 @@ import { layoutBaseStyles, layoutBaseStylesAdvanced, layoutBaseStylesFixesUnderN
42
42
  import { hyperLinkFloatingToolbarStyles, linkLegacyIconStylesFix, linkStyles, linkStylesOld } from './styles/link';
43
43
  import { listsStyles, listsStylesSafariFix } from './styles/list';
44
44
  import { mediaAlignmentStyles, mediaGroupStyles, mediaStyles } from './styles/mediaStyles';
45
- import { mentionsStyles, vanillaMentionsSelectionStyles, vanillaMentionsStyles } from './styles/mentions';
45
+ import { mentionsStyles, mentionsSelectionStyles, mentionNodeStyles } from './styles/mentions';
46
46
  import { panelStyles, panelStylesMixin, panelStylesMixin_fg_platform_editor_add_border_for_nested_panel, panelStylesMixin_fg_platform_editor_nested_dnd_styles_changes, panelViewStyles } from './styles/panelStyles';
47
47
  import { paragraphStylesOld, paragraphStylesUGCModernized, paragraphStylesUGCRefreshed } from './styles/paragraphStyles';
48
48
  import { placeholderOverflowStyles, placeholderStyles, placeholderTextStyles, placeholderTextStylesMixin_fg_platform_editor_system_fake_text_highlight_colour, placeholderWrapStyles } from './styles/placeholderStyles';
@@ -107,7 +107,7 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
107
107
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
108
108
  cursorStyles,
109
109
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
110
- fg('platform_editor_fix_floating_toolbar_focus') && firstFloatingToolbarButtonStyles,
110
+ firstFloatingToolbarButtonStyles,
111
111
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
112
112
  placeholderTextStyles, fg('platform_editor_system_fake_text_highlight_colour') &&
113
113
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -183,15 +183,15 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
183
183
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
184
184
  expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes,
185
185
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
186
- fg('platform-visual-refresh-icons') && expandStylesMixin_fg_platform_visual_refresh_icons,
186
+ fg('platform-visual-refresh-icons') && expandStylesMixin_fg_platform_visual_refresh_icons, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ?
187
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
188
+ findReplaceStylesNew :
187
189
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
188
190
  findReplaceStyles,
189
191
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
190
192
  textHighlightStyle,
191
193
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
192
- decisionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
193
- exposure: false
194
- }) &&
194
+ decisionStyles,
195
195
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
196
196
  vanillaTaskItemStyles, editorExperiment('platform_editor_vanilla_dom', true, {
197
197
  exposure: false
@@ -313,15 +313,11 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
313
313
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
314
314
  firstCodeBlockWithNoMarginOld,
315
315
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
316
- firstBlockNodeStyles, editorExperiment('platform_editor_vanilla_dom', true, {
317
- exposure: false
318
- }) &&
316
+ firstBlockNodeStyles,
319
317
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
320
- vanillaMentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
321
- exposure: false
322
- }) &&
318
+ mentionNodeStyles,
323
319
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
324
- vanillaMentionsSelectionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
320
+ mentionsSelectionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
325
321
  exposure: false
326
322
  }) ?
327
323
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -12,4 +12,113 @@ export const findReplaceStyles = css({
12
12
  '.selected-search-match': {
13
13
  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
14
14
  }
15
+ });
16
+
17
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
18
+ export const findReplaceStylesNew = css({
19
+ /** Text match styles */
20
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
21
+ '.search-match': {
22
+ borderRadius: '3px',
23
+ backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
24
+ boxShadow: `${"var(--ds-shadow-raised, 0 1px 1px 0 rgba(9, 30, 66, 0.25), 0 0 1px 0 rgba(9, 30, 66, 0.31))"}, inset 0 0 0 1px ${"var(--ds-border-input, #8590A2)"}`
25
+ },
26
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
27
+ '.search-match-selected': {
28
+ backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
29
+ },
30
+ /** Block match styles */
31
+
32
+ /** Light mode */
33
+
34
+ /** Without node selection */
35
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
36
+ '.search-match-block': {
37
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
38
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
39
+ boxShadow: `
40
+ inset 0 0 0 1px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"},
41
+ inset 0 0 0 5px ${"var(--ds-background-accent-yellow-subtler, #F8E6A0)"}
42
+ `
43
+ }
44
+ },
45
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
46
+ '.search-match-selected.search-match-block': {
47
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
48
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
49
+ boxShadow: `
50
+ inset 0 0 0 1px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"},
51
+ inset 0 0 0 4px ${"var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"}
52
+ `
53
+ }
54
+ },
55
+ /** With node selection */
56
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
57
+ '.search-match-block.ak-editor-selected-node': {
58
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
59
+ '.loader-wrapper>div::after': {
60
+ boxShadow: `
61
+ inset 0 0 0 1px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"},
62
+ inset 0 0 0 5px ${"var(--ds-background-accent-yellow-subtler, #F8E6A0)"},
63
+ 0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
64
+ `
65
+ }
66
+ },
67
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
68
+ '.search-match-selected.search-match-block.ak-editor-selected-node': {
69
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
70
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
71
+ boxShadow: `
72
+ inset 0 0 0 1px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"},
73
+ inset 0 0 0 4px ${"var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"},
74
+ 0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
75
+ `
76
+ }
77
+ },
78
+ /** Dark mode */
79
+
80
+ /** Without node selection */
81
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
82
+ '.search-match-block.search-match-dark': {
83
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
84
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
85
+ boxShadow: `
86
+ inset 0 0 0 1px ${"var(--ds-background-accent-yellow-bolder, #946F00)"},
87
+ inset 0 0 0 5px ${"var(--ds-background-accent-yellow-bolder-pressed, #533F04)"}
88
+ `
89
+ }
90
+ },
91
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
92
+ '.search-match-selected.search-match-block.search-match-dark': {
93
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
94
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
95
+ boxShadow: `
96
+ inset 0 0 0 1px ${"var(--ds-background-accent-yellow-bolder, #946F00)"},
97
+ inset 0 0 0 4px ${"var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"}
98
+ `
99
+ }
100
+ },
101
+ /** With node selection */
102
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
103
+ '.search-match-block.search-match-dark.ak-editor-selected-node': {
104
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
105
+ '.loader-wrapper>div::after': {
106
+ boxShadow: `
107
+ inset 0 0 0 1px ${"var(--ds-background-accent-yellow-bolder, #946F00)"},
108
+ inset 0 0 0 5px ${"var(--ds-background-accent-yellow-bolder-pressed, #533F04)"},
109
+ 0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
110
+ `
111
+ }
112
+ },
113
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
114
+ '.search-match-selected.search-match-block.search-match-dark.ak-editor-selected-node': {
115
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
116
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
117
+ boxShadow: `
118
+ inset 0 0 0 1px ${"var(--ds-background-accent-yellow-bolder, #946F00)"},
119
+ inset 0 0 0 4px ${"var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"},
120
+ 0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
121
+ `
122
+ }
123
+ }
15
124
  });
@@ -42,13 +42,17 @@ export const mentionsStyles = css({
42
42
  });
43
43
 
44
44
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
45
- export const vanillaMentionsStyles = css({
45
+ export const mentionNodeStyles = css({
46
46
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
47
47
  '.editor-mention-primitive': {
48
48
  display: 'inline',
49
49
  borderRadius: '20px',
50
50
  cursor: 'pointer',
51
51
  padding: '0 0.3em 2px 0.23em',
52
+ // To match `packages/elements/mention/src/components/Mention/PrimitiveMention.tsx` implementation
53
+ // we match the line height exactly
54
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
55
+ lineHeight: '1.714',
52
56
  fontWeight: "var(--ds-font-weight-regular, 400)",
53
57
  wordBreak: 'break-word',
54
58
  background: "var(--ds-background-neutral, #091E420F)",
@@ -89,7 +93,7 @@ export const vanillaMentionsStyles = css({
89
93
 
90
94
  // This is mentions styles for mentions selection styles based on the vanilla node view
91
95
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
92
- export const vanillaMentionsSelectionStyles = css({
96
+ export const mentionsSelectionStyles = css({
93
97
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
94
98
  '.danger': {
95
99
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -253,7 +253,7 @@ export const vanillaTaskItemStyles = css({
253
253
  display: 'none'
254
254
  },
255
255
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
256
- '[data-prosemirror-node-view-type="vanilla"][data-prosemirror-node-name="taskItem"]:has([data-empty]):not(:has([data-type-ahead])) [data-component="placeholder"]': {
256
+ "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='taskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder']": {
257
257
  display: 'block'
258
258
  },
259
259
  // 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 = "208.3.3";
2
+ export const version = "208.3.4";
@@ -21,11 +21,12 @@ import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
21
21
  import { gapCursorStyles } from '@atlaskit/editor-common/selection';
22
22
  import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, pragmaticResizerStyles, pragmaticStylesLayoutFirstNodeResizeHandleFix, pragmaticResizerStylesForTooltip, ruleSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
23
23
  import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
24
- import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
24
+ import { findReplaceStyles, findReplaceStylesNew } from '@atlaskit/editor-plugins/find-replace/styles';
25
25
  import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
26
26
  import { placeholderTextStyles, placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour } from '@atlaskit/editor-plugins/placeholder-text/styles';
27
27
  import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
28
28
  import { fg } from '@atlaskit/platform-feature-flags';
29
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
29
30
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
30
31
  import { useThemeObserver } from '@atlaskit/tokens';
31
32
  import { InlineNodeViewSharedStyles } from '../../nodeviews/getInlineNodeViewProducer.styles';
@@ -44,13 +45,17 @@ export var linkStyles = css(_templateObject || (_templateObject = _taggedTemplat
44
45
  var ruleStyles = function ruleStyles() {
45
46
  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", ";\n\n\t\thr {\n\t\t\tcursor: pointer;\n\t\t\tpadding: ", " 0;\n\t\t\tmargin: ", " 0;\n\t\t\tbackground-clip: content-box;\n\n\t\t\t&.", " {\n\t\t\t\toutline: none;\n\t\t\t\tbackground-color: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), ruleSharedStyles(), "var(--ds-space-050, 4px)", "var(--ds-space-300, 24px)", akEditorSelectedNodeClassName, "var(--ds-border-selected, ".concat(akEditorSelectedBorderColor, ")"));
46
47
  };
47
- var vanillaMentionsStyles = css({
48
+ var mentionNodeStyles = css({
48
49
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
49
50
  '.editor-mention-primitive': {
50
51
  display: 'inline',
51
52
  borderRadius: '20px',
52
53
  cursor: 'pointer',
53
54
  padding: '0 0.3em 2px 0.23em',
55
+ // To match `packages/elements/mention/src/components/Mention/PrimitiveMention.tsx` implementation
56
+ // we match the line height exactly
57
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
58
+ lineHeight: '1.714',
54
59
  fontWeight: "var(--ds-font-weight-regular, 400)",
55
60
  wordBreak: 'break-word',
56
61
  background: "var(--ds-background-neutral, #091E420F)",
@@ -147,15 +152,11 @@ var akEditorBreakpointForSmallDevice = "1266px";
147
152
  var legacyContentStyles = function legacyContentStyles(props) {
148
153
  return css(_templateObject9 || (_templateObject9 = _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--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-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\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t *\n\t * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n /* Switch between the two icons based on the visual refresh feature gate */\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\t", "\n ", "\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\tRelated code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\tIn the \"editorContentAreaContainerStyle\" function */\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, editorFontSize({
149
154
  theme: props.theme
150
- }), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject0 || (_templateObject0 = _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(_templateObject1 || (_templateObject1 = _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)", fg('platform_editor_fix_floating_toolbar_focus') ? firstFloatingToolbarButtonStyles : null, placeholderTextStyles, fg('platform_editor_system_fake_text_highlight_colour') && placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(props.typographyTheme), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles(), listsStyles, ruleStyles(), mediaStyles(), layoutStyles(props.viewMode), fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
151
- exposure: false
152
- }) && vanillaMentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
155
+ }), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject0 || (_templateObject0 = _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(_templateObject1 || (_templateObject1 = _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)", firstFloatingToolbarButtonStyles, placeholderTextStyles, fg('platform_editor_system_fake_text_highlight_colour') && placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(props.typographyTheme), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles(), listsStyles, ruleStyles(), mediaStyles(), layoutStyles(props.viewMode), fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, mentionNodeStyles, editorExperiment('platform_editor_vanilla_dom', true, {
153
156
  exposure: false
154
157
  }) && vanillaSelectionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
155
158
  exposure: false
156
- }) ? emojiStyles : reactEmojiStyles, emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), findReplaceStyles, textHighlightStyle, taskDecisionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
157
- exposure: false
158
- }) && vanillaTaskItemStyles, editorExperiment('platform_editor_vanilla_dom', true, {
159
+ }) ? emojiStyles : reactEmojiStyles, emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? findReplaceStylesNew : findReplaceStyles, textHighlightStyle, taskDecisionStyles, vanillaTaskItemStyles, editorExperiment('platform_editor_vanilla_dom', true, {
159
160
  exposure: false
160
161
  }) && vanillaDecisionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
161
162
  exposure: false
@@ -153,7 +153,7 @@ export var vanillaTaskItemStyles = css(_defineProperty({
153
153
  display: 'none'
154
154
  },
155
155
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
156
- '[data-prosemirror-node-view-type="vanilla"][data-prosemirror-node-name="taskItem"]:has([data-empty]):not(:has([data-type-ahead])) [data-component="placeholder"]': {
156
+ "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='taskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder']": {
157
157
  display: 'block'
158
158
  },
159
159
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -30,7 +30,7 @@ import { embedCardStyles } from './styles/embedCardStyles';
30
30
  import { reactEmojiStyles, vanillaEmojiStyles } from './styles/emoji';
31
31
  import { expandStyles, expandStylesMixin_fg_platform_editor_nested_dnd_styles_changes, expandStylesMixin_fg_platform_visual_refresh_icons, expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes } from './styles/expandStyles';
32
32
  import { extensionStyles } from './styles/extensionStyles';
33
- import { findReplaceStyles } from './styles/findReplaceStyles';
33
+ import { findReplaceStyles, findReplaceStylesNew } from './styles/findReplaceStyles';
34
34
  import { firstBlockNodeStyles } from './styles/firstBlockNodeStyles';
35
35
  import { firstFloatingToolbarButtonStyles } from './styles/floatingToolbarStyles';
36
36
  import { fullPageEditorStyles } from './styles/fullPageEditorStyles';
@@ -42,7 +42,7 @@ import { layoutBaseStyles, layoutBaseStylesAdvanced, layoutBaseStylesFixesUnderN
42
42
  import { hyperLinkFloatingToolbarStyles, linkLegacyIconStylesFix, linkStyles, linkStylesOld } from './styles/link';
43
43
  import { listsStyles, listsStylesSafariFix } from './styles/list';
44
44
  import { mediaAlignmentStyles, mediaGroupStyles, mediaStyles } from './styles/mediaStyles';
45
- import { mentionsStyles, vanillaMentionsSelectionStyles, vanillaMentionsStyles } from './styles/mentions';
45
+ import { mentionsStyles, mentionsSelectionStyles, mentionNodeStyles } from './styles/mentions';
46
46
  import { panelStyles, panelStylesMixin, panelStylesMixin_fg_platform_editor_add_border_for_nested_panel, panelStylesMixin_fg_platform_editor_nested_dnd_styles_changes, panelViewStyles } from './styles/panelStyles';
47
47
  import { paragraphStylesOld, paragraphStylesUGCModernized, paragraphStylesUGCRefreshed } from './styles/paragraphStyles';
48
48
  import { placeholderOverflowStyles, placeholderStyles, placeholderTextStyles, placeholderTextStylesMixin_fg_platform_editor_system_fake_text_highlight_colour, placeholderWrapStyles } from './styles/placeholderStyles';
@@ -104,7 +104,7 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
104
104
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
105
105
  cursorStyles,
106
106
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
107
- fg('platform_editor_fix_floating_toolbar_focus') && firstFloatingToolbarButtonStyles,
107
+ firstFloatingToolbarButtonStyles,
108
108
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
109
109
  placeholderTextStyles, fg('platform_editor_system_fake_text_highlight_colour') &&
110
110
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -180,15 +180,15 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
180
180
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
181
181
  expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes,
182
182
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
183
- fg('platform-visual-refresh-icons') && expandStylesMixin_fg_platform_visual_refresh_icons,
183
+ fg('platform-visual-refresh-icons') && expandStylesMixin_fg_platform_visual_refresh_icons, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ?
184
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
185
+ findReplaceStylesNew :
184
186
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
185
187
  findReplaceStyles,
186
188
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
187
189
  textHighlightStyle,
188
190
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
189
- decisionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
190
- exposure: false
191
- }) &&
191
+ decisionStyles,
192
192
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
193
193
  vanillaTaskItemStyles, editorExperiment('platform_editor_vanilla_dom', true, {
194
194
  exposure: false
@@ -310,15 +310,11 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
310
310
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
311
311
  firstCodeBlockWithNoMarginOld,
312
312
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
313
- firstBlockNodeStyles, editorExperiment('platform_editor_vanilla_dom', true, {
314
- exposure: false
315
- }) &&
313
+ firstBlockNodeStyles,
316
314
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
317
- vanillaMentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
318
- exposure: false
319
- }) &&
315
+ mentionNodeStyles,
320
316
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
321
- vanillaMentionsSelectionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
317
+ mentionsSelectionStyles, editorExperiment('platform_editor_vanilla_dom', true, {
322
318
  exposure: false
323
319
  }) ?
324
320
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -12,4 +12,85 @@ export var findReplaceStyles = css({
12
12
  '.selected-search-match': {
13
13
  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
14
14
  }
15
+ });
16
+
17
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
18
+ export var findReplaceStylesNew = css({
19
+ /** Text match styles */
20
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
21
+ '.search-match': {
22
+ borderRadius: '3px',
23
+ backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
24
+ boxShadow: "var(--ds-shadow-raised, 0 1px 1px 0 rgba(9, 30, 66, 0.25), 0 0 1px 0 rgba(9, 30, 66, 0.31))".concat(", inset 0 0 0 1px ", "var(--ds-border-input, #8590A2)")
25
+ },
26
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
27
+ '.search-match-selected': {
28
+ backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
29
+ },
30
+ /** Block match styles */
31
+
32
+ /** Light mode */
33
+
34
+ /** Without node selection */
35
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
36
+ '.search-match-block': {
37
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
38
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
39
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", "\n\t\t\t")
40
+ }
41
+ },
42
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
43
+ '.search-match-selected.search-match-block': {
44
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
45
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
46
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", "\n\t\t\t")
47
+ }
48
+ },
49
+ /** With node selection */
50
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
51
+ '.search-match-block.ak-editor-selected-node': {
52
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
53
+ '.loader-wrapper>div::after': {
54
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
55
+ }
56
+ },
57
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
58
+ '.search-match-selected.search-match-block.ak-editor-selected-node': {
59
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
60
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
61
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
62
+ }
63
+ },
64
+ /** Dark mode */
65
+
66
+ /** Without node selection */
67
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
68
+ '.search-match-block.search-match-dark': {
69
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
70
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
71
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", "\n\t\t\t")
72
+ }
73
+ },
74
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
75
+ '.search-match-selected.search-match-block.search-match-dark': {
76
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
77
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
78
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "\n\t\t\t")
79
+ }
80
+ },
81
+ /** With node selection */
82
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
83
+ '.search-match-block.search-match-dark.ak-editor-selected-node': {
84
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
85
+ '.loader-wrapper>div::after': {
86
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
87
+ }
88
+ },
89
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
90
+ '.search-match-selected.search-match-block.search-match-dark.ak-editor-selected-node': {
91
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
92
+ '[data-smart-link-container="true"], .loader-wrapper>div::after': {
93
+ boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
94
+ }
95
+ }
15
96
  });
@@ -29,13 +29,17 @@ backgroundSelectionStyles, mentionsSelectedColor])), '.danger', _defineProperty(
29
29
  })));
30
30
 
31
31
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
32
- export var vanillaMentionsStyles = css({
32
+ export var mentionNodeStyles = css({
33
33
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
34
34
  '.editor-mention-primitive': {
35
35
  display: 'inline',
36
36
  borderRadius: '20px',
37
37
  cursor: 'pointer',
38
38
  padding: '0 0.3em 2px 0.23em',
39
+ // To match `packages/elements/mention/src/components/Mention/PrimitiveMention.tsx` implementation
40
+ // we match the line height exactly
41
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
42
+ lineHeight: '1.714',
39
43
  fontWeight: "var(--ds-font-weight-regular, 400)",
40
44
  wordBreak: 'break-word',
41
45
  background: "var(--ds-background-neutral, #091E420F)",
@@ -76,7 +80,7 @@ export var vanillaMentionsStyles = css({
76
80
 
77
81
  // This is mentions styles for mentions selection styles based on the vanilla node view
78
82
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
79
- export var vanillaMentionsSelectionStyles = css(_defineProperty({
83
+ export var mentionsSelectionStyles = css(_defineProperty({
80
84
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
81
85
  '.danger': {
82
86
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -238,7 +238,7 @@ export var vanillaTaskItemStyles = css(_defineProperty({
238
238
  display: 'none'
239
239
  },
240
240
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
241
- '[data-prosemirror-node-view-type="vanilla"][data-prosemirror-node-name="taskItem"]:has([data-empty]):not(:has([data-type-ahead])) [data-component="placeholder"]': {
241
+ "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='taskItem']:has([data-empty]):not(:has([data-type-ahead])) [data-component='placeholder']": {
242
242
  display: 'block'
243
243
  },
244
244
  // 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 = "208.3.3";
2
+ export var version = "208.3.4";
@@ -1 +1,2 @@
1
1
  export declare const findReplaceStyles: import("@emotion/react").SerializedStyles;
2
+ export declare const findReplaceStylesNew: import("@emotion/react").SerializedStyles;
@@ -1,3 +1,3 @@
1
1
  export declare const mentionsStyles: import("@emotion/react").SerializedStyles;
2
- export declare const vanillaMentionsStyles: import("@emotion/react").SerializedStyles;
3
- export declare const vanillaMentionsSelectionStyles: import("@emotion/react").SerializedStyles;
2
+ export declare const mentionNodeStyles: import("@emotion/react").SerializedStyles;
3
+ export declare const mentionsSelectionStyles: import("@emotion/react").SerializedStyles;
@@ -1 +1,2 @@
1
1
  export declare const findReplaceStyles: import("@emotion/react").SerializedStyles;
2
+ export declare const findReplaceStylesNew: import("@emotion/react").SerializedStyles;
@@ -1,3 +1,3 @@
1
1
  export declare const mentionsStyles: import("@emotion/react").SerializedStyles;
2
- export declare const vanillaMentionsStyles: import("@emotion/react").SerializedStyles;
3
- export declare const vanillaMentionsSelectionStyles: import("@emotion/react").SerializedStyles;
2
+ export declare const mentionNodeStyles: import("@emotion/react").SerializedStyles;
3
+ export declare const mentionsSelectionStyles: import("@emotion/react").SerializedStyles;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-core",
3
- "version": "208.3.4",
3
+ "version": "208.3.5",
4
4
  "description": "A package contains Atlassian editor core functionality",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -55,7 +55,7 @@
55
55
  "@atlaskit/editor-prosemirror": "7.0.0",
56
56
  "@atlaskit/editor-shared-styles": "^3.4.0",
57
57
  "@atlaskit/emoji": "^69.3.0",
58
- "@atlaskit/icon": "^27.1.0",
58
+ "@atlaskit/icon": "^27.2.0",
59
59
  "@atlaskit/link": "^3.2.0",
60
60
  "@atlaskit/media-card": "^79.3.0",
61
61
  "@atlaskit/mention": "^24.2.0",
@@ -418,10 +418,6 @@
418
418
  "type": "boolean",
419
419
  "referenceOnly": true
420
420
  },
421
- "platform_editor_scroll_table_flickering_fix": {
422
- "type": "boolean",
423
- "referenceOnly": true
424
- },
425
421
  "platform_editor_paste_full_table_inside_empty_cell": {
426
422
  "type": "boolean",
427
423
  "referenceOnly": true
@@ -529,10 +525,6 @@
529
525
  "type": "boolean",
530
526
  "referenceOnly": true
531
527
  },
532
- "platform_editor_controls_patch_12": {
533
- "type": "boolean",
534
- "referenceOnly": true
535
- },
536
528
  "platform_editor_controls_patch_13": {
537
529
  "type": "boolean",
538
530
  "referenceOnly": true
@@ -584,9 +576,6 @@
584
576
  "should-render-to-parent-should-be-true-editor": {
585
577
  "type": "boolean"
586
578
  },
587
- "platform_editor_fix_floating_toolbar_focus": {
588
- "type": "boolean"
589
- },
590
579
  "platform_editor_add_border_for_nested_panel": {
591
580
  "type": "boolean",
592
581
  "referenceOnly": true