anyway to set styles on selected item on Combobox item?

[daniel-aziz]

anyway to set styles on selected item on Combobox item?
currently setting it with aria-selected
im new to mantine, and i read the styles API guide and styles API for combobox, and im using tailwind to style my app, so i didnt find any other way to do so.
it is important because i need to set the colors accroding my app theme.

 <Combobox
      withinPortal
      onOptionSubmit={(optionValue, optionProps) => {
        if (inputRef?.current) {
          inputRef.current.value = optionValue;
        }
        onSelection?.(optionValue, optionProps);
        combobox.closeDropdown();
      }}
      store={combobox}
      classNames={{
        dropdown: "rounded-md shadow-lg p-0 m-0",
        option: clsx(
          "text-xs font-normal text-gray-900 py-2 px-4 border-b border-gray-300 truncate",
          "hover:bg-gray-100",
          "focus:bg-gray-100",
          "active:bg-gray-200",
          "aria-selected:bg-gray-100",
        ),
      }}
    >

i also used the following attributes, but non of them worked.

    classNames={{
        option: clsx(
          "data-active:bg-gold-500",
          "data-combobox-active:bg-cherry-500",
          "data-combobox-selected:bg-lavender-700",
          "data-selected:bg-teal-600",
        ),
      }}
    ```

[rtivital]

You can find an example of applying styles on this page – https://mantine.dev/combobox/?e=SelectedStyles
If you are not sure how to apply these styles using tailwind, it is better to ask this question in tailwind community.

[daniel-aziz]

@rtivital
Thanks! worked with the following syntax under calssNames.option

 "data-[combobox-selected]:bg-gray-100",