Function Draggable

packages/@react-spectrum/s2/stories/DropZone.stories.tsx:157–194

()

};

function Draggable() {
  let {dragProps} = useDrag({
    getItems() {
      return [
        {
          'text/plain': 'hello world'
        }
      ];
    },
    getAllowedDropOperations() {
      return ['copy'];
    }
  });

  let {clipboardProps} = useClipboard({
    getItems() {
      return [
        {
          'text/plain': 'hello world'
        }
      ];
    }
  });

  let ref = React.useRef(null);
  let {buttonProps} = useButton({elementType: 'div'}, ref);

  return (
    <FocusRing>
      <div
        className={style({color: 'gray-900'})}
        ref={ref}
        {...mergeProps(dragProps, buttonProps, clipboardProps)}>
        <span>Drag me</span>
      </div>
    </FocusRing>
  );
}