ui: update ClientButton to support function onClick alongside legacy string onClick
This commit is contained in:
@@ -2,12 +2,22 @@
|
|||||||
|
|
||||||
import { useEffect, useRef } from 'react'
|
import { useEffect, useRef } from 'react'
|
||||||
|
|
||||||
export function ClientButton({ children, onClick, ...props }: { children?: React.ReactNode; onClick?: string } & React.ButtonHTMLAttributes<HTMLButtonElement>) {
|
export function ClientButton({
|
||||||
|
children,
|
||||||
|
onClick,
|
||||||
|
...props
|
||||||
|
}: {
|
||||||
|
children?: React.ReactNode
|
||||||
|
onClick?: ((event: React.MouseEvent<HTMLButtonElement>) => void) | string
|
||||||
|
} & React.ButtonHTMLAttributes<HTMLButtonElement>) {
|
||||||
const btnRef = useRef<HTMLButtonElement>(null)
|
const btnRef = useRef<HTMLButtonElement>(null)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (typeof onClick === 'string' && btnRef.current) {
|
if (!btnRef.current) return
|
||||||
|
if (typeof onClick === 'string') {
|
||||||
btnRef.current.onclick = onClick as any
|
btnRef.current.onclick = onClick as any
|
||||||
|
} else if (typeof onClick === 'function') {
|
||||||
|
btnRef.current.onclick = (e: Event) => onClick(e as React.MouseEvent<HTMLButtonElement>)
|
||||||
}
|
}
|
||||||
}, [onClick])
|
}, [onClick])
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user