jfs-components 0.1.57 → 0.1.58

package/lib/typescript/src/icons/registry.d.ts

@@ -4,7 +4,7 @@
  * Auto-generated from SVG files in src/icons/
  * DO NOT EDIT MANUALLY - Run "npm run icons:generate" to regenerate
  *
- * Generated: 2026-07-27T20:45:13.986Z
+ * Generated: 2026-07-27T21:47:09.131Z
  */
 export declare const iconRegistry: Record<string, {
     path: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jfs-components",
-  "version": "0.1.57",
+  "version": "0.1.58",
   "description": "React Native Jio Finance Components Library",
   "author": "sunshuaiqi@gmail.com",
   "license": "MIT",

package/src/components/TextInput/TextInput.tsx

@@ -162,6 +162,14 @@ const TextInputBase = forwardRef<RNTextInput, TextInputProps>(function TextInput
   // Convert radius to React Native format (if 99999, use a large value for fully rounded)
   const borderRadius = radius === 99999 ? 99999 : radius
 
+  // Row height from tokens: vertical padding above/below the text line.
+  // Applied as container `minHeight` (FormField pattern) — NOT as TextInput
+  // `lineHeight` / `minHeight`, which breaks iOS vertical centering.
+  const padV = typeof paddingVertical === 'number' ? paddingVertical : 0
+  const textLine = typeof lineHeight === 'number' ? lineHeight : 0
+  const iconH = typeof iconSize === 'number' ? iconSize : 0
+  const rowMinHeight = padV * 2 + Math.max(textLine, iconH)
+
   const containerStyle: ViewStyle = {
     flexDirection: 'row',
     alignItems: 'center',
@@ -171,25 +179,25 @@ const TextInputBase = forwardRef<RNTextInput, TextInputProps>(function TextInput
     borderStyle: 'solid' as const,
     borderRadius,
     paddingHorizontal,
-    paddingVertical,
+    // Same as FormField / SuggestiveSearch: the ROW owns height via minHeight;
+    // paddingVertical on the row would fight that and let the field stretch.
+    paddingVertical: 0,
+    minHeight: rowMinHeight > 0 ? rowMinHeight : undefined,
     gap: 8,
   }
 
   const hoverStyle: ViewStyle = isHovered ? { opacity: 0.95 } : {}
   const focusContainerStyle: ViewStyle = isFocused ? { borderColor: '#222', borderWidth: 1 } : {}
 
-  // ⚠️ DO NOT change to an unconditional `lineHeight`, and do NOT put
-  // `minHeight: lineHeight` on this single-line input on iOS. Same contract as
-  // FormField / SuggestiveSearch — read before "simplifying".
+  // ⚠️ Same contract as FormField / SuggestiveSearch — do not "simplify".
   //
-  // facebook/react-native#39145 / #28012: on iOS, a single-line RN TextInput
-  // (UITextField) with `lineHeight` > font metrics puts ALL the extra space
-  // ABOVE the glyphs, so placeholder/value sink. Android/Web distribute evenly.
-  // RN's documented workaround (#39145) and #56774: omit `lineHeight` on
-  // single-line iOS inputs — UITextField centers natively — and let the
-  // wrapper (`alignItems: 'center'` + padding/icon) own vertical layout.
-  // Pinning `lineHeight` to `fontSize` is NOT a substitute; it clips custom
-  // font metrics and floats typed text above center.
+  // facebook/react-native#39145 / #28012 / #56774:
+  // Single-line iOS UITextField + `lineHeight` (or a tall field box) puts ALL
+  // extra space ABOVE the glyphs → placeholder/value sink. Documented fix:
+  // omit `lineHeight` on the single-line input; let the wrapper
+  // (`alignItems: 'center'` + `minHeight`) center it. UITextField centers
+  // natively when it is only as tall as its font. Do NOT pin lineHeight to
+  // fontSize (clips custom fonts / floats typed text).
   const textInputStyle: TextStyle = {
     flex: 1,
     color: textColor,

package/src/icons/registry.ts

@@ -4,7 +4,7 @@
  * Auto-generated from SVG files in src/icons/
  * DO NOT EDIT MANUALLY - Run "npm run icons:generate" to regenerate
  * 
- * Generated: 2026-07-27T20:45:13.986Z
+ * Generated: 2026-07-27T21:47:09.131Z
  */
 
 // Icon name to SVG data mapping