fix: use popper for form validation messages

[jacobdevera]

Description

• use FormValidationOverlay to display validation messages. Remove direct renders of FormMessage, which consumes DOM space
• do not display validation message until field is focused (per https://experience.sap.com/fiori-design-web/form-field-validation/)
• refactoring keyboard navigation of Select to rely on focusManager in Popover instead
• add firstFocusIndex prop to Popover to indicate a focusable item to focus first

Affected components with validation

• ComboBoxInput
• DatePicker
• FormInput
• FormTextarea
• InputGroup
• MultiSelect
• Select
• StepInput

Out of Scope

If a component did not already have keyboard navigation, it was not added

fixes #1095

[netlify]

Deploy preview for fundamental-react ready!

Built with commit 3c17a65

https://deploy-preview-1105--fundamental-react.netlify.app

[jbadan]

This looks really good! Two things:

1. comboboxinput, multiInput, localizationeditor, searchInput, select - when I click into the input - the dropdown opens, when I tab into it only the validation opens. I'm totally fine with this being a followup if you need to get this DatePicker fix to production asap

2. something went wonky with inputgroup styles

[jacobdevera]

1. comboboxinput, multiInput, localizationeditor, searchInput, select - when I click into the input - the dropdown opens, when I tab into it only the validation opens.

I believe this is consistent with previous behavior; they should only open on click. However, form validation should appear on focus as well. But a deeper dive for these components could be done in a separate PR.

2. something went wonky with inputgroup styles

✅