From d5bad65199532de25e881be601b14d852d51851b Mon Sep 17 00:00:00 2001 From: Mohammad Luthfi Fathur Rahman Date: Mon, 14 Mar 2022 20:29:57 +0700 Subject: [PATCH 1/7] add scroll padding to multiline and labeled text input --- src/components/TextInput/BaseTextInput.js | 1 + src/styles/styles.js | 4 ++++ 2 files changed, 5 insertions(+) diff --git a/src/components/TextInput/BaseTextInput.js b/src/components/TextInput/BaseTextInput.js index 87dae0aff7da..905c45ab143b 100644 --- a/src/components/TextInput/BaseTextInput.js +++ b/src/components/TextInput/BaseTextInput.js @@ -261,6 +261,7 @@ class BaseTextInput extends Component { !hasLabel && styles.pv0, this.props.prefixCharacter && StyleUtils.getPaddingLeft(this.state.prefixWidth + styles.pl1.paddingLeft), this.props.secureTextEntry && styles.pr2, + hasLabel && this.props.multiline && styles.textInputScrollPadding, ]} multiline={this.props.multiline} maxLength={this.props.maxLength} diff --git a/src/styles/styles.js b/src/styles/styles.js index f78e815d0f2a..998798f36c05 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -698,6 +698,10 @@ const styles = { borderRadius: variables.componentBorderRadiusNormal, }, + textInputScrollPadding: { + scrollPadding: '23px 0 0 0', + }, + textInputAndIconContainer: { flex: 1, height: '100%', From 88335a1378c36e33d0c1b98037ef1af40f84bb76 Mon Sep 17 00:00:00 2001 From: Mohammad Luthfi Fathur Rahman Date: Wed, 16 Mar 2022 09:53:02 +0700 Subject: [PATCH 2/7] rename style to give more idea --- src/styles/styles.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/styles.js b/src/styles/styles.js index 998798f36c05..b3ea9c25a94f 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -698,7 +698,7 @@ const styles = { borderRadius: variables.componentBorderRadiusNormal, }, - textInputScrollPadding: { + textInputLabelMultilineScrollPadding: { scrollPadding: '23px 0 0 0', }, From 05ba7c5c54ae305d5380dc34e8f6658b3f657312 Mon Sep 17 00:00:00 2001 From: Mohammad Luthfi Fathur Rahman Date: Wed, 16 Mar 2022 09:54:11 +0700 Subject: [PATCH 3/7] move style for not applying to native --- src/components/TextInput/BaseTextInput.js | 1 - src/components/TextInput/index.js | 9 ++++++++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/src/components/TextInput/BaseTextInput.js b/src/components/TextInput/BaseTextInput.js index 905c45ab143b..87dae0aff7da 100644 --- a/src/components/TextInput/BaseTextInput.js +++ b/src/components/TextInput/BaseTextInput.js @@ -261,7 +261,6 @@ class BaseTextInput extends Component { !hasLabel && styles.pv0, this.props.prefixCharacter && StyleUtils.getPaddingLeft(this.state.prefixWidth + styles.pl1.paddingLeft), this.props.secureTextEntry && styles.pr2, - hasLabel && this.props.multiline && styles.textInputScrollPadding, ]} multiline={this.props.multiline} maxLength={this.props.maxLength} diff --git a/src/components/TextInput/index.js b/src/components/TextInput/index.js index 30a00e89b76d..0c50c656051e 100644 --- a/src/components/TextInput/index.js +++ b/src/components/TextInput/index.js @@ -16,6 +16,8 @@ class TextInput extends React.Component { } render() { + const isLabeledMultiline = Boolean(this.props.label.length) && this.props.multiline; + return ( ); } From f37058cd157e5992aea00562e4f7c872ae231402 Mon Sep 17 00:00:00 2001 From: mollfpr Date: Wed, 16 Mar 2022 19:00:48 +0700 Subject: [PATCH 4/7] Update src/styles/styles.js Co-authored-by: Rajat Parashar --- src/styles/styles.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/styles.js b/src/styles/styles.js index b3ea9c25a94f..255807ac2c2f 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -698,7 +698,7 @@ const styles = { borderRadius: variables.componentBorderRadiusNormal, }, - textInputLabelMultilineScrollPadding: { + textInputMultiline: { scrollPadding: '23px 0 0 0', }, From 0a729da90867552a411ebe9ed695d8d41e92b309 Mon Sep 17 00:00:00 2001 From: mollfpr Date: Wed, 16 Mar 2022 19:01:03 +0700 Subject: [PATCH 5/7] Update src/components/TextInput/index.js Co-authored-by: Rajat Parashar --- src/components/TextInput/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/TextInput/index.js b/src/components/TextInput/index.js index 0c50c656051e..bcdb7541abee 100644 --- a/src/components/TextInput/index.js +++ b/src/components/TextInput/index.js @@ -38,7 +38,7 @@ class TextInput extends React.Component { inputStyle={[ styles.baseTextInput, styles.textInputDesktop, - isLabeledMultiline && styles.textInputLabelMultilineScrollPadding, + isLabeledMultiline && styles.textInputMultiline, ...this.props.inputStyle, ]} /> From 4ca16e2681d54a5617c053c945f35a46b87419d7 Mon Sep 17 00:00:00 2001 From: mollfpr Date: Wed, 16 Mar 2022 20:52:56 +0700 Subject: [PATCH 6/7] Update styles.js --- src/styles/styles.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/styles/styles.js b/src/styles/styles.js index 255807ac2c2f..7432f2c213b1 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -700,6 +700,7 @@ const styles = { textInputMultiline: { scrollPadding: '23px 0 0 0', + overflowY: 'auto', }, textInputAndIconContainer: { From 707bf849a79f5ef5721fc345f1c0778f32e39cae Mon Sep 17 00:00:00 2001 From: Mohammad Luthfi Fathur Rahman Date: Wed, 23 Mar 2022 18:21:18 +0700 Subject: [PATCH 7/7] remove overflow auto --- src/styles/styles.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/styles/styles.js b/src/styles/styles.js index 7432f2c213b1..255807ac2c2f 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -700,7 +700,6 @@ const styles = { textInputMultiline: { scrollPadding: '23px 0 0 0', - overflowY: 'auto', }, textInputAndIconContainer: {