Components
Search
Overview
Search fields provide a quick and easy way to access content and features within the neon framework by inputing keywords and returning results based on that content input.
Use a search field, when a user needs to query information about addresses, transaction types, filter table information, and account ID's.
Types
Global Search is present throughout the entire Neon ecosystem. The global search field is in the upper left of the toolbar. This search field is useful for identifying accounts, searching for an activity, and accessing subsections in Neon.
Filter Search allows users to search for a large number of filterable items in an efficient manner.
Best Practices
- Use placeholder text in the SearchBox to describe what users can search for. Example: "Search"; "Search accounts"; "Search donations"
- Provide autocomplete suggestions to help the user search quickly. These suggestions can be from past searches or auto-completions of the user's query text.
- Provide autocomplete suggestions where there are strong matches to the user's query that the user may want to view immediately.
- Don't leave the SearchBox blank because it's too ambiguous.
- Don't have lengthy and unclear hint text. It should be used to clarify and set expectations.
- Don't provide too many autocomplete suggestions, as that will overwhelm the user.
- Don't provide inaccurate matches or bad predictions, as it will make search seem unreliable and will result in user frustration.
- Don’t provide too much information or metadata in the suggestions list; it’s intended to be lightweight.
- Don’t use an autocomplete dropdown for something that has one choice; there must be more than one item.
- Don't use SearchBox if you cannot reliably provide accurate results.