Comobox Item CSS selector when selected. #3671
Unanswered
severinlandolt
asked this question in
Questions
Replies: 1 comment
-
There's no specific data attribute for selected combobox items. Feel free to open a feature request. However, you can implement your own function ComboboxItem(props: Ariakit.ComboboxItemProps) {
const combobox = Ariakit.useComboboxContext()!;
// or combobox.useState("value") if you want to account for values
// typed by the user in addition to those selected from the list.
const selectedValue = combobox.useState("selectedValue");
const selected = !!props.value && props.value === selectedValue;
return <Ariakit.ComboboxItem {...props} data-selected={selected} />;
} |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hey there! Just experimenting with the Combobox Radix UI example.
I want to add a CSS class to make the text of the selected item bold like this
data-[checked=true]:font-bold
, but I couldn't find a suiting selector here: https://ariakit.org/guide/styling#data-user-valueThanks for any help!
Beta Was this translation helpful? Give feedback.
All reactions