From 303c6acb4e86ed192f3f618e6a0dc3296f218e84 Mon Sep 17 00:00:00 2001 From: Tsaqif Date: Tue, 15 Oct 2024 16:35:48 +0700 Subject: [PATCH 1/2] Fix some text inputs are unaligned if there are prefix characters Signed-off-by: Tsaqif --- src/components/TextInput/BaseTextInput/index.native.tsx | 1 + src/components/TextInput/BaseTextInput/index.tsx | 1 + src/styles/index.ts | 3 +++ 3 files changed, 5 insertions(+) diff --git a/src/components/TextInput/BaseTextInput/index.native.tsx b/src/components/TextInput/BaseTextInput/index.native.tsx index 871ab8b25ac2..e0c7f1c9da9d 100644 --- a/src/components/TextInput/BaseTextInput/index.native.tsx +++ b/src/components/TextInput/BaseTextInput/index.native.tsx @@ -259,6 +259,7 @@ function BaseTextInput( !hideFocusedState && isFocused && styles.borderColorFocus, (!!hasError || !!errorText) && styles.borderColorDanger, autoGrowHeight && {scrollPaddingTop: typeof maxAutoGrowHeight === 'number' ? 2 * maxAutoGrowHeight : undefined}, + isAutoGrowHeightMarkdown && styles.autoGrowMarkdwonTextInputPaddingBottom, ]); const inputPaddingLeft = !!prefixCharacter && StyleUtils.getPaddingLeft(StyleUtils.getCharacterPadding(prefixCharacter) + styles.pl1.paddingLeft); diff --git a/src/components/TextInput/BaseTextInput/index.tsx b/src/components/TextInput/BaseTextInput/index.tsx index 09b644c8e76a..43f2e53c29f6 100644 --- a/src/components/TextInput/BaseTextInput/index.tsx +++ b/src/components/TextInput/BaseTextInput/index.tsx @@ -261,6 +261,7 @@ function BaseTextInput( !hideFocusedState && isFocused && styles.borderColorFocus, (!!hasError || !!errorText) && styles.borderColorDanger, autoGrowHeight && {scrollPaddingTop: typeof maxAutoGrowHeight === 'number' ? 2 * maxAutoGrowHeight : undefined}, + isAutoGrowHeightMarkdown && styles.autoGrowMarkdwonTextInputPaddingBottom, ]); const isMultiline = multiline || autoGrowHeight; diff --git a/src/styles/index.ts b/src/styles/index.ts index 6998b7698c1d..0e6c8f0df420 100644 --- a/src/styles/index.ts +++ b/src/styles/index.ts @@ -1181,6 +1181,9 @@ const styles = (theme: ThemeColors) => overflow: 'hidden', borderBottomWidth: 2, borderColor: theme.border, + }, + + autoGrowMarkdwonTextInputPaddingBottom: { paddingBottom: 8, }, From 38c5b3bc78e9d91e8a789382594f6234081ae7c0 Mon Sep 17 00:00:00 2001 From: Tsaqif Date: Wed, 16 Oct 2024 05:14:00 +0700 Subject: [PATCH 2/2] Using pb2 instead of creating new class Signed-off-by: Tsaqif --- src/components/TextInput/BaseTextInput/index.native.tsx | 2 +- src/components/TextInput/BaseTextInput/index.tsx | 2 +- src/styles/index.ts | 4 ---- 3 files changed, 2 insertions(+), 6 deletions(-) diff --git a/src/components/TextInput/BaseTextInput/index.native.tsx b/src/components/TextInput/BaseTextInput/index.native.tsx index e0c7f1c9da9d..eadcabb8bfc6 100644 --- a/src/components/TextInput/BaseTextInput/index.native.tsx +++ b/src/components/TextInput/BaseTextInput/index.native.tsx @@ -259,7 +259,7 @@ function BaseTextInput( !hideFocusedState && isFocused && styles.borderColorFocus, (!!hasError || !!errorText) && styles.borderColorDanger, autoGrowHeight && {scrollPaddingTop: typeof maxAutoGrowHeight === 'number' ? 2 * maxAutoGrowHeight : undefined}, - isAutoGrowHeightMarkdown && styles.autoGrowMarkdwonTextInputPaddingBottom, + isAutoGrowHeightMarkdown && styles.pb2, ]); const inputPaddingLeft = !!prefixCharacter && StyleUtils.getPaddingLeft(StyleUtils.getCharacterPadding(prefixCharacter) + styles.pl1.paddingLeft); diff --git a/src/components/TextInput/BaseTextInput/index.tsx b/src/components/TextInput/BaseTextInput/index.tsx index 43f2e53c29f6..48b99486d6cc 100644 --- a/src/components/TextInput/BaseTextInput/index.tsx +++ b/src/components/TextInput/BaseTextInput/index.tsx @@ -261,7 +261,7 @@ function BaseTextInput( !hideFocusedState && isFocused && styles.borderColorFocus, (!!hasError || !!errorText) && styles.borderColorDanger, autoGrowHeight && {scrollPaddingTop: typeof maxAutoGrowHeight === 'number' ? 2 * maxAutoGrowHeight : undefined}, - isAutoGrowHeightMarkdown && styles.autoGrowMarkdwonTextInputPaddingBottom, + isAutoGrowHeightMarkdown && styles.pb2, ]); const isMultiline = multiline || autoGrowHeight; diff --git a/src/styles/index.ts b/src/styles/index.ts index 0e6c8f0df420..5e29dd1dc37a 100644 --- a/src/styles/index.ts +++ b/src/styles/index.ts @@ -1183,10 +1183,6 @@ const styles = (theme: ThemeColors) => borderColor: theme.border, }, - autoGrowMarkdwonTextInputPaddingBottom: { - paddingBottom: 8, - }, - optionRowAmountInput: { textAlign: 'right', },