Vgs
fun VgsCvcTextField(state: VgsCvcTextFieldState, onStateChange: (state: VgsCvcTextFieldState) -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, readOnly: Boolean = false, textStyle: TextStyle = LocalTextStyle.current, label: @Composable () -> Unit? = null, placeholder: @Composable () -> Unit? = null, leadingIcon: @Composable () -> Unit? = null, trailingIcon: @Composable () -> Unit? = null, isError: Boolean = false, keyboardOptions: KeyboardOptions = KeyboardOptions.Default, keyboardActions: KeyboardActions = KeyboardActions.Default, interactionSource: MutableInteractionSource? = null, shape: Shape = TextFieldDefaults.TextFieldShape, colors: TextFieldColors = TextFieldDefaults.textFieldColors())
Material filled text field for collecting a card security code (CVC/CVV).
Obtain state with com.verygoodsecurity.vgscollect.widget.compose.state.rememberVgsCvcTextFieldState and pass the latest instance back through onStateChange. Sync the detected brand from your card-number state so the required length adapts (3 digits for most brands, 4 for Amex):
LaunchedEffect(cardNumberState.cardBrand) {
cvcState = cvcState.withCardBrand(cardNumberState.cardBrand)
}Content copied to clipboard
The raw value stays inside the SDK — submit by passing the state to com.verygoodsecurity.vgscollect.core.VGSCollect.asyncSubmit.
Parameters
state
current immutable field state.
on
invoked with the next state on every user edit.