How to use the @wordpress/rich-text.join function in @wordpress/rich-text

//
// isCollapsed
//
RT.isCollapsed(VALUE);

//
// isEmpty
//
RT.isEmpty(VALUE);

//
// join
//
RT.join([VALUE, VALUE]);
RT.join([], VALUE);
RT.join([], 'foo');
RT.join([VALUE], 'foo');

//
// registerFormatType
//
RT.registerFormatType('foo', {
    tagName: 'span',
    className: 'foo',
    title: 'Foo',
    edit: () =&gt; <span>Hello World</span>,
});
RT.registerFormatType('foo', {
    tagName: 'span',
    className: null,
    title: 'Foo',
    keywords: ['foo', 'bar', 'baz'],

//
// isCollapsed
//
RT.isCollapsed(VALUE);

//
// isEmpty
//
RT.isEmpty(VALUE);

//
// join
//
RT.join([VALUE, VALUE]);
RT.join([], VALUE);
RT.join([], 'foo');
RT.join([VALUE], 'foo');

//
// registerFormatType
//
RT.registerFormatType('foo', {
    tagName: 'span',
    className: 'foo',
    title: 'Foo',
    edit: () =&gt; <span>Hello World</span>,
});
RT.registerFormatType('foo', {
    tagName: 'span',
    className: null,
    title: 'Foo',

const headingBlock = createBlock( 'core/heading', {
					content: toHTMLString( { value: pieces[ 0 ] } ),
				} );

				if ( ! citation && pieces.length === 1 ) {
					return headingBlock;
				}

				const quotePieces = pieces.slice( 1 );

				const quoteBlock = createBlock( 'core/quote', {
					...attrs,
					citation,
					value: toHTMLString( {
						value: quotePieces.length ? join( pieces.slice( 1 ), '\u2028' ) : create(),
						multilineTag: 'p',
					} ),
				} );

				return [ headingBlock, quoteBlock ];
			},
		},

transform: ( attributes ) => {
				return createBlock( 'core/quote', {
					value: toHTMLString( {
						value: join( attributes.map( ( { content } ) =>
							create( { html: content } )
						), '\u2028' ),
						multilineTag: 'p',
					} ),
				} );
			},
		},