Skip to content

TextInput action hover state is incorrect  #3867

@maximedegreve

Description

@maximedegreve

Description

The hover state for clearing an input should just slightly change the icon color instead of providing a background behind it.
The background right now is also incorrectly sized making it even more apparent that it's implementation is incorrect.

Screenshot 2023-10-26 at 13 44 1

Additionally the example in storybook shows the clear button even though there is no input value. This is incorrect behaviour and could encourage a wrong pattern. It's crucial that the clear button is hidden when the input is empty. Therefore I suggest adding this simple functionality in storybook and be default add a value to it.

Steps to reproduce

  1. Go to https://primer.style/react/storybook/?path=/story/components-textinput-features--with-trailing-action
  2. Hover the clear button

Version

v35.32.1

Browser

Safari

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions