== Background goal
Explore design solutions for Field component before implementing it in Codex in T309239.
=== Design proposal
| [[ https://www.figma.com/file/uBYlqttQgO2tXXxTVJQj0T/Form-field---T309239?node-id=1504%3A10717&t=VNwsM6mhuY4Y03ZX-11 | Explorations captured in this Figma file ]] |
===== Required/Optional
Since all form fields are required by default, we will indicate just the optional ones in order to avoid too many asterisks across the form page. Optional text will appear next to the label and it will be included within the text when the label is multiline.
{F36867698}
===== Label and description
// It will be added here once it's done.//
===== Tooltip
Tooltip will be placed next to the label so it's not separated from the label when the field is too long. Tooltip will be included within the label text when it's multiline.
{F36867741}
===== Helper text and Inline message
// It will be added here once it's done.//
===== Characters counter
It will not be implemented as part of the MVP task. It will be implemented in this other task T331000
===== Field action (e.g. delete)
According to how the fields are connected, the Field component will display two different types of actions:
- Inline action
- Stacked action
{F36888368}
===== Label placement
// It will be added here once it's done.//
---
=== Acceptance criteria
[] Explore design proposals for:
[-] Required/Optional
[] Label and description
[-] Tooltip
[] Helper text and Inline message
[-] ~~Characters counter~~ It will be implemented in T331000
[-] Field action
[] Label placement
[] Review proposals with the design and DST team
[] Decide on the best solution to implement the component