CheckboxGroupComponent

This class combines the configuration and the core styling of a checkbox group. The rendering itself is also done within the companion object.

In order to render a checkbox group use the checkboxGroup factory function!

This class offers the following configuration features:

• the items as a flowOf(List<T>)

• the label(mapping) of a switch (static, dynamic via a Flow<String> or customized content of a Div.RenderContext ) the the example below

• some predefined styling variants (size)

• the style of the items (checkbox)

• the style checked state

• the style of the label

• the checked icon ( use our icon library of our theme )

• link an external boolean flow to set the disabled state of the box *

• choose the direction of checkbox elements (row vs column)

This can be done within a functional expression that is the last parameter of the factory function, called `build`. It offers an initialized instance of this CheckboxGroupComponent class as receiver, so every mutating method can be called for configuring the desired state for rendering the checkbox.

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"}}
     }}
}