@atlaskit/editor-plugin-find-replace 0.1.0

package/dist/esm/commands.js

@@ -0,0 +1,248 @@
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { FindReplaceActionTypes } from './actions';
+import { createCommand, getPluginState } from './pm-plugins/plugin-factory';
+import { createDecoration, findDecorationFromMatch, findMatches, findSearchIndex, getSelectedText, getSelectionForMatch, nextIndex, prevIndex, removeDecorationsFromSet, removeMatchesFromSet } from './utils';
+import batchDecorations from './utils/batch-decorations';
+import { withScrollIntoView } from './utils/commands';
+export var activate = function activate() {
+  return createCommand(function (state) {
+    var selection = state.selection;
+    var findText;
+    var matches;
+    var index;
+
+    // if user has selected text and hit cmd-f, set that as the keyword
+    if (selection instanceof TextSelection && !selection.empty) {
+      findText = getSelectedText(selection);
+      var _getPluginState = getPluginState(state),
+        shouldMatchCase = _getPluginState.shouldMatchCase;
+      matches = findMatches(state.doc, findText, shouldMatchCase);
+      index = findSearchIndex(selection.from, matches);
+    }
+    return {
+      type: FindReplaceActionTypes.ACTIVATE,
+      findText: findText,
+      matches: matches,
+      index: index
+    };
+  });
+};
+export var find = function find(editorView, containerElement, keyword) {
+  return withScrollIntoView(createCommand(function (state) {
+    var selection = state.selection;
+    var _getPluginState2 = getPluginState(state),
+      shouldMatchCase = _getPluginState2.shouldMatchCase;
+    var matches = keyword !== undefined ? findMatches(state.doc, keyword, shouldMatchCase) : [];
+    var index = findSearchIndex(selection.from, matches);
+
+    // we can't just apply all the decorations to highlight the search results at once
+    // as if there are a lot ProseMirror cries :'(
+    batchDecorations.applyAllSearchDecorations(editorView, containerElement, function (decorations) {
+      return addDecorations(decorations)(editorView.state, editorView.dispatch);
+    }, function (decorations) {
+      return removeDecorations(decorations)(editorView.state, editorView.dispatch);
+    });
+    return {
+      type: FindReplaceActionTypes.FIND,
+      findText: keyword || '',
+      matches: matches,
+      index: index
+    };
+  }, function (tr, state) {
+    var selection = state.selection;
+    var _getPluginState3 = getPluginState(state),
+      shouldMatchCase = _getPluginState3.shouldMatchCase;
+    var matches = keyword !== undefined ? findMatches(state.doc, keyword, shouldMatchCase) : [];
+    if (matches.length > 0) {
+      var index = findSearchIndex(selection.from, matches);
+      return tr.setSelection(getSelectionForMatch(tr.selection, tr.doc, index, matches));
+    }
+    return tr;
+  }));
+};
+export var findNext = function findNext() {
+  return withScrollIntoView(createCommand(function (state) {
+    return findInDirection(state, 'next');
+  }, function (tr, state) {
+    var _getPluginState4 = getPluginState(state),
+      matches = _getPluginState4.matches,
+      index = _getPluginState4.index;
+    // can't use index from plugin state because if the cursor has moved, it will still be the
+    // OLD index (the find next operation should look for the first match forward starting
+    // from the current cursor position)
+    var searchIndex = findSearchIndex(state.selection.from, matches);
+    if (searchIndex === index) {
+      // cursor has not moved, so we just want to find the next in matches array
+      searchIndex = nextIndex(searchIndex, matches.length);
+    }
+    return tr.setSelection(getSelectionForMatch(tr.selection, tr.doc, searchIndex, matches));
+  }));
+};
+export var findPrevious = function findPrevious() {
+  return withScrollIntoView(createCommand(function (state) {
+    return findInDirection(state, 'previous');
+  }, function (tr, state) {
+    var _getPluginState5 = getPluginState(state),
+      matches = _getPluginState5.matches;
+    // can't use index from plugin state because if the cursor has moved, it will still be the
+    // OLD index (the find prev operation should look for the first match backward starting
+    // from the current cursor position)
+    var searchIndex = findSearchIndex(state.selection.from, matches, true);
+    return tr.setSelection(getSelectionForMatch(tr.selection, tr.doc, searchIndex, matches));
+  }));
+};
+var findInDirection = function findInDirection(state, dir) {
+  var pluginState = getPluginState(state);
+  var matches = pluginState.matches,
+    findText = pluginState.findText;
+  var decorationSet = pluginState.decorationSet,
+    index = pluginState.index;
+  if (findText) {
+    var searchIndex = findSearchIndex(state.selection.from, matches, dir === 'previous');
+    // compare index from plugin state and index of first match forward from cursor position
+    if (index === searchIndex) {
+      // normal case, cycling through matches
+      index = dir === 'next' ? nextIndex(index, matches.length) : prevIndex(index, matches.length);
+    } else {
+      // cursor has moved
+      index = searchIndex;
+    }
+    decorationSet = updateSelectedHighlight(state, index);
+  }
+  return {
+    type: dir === 'next' ? FindReplaceActionTypes.FIND_NEXT : FindReplaceActionTypes.FIND_PREVIOUS,
+    index: index,
+    decorationSet: decorationSet
+  };
+};
+export var replace = function replace(replaceText) {
+  return withScrollIntoView(createCommand(function (state) {
+    var pluginState = getPluginState(state);
+    var findText = pluginState.findText;
+    var decorationSet = pluginState.decorationSet,
+      matches = pluginState.matches,
+      index = pluginState.index;
+    decorationSet = updateSelectedHighlight(state, nextIndex(index, matches.length));
+    if (replaceText.toLowerCase().indexOf(findText.toLowerCase()) === -1) {
+      decorationSet = removeMatchesFromSet(decorationSet, [matches[index]], state.doc);
+      matches.splice(index, 1);
+      if (index > matches.length - 1) {
+        index = 0;
+      }
+    } else {
+      index = nextIndex(index, matches.length);
+    }
+    return {
+      type: FindReplaceActionTypes.REPLACE,
+      replaceText: replaceText,
+      decorationSet: decorationSet,
+      matches: matches,
+      index: index
+    };
+  }, function (tr, state) {
+    var _getPluginState6 = getPluginState(state),
+      matches = _getPluginState6.matches,
+      index = _getPluginState6.index,
+      findText = _getPluginState6.findText;
+    if (matches[index]) {
+      var _matches$index = matches[index],
+        start = _matches$index.start,
+        end = _matches$index.end;
+      var newIndex = nextIndex(index, matches.length);
+      tr.insertText(replaceText, start, end).setSelection(getSelectionForMatch(tr.selection, tr.doc, newIndex, matches, newIndex === 0 ? 0 : replaceText.length - findText.length));
+    }
+    return tr;
+  }));
+};
+export var replaceAll = function replaceAll(replaceText) {
+  return createCommand({
+    type: FindReplaceActionTypes.REPLACE_ALL,
+    replaceText: replaceText,
+    decorationSet: DecorationSet.empty,
+    matches: [],
+    index: 0
+  }, function (tr, state) {
+    var pluginState = getPluginState(state);
+    pluginState.matches.forEach(function (match) {
+      tr.insertText(replaceText, tr.mapping.map(match.start), tr.mapping.map(match.end));
+    });
+    tr.setMeta('scrollIntoView', false);
+    return tr;
+  });
+};
+export var addDecorations = function addDecorations(decorations) {
+  return createCommand(function (state) {
+    var _getPluginState7 = getPluginState(state),
+      decorationSet = _getPluginState7.decorationSet;
+    return {
+      type: FindReplaceActionTypes.UPDATE_DECORATIONS,
+      decorationSet: decorationSet.add(state.doc, decorations)
+    };
+  });
+};
+export var removeDecorations = function removeDecorations(decorations) {
+  return createCommand(function (state) {
+    var _getPluginState8 = getPluginState(state),
+      decorationSet = _getPluginState8.decorationSet;
+    return {
+      type: FindReplaceActionTypes.UPDATE_DECORATIONS,
+      decorationSet: removeDecorationsFromSet(decorationSet, decorations, state.doc)
+    };
+  });
+};
+export var cancelSearch = function cancelSearch() {
+  return createCommand(function () {
+    batchDecorations.stop();
+    return {
+      type: FindReplaceActionTypes.CANCEL
+    };
+  });
+};
+export var blur = function blur() {
+  return createCommand({
+    type: FindReplaceActionTypes.BLUR
+  });
+};
+export var toggleMatchCase = function toggleMatchCase() {
+  return createCommand({
+    type: FindReplaceActionTypes.TOGGLE_MATCH_CASE
+  });
+};
+var updateSelectedHighlight = function updateSelectedHighlight(state, nextSelectedIndex) {
+  var _getPluginState9 = getPluginState(state),
+    decorationSet = _getPluginState9.decorationSet,
+    index = _getPluginState9.index,
+    matches = _getPluginState9.matches;
+  var currentSelectedMatch = matches[index];
+  var nextSelectedMatch = matches[nextSelectedIndex];
+  if (index === nextSelectedIndex) {
+    return decorationSet;
+  }
+  var currentSelectedDecoration = findDecorationFromMatch(decorationSet, currentSelectedMatch);
+  var nextSelectedDecoration = findDecorationFromMatch(decorationSet, nextSelectedMatch);
+
+  // Update decorations so the current selected match becomes a normal match
+  // and the next selected gets the selected styling
+  var decorationsToRemove = [];
+  if (currentSelectedDecoration) {
+    decorationsToRemove.push(currentSelectedDecoration);
+  }
+  if (nextSelectedDecoration) {
+    decorationsToRemove.push(nextSelectedDecoration);
+  }
+  if (decorationsToRemove.length > 0) {
+    // removeDecorationsFromSet depends on decorations being pre-sorted
+    decorationsToRemove.sort(function (a, b) {
+      return a.from < b.from ? -1 : 1;
+    });
+    decorationSet = removeDecorationsFromSet(decorationSet, decorationsToRemove, state.doc);
+  }
+  if (currentSelectedMatch) {
+    decorationSet = decorationSet.add(state.doc, [createDecoration(currentSelectedMatch.start, currentSelectedMatch.end)]);
+  }
+  if (nextSelectedMatch) {
+    decorationSet = decorationSet.add(state.doc, [createDecoration(nextSelectedMatch.start, nextSelectedMatch.end, true)]);
+  }
+  return decorationSet;
+};

package/dist/esm/index.js

@@ -0,0 +1 @@
+export { findReplacePlugin } from './plugin';

package/dist/esm/plugin.js

@@ -0,0 +1,86 @@
+import React from 'react';
+import FindReplaceToolbarButtonWithState from './FindReplaceToolbarButtonWithState';
+import keymapPlugin from './pm-plugins/keymap';
+import { createPlugin } from './pm-plugins/main';
+import { findReplacePluginKey } from './pm-plugins/plugin-key';
+export var findReplacePlugin = function findReplacePlugin(_ref) {
+  var _api$featureFlags;
+  var props = _ref.config,
+    api = _ref.api;
+  var featureFlags = (api === null || api === void 0 || (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState()) || {};
+  return {
+    name: 'findReplace',
+    pmPlugins: function pmPlugins() {
+      return [{
+        name: 'findReplace',
+        plugin: function plugin(_ref2) {
+          var dispatch = _ref2.dispatch;
+          return createPlugin(dispatch);
+        }
+      }, {
+        name: 'findReplaceKeymap',
+        plugin: function plugin() {
+          var _api$analytics;
+          return keymapPlugin(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions);
+        }
+      }];
+    },
+    getSharedState: function getSharedState(editorState) {
+      if (!editorState) {
+        return undefined;
+      }
+      return findReplacePluginKey.getState(editorState) || undefined;
+    },
+    actions: {
+      getToolbarButton: function getToolbarButton(_ref3) {
+        var popupsBoundariesElement = _ref3.popupsBoundariesElement,
+          popupsMountPoint = _ref3.popupsMountPoint,
+          popupsScrollableElement = _ref3.popupsScrollableElement,
+          editorView = _ref3.editorView,
+          containerElement = _ref3.containerElement,
+          dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent,
+          isToolbarReducedSpacing = _ref3.isToolbarReducedSpacing;
+        return /*#__PURE__*/React.createElement(FindReplaceToolbarButtonWithState, {
+          popupsBoundariesElement: popupsBoundariesElement,
+          popupsMountPoint: popupsMountPoint,
+          popupsScrollableElement: popupsScrollableElement,
+          editorView: editorView,
+          containerElement: containerElement,
+          dispatchAnalyticsEvent: dispatchAnalyticsEvent
+          // `allowMatchCase` comes through the preset, but not the feature flags
+          // prop with the `ComposableEditor` - grab the FFs from the editor API
+          // instead until we clean this up.
+          ,
+          featureFlags: featureFlags,
+          isToolbarReducedSpacing: isToolbarReducedSpacing,
+          api: api
+        });
+      }
+    },
+    primaryToolbarComponent: function primaryToolbarComponent(_ref4) {
+      var popupsBoundariesElement = _ref4.popupsBoundariesElement,
+        popupsMountPoint = _ref4.popupsMountPoint,
+        popupsScrollableElement = _ref4.popupsScrollableElement,
+        isToolbarReducedSpacing = _ref4.isToolbarReducedSpacing,
+        editorView = _ref4.editorView,
+        containerElement = _ref4.containerElement,
+        dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent;
+      if (props !== null && props !== void 0 && props.twoLineEditorToolbar) {
+        return null;
+      } else {
+        return /*#__PURE__*/React.createElement(FindReplaceToolbarButtonWithState, {
+          popupsBoundariesElement: popupsBoundariesElement,
+          popupsMountPoint: popupsMountPoint,
+          popupsScrollableElement: popupsScrollableElement,
+          isToolbarReducedSpacing: isToolbarReducedSpacing,
+          editorView: editorView,
+          containerElement: containerElement,
+          dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+          takeFullWidth: props === null || props === void 0 ? void 0 : props.takeFullWidth,
+          featureFlags: featureFlags,
+          api: api
+        });
+      }
+    }
+  };
+};

package/dist/esm/pm-plugins/keymap.js

@@ -0,0 +1,18 @@
+import { TRIGGER_METHOD } from '@atlaskit/editor-common/analytics';
+import { bindKeymapWithCommand, find as findKeymap } from '@atlaskit/editor-common/keymaps';
+import { keymap } from '@atlaskit/editor-prosemirror/keymap';
+import { activateWithAnalytics } from '../commands-with-analytics';
+var activateFindReplace = function activateFindReplace(editorAnalyticsAPI) {
+  return function (state, dispatch) {
+    activateWithAnalytics(editorAnalyticsAPI)({
+      triggerMethod: TRIGGER_METHOD.SHORTCUT
+    })(state, dispatch);
+    return true;
+  };
+};
+var keymapPlugin = function keymapPlugin(editorAnalyticsAPI) {
+  var list = {};
+  bindKeymapWithCommand(findKeymap.common, activateFindReplace(editorAnalyticsAPI), list);
+  return keymap(list);
+};
+export default keymapPlugin;

package/dist/esm/pm-plugins/main.js

@@ -0,0 +1,33 @@
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { createPluginState, getPluginState } from './plugin-factory';
+import { findReplacePluginKey } from './plugin-key';
+export var initialState = {
+  isActive: false,
+  shouldFocus: false,
+  findText: '',
+  replaceText: '',
+  index: 0,
+  matches: [],
+  decorationSet: DecorationSet.empty,
+  shouldMatchCase: false
+};
+export var createPlugin = function createPlugin(dispatch) {
+  return new SafePlugin({
+    key: findReplacePluginKey,
+    state: createPluginState(dispatch, function () {
+      return initialState;
+    }),
+    props: {
+      decorations: function decorations(state) {
+        var _getPluginState = getPluginState(state),
+          isActive = _getPluginState.isActive,
+          findText = _getPluginState.findText,
+          decorationSet = _getPluginState.decorationSet;
+        if (isActive && findText) {
+          return decorationSet;
+        }
+      }
+    }
+  });
+};

package/dist/esm/pm-plugins/plugin-factory.js

@@ -0,0 +1,104 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { pluginFactory, stepHasSlice } from '@atlaskit/editor-common/utils';
+import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import reducer from '../reducer';
+import { createDecorations, findDecorationFromMatch, findMatches, findSearchIndex, isMatchAffectedByStep, removeDecorationsFromSet, removeMatchesFromSet } from '../utils';
+import { findUniqueItemsIn } from '../utils/array'; // TODO: move into index export
+
+import { initialState } from './main';
+import { findReplacePluginKey } from './plugin-key';
+var handleDocChanged = function handleDocChanged(tr, pluginState) {
+  var isActive = pluginState.isActive,
+    findText = pluginState.findText;
+  if (!isActive || !findText) {
+    return pluginState;
+  }
+  if (!tr.steps.find(stepHasSlice)) {
+    return pluginState;
+  }
+  var index = pluginState.index,
+    decorationSet = pluginState.decorationSet,
+    matches = pluginState.matches,
+    shouldMatchCase = pluginState.shouldMatchCase;
+  var newMatches = findMatches(tr.doc, findText, shouldMatchCase);
+  decorationSet = decorationSet.map(tr.mapping, tr.doc);
+  var numDecorations = decorationSet.find().length;
+  var mappedMatches = matches.map(function (match) {
+    return {
+      start: tr.mapping.map(match.start),
+      end: tr.mapping.map(match.end)
+    };
+  });
+  var matchesToAdd = [];
+  var matchesToDelete = [];
+  if (newMatches.length > 0 && numDecorations === 0) {
+    matchesToAdd = newMatches;
+  } else if (newMatches.length === 0 && numDecorations > 0) {
+    decorationSet = DecorationSet.empty;
+  } else if (newMatches.length > 0 || numDecorations > 0) {
+    // go through tr steps and find any new matches from user adding content or
+    // any dead matches from user deleting content
+    tr.steps.forEach(function (step) {
+      if (stepHasSlice(step)) {
+        // add all matches that are between the affected positions and don't already have
+        // corresponding decorations
+        matchesToAdd = [].concat(_toConsumableArray(matchesToAdd), _toConsumableArray(newMatches.filter(function (match) {
+          return isMatchAffectedByStep(match, step, tr) && !findDecorationFromMatch(decorationSet, match);
+        })));
+
+        // delete any matches that are missing from the newMatches array and have a
+        // corresponding decoration
+        matchesToDelete = [].concat(_toConsumableArray(matchesToDelete), _toConsumableArray(findUniqueItemsIn(mappedMatches.filter(function (match) {
+          return isMatchAffectedByStep(match, step, tr) && !!findDecorationFromMatch(decorationSet, match);
+        }), newMatches, function (firstMatch, secondMatch) {
+          return firstMatch.start === secondMatch.start && firstMatch.end === secondMatch.end;
+        })));
+      }
+    });
+  }
+
+  // update decorations if matches changed following document update
+  if (matchesToDelete.length > 0) {
+    var decorationsToDelete = matchesToDelete.reduce(function (decorations, match) {
+      return [].concat(_toConsumableArray(decorations), _toConsumableArray(decorationSet.find(match.start, match.end)));
+    }, []);
+    decorationSet = removeDecorationsFromSet(decorationSet, decorationsToDelete, tr.doc);
+  }
+  if (matchesToAdd.length > 0) {
+    decorationSet = decorationSet.add(tr.doc, createDecorations(tr.selection.from, matchesToAdd));
+  }
+
+  // update selected match if it has changed
+  var newIndex = index;
+  var selectedMatch = mappedMatches[index];
+  if (selectedMatch) {
+    newIndex = newMatches.findIndex(function (match) {
+      return match.start === selectedMatch.start;
+    });
+  }
+  if (newIndex === undefined || newIndex === -1) {
+    newIndex = findSearchIndex(tr.selection.from, newMatches);
+  }
+  var newSelectedMatch = newMatches[newIndex];
+  decorationSet = removeMatchesFromSet(decorationSet, [selectedMatch, newSelectedMatch], tr.doc);
+  if (newSelectedMatch) {
+    decorationSet = decorationSet.add(tr.doc, createDecorations(0, [newSelectedMatch]));
+  }
+  return _objectSpread(_objectSpread({}, pluginState), {}, {
+    matches: newMatches,
+    index: newIndex,
+    decorationSet: decorationSet
+  });
+};
+var _pluginFactory = pluginFactory(findReplacePluginKey, reducer(function () {
+    return initialState;
+  }), {
+    onDocChanged: handleDocChanged
+  }),
+  createCommand = _pluginFactory.createCommand,
+  getPluginState = _pluginFactory.getPluginState,
+  createPluginState = _pluginFactory.createPluginState;
+export { createCommand, getPluginState, createPluginState };

package/dist/esm/pm-plugins/plugin-key.js

@@ -0,0 +1,2 @@
+import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+export var findReplacePluginKey = new PluginKey('findReplace');

package/dist/esm/reducer.js

@@ -0,0 +1,54 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { FindReplaceActionTypes } from './actions';
+var reducer = function reducer(getInitialState) {
+  return function (state, action) {
+    switch (action.type) {
+      case FindReplaceActionTypes.ACTIVATE:
+      case FindReplaceActionTypes.FIND:
+        return _objectSpread(_objectSpread({}, state), {}, {
+          isActive: true,
+          shouldFocus: action.type === FindReplaceActionTypes.ACTIVATE,
+          findText: action.findText !== undefined ? action.findText : state.findText,
+          matches: action.matches || state.matches,
+          index: action.index !== undefined ? action.index : state.index
+        });
+      case FindReplaceActionTypes.UPDATE_DECORATIONS:
+        return _objectSpread(_objectSpread({}, state), {}, {
+          decorationSet: action.decorationSet
+        });
+      case FindReplaceActionTypes.FIND_NEXT:
+        return _objectSpread(_objectSpread({}, state), {}, {
+          index: action.index,
+          decorationSet: action.decorationSet
+        });
+      case FindReplaceActionTypes.FIND_PREVIOUS:
+        return _objectSpread(_objectSpread({}, state), {}, {
+          index: action.index,
+          decorationSet: action.decorationSet
+        });
+      case FindReplaceActionTypes.REPLACE:
+      case FindReplaceActionTypes.REPLACE_ALL:
+        return _objectSpread(_objectSpread({}, state), {}, {
+          replaceText: action.replaceText,
+          decorationSet: action.decorationSet,
+          matches: action.matches,
+          index: action.index
+        });
+      case FindReplaceActionTypes.CANCEL:
+        return getInitialState();
+      case FindReplaceActionTypes.BLUR:
+        return _objectSpread(_objectSpread({}, state), {}, {
+          shouldFocus: false
+        });
+      case FindReplaceActionTypes.TOGGLE_MATCH_CASE:
+        return _objectSpread(_objectSpread({}, state), {}, {
+          shouldMatchCase: !state.shouldMatchCase
+        });
+      default:
+        return state;
+    }
+  };
+};
+export default reducer;

package/dist/esm/styles.js

@@ -0,0 +1,11 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+var _templateObject;
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage/preview */
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
+
+// TODO: https://product-fabric.atlassian.net/browse/DSP-4290
+import { css } from '@emotion/react';
+import { B200, B75 } from '@atlaskit/theme/colors';
+export var searchMatchClass = 'search-match';
+export var selectedSearchMatchClass = 'selected-search-match';
+export var findReplaceStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    background-color: ", ";\n  }\n\n  .", " {\n    background-color: ", ";\n    color: white;\n  }\n"])), searchMatchClass, B75, selectedSearchMatchClass, B200);

package/dist/esm/types.js

@@ -0,0 +1 @@
+export {};