wp-includes/blocks/image.php:323function block_core_image_print_lightbox_overlay() { $dialog_label = esc_attr__( 'Enlarged images' ); $close_button_text = esc_attr__( 'Close' ); $prev_button_text = esc_attr_x( 'Previous', 'previous image in lightbox' ); $next_button_text = esc_attr_x( 'Next', 'next image in lightbox' ); $close_button_icon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" focusable="false"><path d="m13.06 12 6.47-6.47-1.06-1.06L12 10.94 5.53 4.47 4.47 5.53 10.94 12l-6.47 6.47 1.06 1.06L12 13.06l6.47 6.47 1.06-1.06L13.06 12Z"></path></svg>'; $prev_button_icon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="28" height="28" aria-hidden="true" focusable="false"><path d="M14.6 7l-1.2-1L8 12l5.4 6 1.2-1-4.6-5z"></path></svg>'; $next_button_icon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="28" height="28" aria-hidden="true" focusable="false"><path d="M10.6 6L9.4 7l4.6 5-4.6 5 1.2 1 5.4-6z"></path></svg>'; // If the current theme does NOT have a `theme.json`, or the colors are not // defined, it needs to set the background color & close button color to some // default values because it can't get them from the Global Styles. $background_color = '#fff'; $close_button_color = '#000'; if ( wp_theme_has_theme_json() ) { $global_styles_color = wp_get_global_styles( array( 'color' ) ); if ( ! empty( $global_styles_color['background'] ) ) { $background_color = esc_attr( $global_styles_color['background'] ); } if ( ! empty( $global_styles_color['text'] ) ) { $close_button_color = esc_attr( $global_styles_color['text'] ); } } echo <<<HTML <div class="wp-lightbox-overlay zoom" aria-label="{$dialog_label}" data-wp-interactive="core/image" data-wp-router-region='{ "id": "core/image-overlay", "attachTo": "body" }' data-wp-key="wp-lightbox-overlay" data-wp-context='{}' data-wp-bind--role="state.roleAttribute" data-wp-bind--aria-label="state.ariaLabel" data-wp-bind--aria-modal="state.ariaModal" data-wp-class--active="state.overlayEnabled" data-wp-class--show-closing-animation="state.overlayOpened" data-wp-watch---focus="callbacks.setOverlayFocus" data-wp-watch---inert="callbacks.setInertElements" data-wp-on--keydown="actions.handleKeydown" data-wp-on--touchstart="actions.handleTouchStart" data-wp-on--touchmove="actions.handleTouchMove" data-wp-on--touchend="actions.handleTouchEnd" data-wp-on--click="actions.hideLightbox" data-wp-on-window--resize="callbacks.setOverlayStyles" data-wp-on-window--scroll="actions.handleScroll" data-wp-bind--style="state.overlayStyles" tabindex="-1" > <button type="button" style="fill:{$close_button_color}" class="wp-lightbox-close-button" data-wp-bind--aria-label="state.closeButtonAriaLabel"> <span class="wp-lightbox-close-icon" data-wp-bind--hidden="!state.hasNavigationIcon">{$close_button_icon}</span> <span class="wp-lightbox-close-text" data-wp-bind--hidden="!state.hasNavigationText">{$close_button_text}</span> </button> <button type="button" style="fill:{$close_button_color}" class="wp-lightbox-navigation-button wp-lightbox-navigation-button-prev" data-wp-bind--hidden="!state.hasNavigation" data-wp-on--click="actions.showPreviousImage" data-wp-bind--aria-label="state.prevButtonAriaLabel"> <span class="wp-lightbox-navigation-icon" data-wp-bind--hidden="!state.hasNavigationIcon">{$prev_button_icon}</span> <span class="wp-lightbox-navigation-text" data-wp-bind--hidden="!state.hasNavigationText">{$prev_button_text}</span> </button> <div class="lightbox-image-container"> <figure data-wp-bind--class="state.selectedImage.figureClassNames" data-wp-bind--style="state.figureStyles"> <img data-wp-bind--alt="state.selectedImage.alt" data-wp-bind--class="state.selectedImage.imgClassNames" data-wp-bind--style="state.imgStyles" data-wp-bind--src="state.selectedImage.currentSrc"> </figure> </div> <div class="lightbox-image-container"> <figure data-wp-bind--class="state.selectedImage.figureClassNames" data-wp-bind--style="state.figureStyles"> <img data-wp-bind--alt="state.selectedImage.alt" data-wp-bind--class="state.selectedImage.imgClassNames" data-wp-bind--style="state.imgStyles" data-wp-bind--src="state.enlargedSrc" data-wp-bind--srcset="state.enlargedSrcset" sizes="100vw" > </figure> </div> <button type="button" style="fill:{$close_button_color}" class="wp-lightbox-navigation-button wp-lightbox-navigation-button-next" data-wp-bind--hidden="!state.hasNavigation" data-wp-on--click="actions.showNextImage" data-wp-bind--aria-label="state.nextButtonAriaLabel"> <span class="wp-lightbox-navigation-text" data-wp-bind--hidden="!state.hasNavigationText">{$next_button_text}</span> <span class="wp-lightbox-navigation-icon" data-wp-bind--hidden="!state.hasNavigationIcon">{$next_button_icon}</span> </button> <div data-wp-text="state.ariaLabel" aria-live="polite" aria-atomic="true" class="screen-reader-text"></div> <div class="scrim" style="background-color: {$background_color}" aria-hidden="true"></div>Introduced in 6.5.0. Unchanged from 6.7.7 through 7.1.0.
Signature, return type and hooks compared across 5 parsed releases.
src/wp-includes/blocks/image.php, and regenerated for each WordPress release so it tracks the code rather than a snapshot of it.