fix: react native text input alignment with prefix (#1781)

razorpay · Nov 2, 2023 · f0d4dce · f0d4dce
1 parent 2d07f56
commit f0d4dce
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/.changeset/wet-cycles-greet.md b/.changeset/wet-cycles-greet.md
@@ -0,0 +1,5 @@
+---
+"@razorpay/blade": patch
+---
+
+fix: react native text input alignment with prefix
diff --git a/packages/blade/src/components/Input/BaseInput/StyledBaseInput.native.tsx b/packages/blade/src/components/Input/BaseInput/StyledBaseInput.native.tsx
@@ -8,6 +8,7 @@ import type {
   TouchableHighlightProps,
   GestureResponderEvent,
 } from 'react-native';
+import { Platform as RNPlatform } from 'react-native';
 import type { BaseInputProps } from './BaseInput';
 import type { StyledBaseInputProps } from './types';
 import { getBaseInputStyles } from './baseInputStyles';
@@ -127,7 +128,10 @@ const getRNInputStyles = (
       hasTags: props.hasTags,
       isDropdownTrigger: props.isDropdownTrigger,
     }),
-    lineHeight: undefined,
+    lineHeight: RNPlatform.select({
+      android: makeSize(props.theme.typography.lineHeights[100]),
+      ios: undefined,
+    }),
     textAlignVertical: 'top',
     height: getInputHeight({
       isTextArea: props.isTextArea,