Editable Text
Introduction
EditableText
appears as normal UI text but transforms into a text input field
when the user focuses it.
The below information is a snippet from the
related section in the Blueprint reference documentation.
Examples
Edit title...
Edit multiline text...
Usage
EditableText
API Reference
EditableText
Prop Name | Required? | Type | Description |
---|---|---|---|
className | false | string | A space-delimited list of class names to pass along to a child element. |
confirmOnEnterKey | false | boolean | If `true` and in multiline mode, the `enter` key will trigger onConfirm and `mod+enter` will insert a newline. If `false`, the key bindings are inverted such that `enter` adds a newline. |
defaultValue | false | string | Default text value of uncontrolled input. |
disabled | false | boolean | Whether the text can be edited. |
intent | false | Intent | Visual intent color to apply to element. |
isEditing | false | boolean | Whether the component is currently being edited. |
maxLength | false | number | Maximum number of characters allowed. Unlimited by default. |
maxLines | false | number | Maximum number of lines before scrolling begins, when `multiline`. |
minLines | false | number | Minimum number of lines (essentially minimum height), when `multiline`. |
minWidth | false | number | Minimum width in pixels of the input, when not `multiline`. |
multiline | false | boolean | Whether the component supports multiple lines of text. This prop should not be changed during the component's lifetime. |
placeholder | false | string | Placeholder text when there is no value. |
selectAllOnFocus | false | boolean | Whether the entire text field should be selected on focus. If `false`, the cursor is placed at the end of the text. |
type | false | string | The type of input that should be shown, when not `multiline`. |
value | false | string | Text value of controlled input. |
Related Reading
Blueprint Reference