textArea

fun RenderContext.textArea(styling: BasicParams.() -> Unit = {}, value: Store<String>? = null, baseClass: StyleClass = StyleClass.None, id: String? = null, prefix: String = "textArea", build: TextAreaComponent.() -> Unit)

This component generates a TextArea.

You can optionally pass a store in order to set the value and react to updates automatically.

To enable or disable it or to make it readOnly, just use the well known attributes of HTML.

Possible values to set are( default *) :

  • size : small | normal * | large

  • resizeBehavior : none | vertical *| horizontal

  • placeholder : String | Flow<String>

  • disable : Boolean | Flow<Boolean>

  • value -> maybe you want to set an initial value instead of a placeholder

  • events -> access the DOM events of the underlying HTML element

  • element -> basic properties of the textarea html element; use with caution!

textArea(value = dataStore) { placeholder { "My placeholder" } // render a placeholder text for empty textarea resizeBehavior { horizontal } // resize textarea horizontal size { small } // render a smaller textarea }

textArea({ // use the styling parameter background { color { dark } } color { light } radius { "1rem" }}, store = dataStore) { disable(true) // textarea is disabled resizeBehavior { none } // resizing is not possible size { large } // render a large textarea }

textArea { value { dataStore.data } // value depends on value in store disable(true) // editing is disabled, but resizing still works }

// all state management can also be done manually if needed: val someStore = storeOf("some initial text") textArea { value(someStore.data) events { changes.values() handledBy someStore.update } }

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 TextAreaComponent

id

the ID of the element

prefix

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

styling

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

value

optional Store that holds the data of the textarea