[BUG] Group Heading props does not work

[pdhruv93]

Description

I am using custom Group component but somehow the onClick does not work. It works on normal react-select. The end goal is to select all the options under a group when the heading is clicked. Here is the link for react-select

const Group = (props: any) => {
    const onClick = () => {
        console.log(':::Here');
        props.selectProps.onChange(props.options);
    };

    return (
        <chakraComponents.Group
            {...props}
            headingProps={{ ...props.headingProps, onClick }}
        />
    );
};

<Select
    {...props}
    isMulti
    formatGroupLabel={formatGroupLabel}
    chakraStyles={selectStyles}
    components={{ Group }}
    menuIsOpen
/>

chakra-react-select Version

4.7.5

Link to Reproduction

https://codesandbox.io/p/sandbox/chakra-accordion-react-seelct-vp6pcr

TypeScript?

• [X] Yes I use TypeScript

Steps to reproduce

Please check on the sandbox link provided

Operating System

• [ ] macOS
• [ ] Windows
• [ ] Linux
• [ ] iOS/iPadOS
• [ ] Android

Additional Information

No response

[csandman]

Yeah, I actually realized this was an issue very recently and had a fix in another branch I've been working on. I've been running into performance issues with that branch though, so I'm probably going to cherry pick some of the changes in it so I can get a release out sooner with some of the smaller changes. I'll try and get a fix out for this either later today or tomorrow!

[pdhruv93]

Thanks, quite quick!

[csandman]

Ok, a new version, v4.7.6, has been pushed out with a fix for this! I replicated your example that wasn't working and you can see that it is now working on this version: https://codesandbox.io/s/q36t83?file=/ChakraAccordion.tsx