FormControlComponent

open class FormControlComponent : Component<Unit>

This component class manages the configuration of a formControl and some render centric functionalities. The former are important for clients of a formControl, the latter for extending or changing the default behaviors.

A formControl can be configured in different aspects:

  • a label for a description of the control as a whole

  • mark the control as required

  • an optional helper text

  • provide a validation message as a Flow]; the severity is reflected by the default theme!

  • provide a store to the control itself, with optional additional validation (dev.fritz2.components.validation.WithValidator) at best, in order to automatically apply model validation and get the results shown

Customizing the control:

To add a new control, extend this class and add a new control function that wraps the desired control component factory function like FormControlComponent.inputField, FormControlComponent.selectField, FormControlComponent.checkbox, FormControlComponent.checkboxGroup and FormControlComponent.radioGroup do.

In order to simply change the target of some of the default control wrapping function to a different control component, extend this class and override the desired function. Be aware that you cannot provide default arguments for an overridden function, so you must offer a new function with default arguments that just directs to the overridden one.

Be aware of the render strategy - pick whether your control should be rendered as a single control or a group.

If those do not fit, just implement the ControlRenderer interface and pair it with the string based key of the related control wrapping function. Have a look at the initRenderStrategies and finalizeRenderStrategies field and ControlRegistration.assignee field to learn how the mapping between control and rendering strategy is done.

Constructors

Link copied to clipboard
fun FormControlComponent()

Types

Link copied to clipboard
object Companion
Link copied to clipboard
data class Control(    val id: String?,     val name: String,     val rendering: RenderContext.() -> RenderContext)
Link copied to clipboard
class ControlRegistration
Link copied to clipboard
object FormSizeContext
Link copied to clipboard
class ValidationResult(val messages: Flow<List<ComponentValidationMessage>>?)

Functions

Link copied to clipboard
open fun checkbox(    styling: BasicParams.() -> Unit = {},     baseClass: StyleClass = StyleClass.None,     value: Store<Boolean>? = null,     id: String? = value?.id ?: "${ControlNames.checkbox}-${Id.next()}",     prefix: String = ControlNames.checkbox,     build: CheckboxComponent.() -> Unit = {})
Link copied to clipboard
open fun <T> checkboxGroup(    styling: BasicParams.() -> Unit = {},     items: List<T>,     values: Store<List<T>>? = null,     baseClass: StyleClass = StyleClass.None,     id: String? = values?.id ?: "${ControlNames.checkboxGroup}-${Id.next()}",     prefix: String = ControlNames.checkboxGroup,     build: CheckboxGroupComponent<T>.() -> Unit = {})
Link copied to clipboard
open fun inputField(    styling: BasicParams.() -> Unit = {},     value: Store<String>? = null,     baseClass: StyleClass = StyleClass.None,     id: String? = value?.id ?: "${ControlNames.inputField}-${Id.next()}",     prefix: String = ControlNames.inputField,     build: InputFieldComponent.() -> Unit = {})
Link copied to clipboard
open fun <T> radioGroup(    styling: BasicParams.() -> Unit = {},     items: List<T>,     value: Store<T>? = null,     baseClass: StyleClass = StyleClass.None,     id: String? = value?.id ?: "${ControlNames.radioGroup}-${Id.next()}",     prefix: String = ControlNames.radioGroup,     build: RadioGroupComponent<T>.() -> Unit = {})
Link copied to clipboard
open override fun render(    context: RenderContext,     styling: BoxParams.() -> Unit,     baseClass: StyleClass,     id: String?,     prefix: String)

Central method that should do the actual rendering of a component.

Link copied to clipboard
open fun renderHelperText(renderContext: RenderContext)
Link copied to clipboard
open fun renderValidationMessages(renderContext: RenderContext)
Link copied to clipboard
open fun <T> selectField(    styling: BasicParams.() -> Unit = {},     items: List<T>,     value: Store<T>? = null,     baseClass: StyleClass = StyleClass.None,     id: String? = value?.id ?: "${ControlNames.selectField}-${Id.next()}",     prefix: String = ControlNames.selectField,     build: SelectFieldComponent<T>.() -> Unit = {})
Link copied to clipboard
open fun slider(    styling: BasicParams.() -> Unit = {},     value: Store<Int>? = null,     baseClass: StyleClass = StyleClass.None,     id: String? = value?.id ?: "${ControlNames.slider}-${Id.next()}",     prefix: String = ControlNames.slider,     build: SliderComponent.() -> Unit = {})
Link copied to clipboard
open fun switch(    styling: BasicParams.() -> Unit = {},     value: Store<Boolean>? = null,     baseClass: StyleClass = StyleClass.None,     id: String? = value?.id ?: "${ControlNames.switch}-${Id.next()}",     prefix: String = ControlNames.switch,     build: SwitchComponent.() -> Unit = {})
Link copied to clipboard
open fun textArea(    styling: BasicParams.() -> Unit = {},     value: Store<String>? = null,     baseClass: StyleClass = StyleClass.None,     id: String? = value?.id ?: "${ControlNames.textArea}-${Id.next()}",     prefix: String = ControlNames.textArea,     build: TextAreaComponent.() -> Unit = {})
Link copied to clipboard
open fun typeAhead(    styling: BasicParams.() -> Unit = {},     value: Store<String>? = null,     items: Proposal,     baseClass: StyleClass = StyleClass.None,     id: String? = value?.id ?: "${ControlNames.typeAhead}-${Id.next()}",     prefix: String = ControlNames.typeAhead,     build: TypeAheadComponent.() -> Unit = {})

Properties

Link copied to clipboard
Link copied to clipboard
val helperText: ComponentProperty<String?>
Link copied to clipboard
val helperTextStyle: ComponentProperty<Style<BasicParams>>
Link copied to clipboard
val label: DynamicComponentProperty<String>
Link copied to clipboard
val labelStyle: ComponentProperty<Style<BasicParams>>
Link copied to clipboard
val ownSize: Style<BasicParams>
Link copied to clipboard
val validationMessage: ComponentProperty<() -> Flow<ComponentValidationMessage?>?>
Link copied to clipboard
val validationMessageRendering: ComponentProperty<RenderContext.(ComponentValidationMessage) -> Unit>
Link copied to clipboard
val validationMessages: ComponentProperty<() -> Flow<List<ComponentValidationMessage>>?>