@atlaskit/editor-plugin-find-replace 2.7.1 → 2.8.0

package/dist/esm/pm-plugins/utils/index.js

@@ -1,10 +1,13 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import classnames from 'classnames';
 import { timestampToString } from '@atlaskit/editor-common/utils';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { isResolvingMentionProvider } from '@atlaskit/mention/resource';
 import { isPromise, MentionNameStatus } from '@atlaskit/mention/types';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { searchMatchClass, selectedSearchMatchClass } from '../../ui/styles';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { getGlobalTheme } from '@atlaskit/tokens';
+import { searchMatchClass, selectedSearchMatchClass, blockSearchMatchClass, darkModeSearchMatchClass } from '../../ui/styles';
 export function getSelectedText(selection) {
   var text = '';
   var selectedContent = selection.content().content;
@@ -16,18 +19,37 @@ export function getSelectedText(selection) {
 export var createDecorations = function createDecorations(selectedIndex, matches) {
   return matches.map(function (_ref, i) {
     var start = _ref.start,
-      end = _ref.end;
-    return createDecoration(start, end, i === selectedIndex);
+      end = _ref.end,
+      nodeType = _ref.nodeType;
+    return createDecoration(start, end, i === selectedIndex, nodeType);
   });
 };
-export var createDecoration = function createDecoration(start, end, isSelected) {
-  var className = searchMatchClass;
-  if (isSelected) {
-    className += " ".concat(selectedSearchMatchClass);
+var isBlock = function isBlock(nodeType) {
+  return nodeType === 'blockCard' || nodeType === 'embedCard';
+};
+export var createDecoration = function createDecoration(start, end, isSelected, nodeType) {
+  if (expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
+    var _getGlobalTheme = getGlobalTheme(),
+      colorMode = _getGlobalTheme.colorMode;
+    var className = classnames(searchMatchClass, _defineProperty(_defineProperty(_defineProperty({}, selectedSearchMatchClass, isSelected), blockSearchMatchClass, isBlock(nodeType)), darkModeSearchMatchClass, colorMode === 'dark'));
+    if (isBlock(nodeType)) {
+      return Decoration.node(start, end, {
+        class: className
+      });
+    } else {
+      return Decoration.inline(start, end, {
+        class: className
+      });
+    }
+  } else {
+    var _className = searchMatchClass;
+    if (isSelected) {
+      _className += " ".concat(selectedSearchMatchClass);
+    }
+    return Decoration.inline(start, end, {
+      class: _className
+    });
   }
-  return Decoration.inline(start, end, {
-    class: className
-  });
 };
 export function findMatches(_ref2) {
   var content = _ref2.content,
@@ -59,7 +81,8 @@ export function findMatches(_ref2) {
       matches.push({
         start: pos + index,
         end: pos + end,
-        canReplace: fg('platform_editor_find_and_replace_1') ? true : undefined
+        canReplace: expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? true : undefined,
+        nodeType: expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? 'text' : undefined
       });
       index = text.indexOf(searchText, end);
     }
@@ -70,14 +93,8 @@ export function findMatches(_ref2) {
     }
     var pos = textGrouping.pos;
     var text = textGrouping.text;
-    // status text is rendered in all caps regardless so case matching should work if the search text is all caps
-    if (fg('platform_editor_find_and_replace_part_2')) {
-      if (shouldMatchCase) {
-        text = text.toUpperCase();
-      } else {
-        text = text.toLowerCase();
-        searchText = searchText.toLowerCase();
-      }
+    if (shouldMatchCase) {
+      text = text.toUpperCase();
     } else {
       text = text.toLowerCase();
       searchText = searchText.toLowerCase();
@@ -88,11 +105,12 @@ export function findMatches(_ref2) {
       matches.push({
         start: start,
         end: start + nodeSize,
-        canReplace: false
+        canReplace: false,
+        nodeType: 'status'
       });
     }
   };
-  var collectDateOrMentionMatch = function collectDateOrMentionMatch(textGrouping, nodeSize) {
+  var collectNodeMatch = function collectNodeMatch(textGrouping, node) {
     if (!textGrouping) {
       return;
     }
@@ -107,9 +125,37 @@ export function findMatches(_ref2) {
       var start = pos;
       matches.push({
         start: start,
-        end: start + nodeSize,
-        canReplace: false
+        end: start + node.nodeSize,
+        canReplace: false,
+        nodeType: node.type.name
+      });
+    }
+  };
+  var collectCardTitleMatch = function collectCardTitleMatch(node, pos) {
+    var _api$card;
+    var cards = api === null || api === void 0 || (_api$card = api.card) === null || _api$card === void 0 || (_api$card = _api$card.sharedState.currentState()) === null || _api$card === void 0 ? void 0 : _api$card.cards;
+    if (cards) {
+      var relevantCard = cards.find(function (card) {
+        return card.url === node.attrs.url;
       });
+      var title = relevantCard === null || relevantCard === void 0 ? void 0 : relevantCard.title;
+      if (relevantCard) {
+        if (title) {
+          collectNodeMatch({
+            text: title,
+            pos: pos
+          }, node);
+        } else {
+          // when there is no title, e.g. in an error case like unauthorized
+          // the link card just shows the entire url as the title in inline card
+          if (node.type.name === 'inlineCard') {
+            collectNodeMatch({
+              text: node.attrs.url,
+              pos: pos
+            }, node);
+          }
+        }
+      }
     }
   };
   if (searchTextLength > 0) {
@@ -126,7 +172,7 @@ export function findMatches(_ref2) {
       } else {
         collectTextMatch(textGrouping);
         textGrouping = null;
-        if (fg('platform_editor_find_and_replace_1')) {
+        if (expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
           switch (node.type.name) {
             case 'status':
               collectStatusMatch({
@@ -135,43 +181,44 @@ export function findMatches(_ref2) {
               }, node.nodeSize);
               break;
             case 'date':
-              if (fg('platform_editor_find_and_replace_part_2')) {
-                collectDateOrMentionMatch({
-                  text: timestampToString(node.attrs.timestamp, getIntl ? getIntl() : null),
-                  pos: pos
-                }, node.nodeSize);
-              }
+              collectNodeMatch({
+                text: timestampToString(node.attrs.timestamp, getIntl ? getIntl() : null),
+                pos: pos
+              }, node);
               break;
             case 'mention':
-              if (fg('platform_editor_find_and_replace_part_2')) {
-                var text;
-                if (node.attrs.text) {
-                  text = node.attrs.text;
-                } else {
-                  var _api$mention;
-                  // the text may be sanitised from the node for privacy reasons
-                  // so we need to use the mentionProvider to resolve it
-                  var mentionProvider = api === null || api === void 0 || (_api$mention = api.mention) === null || _api$mention === void 0 || (_api$mention = _api$mention.sharedState.currentState()) === null || _api$mention === void 0 ? void 0 : _api$mention.mentionProvider;
-                  if (isResolvingMentionProvider(mentionProvider)) {
-                    var nameDetail = mentionProvider.resolveMentionName(node.attrs.id);
-                    if (isPromise(nameDetail)) {
-                      text = '@...';
+              var text;
+              if (node.attrs.text) {
+                text = node.attrs.text;
+              } else {
+                var _api$mention;
+                // the text may be sanitised from the node for privacy reasons
+                // so we need to use the mentionProvider to resolve it
+                var mentionProvider = api === null || api === void 0 || (_api$mention = api.mention) === null || _api$mention === void 0 || (_api$mention = _api$mention.sharedState.currentState()) === null || _api$mention === void 0 ? void 0 : _api$mention.mentionProvider;
+                if (isResolvingMentionProvider(mentionProvider)) {
+                  var nameDetail = mentionProvider.resolveMentionName(node.attrs.id);
+                  if (isPromise(nameDetail)) {
+                    text = '@...';
+                  } else {
+                    if (nameDetail.status === MentionNameStatus.OK) {
+                      text = "@".concat(nameDetail.name || '');
                     } else {
-                      if (nameDetail.status === MentionNameStatus.OK) {
-                        text = "@".concat(nameDetail.name || '');
-                      } else {
-                        text = '@_|unknown|_';
-                      }
+                      text = '@_|unknown|_';
                     }
                   }
                 }
-                if (text) {
-                  collectDateOrMentionMatch({
-                    text: text,
-                    pos: pos
-                  }, node.nodeSize);
-                }
               }
+              if (text) {
+                collectNodeMatch({
+                  text: text,
+                  pos: pos
+                }, node);
+              }
+              break;
+            case 'inlineCard':
+            case 'blockCard':
+            case 'embedCard':
+              collectCardTitleMatch(node, pos);
               break;
             default:
               break;

package/dist/esm/ui/FindReplace.js

@@ -17,6 +17,7 @@ import React from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import Find from './Find';
 import Replace from './Replace';
 import ReplaceNext from './ReplaceNext';
@@ -146,7 +147,7 @@ var FindReplace = /*#__PURE__*/function (_React$PureComponent) {
           css: ruleStyles,
           id: "replace-hr-element"
         }), fg('editor_a11y_refactor_find_replace_style') ? jsx(ReplaceNext, {
-          canReplace: fg('platform_editor_find_and_replace_1') ? !!isReplaceable : count.total > 0,
+          canReplace: expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? !!isReplaceable : count.total > 0,
           replaceText: replaceText,
           onReplace: onReplace,
           onReplaceAll: onReplaceAll,
@@ -161,7 +162,7 @@ var FindReplace = /*#__PURE__*/function (_React$PureComponent) {
           setFindTyped: this.setFindTyped,
           focusToolbarButton: focusToolbarButton
         }) : jsx(Replace, {
-          canReplace: fg('platform_editor_find_and_replace_1') ? !!isReplaceable : count.total > 0,
+          canReplace: expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? !!isReplaceable : count.total > 0,
           replaceText: replaceText,
           onReplace: onReplace,
           onReplaceAll: onReplaceAll,

package/dist/esm/ui/FindReplaceDropDownOrToolbarButtonWithState.js

@@ -2,7 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useLayoutEffect, useState } from 'react';
 import { TRIGGER_METHOD } from '@atlaskit/editor-common/analytics';
 import { sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { blur, toggleMatchCase } from '../pm-plugins/commands';
 import { activateWithAnalytics, cancelSearchWithAnalytics, findNextWithAnalytics, findPrevWithAnalytics, findWithAnalytics, replaceAllWithAnalytics, replaceWithAnalytics } from '../pm-plugins/commands-with-analytics';
 import FindReplaceDropdown from './FindReplaceDropdown';
@@ -178,8 +178,8 @@ var FindReplaceToolbarButtonWithState = function FindReplaceToolbarButtonWithSta
     findText: findText,
     index: index,
     numMatches: matches.length,
-    isReplaceable: fg('platform_editor_find_and_replace_1') ? (_matches$index = matches[index]) === null || _matches$index === void 0 ? void 0 : _matches$index.canReplace : undefined,
-    numReplaceable: fg('platform_editor_find_and_replace_1') ? matches.filter(function (match) {
+    isReplaceable: expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? (_matches$index = matches[index]) === null || _matches$index === void 0 ? void 0 : _matches$index.canReplace : undefined,
+    numReplaceable: expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? matches.filter(function (match) {
       return match.canReplace === true;
     }).length : undefined,
     replaceText: replaceText,

package/dist/esm/ui/Replace.js

@@ -22,9 +22,9 @@ import { findReplaceMessages as messages } from '@atlaskit/editor-common/message
 import { Label, ValidMessage } from '@atlaskit/form';
 import ChevronDownIcon from '@atlaskit/icon/core/migration/chevron-down--hipchat-chevron-down';
 import ChevronUpIcon from '@atlaskit/icon/core/migration/chevron-up--hipchat-chevron-up';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { Inline, xcss } from '@atlaskit/primitives';
 import Textfield from '@atlaskit/textfield';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { FindReplaceTooltipButton } from './FindReplaceTooltipButton';
 import { nextPreviousItemStyles, orderOneStyles, orderZeroStyles, sectionWrapperJustified, sectionWrapperStyles, sectionWrapperStylesAlternate, textFieldWrapper } from './ui-styles';
 // eslint-disable-next-line @repo/internal/react/no-class-components
@@ -97,7 +97,7 @@ var Replace = /*#__PURE__*/function (_React$PureComponent) {
         _this.setState({
           isHelperMessageVisible: true
         });
-        if (_this.props.count.totalReplaceable && fg('platform_editor_find_and_replace_1')) {
+        if (_this.props.count.totalReplaceable && expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
           _this.triggerSuccessReplacementMessageUpdate(_this.props.count.totalReplaceable);
           _this.setState({
             replaceCount: _this.props.count.totalReplaceable
@@ -297,7 +297,7 @@ var Replace = /*#__PURE__*/function (_React$PureComponent) {
         testId: this.replaceAll,
         id: "replaceAll-button",
         onClick: this.handleReplaceAllClick,
-        isDisabled: fg('platform_editor_find_and_replace_1') ? count.totalReplaceable === 0 : !canReplace
+        isDisabled: expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? count.totalReplaceable === 0 : !canReplace
       }, this.replaceAll))), jsx("div", {
         css: orderZeroStyles
       }, jsx(Button, {

package/dist/esm/ui/ReplaceNext.js

@@ -7,9 +7,9 @@ import { findReplaceMessages as messages } from '@atlaskit/editor-common/message
 import { ValidMessage } from '@atlaskit/form';
 import ChevronDownIcon from '@atlaskit/icon/core/migration/chevron-down--hipchat-chevron-down';
 import ChevronUpIcon from '@atlaskit/icon/core/migration/chevron-up--hipchat-chevron-up';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Inline, Text, xcss } from '@atlaskit/primitives';
 import Textfield from '@atlaskit/textfield';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { FindReplaceTooltipButton } from './FindReplaceTooltipButton';
 var replaceContainerStyles = xcss({
   padding: 'space.100'
@@ -135,7 +135,7 @@ var Replace = function Replace(_ref) {
         replaceText: replaceText
       });
       setIsHelperMessageVisible(true);
-      if (count.totalReplaceable && fg('platform_editor_find_and_replace_1')) {
+      if (count.totalReplaceable && expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
         triggerSuccessReplacementMessageUpdate(count.totalReplaceable);
         setReplaceCount(count.totalReplaceable);
       } else {
@@ -240,7 +240,7 @@ var Replace = function Replace(_ref) {
     testId: replaceAll,
     id: "replaceAll-button",
     onClick: handleReplaceAllClick,
-    isDisabled: fg('platform_editor_find_and_replace_1') ? count.totalReplaceable === 0 : !canReplace
+    isDisabled: expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? count.totalReplaceable === 0 : !canReplace
   }, replaceAll)), /*#__PURE__*/React.createElement(Button, {
     appearance: "subtle",
     testId: closeFindReplaceDialog,

package/dist/esm/ui/styles.js

@@ -10,10 +10,59 @@ import { css } from '@emotion/react';
 import { N40A, N50A, N60A } from '@atlaskit/theme/colors';
 export var searchMatchClass = 'search-match';
 export var selectedSearchMatchClass = 'selected-search-match';
+export var blockSearchMatchClass = 'search-match-block';
+export var darkModeSearchMatchClass = 'search-match-dark';
 export var findReplaceStyles = css(_defineProperty(_defineProperty({}, ".".concat(searchMatchClass), {
   borderRadius: '3px',
   backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
   boxShadow: "var(--ds-shadow-raised, ".concat("0 1px 1px 0 ".concat(N50A, ", 0 0 1px 0 ").concat(N60A), ")") + ', inset 0 0 0 1px ' + "var(--ds-border-input, ".concat("".concat(N40A), ")")
 }), ".".concat(selectedSearchMatchClass), {
   backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
+}));
+export var findReplaceStylesNew = css(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ".".concat(searchMatchClass), {
+  borderRadius: '3px',
+  backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
+  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)")
+}), ".".concat(selectedSearchMatchClass), {
+  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
+}), ".".concat(blockSearchMatchClass), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+    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")
+  }
+}), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+    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")
+  }
+}), ".".concat(blockSearchMatchClass, ".ak-editor-selected-node"), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.loader-wrapper>div::after': {
+    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")
+  }
+}), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".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: "\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")
+  }
+}), ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+    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")
+  }
+}), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
+    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")
+  }
+}), ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.loader-wrapper>div::after': {
+    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")
+  }
+}), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".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: "\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")
+  }
 }));

package/dist/types/findReplacePluginType.d.ts

@@ -2,6 +2,7 @@
 import { TRIGGER_METHOD } from '@atlaskit/editor-common/analytics';
 import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+import type { CardPlugin } from '@atlaskit/editor-plugin-card';
 import type { MentionsPlugin } from '@atlaskit/editor-plugin-mentions';
 import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugin-primary-toolbar';
 import type { FindReplacePluginState, FindReplaceToolbarButtonActionProps } from './types';
@@ -12,7 +13,8 @@ export type FindReplacePluginOptions = {
 export type FindReplacePluginDependencies = [
     OptionalPlugin<AnalyticsPlugin>,
     OptionalPlugin<PrimaryToolbarPlugin>,
-    OptionalPlugin<MentionsPlugin>
+    OptionalPlugin<MentionsPlugin>,
+    OptionalPlugin<CardPlugin>
 ];
 export type FindReplacePlugin = NextEditorPlugin<'findReplace', {
     pluginConfiguration: FindReplacePluginOptions;

package/dist/types/pm-plugins/main.d.ts

@@ -1,7 +1,7 @@
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { ExtractInjectionAPI, PMPluginFactoryParams } from '@atlaskit/editor-common/types';
-import { FindReplacePlugin } from '../findReplacePluginType';
+import type { ExtractInjectionAPI, PMPluginFactoryParams } from '@atlaskit/editor-common/types';
+import type { FindReplacePlugin } from '../findReplacePluginType';
 import type { FindReplacePluginState } from '../types';
 export declare const initialState: FindReplacePluginState;
 export declare const createPlugin: (dispatch: Dispatch, getIntl: PMPluginFactoryParams['getIntl'], api?: ExtractInjectionAPI<FindReplacePlugin>) => SafePlugin<FindReplacePluginState>;

package/dist/types/pm-plugins/utils/index.d.ts

@@ -1,4 +1,4 @@
-import { IntlShape } from 'react-intl-next';
+import type { IntlShape } from 'react-intl-next';
 import { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { Fragment, Node as PmNode, Slice } from '@atlaskit/editor-prosemirror/model';
 import type { ReadonlyTransaction, Selection } from '@atlaskit/editor-prosemirror/state';
@@ -9,11 +9,8 @@ import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
 import { FindReplacePlugin } from '../../findReplacePluginType';
 import type { Match } from '../../types';
 export declare function getSelectedText(selection: TextSelection): string;
-export declare const createDecorations: (selectedIndex: number, matches: {
-    start: number;
-    end: number;
-}[]) => Decoration[];
-export declare const createDecoration: (start: number, end: number, isSelected?: boolean) => Decoration;
+export declare const createDecorations: (selectedIndex: number, matches: Match[]) => Decoration[];
+export declare const createDecoration: (start: number, end: number, isSelected?: Boolean, nodeType?: string) => Decoration;
 type FindMatchesType = {
     content: PmNode | Fragment;
     searchText: string;

package/dist/types/types/index.d.ts

@@ -1,4 +1,4 @@
-import { IntlShape } from 'react-intl-next';
+import type { IntlShape } from 'react-intl-next';
 import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { DecorationSet, EditorView } from '@atlaskit/editor-prosemirror/view';
@@ -49,6 +49,8 @@ export type Match = {
     end: number;
     /** Boolean for whether the match can be replaced */
     canReplace?: boolean;
+    /** Type of the node of the match */
+    nodeType?: string;
 };
 export type TextGrouping = {
     /** The concatenated text across nodes */

package/dist/types/ui/styles.d.ts

@@ -1,3 +1,6 @@
 export declare const searchMatchClass = "search-match";
 export declare const selectedSearchMatchClass = "selected-search-match";
+export declare const blockSearchMatchClass = "search-match-block";
+export declare const darkModeSearchMatchClass = "search-match-dark";
 export declare const findReplaceStyles: import("@emotion/react").SerializedStyles;
+export declare const findReplaceStylesNew: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/findReplacePluginType.d.ts

@@ -2,6 +2,7 @@
 import { TRIGGER_METHOD } from '@atlaskit/editor-common/analytics';
 import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+import type { CardPlugin } from '@atlaskit/editor-plugin-card';
 import type { MentionsPlugin } from '@atlaskit/editor-plugin-mentions';
 import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugin-primary-toolbar';
 import type { FindReplacePluginState, FindReplaceToolbarButtonActionProps } from './types';
@@ -12,7 +13,8 @@ export type FindReplacePluginOptions = {
 export type FindReplacePluginDependencies = [
     OptionalPlugin<AnalyticsPlugin>,
     OptionalPlugin<PrimaryToolbarPlugin>,
-    OptionalPlugin<MentionsPlugin>
+    OptionalPlugin<MentionsPlugin>,
+    OptionalPlugin<CardPlugin>
 ];
 export type FindReplacePlugin = NextEditorPlugin<'findReplace', {
     pluginConfiguration: FindReplacePluginOptions;

package/dist/types-ts4.5/pm-plugins/main.d.ts

@@ -1,7 +1,7 @@
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { ExtractInjectionAPI, PMPluginFactoryParams } from '@atlaskit/editor-common/types';
-import { FindReplacePlugin } from '../findReplacePluginType';
+import type { ExtractInjectionAPI, PMPluginFactoryParams } from '@atlaskit/editor-common/types';
+import type { FindReplacePlugin } from '../findReplacePluginType';
 import type { FindReplacePluginState } from '../types';
 export declare const initialState: FindReplacePluginState;
 export declare const createPlugin: (dispatch: Dispatch, getIntl: PMPluginFactoryParams['getIntl'], api?: ExtractInjectionAPI<FindReplacePlugin>) => SafePlugin<FindReplacePluginState>;

package/dist/types-ts4.5/pm-plugins/utils/index.d.ts

@@ -1,4 +1,4 @@
-import { IntlShape } from 'react-intl-next';
+import type { IntlShape } from 'react-intl-next';
 import { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { Fragment, Node as PmNode, Slice } from '@atlaskit/editor-prosemirror/model';
 import type { ReadonlyTransaction, Selection } from '@atlaskit/editor-prosemirror/state';
@@ -9,11 +9,8 @@ import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
 import { FindReplacePlugin } from '../../findReplacePluginType';
 import type { Match } from '../../types';
 export declare function getSelectedText(selection: TextSelection): string;
-export declare const createDecorations: (selectedIndex: number, matches: {
-    start: number;
-    end: number;
-}[]) => Decoration[];
-export declare const createDecoration: (start: number, end: number, isSelected?: boolean) => Decoration;
+export declare const createDecorations: (selectedIndex: number, matches: Match[]) => Decoration[];
+export declare const createDecoration: (start: number, end: number, isSelected?: Boolean, nodeType?: string) => Decoration;
 type FindMatchesType = {
     content: PmNode | Fragment;
     searchText: string;

package/dist/types-ts4.5/types/index.d.ts

@@ -1,4 +1,4 @@
-import { IntlShape } from 'react-intl-next';
+import type { IntlShape } from 'react-intl-next';
 import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { DecorationSet, EditorView } from '@atlaskit/editor-prosemirror/view';
@@ -49,6 +49,8 @@ export type Match = {
     end: number;
     /** Boolean for whether the match can be replaced */
     canReplace?: boolean;
+    /** Type of the node of the match */
+    nodeType?: string;
 };
 export type TextGrouping = {
     /** The concatenated text across nodes */

package/dist/types-ts4.5/ui/styles.d.ts

@@ -1,3 +1,6 @@
 export declare const searchMatchClass = "search-match";
 export declare const selectedSearchMatchClass = "selected-search-match";
+export declare const blockSearchMatchClass = "search-match-block";
+export declare const darkModeSearchMatchClass = "search-match-dark";
 export declare const findReplaceStyles: import("@emotion/react").SerializedStyles;
+export declare const findReplaceStylesNew: import("@emotion/react").SerializedStyles;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-find-replace",
-	"version": "2.7.1",
+	"version": "2.8.0",
 	"description": "find replace plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -33,31 +33,33 @@
 	},
 	"dependencies": {
 		"@atlaskit/button": "^23.2.0",
-		"@atlaskit/editor-common": "^107.0.0",
+		"@atlaskit/editor-common": "^107.2.0",
 		"@atlaskit/editor-plugin-analytics": "^2.3.0",
+		"@atlaskit/editor-plugin-card": "^6.6.0",
 		"@atlaskit/editor-plugin-mentions": "^4.7.0",
 		"@atlaskit/editor-plugin-primary-toolbar": "^3.2.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/editor-shared-styles": "^3.4.0",
 		"@atlaskit/form": "^12.0.0",
-		"@atlaskit/icon": "^27.0.0",
+		"@atlaskit/icon": "^27.2.0",
 		"@atlaskit/mention": "^24.2.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^14.9.0",
 		"@atlaskit/textfield": "^8.0.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^8.0.0",
-		"@atlaskit/tokens": "^5.3.0",
+		"@atlaskit/tmp-editor-statsig": "^8.2.0",
+		"@atlaskit/tokens": "^5.4.0",
 		"@atlaskit/tooltip": "^20.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
+		"classnames": "^2.2.5",
 		"lodash": "^4.17.21",
 		"raf-schd": "^4.0.3"
 	},
 	"devDependencies": {
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/editor-plugin-block-type": "^5.2.0",
-		"@atlaskit/editor-plugin-text-formatting": "^2.3.0",
+		"@atlaskit/editor-plugin-text-formatting": "^2.4.0",
 		"@testing-library/react": "^13.4.0",
 		"@testing-library/user-event": "^14.4.3",
 		"mockdate": "^3.0.5",
@@ -117,12 +119,6 @@
 		},
 		"editor_a11y_refactor_find_replace_style": {
 			"type": "boolean"
-		},
-		"platform_editor_find_and_replace_1": {
-			"type": "boolean"
-		},
-		"platform_editor_find_and_replace_part_2": {
-			"type": "boolean"
 		}
 	}
 }