-
Notifications
You must be signed in to change notification settings - Fork 135
Platform: Text Input Component Technical Design
The text input is used to enter single of text. When empty, it can hold a placeholder similar to a select component. You can define the height and width of the text input and also determine specific behaviour when handling texts.
<fdp-input
[type]="cozy|compact"
[label]="Label for textarea:"
[labelIcon]="icon-name"
[isMandatory]="false | true"
[placeholderText]="Start writing something"
[state]="disabled|warning|valid|invalid|readonly"
[hint]="This is a sample message"
[growing]="true | false"
[maxLength]="35"
[rows]="1"
[showExceededText]="true"
[disabled]="true | false"
>
</fdp-input>can be cozy or compact type of input form factors
Label is the name of the control. This should not be the same text as placeholder. Part of Label Component.
An icon alongside the label to indicate that inline help is available. Part of Label Component(?).
Whether the input is required(asterisk) to be filled. Part of Label Component.
The prompt text that is displayed when the input field is empty.
Can be one of disabled|warning|valid|invalid|readonly. The helpMessage will take the appropriate state's colour.
A short message to provide feedback to users what has to be entered.
Whether the input should grow dynamically based on the content.
The maximum number of characters that can be entered in this input.
this marks input variable as read only.
N/A
N/A
N/A
N/A
Form, Label
Note: Please note that label, labelIcon and isMandatory will be implemented/changed depending on how Label component is implemented.
from Lokanathan:
how to handle the input validation in the input text, should we proceed with the type of data type like number | string | etc