Documentation Index
Fetch the complete documentation index at: https://docs.brikl.co/llms.txt
Use this file to discover all available pages before exploring further.
Overview
Radio 10 is a segmented button group component that functions as a radio selector. It presents up to 6 labeled options (0–5) arranged horizontally, where clicking a button sets a custom state on the parent group to track the selected item. The active selection is visually highlighted with a dark border, and disabled buttons appear at reduced opacity. It is ideal for filter bars, tab-like navigation, or single-choice selection UI patterns.How to use
States
This component includes conditional states that automatically change its appearance.| State | Trigger | Visual effect |
|---|---|---|
| Disabled | Button’s isnt_clickable condition is true | Button opacity is reduced to 50%, indicating it is non-interactive |
| Selected | Parent group’s custom state radio_item_ equals the button’s own item_ custom state value | Button border color on all sides changes to dark rgba(27,23,24,1), visually indicating the active selection |
These states are handled natively by Bubble and require no additional setup.
They will work automatically once the component is pasted into your editor.
Responsive
This component adapts to mobile screens. Font sizes and layout automatically adjust on screens smaller than Bubble’s built-in mobile breakpoint.Workflows
This component includes pre-built workflows.| Trigger | Action |
|---|---|
| Button - 0 is clicked | Sets the parent group’s custom state radio_item_ to the value of Button 0’s item_ custom state (0) |
| Button - 1 is clicked | Sets the parent group’s custom state radio_item_ to the value of Button 1’s item_ custom state (1) |
| Button - 2 is clicked | Sets the parent group’s custom state radio_item_ to the value of Button 2’s item_ custom state (2) |
| Button - 3 is clicked | Sets the parent group’s custom state radio_item_ to the value of Button 3’s item_ custom state (3) |
| Button - 4 is clicked | Sets the parent group’s custom state radio_item_ to the value of Button 4’s item_ custom state (4) |
| Button - 5 is clicked | Sets the parent group’s custom state radio_item_ to the value of Button 5’s item_ custom state (5) |
These workflows are included when you use the Copy with Workflows option in the Brikl panel.
Requirements
| License | Starter plan required |
| Plugins | None |
| Custom code | Not required |
Platforms
| Platform | Supported |
|---|---|
| Web | ✅ |
| Mobile | ✅ |
License
This component requires a Starter plan.