diff --git a/src/index.js b/src/index.js
index 70055bd..551ec8d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,20 +1,9 @@
 import { registerFormatType, toggleFormat, insert } from '@wordpress/rich-text';
-import { Fragment, useEffect, useState } from '@wordpress/element';
-import {
-	BlockControls,
-	RichTextShortcut,
-	store as blockEditorStore,
-} from '@wordpress/block-editor';
+import { Fragment } from '@wordpress/element';
+import { BlockControls, RichTextShortcut } from '@wordpress/block-editor';
 import { Popover, ToolbarButton, ToolbarGroup } from '@wordpress/components';
 import { applyFilters } from '@wordpress/hooks';
 import { displayShortcut } from '@wordpress/keycodes';
-import {
-	select,
-	useSelect,
-	dispatch,
-	createReduxStore,
-	register,
-} from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 
 import { CharacterMap } from 'react-character-map';
@@ -35,55 +24,6 @@ const type = `special-characters/${ name }`;
 let anchorRange;
 let anchorRect;
 
-const DEFAULT_STATE = {
-	clientId: '',
-	originalContent: '',
-};
-
-const caretDataStore = createReduxStore( 'caret-data-store', {
-	reducer( state = DEFAULT_STATE, action ) {
-		switch ( action.type ) {
-			case 'SET_CLIENT_ID':
-				return {
-					...state,
-					clientId: action.clientId,
-				};
-
-			case 'SET_ORIGINAL_CONTENT':
-				return {
-					...state,
-					originalContent: action.originalContent,
-				};
-		}
-
-		return state;
-	},
-	actions: {
-		setClientId( clientId ) {
-			return {
-				type: 'SET_CLIENT_ID',
-				clientId,
-			};
-		},
-		setOriginalContent( originalContent ) {
-			return {
-				type: 'SET_ORIGINAL_CONTENT',
-				originalContent,
-			};
-		},
-	},
-	selectors: {
-		getClientId( state ) {
-			return state.clientId;
-		},
-		getOriginalContent( state ) {
-			return state.originalContent;
-		},
-	},
-} );
-
-register( caretDataStore );
-
 /**
  * Register the "Format Type" to create the character inserter.
  */
@@ -102,72 +42,7 @@ registerFormatType( type, {
 	 * @param {Function}    props.onChange   Event handler to detect range selection.
 	 * @param {HTMLElement} props.contentRef The editable element.
 	 */
-	edit: function Edit( { isActive, value, onChange, contentRef } ) {
-		const [ inActiveBySelection, setInactiveBySelection ] =
-			useState( false );
-		const { start, end, selectedBlock } = useSelect( ( __select ) => {
-			return {
-				start: __select( blockEditorStore ).getSelectionStart().offset,
-				end: __select( blockEditorStore ).getSelectionEnd().offset,
-				selectedBlock: __select( blockEditorStore ).getSelectedBlock(),
-			};
-		} );
-
-		useEffect( () => {
-			const content = selectedBlock.attributes.content.replace(
-				/<insertspecialcharacters>|<\/insertspecialcharacters>/g,
-				''
-			);
-			dispatch( caretDataStore ).setClientId( selectedBlock.clientId );
-
-			const preBreak = content.substring( 0, start );
-
-			if ( ( isActive || inActiveBySelection ) && start - end === 0 ) {
-				dispatch( caretDataStore ).setOriginalContent( content );
-				const postBreak = content.substring( start );
-				const postBreakFirstChar = postBreak.substring( 0, 1 );
-				const postBreakWithoutFirstChar = postBreak.substring( 1 );
-
-				if ( contentRef && contentRef.current ) {
-					contentRef.current.innerHTML =
-						preBreak +
-						`<span class="insert-special-character__faux-caret">${ postBreakFirstChar }</span>` +
-						postBreakWithoutFirstChar;
-				}
-			} else if (
-				( isActive || inActiveBySelection ) &&
-				end - start > 0
-			) {
-				dispatch( caretDataStore ).setOriginalContent( content );
-				const selectedText = content.substring( start, end );
-				const preSelectText = content.substring( 0, start );
-				const postSelectText = content.substring( end );
-
-				if ( contentRef && contentRef.current ) {
-					contentRef.current.innerHTML =
-						preSelectText +
-						`<span class="insert-special-character__faux-selection">${ selectedText }</span>` +
-						postSelectText;
-				}
-			}
-
-			return () => {
-				const storedClientId = select( caretDataStore ).getClientId();
-
-				if ( selectedBlock.clientId !== storedClientId ) {
-					return;
-				}
-
-				const backupUpContent =
-					select( caretDataStore ).getOriginalContent();
-
-				if ( backupUpContent ) {
-					contentRef.current.innerHTML = backupUpContent;
-					dispatch( caretDataStore ).setOriginalContent( '' );
-				}
-			};
-		}, [ isActive, inActiveBySelection ] );
-
+	edit( { isActive, value, onChange, contentRef } ) {
 		const onToggle = () => {
 			const selection = contentRef.current.ownerDocument.getSelection();
 
@@ -215,8 +90,6 @@ registerFormatType( type, {
 								text: char.char,
 							};
 
-							setInactiveBySelection( true );
-
 							onChange(
 								insert(
 									value,
diff --git a/src/insert-special-characters.scss b/src/insert-special-characters.scss
index e75dd67..e28b820 100644
--- a/src/insert-special-characters.scss
+++ b/src/insert-special-characters.scss
@@ -1,23 +1,5 @@
 $grid-border-color: #c8c8c8;
 
-.insert-special-character__faux-caret {
-	border-left: 1px solid #000;
-	animation: 1s caret-blink step-end infinite;
-}
-
-.insert-special-character__faux-selection {
-	background-color: rgba(0, 0, 0, 0.2);
-}
-
-@keyframes caret-blink {
-	from, to {
-		border-color: black;
-	}
-	50% {
-		border-color: transparent;
-	}
-}
-
 .character-map-popover {
 	.components-popover__content {
 		border: 1px solid #1e1e1e