web: update `Input` component API
Created by: valerybugakov
Context
Before migrating to the Wildcard Input
component we need to make it possible to use Label
and Input
separately because sometimes they are located in different parts of the UI. Instead of always wrapping Input
into Label
like it's done in the current version we can leave it as an optional behavior, but allow to use Input
independently.
<div>
<Label htmlFor="email">Email</Label>
<EmailCoolDescription />
<Input id="email" />
</div>
Changes
- Make
Label
optional in theInput
component. - Introduce
InputStatus
that is useful in the follow-up migration of theFormInput.tsx
used in code-insights. - Use the
Label
component everywhere in the Wildcard instead of the rawlabel
element.
Test plan
Run yarn build-ts
locally and check visual regressions in the Input
story.