[fix] <Search/> component does not have "X" to clear
ReactUSWDS Version & USWDS Version:
"@trussworks/react-uswds": "^6.2.0",
"@uswds/uswds": "3.4.1",
Describe the bug
By default the USWDS Search component has the "X" to clear input functionality.
In Trussworks' implementation of the Search component, there is no "X" to clear input functionality. That seems to be exclusively available to items that utilize the <ComboBox />.
To Reproduce Steps to reproduce the behavior:
- Go to the Search component
- https://trussworks.github.io/react-uswds/?path=/story/components-search-search--default-search
- Attempt to clear via "X" to clear
- There is none
Screenshots
USWDS Search input:
Trussworks Search input:
I think I found the issue, since that "X" is appearing as a native HTML element due to type="search" being an attribute on the <input> field, so I realized the class usa-input on the <form> is removing the "X"!
Demo of the "fix":
https://github.com/trussworks/react-uswds/assets/516877/2acaa705-6ca5-41a5-93c9-3193f695aa98
Noting that there is no 'x' even on the USWDS Search component if I'm using Firefox, but on Chrome it does appear.