Make WordPress Core


Ignore:
Timestamp:
02/08/2024 10:39:24 AM (5 months ago)
Author:
gziolo
Message:

Editor: Add viewScriptModule handling to block.json metadata

Syncing changes from the Gutenberg plugin: https://github.com/WordPress/gutenberg/pull/57437.

Scripts and styles can be registered for blocks via block.json metadata. There is now a Modules API, but was no way to register or associate module assets with blocks via block.json.

Fixes #60233.
Props jonsurrell, gziolo, cbravobernal, luisherranz, youknowriad.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/blocks.php

    r57559 r57565  
    3737 * @since 5.5.0
    3838 * @since 6.1.0 Added `$index` parameter.
     39 * @since 6.5.0 Added support for `viewScriptModule` field.
    3940 *
    4041 * @param string $block_name Name of the block.
     
    5354            $asset_handle .= '-view';
    5455        }
     56        if ( str_ends_with( strtolower( $field_name ), 'scriptmodule' ) ) {
     57            $asset_handle .= '-script-module';
     58        }
    5559        if ( $index > 0 ) {
    5660            $asset_handle .= '-' . ( $index + 1 );
     
    6064
    6165    $field_mappings = array(
    62         'editorScript' => 'editor-script',
    63         'script'       => 'script',
    64         'viewScript'   => 'view-script',
    65         'editorStyle'  => 'editor-style',
    66         'style'        => 'style',
    67         'viewStyle'    => 'view-style',
     66        'editorScript'     => 'editor-script',
     67        'editorStyle'      => 'editor-style',
     68        'script'           => 'script',
     69        'style'            => 'style',
     70        'viewScript'       => 'view-script',
     71        'viewScriptModule' => 'view-script-module',
     72        'viewStyle'        => 'view-style',
    6873    );
    6974    $asset_handle   = str_replace( '/', '-', $block_name ) .
     
    121126
    122127    return plugins_url( basename( $path ), $path );
     128}
     129
     130/**
     131 * Finds a script module ID for the selected block metadata field. It detects
     132 * when a path to file was provided and optionally finds a corresponding asset
     133 * file with details necessary to register the script module under with an
     134 * automatically generated module ID. It returns unprocessed script module
     135 * ID otherwise.
     136 *
     137 * @since 6.5.0
     138 *
     139 * @param array  $metadata   Block metadata.
     140 * @param string $field_name Field name to pick from metadata.
     141 * @param int    $index      Optional. Index of the script module ID to register when multiple
     142 *                           items passed. Default 0.
     143 * @return string|false Script module ID or false on failure.
     144 */
     145function register_block_script_module_id( $metadata, $field_name, $index = 0 ) {
     146    if ( empty( $metadata[ $field_name ] ) ) {
     147        return false;
     148    }
     149
     150    $module_id = $metadata[ $field_name ];
     151    if ( is_array( $module_id ) ) {
     152        if ( empty( $module_id[ $index ] ) ) {
     153            return false;
     154        }
     155        $module_id = $module_id[ $index ];
     156    }
     157
     158    $module_path = remove_block_asset_path_prefix( $module_id );
     159    if ( $module_id === $module_path ) {
     160        return $module_id;
     161    }
     162
     163    $path                  = dirname( $metadata['file'] );
     164    $module_asset_raw_path = $path . '/' . substr_replace( $module_path, '.asset.php', - strlen( '.js' ) );
     165    $module_id             = generate_block_asset_handle( $metadata['name'], $field_name, $index );
     166    $module_asset_path     = wp_normalize_path(
     167        realpath( $module_asset_raw_path )
     168    );
     169
     170    $module_path_norm = wp_normalize_path( realpath( $path . '/' . $module_path ) );
     171    $module_uri       = get_block_asset_url( $module_path_norm );
     172
     173    $module_asset        = ! empty( $module_asset_path ) ? require $module_asset_path : array();
     174    $module_dependencies = isset( $module_asset['dependencies'] ) ? $module_asset['dependencies'] : array();
     175
     176    wp_register_script_module(
     177        $module_id,
     178        $module_uri,
     179        $module_dependencies,
     180        isset( $module_asset['version'] ) ? $module_asset['version'] : false
     181    );
     182
     183    return $module_id;
    123184}
    124185
     
    315376 * @since 6.3.0 Added `selectors` field.
    316377 * @since 6.4.0 Added support for `blockHooks` field.
    317  * @since 6.5.0 Added support for `allowedBlocks` and `viewStyle` fields.
     378 * @since 6.5.0 Added support for `allowedBlocks`, `viewScriptModule`, and `viewStyle` fields.
    318379 *
    319380 * @param string $file_or_folder Path to the JSON file with metadata definition for
     
    491552    }
    492553
     554    $module_fields = array(
     555        'viewScriptModule' => 'view_script_module_ids',
     556    );
     557    foreach ( $module_fields as $metadata_field_name => $settings_field_name ) {
     558        if ( ! empty( $settings[ $metadata_field_name ] ) ) {
     559            $metadata[ $metadata_field_name ] = $settings[ $metadata_field_name ];
     560        }
     561        if ( ! empty( $metadata[ $metadata_field_name ] ) ) {
     562            $modules           = $metadata[ $metadata_field_name ];
     563            $processed_modules = array();
     564            if ( is_array( $modules ) ) {
     565                for ( $index = 0; $index < count( $modules ); $index++ ) {
     566                    $result = register_block_script_module_id(
     567                        $metadata,
     568                        $metadata_field_name,
     569                        $index
     570                    );
     571                    if ( $result ) {
     572                        $processed_modules[] = $result;
     573                    }
     574                }
     575            } else {
     576                $result = register_block_script_module_id(
     577                    $metadata,
     578                    $metadata_field_name
     579                );
     580                if ( $result ) {
     581                    $processed_modules[] = $result;
     582                }
     583            }
     584            $settings[ $settings_field_name ] = $processed_modules;
     585        }
     586    }
     587
    493588    $style_fields = array(
    494589        'editorStyle' => 'editor_style_handles',
Note: See TracChangeset for help on using the changeset viewer.