Background/Goal
The TypeaheadSearch component is designed and built on top of the SearchInput component and, like its "parent", it should present two anatomic variants:
- A variant that features only a single input type search
- A variant that also includes a 'Search' button besides the input
Nevertheless, the current released version of the TahS component displays its search button when users hover on the element. How might we capture this logic?
Options
- (Initial decision) Make this idiosyncratic behaviour to be handled by the application. The logic that makes the Search button to be displayed on hover/active could be considered to not be core to the component, and thus would need to be implemented in context.
- Nevertheless, since the TahS will be reused with its current logic in many of our projects, it would be reasonable to simplify its reusage by allowing implementers to enabe this logic via a prop (e.g. "hideButtonByDefault" or "showButtonOnHover") of the "with button" version. Problem: we'd be contradicting our component architecture by adding this configuration to only one of the variants of the component, since component configuration should be shared between variants.
- Creating a new variant of the TahS component that includes this logic. We'd need to consider whether we'd then want to apply this behaviour to the parent SearchInput component.
- Make this the default behavior of the TahS component in Codex. (Wouldn’t be aligned with the default behavior of its parent, the SearchInput component)
- Create a new variant of the SearchInput component that displays this behavior, and a subsequent TahS variant derived from it