@atlaskit/editor-core 209.1.1 → 209.1.2

package/dist/cjs/ui/EditorContentContainer/styles/statusStyles.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.statusStylesMixin_without_fg_platform_component_visual_refresh = exports.statusStylesMixin_fg_platform_component_visual_refresh = exports.statusStyles = void 0;
+exports.statusStylesMixin_without_fg_platform_component_visual_refresh_with_search_match = exports.statusStylesMixin_without_fg_platform_component_visual_refresh = exports.statusStylesMixin_fg_platform_component_visual_refresh_with_search_match = exports.statusStylesMixin_fg_platform_component_visual_refresh = exports.statusStyles = void 0;
 var _react = require("@emotion/react");
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
 
@@ -124,6 +124,52 @@ var statusStylesMixin_fg_platform_component_visual_refresh = exports.statusStyle
   }
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var statusStylesMixin_fg_platform_component_visual_refresh_with_search_match = exports.statusStylesMixin_fg_platform_component_visual_refresh_with_search_match = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '.statusView-content-wrap:not(.search-match-block)': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&.ak-editor-selected-node .status-lozenge-span > span': {
+      boxShadow: "0 0 0 2px ".concat("var(--ds-border-selected, #0C66E4)")
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] .lozenge-text': {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    color: '#292A2E'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=neutral] > .lozenge-wrapper': {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    backgroundColor: '#DDDEE1'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=purple] > .lozenge-wrapper': {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    backgroundColor: '#D8A0F7'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=blue] > .lozenge-wrapper': {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    backgroundColor: '#8FB8F6'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=yellow] > .lozenge-wrapper': {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    backgroundColor: '#F9C84E'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=red] > .lozenge-wrapper': {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    backgroundColor: '#FD9891'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=green] > .lozenge-wrapper': {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    backgroundColor: '#B3DF72'
+  }
+});
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 var statusStylesMixin_without_fg_platform_component_visual_refresh = exports.statusStylesMixin_without_fg_platform_component_visual_refresh = (0, _react.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -192,4 +238,74 @@ var statusStylesMixin_without_fg_platform_component_visual_refresh = exports.sta
   '[data-prosemirror-node-name="status"] > [data-color=green] .lozenge-text': {
     color: "var(--ds-text-success, #216E4E)"
   }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var statusStylesMixin_without_fg_platform_component_visual_refresh_with_search_match = exports.statusStylesMixin_without_fg_platform_component_visual_refresh_with_search_match = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '.statusView-content-wrap:not(.search-match-block)': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&.ak-editor-selected-node .status-lozenge-span > span': {
+      // getSelectionStyles([SelectionStyle.BoxShadow]);
+      boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)"),
+      borderColor: 'transparent',
+      // hideNativeBrowserTextSelectionStyles
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '&::selection, & *::selection': {
+        backgroundColor: 'transparent'
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+      '&::-moz-selection, & *::-moz-selection': {
+        backgroundColor: 'transparent'
+      }
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=neutral] .lozenge-wrapper': {
+    backgroundColor: "var(--ds-background-neutral, #091E420F)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=neutral] .lozenge-text': {
+    color: "var(--ds-text-subtle, #44546F)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=purple] .lozenge-wrapper': {
+    backgroundColor: "var(--ds-background-discovery, #F3F0FF)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=purple] .lozenge-text': {
+    color: "var(--ds-text-discovery, #5E4DB2)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=blue] .lozenge-wrapper': {
+    backgroundColor: "var(--ds-background-information, #E9F2FF)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=blue] .lozenge-text': {
+    color: "var(--ds-text-information, #0055CC)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=yellow] .lozenge-wrapper': {
+    backgroundColor: "var(--ds-background-warning, #FFF7D6)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=yellow] .lozenge-text': {
+    color: "var(--ds-text-warning, #A54800)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=red] .lozenge-wrapper': {
+    backgroundColor: "var(--ds-background-danger, #FFECEB)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=red] .lozenge-text': {
+    color: "var(--ds-text-danger, #AE2E24)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=green] .lozenge-wrapper': {
+    backgroundColor: "var(--ds-background-success, #DCFFF1)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-prosemirror-node-name="status"] > [data-color=green] .lozenge-text': {
+    color: "var(--ds-text-success, #216E4E)"
+  }
 });

package/dist/cjs/version-wrapper.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.version = exports.name = void 0;
 var name = exports.name = "@atlaskit/editor-core";
-var version = exports.version = "209.1.0";
+var version = exports.version = "209.1.1";

package/dist/es2019/ui/ContentStyles/index.js

@@ -19,7 +19,7 @@ import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
 import { gapCursorStyles } from '@atlaskit/editor-common/selection';
 import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, pragmaticResizerStyles, pragmaticStylesLayoutFirstNodeResizeHandleFix, pragmaticResizerStylesForTooltip, ruleSharedStyles, shadowSharedStyle, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
 import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
-import { findReplaceStyles, findReplaceStylesNewYellow, findReplaceStylesNewMagenta } from '@atlaskit/editor-plugins/find-replace/styles';
+import { findReplaceStyles, findReplaceStylesNewYellow, findReplaceStylesNewMagenta, findReplaceStylesNewMagentaNoImportant } from '@atlaskit/editor-plugins/find-replace/styles';
 import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
 import { placeholderTextStyles, placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour } from '@atlaskit/editor-plugins/placeholder-text/styles';
 import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
@@ -138,14 +138,40 @@ const mentionSelectionStyles = css`
 		color: ${"var(--ds-text-subtle, #44546F)"}
 	}
 `;
+const mentionsSelectionStylesWithSearchMatch = css`
+	.danger {
+		.editor-mention-primitive {
+			box-shadow: 0 0 0 ${akEditorSelectedBorderSize}px ${akEditorDeleteBorder};
+			background-color: ${`var(--ds-background-danger, ${akEditorDeleteBackgroundWithOpacity})`};
+		}
+	}
+
+	.${akEditorSelectedNodeClassName}:not(.search-match-block) > .editor-mention-primitive,
+	.${akEditorSelectedNodeClassName}:not(.search-match-block) > .editor-mention-primitive.mention-self,
+	.${akEditorSelectedNodeClassName}:not(.search-match-block) > .editor-mention-primitive.mention-restricted {
+		${getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Background])}
+		/* need to specify dark text colour because personal mentions
+	       (in dark blue) have white text by default */
+		color: ${"var(--ds-text-subtle, #44546F)"}
+	}
+
+	.${akEditorSelectedNodeClassName}.search-match-block > .editor-mention-primitive,
+	.${akEditorSelectedNodeClassName}.search-match-block > .editor-mention-primitive.mention-self,
+	.${akEditorSelectedNodeClassName}.search-match-block > .editor-mention-primitive.mention-restricted {
+		${getSelectionStyles([SelectionStyle.Background])}
+		/* need to specify dark text colour because personal mentions
+	       (in dark blue) have white text by default */
+		color: ${"var(--ds-text-subtle, #44546F)"}
+	}
+`;
 const mentionsStyles = css`
 	.${MentionSharedCssClassName.MENTION_CONTAINER} {
 		&.${akEditorSelectedNodeClassName} [data-mention-id] > span {
 			${getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Background])}
 
 			/* need to specify dark text colour because personal mentions
-         (in dark blue) have white text by default */
-      color: ${"var(--ds-text-subtle, #44546F)"};
+			(in dark blue) have white text by default */
+			color: ${"var(--ds-text-subtle, #44546F)"};
 		}
 	}
 
@@ -403,7 +429,7 @@ const legacyContentStyles = props => css`
 	${mentionsStyles}
 	${mentionNodeStyles}
 	${fg('platform_editor_centre_mention_padding') && mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding}
-	${mentionSelectionStyles}
+	${expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1') ? mentionsSelectionStylesWithSearchMatch : mentionSelectionStyles}
   ${emojiStyles}
   ${tasksAndDecisionsStyles}
   ${gridStyles}
@@ -412,14 +438,14 @@ const legacyContentStyles = props => css`
   ${dateSharedStyle}
   ${extensionStyles}
   ${expandStyles()}
-  ${expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? fg('platform_editor_find_and_replace_magenta_match') ? findReplaceStylesNewMagenta : findReplaceStylesNewYellow : findReplaceStyles}
+  ${expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? fg('platform_editor_find_and_replace_magenta_match') ? fg('platform_editor_find_and_replace_improvements_1') ? findReplaceStylesNewMagentaNoImportant : findReplaceStylesNewMagenta : findReplaceStylesNewYellow : findReplaceStyles}
   ${textHighlightStyle}
   ${taskDecisionStyles}
 	${taskItemStyles}
   /* Switch between the two icons based on the visual refresh feature gate */
 	${fg('platform-visual-refresh-icons') && decisionIconWithVisualRefresh}
 	${!fg('platform-visual-refresh-icons') && decisionIconWithoutVisualRefresh}
-  ${statusStyles}
+  ${statusStyles()}
   ${statusNodeStyles()}
   ${annotationSharedStyles()}
   ${smartCardStyles()}

package/dist/es2019/ui/ContentStyles/status.js

@@ -3,22 +3,34 @@ import { css } from '@emotion/react';
 import { StatusSharedCssClassName, TableSharedCssClassName } from '@atlaskit/editor-common/styles';
 import { akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, akEditorSelectedBoldBoxShadow, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
 import { fg } from '@atlaskit/platform-feature-flags';
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 const getVisualRefreshStatusStyles = () =>
 // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
-fg('platform-component-visual-refresh') ?
+fg('platform-component-visual-refresh') ? expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1') ? css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values,  @atlaskit/ui-styling-standard/no-imported-style-values
+  [`&.${akEditorSelectedNodeClassName}:not('.search-match-block') .${StatusSharedCssClassName.STATUS_LOZENGE} > span`]: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+    boxShadow: akEditorSelectedBoldBoxShadow
+  }
+}) :
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
 css`
-				&.${akEditorSelectedNodeClassName} .${StatusSharedCssClassName.STATUS_LOZENGE} > span {
-					box-shadow: ${akEditorSelectedBoldBoxShadow};
-				}
-			` :
+					&.${akEditorSelectedNodeClassName} .${StatusSharedCssClassName.STATUS_LOZENGE} > span {
+						box-shadow: ${akEditorSelectedBoldBoxShadow};
+					}
+				` : expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1') ?
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
 css`
-				&.${akEditorSelectedNodeClassName} .${StatusSharedCssClassName.STATUS_LOZENGE} > span {
-					${getSelectionStyles([SelectionStyle.BoxShadow])}
-				}
-			`;
+					&.${akEditorSelectedNodeClassName}:not('.search-match-block') .${StatusSharedCssClassName.STATUS_LOZENGE} > span {
+						${getSelectionStyles([SelectionStyle.BoxShadow])}
+					}
+				` :
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
+css`
+					&.${akEditorSelectedNodeClassName} .${StatusSharedCssClassName.STATUS_LOZENGE} > span {
+						${getSelectionStyles([SelectionStyle.BoxShadow])}
+					}
+				`;
 const getStatusColors = () => fg('platform-component-visual-refresh') ? css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
   '[data-prosemirror-node-name="status"] .lozenge-text': {
@@ -145,7 +157,7 @@ export const statusNodeStyles = () => css`
 `;
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const statusStyles = css`
+export const statusStyles = () => css`
 	.${TableSharedCssClassName.TABLE_CELL_WRAPPER},
 		.${TableSharedCssClassName.TABLE_HEADER_CELL_WRAPPER},
 		[data-layout-section] {
@@ -158,6 +170,7 @@ export const statusStyles = css`
 			}
 		}
 	}
+
 	.${StatusSharedCssClassName.STATUS_CONTAINER} {
 		> span {
 			cursor: pointer;

package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js

@@ -32,7 +32,7 @@ import { embedCardStyles } from './styles/embedCardStyles';
 import { emojiStyles } from './styles/emoji';
 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';
 import { extensionStyles } from './styles/extensionStyles';
-import { findReplaceStyles, findReplaceStylesNewMagenta, findReplaceStylesNewYellow } from './styles/findReplaceStyles';
+import { findReplaceStyles, findReplaceStylesNewMagenta, findReplaceStylesNewMagentaNoImportant, findReplaceStylesNewYellow } from './styles/findReplaceStyles';
 import { firstBlockNodeStyles } from './styles/firstBlockNodeStyles';
 import { firstFloatingToolbarButtonStyles } from './styles/floatingToolbarStyles';
 import { fullPageEditorStyles } from './styles/fullPageEditorStyles';
@@ -44,7 +44,7 @@ import { layoutBaseStyles, layoutBaseStylesAdvanced, layoutBaseStylesFixesUnderN
 import { hyperLinkFloatingToolbarStyles, linkLegacyIconStylesFix, linkStyles, linkStylesOld } from './styles/link';
 import { listsStyles, listsStylesSafariFix } from './styles/list';
 import { mediaAlignmentStyles, mediaGroupStyles, mediaStyles } from './styles/mediaStyles';
-import { mentionsStyles, mentionsSelectionStyles, mentionNodeStyles, mentionsStylesMixin_platform_editor_centre_mention_padding } from './styles/mentions';
+import { mentionsStyles, mentionsSelectionStyles, mentionNodeStyles, mentionsStylesMixin_platform_editor_centre_mention_padding, mentionsSelectionStylesWithSearchMatch } from './styles/mentions';
 import { panelStyles, panelStylesMixin, panelStylesMixin_fg_platform_editor_add_border_for_nested_panel, panelStylesMixin_fg_platform_editor_nested_dnd_styles_changes, panelViewStyles } from './styles/panelStyles';
 import { paragraphStylesOld, paragraphStylesUGCRefreshed } from './styles/paragraphStyles';
 import { placeholderOverflowStyles, placeholderStyles, placeholderTextStyles, placeholderTextStylesMixin_fg_platform_editor_system_fake_text_highlight_colour, placeholderWrapStyles } from './styles/placeholderStyles';
@@ -54,8 +54,8 @@ import { scrollbarStyles } from './styles/scrollbarStyles';
 import { hideCursorWhenHideSelectionStyles, hideSelectionStyles, selectedNodeStyles } from './styles/selectionStyles';
 import { selectionToolbarAnimationStyles } from './styles/selectionToolbarStyles';
 import { shadowStyles } from './styles/shadowStyles';
-import { editorControlsSmartCardStyles, linkingVisualRefreshV1Styles, smartCardStyles, smartLinksInLivePagesStyles, smartLinksInLivePagesStylesOld } from './styles/smartCardStyles';
-import { statusStyles, statusStylesMixin_fg_platform_component_visual_refresh, statusStylesMixin_without_fg_platform_component_visual_refresh } from './styles/statusStyles';
+import { editorControlsSmartCardStyles, linkingVisualRefreshV1Styles, smartCardStyles, smartCardStylesWithSearchMatch, smartLinksInLivePagesStyles, smartLinksInLivePagesStylesOld } from './styles/smartCardStyles';
+import { statusStyles, statusStylesMixin_fg_platform_component_visual_refresh, statusStylesMixin_fg_platform_component_visual_refresh_with_search_match, statusStylesMixin_without_fg_platform_component_visual_refresh, statusStylesMixin_without_fg_platform_component_visual_refresh_with_search_match } from './styles/statusStyles';
 import { tableCommentEditorStyles, tableLayoutFixes } from './styles/tableStyles';
 import { decisionStyles, tasksAndDecisionsStyles, decisionIconWithVisualRefresh, decisionIconWithoutVisualRefresh, taskItemStyles } from './styles/tasksAndDecisionsStyles';
 import { telepointerColorAndCommonStyle, telepointerStyle, telepointerStyleWithInitialOnly } from './styles/telepointerStyles';
@@ -185,9 +185,11 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     expandStylesMixin_without_fg_platform_editor_nested_dnd_styles_changes,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    fg('platform-visual-refresh-icons') && expandStylesMixin_fg_platform_visual_refresh_icons, expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? fg('platform_editor_find_and_replace_magenta_match') ?
+    fg('platform-visual-refresh-icons') && expandStylesMixin_fg_platform_visual_refresh_icons, expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? fg('platform_editor_find_and_replace_magenta_match') ? fg('platform_editor_find_and_replace_improvements_1')
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    findReplaceStylesNewMagenta :
+    ? findReplaceStylesNewMagentaNoImportant
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    : findReplaceStylesNewMagenta :
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     findReplaceStylesNewYellow :
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -203,15 +205,21 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     decisionIconWithoutVisualRefresh,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    statusStyles, fg('platform-component-visual-refresh') ?
+    statusStyles, fg('platform-component-visual-refresh') ? expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1')
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    ? statusStylesMixin_fg_platform_component_visual_refresh_with_search_match
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    : statusStylesMixin_fg_platform_component_visual_refresh : expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1')
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    statusStylesMixin_fg_platform_component_visual_refresh :
+    ? statusStylesMixin_without_fg_platform_component_visual_refresh_with_search_match
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    statusStylesMixin_without_fg_platform_component_visual_refresh,
+    : statusStylesMixin_without_fg_platform_component_visual_refresh,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    annotationStyles,
+    annotationStyles, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1')
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    smartCardStyles, expValEqualsNoExposure('platform_editor_controls', 'cohort', 'variant1') && fg('platform_editor_controls_patch_15') &&
+    ? smartCardStylesWithSearchMatch
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    : smartCardStyles, expValEqualsNoExposure('platform_editor_controls', 'cohort', 'variant1') && fg('platform_editor_controls_patch_15') &&
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     editorControlsSmartCardStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -305,9 +313,11 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     firstBlockNodeStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    mentionNodeStyles,
+    mentionNodeStyles, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1')
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    ? mentionsSelectionStylesWithSearchMatch
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    mentionsSelectionStyles, fg('platform_editor_centre_mention_padding') &&
+    : mentionsSelectionStyles, fg('platform_editor_centre_mention_padding') &&
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     mentionsStylesMixin_platform_editor_centre_mention_padding,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values

package/dist/es2019/ui/EditorContentContainer/styles/findReplaceStyles.js

@@ -442,6 +442,231 @@ export const findReplaceStylesNewMagenta = css({
   },
   /** Dark mode */
 
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-expand-title.search-match-dark > .ak-editor-expand__title-container > .ak-editor-expand__input-container': {
+    boxShadow: `
+		inset 0 0 0 1px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"},
+		inset 0 0 0 5px ${"var(--ds-background-accent-magenta-bolder-pressed, #50253F)"}
+		`,
+    backgroundColor: "var(--ds-background-accent-magenta-bolder-pressed, #50253F)",
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.ak-editor-expand__title-input': {
+      color: "var(--ds-text-inverse, #FFFFFF)"
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-expand-title.selected-search-match.search-match-dark > .ak-editor-expand__title-container > .ak-editor-expand__input-container': {
+    boxShadow: `
+		inset 0 0 0 1px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"},
+		inset 0 0 0 5px ${"var(--ds-background-accent-magenta-bolder-hovered, #943D73)"}
+		`,
+    backgroundColor: "var(--ds-background-accent-magenta-bolder-hovered, #943D73)"
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const findReplaceStylesNewMagentaNoImportant = css({
+  /** Text match styles */
+
+  /** Light mode */
+
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-text': {
+    borderRadius: "var(--ds-space-050, 4px)",
+    boxShadow: `
+		inset 0 0 0 1px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"},
+		inset 0 0 0 5px ${"var(--ds-background-accent-magenta-subtler, #FDD0EC)"}
+		`,
+    // we need to use !important here as we need to override inline selection styles
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+    backgroundColor: `${"var(--ds-background-accent-magenta-subtler, #FDD0EC)"} !important`,
+    color: "var(--ds-text, #172B4D)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-text.selected-search-match': {
+    boxShadow: `
+		inset 0 0 0 1px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"},
+		inset 0 0 0 5px ${"var(--ds-background-accent-magenta-subtlest-pressed, #F797D2)"}
+		`,
+    // we need to use !important here as we need to override inline selection styles
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+    backgroundColor: `${"var(--ds-background-accent-magenta-subtlest-pressed, #F797D2)"} !important`
+  },
+  /** Dark mode */
+
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-text.search-match-dark': {
+    boxShadow: `
+		inset 0 0 0 1px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"},
+		inset 0 0 0 5px ${"var(--ds-background-accent-magenta-bolder-pressed, #50253F)"}
+		`,
+    // we need to use !important here as we need to override inline selection styles
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+    backgroundColor: `${"var(--ds-background-accent-magenta-bolder-pressed, #50253F)"} !important`,
+    color: "var(--ds-text-inverse, #FFFFFF)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-text.selected-search-match.search-match-dark': {
+    boxShadow: `
+		inset 0 0 0 1px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"},
+		inset 0 0 0 5px ${"var(--ds-background-accent-magenta-bolder-hovered, #943D73)"}
+		`,
+    // we need to use !important here as we need to override inline selection styles
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+    backgroundColor: `${"var(--ds-background-accent-magenta-bolder-hovered, #943D73)"} !important`
+  },
+  /** Block match styles */
+
+  /** Light mode */
+
+  /** Without node selection */
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-block': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+      boxShadow: `
+			inset 0 0 0 1px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"},
+			inset 0 0 0 5px ${"var(--ds-background-accent-magenta-subtler, #FDD0EC)"}
+			`
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>a, .lozenge-wrapper, .editor-mention-primitive, .date-lozenger-container>span': {
+      boxShadow: `0px 0px 0px 4px ${"var(--ds-background-accent-magenta-subtler, #FDD0EC)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"}`
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-block.search-match-block-selected': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+      boxShadow: `
+			inset 0 0 0 1px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"},
+			inset 0 0 0 4px ${"var(--ds-background-accent-magenta-subtlest-pressed, #F797D2)"}
+			`
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>a, .lozenge-wrapper, .editor-mention-primitive, .date-lozenger-container>span': {
+      boxShadow: `0px 0px 0px 4px ${"var(--ds-background-accent-magenta-subtlest-pressed, #F797D2)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"}`
+    }
+  },
+  /** With node selection */
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-block.ak-editor-selected-node': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>div::after': {
+      boxShadow: `
+			inset 0 0 0 1px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"},
+			inset 0 0 0 5px ${"var(--ds-background-accent-magenta-subtler, #FDD0EC)"},
+			0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
+			`
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>a, .lozenge-wrapper, .editor-mention-primitive, .date-lozenger-container>span': {
+      boxShadow: `0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}, 0px 0px 0px 4px ${"var(--ds-background-accent-magenta-subtler, #FDD0EC)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"}`
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-block.search-match-block-selected.ak-editor-selected-node': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+      boxShadow: `
+			inset 0 0 0 1px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"},
+			inset 0 0 0 4px ${"var(--ds-background-accent-magenta-subtlest-pressed, #F797D2)"},
+			0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
+			`
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>a, .lozenge-wrapper, .editor-mention-primitive, .date-lozenger-container>span': {
+      boxShadow: `0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}, 0px 0px 0px 4px ${"var(--ds-background-accent-magenta-subtlest-pressed, #F797D2)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"}`
+    }
+  },
+  /** Dark mode */
+  /** Without node selection */
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-block.search-match-dark': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+      boxShadow: `
+			inset 0 0 0 1px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"},
+			inset 0 0 0 5px ${"var(--ds-background-accent-magenta-bolder-pressed, #50253F)"}
+			`
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>a, .lozenge-wrapper, .editor-mention-primitive, .date-lozenger-container>span': {
+      boxShadow: `0px 0px 0px 4px ${"var(--ds-background-accent-magenta-bolder-pressed, #50253F)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"}`
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-block.search-match-block-selected.search-match-dark': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+      boxShadow: `
+			inset 0 0 0 1px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"},
+			inset 0 0 0 4px ${"var(--ds-background-accent-magenta-bolder-hovered, #943D73)"}
+			`
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>a, .lozenge-wrapper, .editor-mention-primitive, .date-lozenger-container>span': {
+      boxShadow: `0px 0px 0px 4px ${"var(--ds-background-accent-magenta-bolder-hovered, #943D73)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"}`
+    }
+  },
+  /** With node selection */
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-block.search-match-dark.ak-editor-selected-node': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>div::after': {
+      boxShadow: `
+			inset 0 0 0 1px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"},
+			inset 0 0 0 5px ${"var(--ds-background-accent-magenta-bolder-pressed, #50253F)"},
+			0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
+			`
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>a, .lozenge-wrapper, .editor-mention-primitive, .date-lozenger-container>span': {
+      boxShadow: `0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}, 0px 0px 0px 4px ${"var(--ds-background-accent-magenta-bolder-pressed, #50253F)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"}`
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-block.search-match-block-selected.search-match-dark.ak-editor-selected-node': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+      boxShadow: `
+			inset 0 0 0 1px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"},
+			inset 0 0 0 4px ${"var(--ds-background-accent-magenta-bolder-hovered, #943D73)"},
+			0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
+			`
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.loader-wrapper>a, .lozenge-wrapper, .editor-mention-primitive, .date-lozenger-container>span': {
+      boxShadow: `0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}, 0px 0px 0px 4px ${"var(--ds-background-accent-magenta-bolder-hovered, #943D73)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-magenta-bolder, #AE4787)"}`
+    }
+  },
+  /** Expand title match styles */
+
+  /** Light mode */
+
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-expand-title > .ak-editor-expand__title-container > .ak-editor-expand__input-container': {
+    borderRadius: "var(--ds-space-050, 4px)",
+    boxShadow: `
+		inset 0 0 0 1px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"},
+		inset 0 0 0 5px ${"var(--ds-background-accent-magenta-subtler, #FDD0EC)"}
+		`,
+    backgroundColor: "var(--ds-background-accent-magenta-subtler, #FDD0EC)",
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.ak-editor-expand__title-input': {
+      color: "var(--ds-text, #172B4D)"
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.search-match-expand-title.selected-search-match > .ak-editor-expand__title-container > .ak-editor-expand__input-container': {
+    boxShadow: `
+		inset 0 0 0 1px ${"var(--ds-background-accent-magenta-subtler-pressed, #E774BB)"},
+		inset 0 0 0 5px ${"var(--ds-background-accent-magenta-subtlest-pressed, #F797D2)"}
+		`,
+    backgroundColor: "var(--ds-background-accent-magenta-subtlest-pressed, #F797D2)"
+  },
+  /** Dark mode */
+
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
   '.search-match-expand-title.search-match-dark > .ak-editor-expand__title-container > .ak-editor-expand__input-container': {
     boxShadow: `