onesine / react-tailwindcss-select

Tailwind Select Component for React.js
https://demo-react-tailwindcss-select.vercel.app/
MIT License
183 stars 38 forks source link

ChevronIcon is missing #42

Open mothy900 opened 1 year ago

mothy900 commented 1 year ago

The Icon in react-tailwin-select (which ChevronIcon) is missing

I try to className - ChevronIcon option w-[30px], h-[30px], bg-color but it does'n work. 'ChevronIcon' class option is missing at web dev-tools Styles.

Here is source code

className :

export const tableClassName = {
    listItem: (value?: { isSelected?: boolean | undefined }) =>
        `m-0 py-2 px-5  cursor-pointer block list-none select-none ${
            value?.isSelected
                ? 'text-primary bg-[#f4f6fa] dark:bg-[#2b2b40] '
                : 'hover:text-primary hover:bg-[#f4f6fa] dark:hover:bg-[#2b2b40] '
        }`,
    list: 'w-[150px] md:w-[150px] lg:w-[150px] text-sm text-gray-700',
    listGroupLabel: 'px-0',
    tagItem: () => 'w-[150px]',
    ChevronIcon: () => 'w-[30px] h-[30px] px-0 bg-error',
    menuButton: () =>
        'dark:bg-[#1b1b29] bg-[#f9f9f9] h-[42px] bg-gray-200  flex w-[150px] items-center text-left text-sm text-gray-700 rounded-md px-3',
    tagItemIconContainer: 'bg-warning w-[150px]',
    menu: 'absolute z-10 w-[150px] bg-neutral-focus shadow-lg border-0 rounded py-1 mt-1.5 text-sm text-gray-700  ',
    tagItemIcon: 'bg-error'
}

Select :

<Select
      value={label}
      onChange={handleChange}
      options={selOptions}
      primaryColor={'indigo'}
      classNames={tableClassName}
/>

Additional : ChevronIcon is missing with default option too

Ps. why primaryColor is required?