Stylish UI/com.segnities007.stylishui.components.organisms/StylishSearchBar

StylishSearchBar

fun StylishSearchBar(query: String, onQueryChange: (String) -> Unit, onSearch: (String) -> Unit, active: Boolean, onActiveChange: (Boolean) -> Unit, modifier: Modifier = Modifier, placeholder: @Composable () -> Unit? = null, leadingIcon: @Composable () -> Unit? = null, trailingIcon: @Composable () -> Unit? = null, shape: Shape = RoundedCornerShape(StylishTheme.dimensions.connectedCornerRadius), colors: SearchBarColors = SearchBarDefaults.colors( containerColor = MaterialTheme.colorScheme.surfaceContainerHigh, ), content: @Composable ColumnScope.() -> Unit = {})

A search bar with a collapsed input field and an expanded results panel, wrapping the Material 3 SearchBar with Stylish defaults.

Hoist query and active to the caller. While active is true, the bar expands and shows content (typically a list of suggestions) below the input field. onSearch fires when the user commits a query via the IME search action; onActiveChange fires when the bar is expanded or collapsed.

Parameters

query

Current text of the search query.

onQueryChange

Called with the new text as the user types.

onSearch

Called with the committed query when the user presses the search action on the keyboard.

active

Whether the search bar is expanded and showing search results.

onActiveChange

Called when the expanded state should change.

modifier

Modifier applied to the SearchBar root.

placeholder

Optional hint text shown when query is empty, typically a Text in the on-surface-variant color.

leadingIcon

Optional icon shown at the start of the input field, typically a search icon.

trailingIcon

Optional icon shown at the end of the input field, e.g. a clear button.

shape

Corner shape of the collapsed search bar. Defaults to RoundedCornerShape with StylishTheme.dimensions.connectedCornerRadius.

colors

SearchBarColors for the bar. Defaults to SearchBarDefaults.colors with a MaterialTheme.colorScheme.surfaceContainerHigh container.

content

Content shown below the input field while active, typically a column of suggestion Texts or rows.