Text Area
Interface element that allows users to enter multi-line text. It is typically used for entering longer pieces of text, such as comments, descriptions, or messages, and is often characterized by its scrollable nature, which allows the text box to grow and accommodate more content as the user types.
Type | Resource |
---|---|
Design | Figma |
Web | Web Storybook |
Code | Gitlab |
Usage
import id.co.biofarma.binduiandroid.components.textarea.TextArea
TextArea(
label = "label",
required = true,
placeholder = "default input",
maxLength = "100",
showCount = true,
isError = false,
disabled = false,
rows = "10",
maxRows = "default",
helperText = "helperText",
errorText = "default",
value = "default",
onChange = { value ->
textValue = value
}
)
Examples
Size
Use size for change size of text area component: sm
, md
or lg
Mode (Optional)
Use mode for change color mode of text area component: light
or dark
Props
Props | Required | Default | Type | description |
---|---|---|---|---|
id | true | - | string | For set the id of text area component. |
label | true | label | string | For set the label of text area component. |
required | false | false | boolean | For toggle required on or off. |
placeholder | true | placeholder | string | For set placeholder text of text area component. |
maxLength | true | 100 | number | For set maxLength of place holder text character. |
showCount | false | false | boolean | For toggle character count show or hide. |
isError | false | false | boolean | For toggle error or not-error. |
disabled | false | false | boolean | For toggle disable or enable text area. |
rows | true | 10 | number | For set rows of text area. |
maxRows | true | default | string | For set maxrows of text area. |
helperText | false | - | string | For change helpertext of text area. |
errorText | false | default | string | For change errortext of the text area. |
value | false | default | string | For change value of the text area. |