wpseek.com
A WordPress-centric search engine for devs and theme authors

function render_block_core_image( $attributes, $content, $block ) {
	if ( false === stripos( $content, '<img' ) ) {
		return '';
	}

	$p = new WP_HTML_Tag_Processor( $content );

	if ( ! $p->next_tag( 'img' ) || null === $p->get_attribute( 'src' ) ) {
		return '';
	}

	$has_id_binding = isset( $attributes['metadata']['bindings']['id'] ) && isset( $attributes['id'] );

	// Ensure the `wp-image-id` classname on the image block supports block bindings.
	if ( $has_id_binding ) {
		// If there's a mismatch with the 'wp-image-' class and the actual id, the id was
		// probably overridden by block bindings. Update it to the correct value.
		// See https://github.com/WordPress/gutenberg/issues/62886 for why this is needed.
		$id                       = $attributes['id'];
		$image_classnames         = $p->get_attribute( 'class' );
		$class_with_binding_value = "wp-image-$id";
		if ( is_string( $image_classnames ) && ! str_contains( $image_classnames, $class_with_binding_value ) ) {
			$image_classnames = preg_replace( '/wp-image-(\d+)/', $class_with_binding_value, $image_classnames );
			$p->set_attribute( 'class', $image_classnames );
		}
	}

	// For backwards compatibility, the data-id html attribute is only set for
	// image blocks nested in a gallery. Detect if the image is in a gallery by
	// checking the data-id attribute.
	// See the `block_core_gallery_data_id_backcompatibility` function.
	if ( isset( $attributes['data-id'] ) ) {
		// If there's a binding for the `id`, the `id` attribute is used for the
		// value, since `data-id` does not support block bindings.
		// Else the `data-id` is used for backwards compatibility, since
		// third parties may be filtering its value.
		$data_id = $has_id_binding ? $attributes['id'] : $attributes['data-id'];
		$p->set_attribute( 'data-id', $data_id );
	}

	$link_destination  = isset( $attributes['linkDestination'] ) ? $attributes['linkDestination'] : 'none';
	$lightbox_settings = block_core_image_get_lightbox_settings( $block->parsed_block );

	/*
	 * If the lightbox is enabled and the image is not linked, adds the filter and
	 * the JavaScript view file.
	 */
	if (
		isset( $lightbox_settings ) &&
		'none' === $link_destination &&
		isset( $lightbox_settings['enabled'] ) &&
		true === $lightbox_settings['enabled']
	) {
		$suffix = wp_scripts_get_suffix();
		if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) {
			$module_url = gutenberg_url( '/build/interactivity/image.min.js' );
		}

		wp_register_script_module(
			'@wordpress/block-library/image',
			isset( $module_url ) ? $module_url : includes_url( "blocks/image/view{$suffix}.js" ),
			array( '@wordpress/interactivity' ),
			defined( 'GUTENBERG_VERSION' ) ? GUTENBERG_VERSION : get_bloginfo( 'version' )
		);

		wp_enqueue_script_module( '@wordpress/block-library/image' );

		/*
		 * This render needs to happen in a filter with priority 15 to ensure that
		 * it runs after the duotone filter and that duotone styles are applied to
		 * the image in the lightbox. Lightbox has to work with any plugins that
		 * might use filters as well. Removing this can be considered in the future
		 * if the way the blocks are rendered changes, or if a new kind of filter is
		 * introduced.
		 */
		add_filter( 'render_block_core/image', 'block_core_image_render_lightbox', 15, 2 );
	} else {
		/*
		 * Remove the filter if previously added by other Image blocks.
		 */
		remove_filter( 'render_block_core/image', 'block_core_image_render_lightbox', 15 );
	}

	return $p->get_updated_html();
}