checkboxGroup

fun <T> RenderContext.checkboxGroup(styling: BasicParams.() -> Unit = {}, store: Store<List<T>>, baseClass: StyleClass? = null, id: String? = null, prefix: String = "checkboxGroupComponent", build: CheckboxGroupComponent<T>.() -> Unit = {})

This component generates a group of checkboxes.

You can set different kind of properties like the labeltext or different styling aspects like the colors of the background, the label or the checked state. Further more there are configuration functions for accessing the checked state of each box or totally disable it. For a detailed overview about the possible properties of the component object itself, have a look at CheckboxGroupComponent

Example usage

// simple use case showing the core functionality
val options = listOf("A", "B", "C")
val myStore = storeOf(<List<String>>)
checkboxGroup(store = myStore) {
items { flowOf(options) } or use items(options) // provide a list of items you can
}

// use case showing some styling options and a store of List<Pair<Int,String>>
val myPairs = listOf((1 to "ffffff"), (2 to "rrrrrr" ), (3 to "iiiiii"), (4 to "tttttt"), ( 5 to "zzzzzz"), (6 to "222222"))
val myStore = storeOf(<List<Pair<Int,String>>)
checkboxGroup(store = myStore) {
label {
it.second
}
size { large }
items { flowOf(options) } or use items(options) // provide a list of items you can
checkedStyle {{
background { color {"green"}}
}}
}

See also

Parameters

baseClass

optional CSS class that should be applied to the element

build

a lambda expression for setting up the component itself. Details in CheckboxGroupComponent

id

the ID of the element

prefix

the prefix for the generated CSS class resulting in the form `$prefix-$hash`

store

a store of List<T>

styling

a lambda expression for declaring the styling as fritz2's styling DSL