TextAreaComponent

open class TextAreaComponent(valueStore: Store<String>?) : Component<TextArea> , EventProperties<HTMLTextAreaElement> , ElementProperties<TextArea> , InputFormProperties, SeverityProperties, TooltipProperties

This class handles the configuration of a textarea element.

Possible values to set are( default *) :

  • size : small | normal * | large

  • resizeBehavior : none | vertical *| horizontal

  • placeholder : String | Flow

  • disable : Boolean | Flow

  • 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!

  • the base options of the HTML input element can be set. Attributes

Example usage

// Basic usage
textArea(value = dataStore) {
placeholder { "My placeholder" } // render a placeholder text for empty textarea
}

// Styling and options
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
}

// disabled
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
}
}

Constructors

TextAreaComponent
Link copied to clipboard
js
fun TextAreaComponent(valueStore: Store<String>? = null)

Types

Companion
Link copied to clipboard
js
object Companion

Functions

enabled
Link copied to clipboard
js
open override fun enabled(value: Boolean)
open override fun enabled(value: Flow<Boolean>)
render
Link copied to clipboard
js
open override fun render(context: RenderContext, styling: BoxParams.() -> Unit, baseClass: StyleClass, id: String?, prefix: String): TextArea
Central method that should do the actual rendering of a component.
severity
Link copied to clipboard
js
open override fun severity(value: SeverityProperties.SeverityContext.() -> Severity)
Property to manage the severity value of the component.
severityClassOf
Link copied to clipboard
js
open override fun severityClassOf(severityStyle: SeverityStyles): Flow<StyleClass>
This function manages the task to map a value of the Severity enumeration to a corresponding style defined within the SeverityStyles interface.
tooltip
Link copied to clipboard
js
open override fun tooltip(vararg text: String, build: TooltipComponent.() -> Unit)
open override fun tooltip(styling: BasicParams.() -> Unit, text: String?, baseClass: StyleClass, id: String, prefix: String, build: TooltipComponent.() -> Unit)

Properties

disabled
Link copied to clipboard
js
open override val disabled: DynamicComponentProperty<Boolean>
element
Link copied to clipboard
js
open override val element: ComponentProperty<TextArea.() -> Unit>
This property enables the client to access the deeper features of an element even though the component itself does not offer an appropriate functionality.
events
Link copied to clipboard
js
open override val events: ComponentProperty<EventContext<HTMLTextAreaElement>.() -> Unit>
This property enables the client to access all events offered by the underlying HTML element.
placeholder
Link copied to clipboard
js
val placeholder: DynamicComponentProperty<String>
readonly
Link copied to clipboard
js
open override val readonly: DynamicComponentProperty<Boolean>
renderTooltip
Link copied to clipboard
js
open override val renderTooltip: ComponentProperty<Tag<HTMLElement>.() -> Unit>
resizeBehavior
Link copied to clipboard
js
val resizeBehavior: ComponentProperty<TextAreaResize.() -> Style<BasicParams>>
severity
Link copied to clipboard
js
open override val severity: NullableDynamicComponentProperty<Severity?>
size
Link copied to clipboard
js
val size: ComponentProperty<FormSizesStyles.() -> Style<BasicParams>>
value
Link copied to clipboard
js
val value: DynamicComponentProperty<String>
variant
Link copied to clipboard
js
val variant: ComponentProperty<TextAreaVariants.() -> Style<BasicParams>>