Add review changes

Expensify · Mar 6, 2024 · cfce5ac · cfce5ac
1 parent 4504afb
commit cfce5ac
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 20 deletions.
diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -99,9 +99,7 @@ export default function App() {
         ref={ref}
         markdownStyle={markdownStyle}
         placeholder="Type here..."
-        onSelectionChange={(e) => {
-          setSelection(e.nativeEvent.selection);
-        }}
+        onSelectionChange={(e) => setSelection(e.nativeEvent.selection)}
         selection={selection}
       />
       {/* <Text>TextInput singleline</Text>

diff --git a/src/MarkdownTextInput.web.tsx b/src/MarkdownTextInput.web.tsx
@@ -300,7 +300,8 @@ const MarkdownTextInput = React.forwardRef<TextInput, MarkdownTextInputProps>(
       [onSelectionChange, setEventProps],
     );
 
-    const updateRefSelectionVariables = useCallback((start: number, end: number) => {
+    const updateRefSelectionVariables = useCallback((newSelection: Selection) => {
+      const {start, end} = newSelection;
       const markdownHTMLInput = divRef.current as HTMLInputElement;
       markdownHTMLInput.selectionStart = start;
       markdownHTMLInput.selectionEnd = end;
@@ -310,12 +311,12 @@ const MarkdownTextInput = React.forwardRef<TextInput, MarkdownTextInputProps>(
       if (!divRef.current) {
         return;
       }
-      const currentSelection = CursorUtils.getCurrentCursorPosition(divRef.current);
+      const newSelection = CursorUtils.getCurrentCursorPosition(divRef.current);
 
-      if (currentSelection && (contentSelection.current.start !== currentSelection.start || contentSelection.current.end !== currentSelection.end)) {
+      if (newSelection && (contentSelection.current.start !== newSelection.start || contentSelection.current.end !== newSelection.end)) {
         if (contentSelection.current.start >= 0 && contentSelection.current.end >= 0) {
-          updateRefSelectionVariables(contentSelection.current.start, contentSelection.current.end);
-          contentSelection.current = currentSelection;
+          updateRefSelectionVariables(contentSelection.current);
+          contentSelection.current = newSelection;
         }
         if (e) {
           handleSelectionChange(e);
@@ -530,7 +531,7 @@ const MarkdownTextInput = React.forwardRef<TextInput, MarkdownTextInputProps>(
       if (autoFocus) {
         divRef.current.focus();
       }
-      updateRefSelectionVariables(contentSelection.current.start, contentSelection.current.end);
+      updateRefSelectionVariables(contentSelection.current);
     }, []);
 
     useEffect(() => {

diff --git a/src/web/cursorUtils.ts b/src/web/cursorUtils.ts
@@ -1,8 +1,8 @@
 function findTextNodes(textNodes: Text[], node: ChildNode) {
-  if (node.nodeType === 3) {
+  if (node.nodeType === Node.TEXT_NODE) {
     textNodes.push(node as Text);
   } else {
-    for (let i = 0, len = node.childNodes.length; i < len; ++i) {
+    for (let i = 0, length = node.childNodes.length; i < length; ++i) {
       const childNode = node.childNodes[i];
       if (childNode) {
         findTextNodes(textNodes, childNode);
@@ -66,16 +66,16 @@ function moveCursorToEnd(target: HTMLElement) {
 
 function getCurrentCursorPosition(target: HTMLElement) {
   const selection = window.getSelection();
-  if (selection && selection.rangeCount > 0) {
-    const range = selection.getRangeAt(0);
-    const preSelectionRange = range.cloneRange();
-    preSelectionRange.selectNodeContents(target);
-    preSelectionRange.setEnd(range.startContainer, range.startOffset);
-    const start = preSelectionRange.toString().length;
-    const end = start + range.toString().length;
-    return {start, end};
+  if (!selection || (selection && selection.rangeCount === 0)) {
+    return null;
   }
-  return null;
+  const range = selection.getRangeAt(0);
+  const preSelectionRange = range.cloneRange();
+  preSelectionRange.selectNodeContents(target);
+  preSelectionRange.setEnd(range.startContainer, range.startOffset);
+  const start = preSelectionRange.toString().length;
+  const end = start + range.toString().length;
+  return {start, end};
 }
 
 function removeSelection() {