How to change background color of the SidebarCollapse when it's active

[Yiyitops]

Hi!
I need help with the SidebarCollapse component, I'm trying to custom it's theme by changing the background color when the SidebarCollapse is active. I tried to see the documentation for theme customization but it didn't help me.
I'm using react with this library. I'm new with this framework and library so I will be glad if someone help me with this issue.

<3

[tulup-conner]

If you're not sure about how to customize the theme based on the docs, you should crack open the source code and look at how the HTML is structured to get a better idea. That's SidebarCollapse.tsx in this case. I believe what you're looking for is a theme on the collapse.button key.

[hamzaabaig]

you will see a theme object at the end of each component for customization

I just checked the classes in elements tab of inspect

lets say I have ul tag with class="space-y-2 py-2"

now to customize this I will check same classes in theme object

you see below that its available in "list"

{
"root": {
"base": "h-full",
"collapsed": {
"on": "w-16",
"off": "w-64"
},
"inner": "h-full overflow-y-auto overflow-x-hidden rounded bg-gray-50 px-3 py-4 dark:bg-gray-800"
},
"collapse": {
"button": "group flex w-full items-center rounded-lg p-2 text-base font-normal text-gray-900 transition duration-75 hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700",
"icon": {
"base": "h-6 w-6 text-gray-500 transition duration-75 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-white",
"open": {
"off": "",
"on": "text-gray-900"
}
},
"label": {
"base": "ml-3 flex-1 whitespace-nowrap text-left",
"icon": {
"base": "h-6 w-6 transition delay-0 ease-in-out",
"open": {
"on": "rotate-180",
"off": ""
}
}
},
"list": "space-y-2 py-2"
},