Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement searchbar_card for wave #390

Closed
wants to merge 1 commit into from

Conversation

VijithaEkanayake-zz
Copy link

searchbar_card can be used to horizontally align textbox and button on the requirement. Fixes: #372

searchbar_card can be used to horizontally align textbox and button on the requirement. Fixes: #372
@lo5
Copy link
Member

lo5 commented Dec 17, 2020

Is there a strong reason for this to be in a card of its own? I'm not sure I understand the need for a separate search bar component (and nested/multiple search textboxes). The current textbox with a search icon can serve this purpose if we add enter key handling to it.

What do you think @mturoci?

@VijithaEkanayake-zz
Copy link
Author

@lo5 The issue we face was, we had to use two different cards to submit the text-box values if we are not using triggers.
image
Basically wanted to have a textbox and a button next to each other and thought it is a very common use case that many people will definitely try to put stuff next to each other. For our case having a search icon with enter key handling also fine I guess.

@mturoci
Copy link
Collaborator

mturoci commented Dec 17, 2020

The current textbox with a search icon can serve this purpose if we add enter key handling to it

Good suggestion. I see the point of this card only in solving the problem people were asking about since the birth of Wave itself - how to put a button next to a textbox.

I personally prefer searchbars with debounce / enter instead of buttons, but I can be biased as a software dev.

Nonetheless, if we still want to proceed with this card, I would do the following:

  • Remove all the positioning and go with reasonable defaults - just put the button on the right side and align it. Right now this is not a searchbar implementation, but rather flexbox form I would say.
  • Change the API to match textbox API.
  • Add proper unit tests.

@lo5
Copy link
Member

lo5 commented Dec 17, 2020

I personally prefer searchbars with debounce / enter instead of buttons

Agree. Button-less search boxes are almost universal now - Chrome, Google Search, Github, etc., so I don't see a strong UX reason to put a button next to a textbox. Let's go with the enter key handling.

@VijithaEkanayake-zz
Copy link
Author

VijithaEkanayake-zz commented Dec 17, 2020

I personally prefer searchbars with debounce / enter instead of buttons

Agree. Button-less search boxes are almost universal now - Chrome, Google Search, Github, etc., so I don't see a strong UX reason to put a button next to a textbox. Let's go with the enter key handling.

Yeah, we can use enter key handling instead of a separate card. I'll close this PR. Thanks for the insights.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add enter handler for textbox
4 participants