Remove placeholders

[benbcai]

Bug Report

Description

The contrast of the color of placeholders with their background does not meet the minimum color contrast ratio of 4.5:1. Darkening the placeholder color increases the risk of making it appear as actual entered value. For this reason, placeholders in terra-date-input, terra-date-picker, terra-time-input should be removed and replaced with help text.

Comment originally from cerner/terra-core#2992 was moved to this issue for guidance:
See #1193 (comment)

Additional Context / Screenshots

Expected Behavior

Possible Solution

Environment

• Component Name and Version:
• Browser Name and Version:
• Node/npm Version: [e.g. Node 8/npm 5]
• Webpack Version:
• Operating System and version (desktop or mobile):

@ Mentions

[benbcai]

The alteration direction below is copied from cerner/terra-core#2992 (comment)

---

Alteration directions for:

• terra-date-input
• terra-date-input/lib/DateInputField
• terra-date-picker
• terra-date-picker/lib/DatePickerField
• terra-time-input
• terra-date-time-picker

---

• The strings (the localized letter abbreviation date/time format masks, e.g. ) that are provided to the text inputs and the placeholder prop/html attributes need to be removed. The Date-Input component should remove "Month" as the placeholder text in the select and the text "- Select -" should be used instead to match the form-select components.
• For each of the base components (non-Field compositions), a new element that matches the styling of the help text prop in terra-form-field needs to be added, and localized letter abbreviation date/time format masks originally put in the placeholder (MM/DD/YYYY, hh:mm:ss, Month DD, YYYY) is now given to the help text placement
• For the component that do not have Field compositions (Time-Input and Date-Time-Picker) need to add Field compositions. All the Field compositions need to remove the help text of the format letter abbreviation masks in the stand-alone/imported inputs, and need to supply the text to the actual help prop. Format notes: If no additional help text is provided, the help text is only the provided format mask e.g. MM/DD/YYYY. If additional help text is provided, the format mask should be supplied first at (MM/DD/YYYY) followed by a space, followed by the text given to the help prop.
• Remove any css styles and variables for the placeholder in the input elements (exception for Date-Input which will keep the "- Select -" placeholder in the dropdown select).
• Add major version Upgrade Guide that includes these comments:
  TODO add the language needed for the accessibility and human factors guidance switching from consumers providing placeholders to providing more detailed help text with Field compositions.