usePaste

Listens for clipboard paste events and forwards files to onPaste. Returns void.

function usePaste(options: PasteOptions): void

Options

Option	Type	Default	Description
onPaste	(files: File[]) => void	required	Accepted clipboard files
accept	string[]	—	Same patterns as elsewhere
enabled	boolean	true	Attach / detach the listener
targetRef	RefObject<Element | null>	document	Listen on a subtree instead of the document

Only clipboard items with kind === 'file' are considered. Text paste is left alone. If at least one file matches accept, the event is preventDefault() so the browser does not also insert the image into a contenteditable.

Example

const containerRef = useRef<HTMLDivElement>(null);

usePaste({
  onPaste: uploader.addFiles,
  accept: ['image/*'],
  enabled: true,
  targetRef: containerRef,
});

return <div ref={containerRef} tabIndex={0}>Paste an image here</div>;

Omit targetRef to listen on document — useful for a full-page uploader, noisy if the user pastes into a form elsewhere. Prefer a focused container when the page has inputs.

Safari and some browsers expose screenshots as image/png with a generated name. accept: ['image/*'] covers that.

Full walkthrough: Clipboard paste.