fix(components): Adjust Clearable Positioning

[ZakaryH]

Motivations

while trying to implement Clearable on AutocompleteRebuilt, I was encountering an issue where the clearable button is not centered. even if I apply something to try to give the parent a relative, flex, attribute - the transform still gets in the way.

I don't believe the transform is necessary. we have a container that becomes the height of the input - why not let it center itself?

the only case I can immediately think of that might have unexpected results is a multiline inputText, however we don't currently support clearable on multiline inputs so that's not an issue. interestingly I think we'll encounter the same "problem" that has on the Autocomplete I'm making but to be honest I'm not sure it's that bad to have the button still be centered.

MUI does the exact same thing

Changes

Added

Changed

functionally it should be identical. hopefully the visual tests confirm that.

all that is different is now we center the button with a more flexible mechanism rather than the transform: 50% which doesn't always work and is a bit more complicated than align-items: center

Deprecated

Removed

Fixed

Security

Testing

Changes can be
tested via Pre-release

---

In Atlantis we use Github's built in pull request reviews.

[cloudflare-workers-and-pages]

Deploying atlantis with    Cloudflare Pages

Latest commit:	00debe5
Status:	✅  Deploy successful!
Preview URL:	https://1cd766ac.atlantis.pages.dev
Branch Preview URL:	https://adjust-clearable-position-lo.atlantis.pages.dev

View logs

[ZakaryH]

something else I've thought about while looking into this is why do we have each instance of handleClear focusing the input? why wouldn't we make that a responsibility of ClearAction?

if you have a value, and you press clear to remove it or all values, then the clear button goes away since there's nothing to clear. because the element that just had focus is gone, focus has to go somewhere. the most sensible place would be the input associated with the clear button.

[ZakaryH]

@jdeichert this is the PR that should go into master first