@momo-kits/foundation 0.167.1-beta.10 → 0.167.1-beta.12

package/Input/InputMoney.tsx

@@ -10,7 +10,6 @@ import React, {
 } from 'react';
 import {
   NativeSyntheticEvent,
-  Platform,
   TextInput,
   TextInputFocusEventData,
   TextInputSelectionChangeEventData,
@@ -57,13 +56,10 @@ const caretFromDigitIndex = (display: string, digitIndex: number) => {
   return 0;
 };
 
-// Finds which range of `old` was replaced to produce `next`. `selection` is
-// the pre-edit selection on iOS and already the post-edit caret on Android,
-// where onSelectionChange fires before onChangeText.
 const detectEdit = (old: string, next: string, selection: Selection): Edit => {
   const { start, end } = selection;
   const removed = old.length - next.length;
-  const preEdit: Edit[] = [
+  const candidates: Edit[] = [
     {
       start,
       end,
@@ -72,26 +68,6 @@ const detectEdit = (old: string, next: string, selection: Selection): Edit => {
     { start: start - removed, end: start, inserted: '' },
     { start, end: start + removed, inserted: '' },
   ];
-  const postEdit: Edit[] = [];
-  const tail = next.length - start;
-  if (start === end && tail <= old.length) {
-    let prefix = 0;
-    while (
-      prefix < Math.min(start, old.length - tail) &&
-      old[prefix] === next[prefix]
-    ) {
-      prefix += 1;
-    }
-    postEdit.push({
-      start: prefix,
-      end: old.length - tail,
-      inserted: next.slice(prefix, start),
-    });
-  }
-  const candidates =
-    Platform.OS === 'android'
-      ? [...postEdit, ...preEdit]
-      : [...preEdit, ...postEdit];
   const match = candidates.find(
     e =>
       e.start >= 0 &&
@@ -196,9 +172,8 @@ const InputMoney = forwardRef(
     const selectionRef = useRef<Selection>({ start: 0, end: 0 });
     // Caret to push to native once the committed text is rendered.
     const pendingCaretRef = useRef<number | null>(null);
-    // Caret the native input reports for the raw, unformatted text. On iOS that
-    // event lands after onChangeText and must not override the formatted caret.
-    const rawCaretRef = useRef<number | null>(null);
+    const pendingSelectionRef = useRef<Selection | null>(null);
+    const editingRef = useRef(false);
     const inputRef = useRef<TextInput>(null);
     const componentName = 'InputMoney';
 
@@ -265,10 +240,13 @@ const InputMoney = forwardRef(
     const _onChangeText = (text: string) => {
       let digits = '';
       let caretDigit = 0;
-      rawCaretRef.current = 0;
+      pendingSelectionRef.current = null;
+      editingRef.current = true;
+      setTimeout(() => {
+        editingRef.current = false;
+      });
       if (text) {
         const edit = detectEdit(displayRef.current, text, selectionRef.current);
-        rawCaretRef.current = edit.start + edit.inserted.length;
         ({ digits, caretDigit } = applyEdit(
           displayRef.current,
           edit,
@@ -285,19 +263,24 @@ const InputMoney = forwardRef(
       e: NativeSyntheticEvent<TextInputSelectionChangeEventData>,
     ) => {
       props.onSelectionChange?.(e);
-      const { start, end } = e.nativeEvent.selection;
-      const rawCaret = rawCaretRef.current;
-      rawCaretRef.current = null;
-      if (start === end && start === rawCaret) {
-        return;
-      }
-      const display = displayRef.current;
-      const max = display ? display.length - currency.length : 0;
-      const clamped = { start: Math.min(start, max), end: Math.min(end, max) };
-      selectionRef.current = clamped;
-      if (clamped.start !== start || clamped.end !== end) {
-        inputRef.current?.setSelection(clamped.start, clamped.end);
-      }
+      if (editingRef.current) return;
+      const selection = e.nativeEvent.selection;
+      pendingSelectionRef.current = selection;
+      setTimeout(() => {
+        if (pendingSelectionRef.current !== selection) return;
+        pendingSelectionRef.current = null;
+        const { start, end } = selection;
+        const display = displayRef.current;
+        const max = display ? display.length - currency.length : 0;
+        const clamped = {
+          start: Math.min(start, max),
+          end: Math.min(end, max),
+        };
+        selectionRef.current = clamped;
+        if (clamped.start !== start || clamped.end !== end) {
+          inputRef.current?.setSelection(clamped.start, clamped.end);
+        }
+      });
     };
 
     const _onFocus = (e: NativeSyntheticEvent<TextInputFocusEventData>) => {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@momo-kits/foundation",
-    "version": "0.167.1-beta.10",
+    "version": "0.167.1-beta.12",
     "description": "React Native Component Kits",
     "main": "index.ts",
     "scripts": {},