How to use the @wordpress/blocks.rawHandler function in @wordpress/blocks

event.clipboardData ||
			event.dataTransfer ||
			this.editor.getDoc().dataTransfer ||
			// Removes the need for further `dataTransfer` checks.
			{ getData: () => '' };

		const { items = [], files = [], types = [] } = dataTransfer;
		const item = find( [ ...items, ...files ], ( { type } ) => /^image\/(?:jpe?g|png|gif)$/.test( type ) );
		const plainText = dataTransfer.getData( 'text/plain' );
		const HTML = dataTransfer.getData( 'text/html' );

		// Only process file if no HTML is present.
		// Note: a pasted file may have the URL as plain text.
		if ( item && ! HTML ) {
			const file = item.getAsFile ? item.getAsFile() : item;
			const content = rawHandler( {
				HTML: `<img src="${ createBlobURL( file ) }">`,
				mode: 'BLOCKS',
				tagName: this.props.tagName,
			} );
			const shouldReplace = this.props.onReplace &amp;&amp; this.isEmpty();

			// Allows us to ask for this information when we get a report.
			window.console.log( 'Received item:\n\n', file );

			if ( shouldReplace ) {
				// Necessary to allow the paste bin to be removed without errors.
				this.props.setTimeout( () =&gt; this.props.onReplace( content ) );
			} else if ( this.props.onSplit ) {
				// Necessary to get the right range.
				// Also done in the TinyMCE paste plugin.
				this.props.setTimeout( () =&gt; this.splitContent( content ) );

event.clipboardData ||
			event.dataTransfer ||
			this.editor.getDoc().dataTransfer ||
			// Removes the need for further `dataTransfer` checks.
			{ getData: () => '' };

    const { items = [], files = [], types = [] } = dataTransfer;
    const item = find([ ...items, ...files ], ({ type }) => /^image\/(?:jpe?g|png|gif)$/.test(type));
    const plainText = dataTransfer.getData('text/plain');
    const HTML = dataTransfer.getData('text/html');

    // Only process file if no HTML is present.
    // Note: a pasted file may have the URL as plain text.
    if (item && ! HTML) {
      const file = item.getAsFile ? item.getAsFile() : item;
      const content = rawHandler({
        HTML: `<img src="${createBlobURL(file)}">`,
        mode: 'BLOCKS',
        tagName: this.props.tagName,
      });
      const shouldReplace = this.props.onReplace &amp;&amp; this.isEmpty();

      // Allows us to ask for this information when we get a report.
      window.console.log('Received item:\n\n', file);

      if (shouldReplace) {
        // Necessary to allow the paste bin to be removed without errors.
        this.props.setTimeout(() =&gt; this.props.onReplace(content));
      }
      else if (this.props.onSplit) {
        // Necessary to get the right range.
        // Also done in the TinyMCE paste plugin.

event.clipboardData ||
			event.dataTransfer ||
			this.editor.getDoc().dataTransfer ||
			// Removes the need for further `dataTransfer` checks.
			{ getData: () => '' };

		const { items = [], files = [], types = [] } = dataTransfer;
		const item = find( [ ...items, ...files ], ( { type } ) => /^image\/(?:jpe?g|png|gif)$/.test( type ) );
		const plainText = dataTransfer.getData( 'text/plain' );
		const HTML = dataTransfer.getData( 'text/html' );

		// Only process file if no HTML is present.
		// Note: a pasted file may have the URL as plain text.
		if ( item && ! HTML ) {
			const file = item.getAsFile ? item.getAsFile() : item;
			const content = rawHandler( {
				HTML: `<img src="${ createBlobURL( file ) }">`,
				mode: 'BLOCKS',
				tagName: this.props.tagName,
			} );
			const shouldReplace = this.props.onReplace &amp;&amp; this.isEmpty();

			// Allows us to ask for this information when we get a report.
			window.console.log( 'Received item:\n\n', file );

			if ( shouldReplace ) {
				// Necessary to allow the paste bin to be removed without errors.
				this.props.setTimeout( () =&gt; this.props.onReplace( content ) );
			} else if ( this.props.onSplit ) {
				// Necessary to get the right range.
				// Also done in the TinyMCE paste plugin.
				this.props.setTimeout( () =&gt; this.splitContent( content ) );

it( 'should convert HTML post to blocks with minimal content changes', () => {
		const HTML = readFile( path.join( __dirname, 'fixtures/wordpress-convert.html' ) );
		expect( serialize( rawHandler( { HTML } ) ) ).toMatchSnapshot();
	} );

onClick: () => dispatch( 'core/block-editor' ).replaceBlocks(
			block.clientId,
			rawHandler( { HTML: getBlockContent( block ) } ),
		),
	} ) ),

return;
			}
		}

		const shouldReplace = this.props.onReplace && this.isEmpty();

		let mode = 'INLINE';

		if ( shouldReplace ) {
			mode = 'BLOCKS';
		} else if ( this.props.onSplit ) {
			mode = 'AUTO';
		}

		const content = rawHandler( {
			HTML,
			plainText: this.pastedPlainText,
			mode,
			tagName: this.props.tagName,
			canUserUseUnfilteredHTML: this.context.canUserUseUnfilteredHTML,
		} );

		if ( typeof content === 'string' ) {
			this.editor.insertContent( content );
		} else if ( this.props.onSplit ) {
			if ( ! content.length ) {
				return;
			}

			if ( shouldReplace ) {
				this.props.onReplace( content );

onHTMLDrop (HTML, position) {
    const blocks = rawHandler({ HTML, mode: 'BLOCKS' });

    if (blocks.length) {
      this.props.insertBlocks(blocks, this.getInsertIndex(position));
    }
  }

port1.onmessage = ( { data: confirmed } ) => {
			port1.close();

			if ( confirmed !== true ) {
				return;
			}

			dispatch( 'core/editor' ).replaceBlock(
				blocks[ 0 ].clientId,
				rawHandler( {
					HTML: blocks[ 0 ].originalContent,
				} )
			);
		};
	} );

return;
      }
    }

    const shouldReplace = this.props.onReplace && this.isEmpty();

    let mode = 'INLINE';

    if (shouldReplace) {
      mode = 'BLOCKS';
    }
    else if (this.props.onSplit) {
      mode = 'AUTO';
    }

    const content = rawHandler({
      HTML,
      plainText: this.pastedPlainText,
      mode,
      tagName: this.props.tagName,
      canUserUseUnfilteredHTML: this.props.canUserUseUnfilteredHTML,
    });

    if (typeof content === 'string') {
      this.editor.insertContent(content);
    }
    else if (this.props.onSplit) {
      if (! content.length) {
        return;
      }

      if (shouldReplace) {

const convertToBlocks = () => {
		onReplace( block.uid, rawHandler( {
			HTML: serialize( block ),
			mode: 'BLOCKS',
			canUserUseUnfilteredHTML,
		} ) );
	};