@momo-kits/foundation 0.168.1-beta.7 → 0.168.1-beta.9

package/Input/InputMoney.tsx

@@ -37,8 +37,6 @@ import SystemTextInput from './SystemTextInput';
 
 const moneyFormatter = new Intl.NumberFormat('vi-VN');
 
-// Finds the common prefix and suffix of `old` and `text`; `size` counts the
-// characters removed plus inserted between them.
 const findEdit = (old: string, text: string) => {
   let start = 0;
   while (start < text.length && old[start] === text[start]) {
@@ -129,11 +127,8 @@ const InputMoney = forwardRef(
       setLastDisplayValue(displayValue);
     }, [displayValue]);
 
-    // The selection only rides along with the render that reformats the text,
-    // then it is released so the user can move the caret freely.
     useEffect(() => {
       if (!caretSelection) return;
-      // A newer keystroke may already have queued its own selection; keep it.
       setCaretSelection(current =>
         current === caretSelection ? undefined : current,
       );
@@ -143,9 +138,6 @@ const InputMoney = forwardRef(
       const next = numeric ? moneyFormatter.format(Number(numeric)) : '';
       setDisplayValue(next);
 
-      // Android moves the caret proportionally when the text is replaced, so
-      // it lands before the typed digit once a separator is added. Send the
-      // caret together with the text, keeping the same digits after it.
       const digitsAfter = caretDigitsAfter.current;
       caretDigitsAfter.current = undefined;
       if (Platform.OS !== 'android' || digitsAfter === undefined) return;
@@ -187,9 +179,6 @@ const InputMoney = forwardRef(
         return;
       }
       const digits = parseInputText(text);
-      // When typing outpaces JS (slow devices) native rejects the stale
-      // formatted text and keeps the raw one, so the edit may apply to either.
-      // Pick the one that differs from the new text by a single edit.
       const raw = lastRawText.current;
       lastRawText.current = text;
       const formattedEdit = findEdit(lastDisplayValue, text);
@@ -199,7 +188,6 @@ const InputMoney = forwardRef(
       caretDigitsAfter.current = parseInputText(
         text.slice(text.length - suffix),
       ).length;
-      // Deleting a separator removes the digit before it.
       if (text.length < old.length && digits === numericValue) {
         const index = parseInputText(text.slice(0, start)).length - 1;
         if (index >= 0) {
@@ -210,6 +198,11 @@ const InputMoney = forwardRef(
       updateNumericValue(digits);
     };
 
+    const focusAtEnd = () => {
+      inputRef.current?.focus();
+      inputRef.current?.setSelection(displayValue.length, displayValue.length);
+    };
+
     const _onFocus = (e: TextInputFocusEvent) => {
       setFocused(true);
       onFocus?.(e);
@@ -279,7 +272,7 @@ const InputMoney = forwardRef(
           />
           <Pressable
             style={[styles.inputView, styles.moneyInputView]}
-            onPress={() => inputRef.current?.focus()}
+            onPress={focusAtEnd}
             disabled={disabled}
           >
             <SystemTextInput
@@ -291,8 +284,6 @@ const InputMoney = forwardRef(
                 disabled: disabled,
                 ...props.accessibilityState,
               }}
-              // No width: the input sizes to its text natively, so the
-              // currency follows it without waiting for JS.
               style={[textStyle, styles.moneyTextInput, { color: textColor }]}
               allowFontScaling={false}
               textBreakStrategy="highQuality"

package/Input/styles.ts

@@ -223,9 +223,8 @@ export default StyleSheet.create({
   },
   moneyTextInput: {
     flexShrink: 1,
-    height: '100%',
     paddingLeft: 0,
     paddingRight: Spacing.XXS,
-    paddingVertical: Spacing.S,
+    paddingVertical: 0,
   },
 });

package/package.json

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