inde.tsx

...

    const [rippleElements, setRippleElements] = useState<JSX.Element[]>([]);

...

    function renderRippleElements() {
        return rippleElements;
    }

    return (
        <button
            className={classNames}
            {...props}
            onClick={(event) => {
                if (props.onClick) {
                    props.onClick(event);
                }

                if (ripple) {
                   onRippleClick(event);
                }
            }}
        >
            {children}
            {renderRippleElements()}
        </button>
    );