[input elements V2]: To provide placeholder option or not?

[sandra-post]

Situation

• In Figma, we did not include the placeholder to input elements (text input, text area, ...) due to possible accessibility issues (see research)
• In Storybook, the following elements currently have a placeholder:
  • Text input
  • Search input
  • Text area

Accessibility issues

From accessibility POV, there are some issues when using placeholders:

• if used as replacement for accurate labels and/or hint texts --> not accessible because placeholder disappears on focus
• its ok to use them but only additionally to labels/hints, so that on focus, the information given with the placeholder is still visible via label and/or hint
• Theoretically, floating labels serve as placeholders

Question

Do we provide with Design System V2 placeholders for input elemnts or not?
--> If YES: Adjust design in Figma
--> If NO: Remove from Storybook

[sandra-post]

Decision Pattern Discussion 17-Dec-2024

• We dont add Placeholder in design
• We add recommendation to not use it in design and code documentation
• We do NOT block placeholder by code, so if devs still want to use it, we are not blocking them. But we are also not promoting it

Tasks

• Add recommendation in design docs
• Add recommendation in dev docs
• Remove placeholder in implementation (compos: Text input, Search input, Text area)