[Need Help] How to trigger the custom menu trigger component's click event when using Dropdown menu component?

[likepeach789]

Hi Team, I am using Dropdown Menu component and hope to get some help from you. I found my custom DropdownMenu.Trigger component's click event is not triggered. Could you please help suggest how to fix it? Thanks.

import * as DropdownMenu from "@radix-ui/react-dropdown-menu";

export const DropdownMenuDemo = () => {
          // this is not triggered
        const onClick = () => {
           console.log('dddddddddddd')
        }
    return (
        <DropdownMenu.Root>
            <DropdownMenu.Trigger asChild>
                <button className="IconButton" aria-label="Customise options">
                    <span onClick={onClick}>span</span>
                </button>
            </DropdownMenu.Trigger>
            <DropdownMenu.Portal>
                <DropdownMenu.Content className="DropdownMenuContent" sideOffset={5}>
                    <DropdownMenu.Item className="DropdownMenuItem">
                        New Tab <div className="RightSlot">⌘+T</div>
                    </DropdownMenu.Item>
                    <DropdownMenu.Item className="DropdownMenuItem">
                        New Window <div className="RightSlot">⌘+N</div>
                    </DropdownMenu.Item>
                </DropdownMenu.Content>
            </DropdownMenu.Portal>
        </DropdownMenu.Root>
    );
};