OutlinedPhoneField

fun OutlinedPhoneField(value: TextFieldValue, onValueChange: (TextFieldValue) -> Unit, validator: FormValidator = remember { FormValidator.PHONE }, mask: String? = DEFAULT_MASK, maskChar: Char = DEFAULT_MASK_CHAR, modifier: Modifier = Modifier, label: @Composable () -> Unit? = null, keyboardOptions: KeyboardOptions = KeyboardOptions( keyboardType = KeyboardType.Phone ), keyboardActions: KeyboardActions = KeyboardActions.Default, leadingIcon: @Composable () -> Unit? = { Icon( imageVector = AuthIcons.rememberCallIcon(), contentDescription = "Phone", ) }, singleLine: Boolean = true, enabled: Boolean = true, isError: Boolean? = null, interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }, textStyle: TextStyle = LocalTextStyle.current, shape: Shape = OutlinedTextFieldDefaults.shape, colors: TextFieldColors = OutlinedTextFieldDefaults.colors(), visualTransformation: VisualTransformation = mask?.let { PhoneVisualTransformation(it, maskChar) } ?: VisualTransformation.None, supportingText: @Composable (validPhone: Boolean) -> Unit? = { if(!it) Text("Please enter a valid phone number") }, trailingIcon: @Composable () -> Unit? = null, placeholder: @Composable () -> Unit? = null, formKey: String = "PHONE", mandatory: Boolean = true)(source)
fun OutlinedPhoneField(value: String, onValueChange: (String) -> Unit, validator: FormValidator = remember { FormValidator.PHONE }, mask: String? = DEFAULT_MASK, maskChar: Char = DEFAULT_MASK_CHAR, modifier: Modifier = Modifier, label: @Composable () -> Unit? = null, keyboardOptions: KeyboardOptions = KeyboardOptions( keyboardType = KeyboardType.Phone ), keyboardActions: KeyboardActions = KeyboardActions.Default, leadingIcon: @Composable () -> Unit? = { Icon( imageVector = AuthIcons.rememberCallIcon(), contentDescription = "Phone", ) }, singleLine: Boolean = true, enabled: Boolean = true, isError: Boolean? = null, interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }, textStyle: TextStyle = LocalTextStyle.current, shape: Shape = OutlinedTextFieldDefaults.shape, colors: TextFieldColors = OutlinedTextFieldDefaults.colors(), visualTransformation: VisualTransformation = mask?.let { PhoneVisualTransformation(it, maskChar) } ?: VisualTransformation.None, supportingText: @Composable (validPhone: Boolean) -> Unit? = { if(!it) Text("Please enter a valid phone number") }, trailingIcon: @Composable () -> Unit? = null, placeholder: @Composable () -> Unit? = null, formKey: String = "PHONE", mandatory: Boolean = true)(source)

A custom email input field with validation and pre-defined styling.

Parameters

value

The current value of the phone field.

onValueChange

The callback function for when the value of the phone field changes.

validator

The form validator used to validate the phone field value. Defaults to FormValidator.PHONE.

mask

The mask for the phone field. This changes how the phone number gets displayed. The value will still be the raw number. Defaults to "+## ### #########".

maskChar

The mask character for the phone field. Defaults to '#'.

modifier

The modifier for styling the phone field. Defaults to Modifier.

label

The label for the phone field. Defaults to null.

keyboardOptions

The keyboard options for the phone field. Defaults to KeyboardOptions(keyboardType = KeyboardType.Email).

keyboardActions

The keyboard actions for the phone field. Defaults to KeyboardActions.Default.

leadingIcon

The leading icon for the phone field. Defaults to an email icon.

singleLine

Whether the phone field should be a single line or multiline. Defaults to true.

enabled

Whether the phone field should be enabled for user interaction. Defaults to true.

isError

Whether the phone field should display an error state. Defaults to null (handled automatically).

interactionSource

The interaction source for the phone field. Defaults to MutableInteractionSource.

textStyle

The text style for the phone field. Defaults to LocalTextStyle.current.

shape

The shape of the phone field. Defaults to TextFieldDefaults.shape.

colors

The colors for the phone field. Defaults to TextFieldDefaults.colors().

supportingText

A composable function to display supporting text based on the validity of the phone field value. Defaults to displaying "Please enter a valid email address" if the value is not a valid email.

trailingIcon

The trailing icon for the phone field. Defaults to null.

placeholder

The placeholder for the phone field. Defaults to null.

formKey

The key to store the validity of the phone field in the AuthState. Defaults to "EMAIL".

mandatory

Whether the form field is mandatory or not. If false, will not affect the AuthState.validForm value. You can also make this value dynamic and only make the field mandatory, if e.g. the value is not empty. Default is true.