diff --git a/wax-prosemirror-components/src/components/findAndReplace/FindAndReplaceTool.js b/wax-prosemirror-components/src/components/findAndReplace/FindAndReplaceTool.js
index 0f721a2c72eede7a8c071fc3f9f72bcb01207eec..9bf82295036dc2b48daeaab28ab5e7c45c0890d6 100644
--- a/wax-prosemirror-components/src/components/findAndReplace/FindAndReplaceTool.js
+++ b/wax-prosemirror-components/src/components/findAndReplace/FindAndReplaceTool.js
@@ -1,40 +1,25 @@
-import React, {
-  useRef,
-  useMemo,
-  useContext,
-  useState,
-  useLayoutEffect,
-} from 'react';
-import { WaxContext } from 'wax-prosemirror-core';
+import React, { useRef, useMemo, useState, useLayoutEffect } from 'react';
+
 import styled from 'styled-components';
 import { grid } from '@pubsweet/ui-toolkit';
 
 import MenuButton from '../../ui/buttons/MenuButton';
 import FindAndReplaceComponent from './FindAndReplaceComponent';
-import useOnClickOutside from '../../helpers/useOnClickOutside';
-
-const FindAndReplaceTool = ({ view = {}, item }) => {
-  const {
-    view: { main },
-    activeViewId,
-  } = useContext(WaxContext);
-  if (item.onlyOnMain) {
-    view = main;
-  }
 
-  const Wrapper = styled.div`
-    font-size: 0;
-    position: relative;
-    z-index: 2;
-  `;
+const Wrapper = styled.div`
+  font-size: 0;
+  position: relative;
+  z-index: 2;
+`;
 
-  const DropWrapper = styled.div`
-    margin-top: ${grid(1)};
-    position: absolute;
-    background: white;
-    top: 32px;
-  `;
+const DropWrapper = styled.div`
+  margin-top: ${grid(1)};
+  position: absolute;
+  background: white;
+  top: 32px;
+`;
 
+const FindAndReplaceTool = ({ view = {}, item }) => {
   const { state } = view;
   const { enable, icon, run, select, title } = item;
   const dropElement = useRef();
diff --git a/wax-prosemirror-components/src/components/findAndReplace/FindComponent.js b/wax-prosemirror-components/src/components/findAndReplace/FindComponent.js
index d0bba955e99ac6c39513b4e3ff9dca9ea92f7803..8e59f3f3dce30eea6ae2b00f5f3395ab0c923fb9 100644
--- a/wax-prosemirror-components/src/components/findAndReplace/FindComponent.js
+++ b/wax-prosemirror-components/src/components/findAndReplace/FindComponent.js
@@ -1,8 +1,9 @@
 /* eslint react/prop-types: 0 */
 
-import React from 'react';
+import React, { useState, useRef, useContext } from 'react';
 import styled from 'styled-components';
 import { grid, th } from '@pubsweet/ui-toolkit';
+import { WaxContext } from 'wax-prosemirror-core';
 import Icon from '../../helpers/Icon';
 
 const Wrapper = styled.div`
@@ -51,14 +52,68 @@ const CloseWrapper = styled.div`
 const ExpandedWrapper = styled.div``;
 
 const FindComponent = ({ close, expand }) => {
-  const onChange = () => {};
+  const {
+    view: { main },
+  } = useContext(WaxContext);
+
+  const {
+    state: { doc },
+  } = main;
+
+  const searchRef = useRef(null);
+  const [searchValue, setsearchValue] = useState('');
+
+  const onChange = () => {
+    setsearchValue(searchRef.current.value);
+    searchDocument();
+  };
+
+  const searchDocument = () => {
+    const results = [];
+    const mergedTextNodes = [];
+    let index = 0;
+
+    doc.descendants((node, pos) => {
+      if (node.isText) {
+        if (mergedTextNodes[index]) {
+          mergedTextNodes[index] = {
+            text: mergedTextNodes[index].text + node.text,
+            pos: mergedTextNodes[index].pos,
+          };
+        } else {
+          mergedTextNodes[index] = {
+            text: node.text,
+            pos,
+          };
+        }
+      } else {
+        index += 1;
+      }
+    });
+
+    mergedTextNodes.forEach(({ text, pos }) => {
+      const search = RegExp(searchValue, 'gui');
+      let m;
+      // eslint-disable-next-line no-cond-assign
+      while ((m = search.exec(text))) {
+        if (m[0] === '') {
+          break;
+        }
+
+        results.push({
+          from: pos + m.index,
+          to: pos + m.index + m[0].length,
+        });
+      }
+    });
+    console.log(results);
+  };
 
   const closeFind = () => {
     close();
   };
 
   const showExpanded = () => {
-    console.log('expanded');
     expand();
   };
 
@@ -66,9 +121,10 @@ const FindComponent = ({ close, expand }) => {
     <Wrapper>
       <SingleRow>
         <SearchInput
+          ref={searchRef}
           type="text"
           placeholder="Find"
-          value=""
+          value={searchValue}
           onChange={onChange}
         />
         <StyledIcon name="navigatePrevious" />