BaseMultilineTextInput

A multiline textfield base component

Props

Prop name	Description	Type	Values	Default
modelValue	input displayed in the textarea. if tabs prop is set, this needs to be an object with properties corresponding to tab names.	object|string	-	''
label	set the label for the input component	string	-	''
showLabel	set true if label should be visible	boolean	-	true
placeholder	set input field placeholder	string	-	''
tabs	set tabs for the input field	array	-	['default']
tabLabels	give the possibility to specify what should be displayed in the tabs	array	-	[]
activeTab	set the currently active tab (specify the property of the object not the label)	string	-	''
tabsLegend	set a legend for the tabs to be read (for accessibility only, hidden)	string	-	'Radiogroup'
inputId	set id which is used for label + id	string|number	-	''
language	set a language (ISO 639-1)	string	-	''
required	mark as required field (currently only used for aria-required)	boolean	-	false
invalid	mark the form field as invalid and ideally also provide an error message to display below the form field. for an example see BaseInput	boolean	-	false
disabled	set true if input field should be disabled. for an example see BaseInput	boolean	-	false
errorMessage	add an error message to be displayed below form field if field is invalid. for an example see BaseInput	string	-	''
showErrorIcon	define if error icon should be shown. for an example see BaseInput	boolean	-	true
clearable	if true a remove icon will be shown allowing to remove all input at once. for an example see BaseInput	boolean	-	false
assistiveText	provide assistive text for screen readers clearInput: text read for remove input icon if prop clearable is set true	object	-	{ clearInput: 'Clear input' }

Events

Event name	Properties	Description
update:model-value	undefined string, Object - the altered field input	Event emitted on input, passing input string or input object

Slots

Name	Description	Bindings
label-addition	to add drop down needed for text input field (base specific) or any other element deemed necessary
input-field-addition-before	Slot to allow for additional elements in the input field <div> (before <input>)
input-field-addition-after	for adding elements after input
post-input-field	elements after the actual input element but within the input field container. for an example see BaseChipsInputField
error-icon	use a custom icon instead of standard error/warning icon. for an example see BaseChipsInputField
remove-icon	use a custom icon instead of standard remove icon. for an example see BaseChipsInputField

---

Demo

Basic example with no extra settings

Example with Tabs