@Composablepublic fun InputField(value: String,onValueChange: (String) -> Unit,modifier: Modifier = Modifier,enabled: Boolean = true,maxLines: Int = Int.MAX_VALUE,border: BorderStroke = BorderStroke(1.dp, ChatTheme.colors.borders),innerPadding: PaddingValues = PaddingValues(horizontal = 16.dp, vertical = 8.dp),keyboardOptions: KeyboardOptions = KeyboardOptions(capitalization = KeyboardCapitalization.Sentences),decorationBox: @Composable (innerTextField:@Composable () -> Unit) -> Unit,) {var textFieldValueState by remember { mutableStateOf(TextFieldValue(text = value)) } val selection = if (textFieldValueState.isCursorAtTheEnd()) {TextRange(value.length)} else {textFieldValueState.selection}val textFieldValue = textFieldValueState.copy(text = value,selection = selection) val description = stringResource(id = R.string.stream_compose_cd_message_input) BasicTextField(modifier = modifier.border(border = border, shape =ChatTheme.shapes.inputField).clip(ChatTheme.shapes.inputField).background(ChatTheme.colors.inputBackground).padding(innerPadding).semantics {contentDescription = description },value = textFieldValue,onValueChange = {textFieldValueState = itif (value != it.text) {onValueChange(it.text)}},textStyle = ChatTheme.typography.body.copy(color = ChatTheme.colors.textHighEmphasis,textDirection = TextDirection.Content),cursorBrush = SolidColor(ChatTheme.colors.primaryAccent),decorationBox = { innerTextField -> decorationBox(innerTextField) },maxLines = maxLines,singleLine = maxLines == 1,enabled = enabled,keyboardOptions = keyboardOptions)}
Custom input field that we use for our UI. It's fairly simple - shows a basic input with clipped corners and a border stroke, with some extra padding on each side.Within it, we allow for custom decoration, so that the user can define what the input field looks like when filled with content.