Bravo Studio Help Center
Search…
Get Started
Set up your design
Bravo Tags
Set up your backend
Data binding
Integrations
App Publication
Search & filter
The text box will turn into a search field where users can filter items from a list on the same page by text content.
👉 The Tag
This tag turns a text box into a search field where users can filter items from a list by text content.
The component works for API data or manually created lists (as in the example file) with separate containers for each item. It only filters content on the same page, it does not search app-wide.
📍 Where to add the tag: A text layer.
1
[component:input-text][action:filter]
Copied!
🏷️ How to add the tag
1. Create a search bar design that includes a text box.
2. Make the text box as big as you want the input field to be.
3. Paste the tag into the layer name of the text box.
5. Import to Bravo & preview on Bravo Vision 🚀
💾 Example files
Duplicate the files below to see how to set it up!
Bravo Sample: Search & filter
Figma
Bravo sample - Search&Filter.xd.zip
2MB
Binary
Search & filter.xd
Last modified 8mo ago
Copy link