Make search bar operate as expected on website/docs.

[silvaDominic]

Description

Replace dummy search bar with functioning one and drop floating search bar on desktop.

Problem Statement/Justification

The search bar for the documentation implies it is an input field but is actually a button. Clicking it opens a functioning, floating input field slightly below it. This is not expected behavior and is technically wrong from a UX perspective. I wouldn't ordinarily mention that, but given that this is for a UI library catered to UI developers, it kind of feels warranted.

Proposed Solution or API

Replace dummy search bar with actual search bar.

Alternatives

I still think there is a place for the floating search bar however. It would be more appropriate for mobile (which currently doesn't even have search available) where a search button icon would open a floating/focused search bar. This would be within the realms of a reasonable expectation on mobile.

Additional Information

[noobinthisgame]

@nikolovlazar this is a docs topic :)

[silvaDominic]

My bad, didn't realize there was a repo for it. Thanks for transferring @noobinthisgame.

[nikolovlazar]

Thank you for raising this issue, @silvaDominic. I totally get your point.

I did a little research and noticed that it's a common pattern across UI frameworks like Chakra UI. Check out Tailwind, MUI, and Mantine.dev for example. All of them have a "fake search bar". I'm not saying no, though. It definitely is a good practice to make it a real search bar, but I don't think it's something we need to focus on at the moment. We do plan on redesigning the whole docsite for v2, so we will have this issue on mind while doing so.

I'll close this issue, but thank you again for bringing it to our attention!

[silvaDominic]

Thanks for posting some other uses @nikolovlazar. It's definitely something I've seen emerging recently. I do see benefits to the modal search approach, but I think there's just better ways to do. As someone who's news to Chakra and has been frequenting the docs, my brain would just twitch every time the modal would popup and my attention was redirected.

Regardless, happy to hear there's a new version in the works and that you'll keep my issue in mind. Liking the component library so far too!

Cheers