You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Using the Listbox component, I was looking for a way to create different groups of item (same thing as the <optgroup> tag). I know it's possible to achieve the same result by just styling and disabling a Listbox.Option component, but I think it would be nice to have a different component to have a clear separation between a "group heading" and the actual options of that group.
The composition could look something like this:
<Listbox>
<Listbox.Button>My button</Listbox.Button>
<Listbox.Options>
<Listbox.OptionGroup title="My first group">
<Listbox.Option>My option</Listbox.Option>
</Listbox.OptionGroup>
<Listbox.OptionGroup title="My second group">
<Listbox.Option>My option</Listbox.Option>
</Listbox.OptionGroup>
</Listbox.Options>
</Listbox>
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
Using the
Listbox
component, I was looking for a way to create different groups of item (same thing as the<optgroup>
tag). I know it's possible to achieve the same result by just styling and disabling aListbox.Option
component, but I think it would be nice to have a different component to have a clear separation between a "group heading" and the actual options of that group.The composition could look something like this:
Keep up the amazing work 👍
Beta Was this translation helpful? Give feedback.
All reactions