| @@ -170,15 +170,15 @@ | ||
| 170 | 170 | * Adds the directives and layout needed for the lightbox behavior. |
| 171 | 171 | * |
| 172 | 172 | * @since 6.4.0 |
| 173 | 173 | * |
| 174 | - * @param string $block_content Rendered block content. | |
| 175 | - * @param array $block Block object. | |
| 176 | - * @param array $block_instance Block instance. | |
| 174 | + * @param string $block_content Rendered block content. | |
| 175 | + * @param array $block Block object. | |
| 176 | + * @param WP_Block $block_instance Block instance. | |
| 177 | 177 | * |
| 178 | 178 | * @return string Filtered block content. |
| 179 | 179 | */ |
| 180 | -function gutenberg_block_core_image_render_lightbox( $block_content, $block, $block_instance ) { | |
| 180 | +function gutenberg_block_core_image_render_lightbox( $block_content, array $block, WP_Block $block_instance ) { | |
| 181 | 181 | /* |
| 182 | 182 | * If there's no IMG tag in the block then return the given block content |
| 183 | 183 | * as-is. There's nothing that this code can knowingly modify to add the |
| 184 | 184 | * lightbox behavior. |
| @@ -249,9 +249,9 @@ | ||
| 249 | 249 | 'alt' => $alt, |
| 250 | 250 | 'galleryId' => $block_instance->context['galleryId'] ?? null, |
| 251 | 251 | 'customAriaLabel' => $custom_aria_label ?? null, |
| 252 | 252 | 'navigationButtonType' => $block_instance->context['navigationButtonType'] ?? 'icon', |
| 253 | - 'triggerButtonAriaLabel' => null, | |
| 253 | + 'triggerButtonAriaLabel' => __( 'Enlarge' ), | |
| 254 | 254 | ), |
| 255 | 255 | ), |
| 256 | 256 | ) |
| 257 | 257 | ); |
| @@ -289,14 +289,14 @@ | ||
| 289 | 289 | |
| 290 | 290 | $body_content = $processor->get_updated_html(); |
| 291 | 291 | |
| 292 | 292 | // Adds a button alongside image in the body content. |
| 293 | + // Extract the img tag using preg_match for structured access. | |
| 293 | 294 | $img = null; |
| 294 | 295 | preg_match( '/<img[^>]+>/', $body_content, $img ); |
| 295 | 296 | |
| 296 | - $button = | |
| 297 | - $img[0] | |
| 298 | - . '<button | |
| 297 | + if ( isset( $img[0] ) ) { | |
| 298 | + $button_html = '<button | |
| 299 | 299 | class="lightbox-trigger" |
| 300 | 300 | type="button" |
| 301 | 301 | aria-haspopup="dialog" |
| 302 | 302 | data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel" |
| @@ -309,9 +309,15 @@ | ||
| 309 | 309 | <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> |
| 310 | 310 | </svg> |
| 311 | 311 | </button>'; |
| 312 | 312 | |
| 313 | - $body_content = preg_replace( '/<img[^>]+>/', $button, $body_content ); | |
| 313 | + // Build the replacement: img tag + button. | |
| 314 | + // Use str_replace for literal replacement instead of preg_replace to avoid | |
| 315 | + // PCRE backreference interpretation of $ and \ sequences in user-controlled | |
| 316 | + // image attributes (e.g., alt="Just $5 today"). | |
| 317 | + $button = $img[0] . $button_html; | |
| 318 | + $body_content = str_replace( $img[0], $button, $body_content ); | |
| 319 | + } | |
| 314 | 320 | |
| 315 | 321 | add_action( 'wp_footer', 'gutenberg_block_core_image_print_lightbox_overlay' ); |
| 316 | 322 | |
| 317 | 323 | return $body_content; |
| @@ -334,9 +340,9 @@ | ||
| 334 | 340 | // default values because it can't get them from the Global Styles. |
| 335 | 341 | $background_color = '#fff'; |
| 336 | 342 | $close_button_color = '#000'; |
| 337 | 343 | if ( wp_theme_has_theme_json() ) { |
| 338 | - $global_styles_color = wp_get_global_styles( array( 'color' ) ); | |
| 344 | + $global_styles_color = gutenberg_get_global_styles( array( 'color' ) ); | |
| 339 | 345 | if ( ! empty( $global_styles_color['background'] ) ) { |
| 340 | 346 | $background_color = esc_attr( $global_styles_color['background'] ); |
| 341 | 347 | } |
| 342 | 348 | if ( ! empty( $global_styles_color['text'] ) ) { |
| @@ -388,9 +394,8 @@ | ||
| 388 | 394 | data-wp-bind--alt="state.selectedImage.alt" |
| 389 | 395 | data-wp-bind--class="state.selectedImage.imgClassNames" |
| 390 | 396 | data-wp-bind--style="state.imgStyles" |
| 391 | 397 | data-wp-bind--src="state.enlargedSrc" |
| 392 | - data-wp-bind--srcset="state.enlargedSrcset" | |
| 393 | 398 | data-wp-bind--srcset="state.enlargedSrcset" |
| 394 | 399 | sizes="100vw" |
| 395 | 400 | > |
| 396 | 401 | </figure> |
