Jenga/io.github.joelkanyi.jenga.component.textfield/JengaSelectField

JengaSelectField

fun JengaSelectField(value: String?, onClick: () -> Unit, modifier: Modifier = Modifier, label: String? = null, placeholder: String? = null, status: JengaTextFieldStatus = JengaTextFieldStatus.Default, supportingText: String? = null, enabled: Boolean = true, leadingIcon: @Composable () -> Unit? = null, trailingIcon: @Composable () -> Unit = { JengaIcon(JengaIcons.ChevronDown, contentDescription = null) }, shape: Shape = JengaTextFieldDefaults.shape, colors: JengaTextFieldColors = JengaTextFieldDefaults.colors(), textStyle: TextStyle = JengaTextFieldDefaults.textStyle, minHeight: Dp = JengaTextFieldDefaults.minHeight, contentPadding: PaddingValues = JengaTextFieldDefaults.contentPadding, focusRingWidth: Dp = JengaTheme.components.textField?.focusRingWidth ?: JengaTextFieldDefaults.FocusRingWidth)(source)

A field that shows a chosen value and opens a picker when tapped, instead of taking typed text. It looks like a JengaTextField; pair it with a picker such as io.github.joelkanyi.jenga.component.feedback.JengaListSheet.

Parameters

value

the chosen value's label, or null when nothing is chosen.

onClick

called when the field is tapped (open the picker here).

modifier

the Modifier for the whole field (label + box + support).

label

optional label shown above the field.

placeholder

optional hint shown while value is null.

status

validation status; see JengaTextFieldStatus.

supportingText

optional helper/error text shown below the field.

enabled

whether the field can be tapped.

leadingIcon

optional icon at the start (inherits the icon color).

trailingIcon

the end icon; a downward chevron by default.

shape

the field shape; defaults to JengaTextFieldDefaults.shape.

colors

the color set; defaults to JengaTextFieldDefaults.colors.

textStyle

the value and placeholder text style.

minHeight

the minimum height of the field box.

contentPadding

padding inside the field box.

focusRingWidth

space reserved around the box so it lines up with a JengaTextField.

Samples

var open by remember {
    mutableStateOf(
        value = false,
    )
}
var fault by remember {
    mutableStateOf<String?>(
        value = null,
    )
}
JengaSelectField(
    value = fault,
    onClick = { open = true },
    label = "Fault",
    placeholder = "Choose a fault",
)
if (open) {
    JengaListSheet(
        onDismissRequest = { open = false },
        title = "Fault",
        content = {
            items(
                items = listOf(
                    "Battery not charging",
                    "Panel damaged",
                ),
            ) { option ->
                JengaRadioListItem(
                    headline = option,
                    selected = option == fault,
                    onClick = {
                        fault = option
                        open = false
                    },
                )
            }
        },
    )
}