Search component is missing a CTA

Detailed description

The Search component does not have a button to perform the search. I understand it can work by pressing the Enter key after typing the query but this is not accessible. So far we have been adding a button next to the search field to solve this case but it would be great if we can just make the icon in the Search component clickable so that the designs are looking clean as well.

We are currently using Carbon V9 on a released product for IBM Talent Management Solutions and are planning to re-design the product and move to V10 soon.

Steps to reproduce the issue

1. Type content in the input field of the Search component
2. Confirm search by clicking somewhere

Additional information

• Some use cases might open a suggested drop-down list while typing which would mean any of those results could be clickable but it still doesn’t allow the user to search for the typed query.
• If we are meant to add an additional Button component to allow for the described use case it would be great if an example can be added to the documentation

Thanks for reading!

[jeanservaas]

@asudoh yes we do currently have the magnifier on the left in v10. The above design was an alternate version of search for a situation in which you click on the icon button to trigger the search. It doesn’t seem intuitive in this situation to keep the icon button on the left…

But I’m curious to see what @shixiedesign thinks. She’s out today but will be back online tomororow.

[jeanservaas]

@kosruben – here is the final spec – there were some old out of date things in that previous one. I also updated this file with the color tokens.

Sketch file:

Alternate_Search_spec.zip