How to apply block transforms for a block with innerBlocks?

admin管理员组

文章数量:1127977

I'm trying to create my first block (using wp-create-block). It is a "factbox" block and would mostly work as a group block, except that it always is an aside, supports float (left and right), and will be collapsable.

I've managed to create the block, it works, but I can't get block transforms to work. I read the documentation, tried to copy code from the core/group-block, but I can't my code to work.

import { __ } from '@wordpress/i18n';
import { InnerBlocks, useBlockProps, __experimentalUseInnerBlocksProps,
useInnerBlocksProps as useInnerBlocksProps, AlignmentToolbar } from '@wordpress/block-editor';
import './editor.scss';

const Edit = () => {
const blockProps = useBlockProps();
const settings = {
transforms: {
    from: [
        {
            type: 'block',
            isMultiBlock: true,
            blocks: [ '*' ],
            __experimentalConvert( blocks ) {
                
                // Clone the Blocks to be Grouped
                // Failing to create new block references causes the original blocks
                // to be replaced in the switchToBlockType call thereby meaning they
                // are removed both from their original location and within the
                // new group block.
                const groupInnerBlocks = blocks.map( ( block ) => {
                    return createBlock(
                        block.name,
                        block.attributes,
                        block.innerBlocks
                    );
                } );

                return createBlock(
                    'wp-create-block/factbox',
                    groupInnerBlocks
                );
            },
        },
    ]
    }
};


return (
    <aside { ...blockProps }>
        <InnerBlocks defaultBlock={['core/paragraph', {placeholder: "Lorem ipsum..."}]} directInsert />
    </aside>
);
};
export default Edit;

I don't get any error messages, but I don't get the option to transform any blocks into my block either?

Expected behaviour is that I'm able to select one or more blocks and transform them into a factbox, like I can do with a group.

本文标签： How to apply block transforms for a block with innerBlocks