Fügen Sie den Kernblöcken in Gutenberg eine benutzerdefinierte Klasse hinzu

Ich versuche, eine Klasse zur Liste von Blöcken ( core/list) in Gutenberg hinzuzufügen . Leider sieht es so aus, als ob einige Blöcke wie Listen und Absätze nicht den Standardnamen der Standardklasse haben und wp-block-{name}nicht mit dem blocks.getBlockDefaultClassNameFilter umbenannt werden können .

Um das zu umgehen, habe ich den blocks.getSaveContent.extraPropsFilter verwendet, der es mir zu ermöglichen scheint, ALLEN Blöcken, die noch keine Klassen haben, eine Klasse hinzuzufügen. Der folgende Code zeigt, wie ich das zum Laufen gebracht habe. Es fügt added-class-nameBlöcke wie Listen und Absätze usw. hinzu.

function addBlockClassName( className ) {
  return Object.assign( className, { class: 'added-class-name' } );
}

wp.hooks.addFilter(
  'blocks.getSaveContent.extraProps',
  'gdt-guten-plugin/add-block-class-name',
  addBlockClassName
);

Und ich stelle es so ein:

function gdt_blocks_class_rename() {
  wp_enqueue_script(
      'gdt-plugin-blacklist-blocks',
      get_stylesheet_directory_uri() . '/dist/guten-addons.js',
      array( 'wp-blocks' )
  );
}
add_action( 'enqueue_block_editor_assets', 'gdt_blocks_class_rename' );

Was ich jedoch tun möchte, ist, NUR Listenblöcken eine Klasse hinzuzufügen ? Kann das überhaupt gemacht werden?

Mit diesem Hook haben Sie ein zweites und ein drittes Argument. Mit dem zweiten können Sie den Blocktyp abrufen.

https://wordpress.org/gutenberg/handbook/extensibility/extending-blocks/

Ein Filter, der für alle Blöcke gilt, die ein WP-Element in der Speicherfunktion zurückgeben. Dieser Filter wird verwendet, um dem Stammelement der Speicherfunktion zusätzliche Requisiten hinzuzufügen. Beispiel: Hinzufügen eines Klassennamens, einer ID oder einer gültigen Requisite für dieses Element. Es empfängt die aktuellen Requisiten des Sicherungselements, den Blocktyp und die Blockattribute als Argumente.

function addBlockClassName( props, blockType ) {
    if(blockType.name === 'core/list') {
        return Object.assign( props, { class: 'wp-block-list' } );
    }
    return props;
}

wp.hooks.addFilter(
    'blocks.getSaveContent.extraProps',
    'gdt-guten-plugin/add-block-class-name',
    addBlockClassName
);