import { DragHandleIcon } from '@chakra-ui/icons' ; import { IconButton } from '@chakra-ui/react' ; import { forwardRef } from 'react' ; import type { DragHandleProps } from 'react-querybuilder' ; const ChakraDragHandle = forwardRef < HTMLSpanElement , DragHandleProps > ( ( { className , title , disabled } , dragRef ) => ( < span ref = { dragRef } className = { className } title = { title } > < IconButton isDisabled = { disabled } aria - label = { title ?? '' } size = "xs" icon = { < DragHandleIcon / > } /> < /span>)); ChakraDragHandle . displayName = 'ChakraDragHandle' ; export default ChakraDragHandle ;