Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Separate TextField from TextFieldSection #9592

Merged
merged 1 commit into from
Nov 12, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ import com.stripe.android.financialconnections.ui.theme.Theme
import com.stripe.android.model.ConsumerSessionLookup
import com.stripe.android.uicore.elements.DropDown
import com.stripe.android.uicore.elements.PhoneNumberCollectionSection
import com.stripe.android.uicore.elements.TextField
import com.stripe.android.uicore.elements.TextFieldController
import com.stripe.android.uicore.elements.TextFieldSection
import com.stripe.android.uicore.utils.collectAsState
Expand Down Expand Up @@ -319,13 +320,19 @@ internal fun EmailSection(
) {
TextFieldSection(
modifier = Modifier
.focusRequester(focusRequester)
.onFocusChanged { focused = it.isFocused },
.padding(vertical = 8.dp),
isSelected = focused,
textFieldController = emailController,
imeAction = if (showFullForm) ImeAction.Next else ImeAction.Done,
enabled = enabled
)
) {
TextField(
modifier = Modifier
.focusRequester(focusRequester)
.onFocusChanged { focused = it.isFocused },
textFieldController = emailController,
imeAction = if (showFullForm) ImeAction.Next else ImeAction.Done,
enabled = enabled
)
}
if (loading) {
CircularProgressIndicator(
modifier = Modifier
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ import com.stripe.android.uicore.elements.EmailConfig
import com.stripe.android.uicore.elements.NameConfig
import com.stripe.android.uicore.elements.PhoneNumberCollectionSection
import com.stripe.android.uicore.elements.PhoneNumberController
import com.stripe.android.uicore.elements.TextField
import com.stripe.android.uicore.elements.TextFieldController
import com.stripe.android.uicore.elements.TextFieldSection
import com.stripe.android.uicore.utils.collectAsState
Expand Down Expand Up @@ -144,15 +145,21 @@ private fun EmailCollectionSection(
) {
TextFieldSection(
textFieldController = emailController,
imeAction = if (signUpScreenState.signUpState == SignUpState.InputtingRemainingFields) {
ImeAction.Next
} else {
ImeAction.Done
},
enabled = enabled && signUpScreenState.signUpState != SignUpState.VerifyingEmail,
modifier = Modifier
.focusRequester(focusRequester)
)
.padding(vertical = 8.dp),
) {
TextField(
modifier = Modifier
.focusRequester(focusRequester),
textFieldController = emailController,
imeAction = if (signUpScreenState.signUpState == SignUpState.InputtingRemainingFields) {
ImeAction.Next
} else {
ImeAction.Done
},
enabled = enabled && signUpScreenState.signUpState != SignUpState.VerifyingEmail,
)
}
if (signUpScreenState.signUpState == SignUpState.VerifyingEmail) {
CircularProgressIndicator(
modifier = Modifier
Expand Down Expand Up @@ -196,10 +203,15 @@ private fun SecondaryFields(

if (signUpScreenState.requiresNameCollection) {
TextFieldSection(
modifier = Modifier.padding(vertical = 8.dp),
textFieldController = nameController,
imeAction = ImeAction.Done,
enabled = true
)
) {
TextField(
textFieldController = nameController,
imeAction = ImeAction.Done,
enabled = true,
)
}
}

LinkTerms(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ import com.stripe.android.common.ui.LoadingIndicator
import com.stripe.android.paymentsheet.injection.AutocompleteViewModelSubcomponent
import com.stripe.android.paymentsheet.ui.AddressOptionsAppBar
import com.stripe.android.ui.core.elements.autocomplete.PlacesClientProxy
import com.stripe.android.uicore.elements.TextField
import com.stripe.android.uicore.elements.TextFieldSection
import com.stripe.android.uicore.shouldUseDarkDynamicColor
import com.stripe.android.uicore.stripeColors
Expand Down Expand Up @@ -129,16 +130,20 @@ internal fun AutocompleteScreenUI(viewModel: AutocompleteViewModel) {
Box(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp)
.padding(horizontal = 16.dp, vertical = 8.dp)
) {
TextFieldSection(
textFieldController = viewModel.textFieldController,
imeAction = ImeAction.Done,
enabled = true,
modifier = Modifier
.fillMaxWidth()
.focusRequester(focusRequester)
)
) {
TextField(
modifier = Modifier
.fillMaxWidth()
.focusRequester(focusRequester),
textFieldController = viewModel.textFieldController,
imeAction = ImeAction.Done,
enabled = true,
)
}
}
if (loading) {
LoadingIndicator(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@ import com.stripe.android.uicore.elements.SameAsShippingElement
import com.stripe.android.uicore.elements.SameAsShippingElementUI
import com.stripe.android.uicore.elements.Section
import com.stripe.android.uicore.elements.SectionCard
import com.stripe.android.uicore.elements.TextField
import com.stripe.android.uicore.elements.TextFieldController
import com.stripe.android.uicore.elements.TextFieldSection
import com.stripe.android.uicore.stripeColors
Expand Down Expand Up @@ -276,10 +277,15 @@ internal fun BillingDetailsForm(
contentAlignment = Alignment.CenterEnd
) {
TextFieldSection(
modifier = Modifier.padding(vertical = 8.dp),
textFieldController = nameController,
imeAction = ImeAction.Next,
enabled = !isProcessing
)
) {
TextField(
textFieldController = nameController,
enabled = !isProcessing,
imeAction = ImeAction.Next,
)
}
}
}
if (formArgs.billingDetailsCollectionConfiguration.email != CollectionMode.Never) {
Expand All @@ -290,14 +296,19 @@ internal fun BillingDetailsForm(
contentAlignment = Alignment.CenterEnd
) {
TextFieldSection(
modifier = Modifier.padding(vertical = 8.dp),
textFieldController = emailController,
imeAction = if (lastTextFieldIdentifier == IdentifierSpec.Email) {
ImeAction.Done
} else {
ImeAction.Next
},
enabled = !isProcessing
)
) {
TextField(
textFieldController = emailController,
enabled = !isProcessing,
imeAction = if (lastTextFieldIdentifier == IdentifierSpec.Email) {
ImeAction.Done
} else {
ImeAction.Next
},
)
}
}
}
if (formArgs.billingDetailsCollectionConfiguration.phone == CollectionMode.Always) {
Expand Down
2 changes: 1 addition & 1 deletion stripe-ui-core/api/stripe-ui-core.api
Original file line number Diff line number Diff line change
Expand Up @@ -236,7 +236,7 @@ public final class com/stripe/android/uicore/elements/TextFieldStateConstants$Va
public final class com/stripe/android/uicore/elements/TextFieldUIKt {
public static final fun AnimatedIcons (Ljava/util/List;ZLandroidx/compose/runtime/Composer;I)V
public static final fun TextField-qRf7idA (Lcom/stripe/android/uicore/elements/TextFieldController;ZILandroidx/compose/ui/Modifier;Lkotlin/jvm/functions/Function1;IILandroidx/compose/ui/focus/FocusRequester;Landroidx/compose/runtime/Composer;II)V
public static final fun TextFieldSection-vbMXUkU (Landroidx/compose/ui/Modifier;Lcom/stripe/android/uicore/elements/TextFieldController;IZZLjava/lang/Integer;Lkotlin/jvm/functions/Function1;Landroidx/compose/runtime/Composer;II)V
public static final fun TextFieldSection (Landroidx/compose/ui/Modifier;Lcom/stripe/android/uicore/elements/TextFieldController;ZLjava/lang/Integer;Lkotlin/jvm/functions/Function2;Landroidx/compose/runtime/Composer;II)V
}

public final class com/stripe/android/uicore/elements/bottomsheet/ComposableSingletons$StripeBottomSheetLayoutKt {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -90,11 +90,9 @@ private fun defaultAutofillEventReporter(): (String) -> Unit {
fun TextFieldSection(
modifier: Modifier = Modifier,
textFieldController: TextFieldController,
imeAction: ImeAction,
enabled: Boolean,
isSelected: Boolean = false,
@StringRes sectionTitle: Int? = null,
onTextStateChanged: (TextFieldState?) -> Unit = {}
content: @Composable () -> Unit,
) {
val error by textFieldController.error.collectAsState()

Expand All @@ -108,19 +106,12 @@ fun TextFieldSection(
}

Section(
modifier = Modifier.padding(vertical = 8.dp),
modifier = modifier,
title = sectionTitle,
error = sectionErrorString,
isSelected = isSelected,
) {
TextField(
textFieldController = textFieldController,
enabled = enabled,
imeAction = imeAction,
modifier = modifier,
onTextStateChanged = onTextStateChanged
)
}
content = content,
)
Copy link
Collaborator Author

@samer-stripe samer-stripe Nov 11, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I initially considered allowing multiple modifiers for TextFieldSection: one for the Section and one for TextField but Jetpack Compose produces a warning if attempting to have modifiers with names other than modifier.

I imagine this was done for better practices when writing Composables in order to indicate that a Composable should be split up if there are multiple modifiers required in order make it work.

This is mainly why I went with the option to make TextFieldSection a Section that reads a textFieldController for a majority of its values then have the consumer pass TextField as part of its content.

}

/**
Expand Down
Loading