WordPress.org
Get WordPress

Make WordPress Core


Ignore:
Timestamp:
10/09/2023 05:21:30 PM (11 months ago)
Author:
karmatosed
Message:

Update npm packages to latest versions for 6.4 beta 3.

The npm packages needed a further update for beta 3 in preparation for 6.4.

Props @richtabor, @mmaattiiaass, @tellthemachines, @mamaduka, @swissspidy, @scruffian, @andraganescu, @andrewserong, @mujuonly, @get_dave, @ntsekouras, @carlosgprim, @ramonopoly, @jameskoster, @wildworks, @aaronrobertshaw, @czapla, @santosguillamot, @artemiosans, @afercia, @glendaviesnz, @kevin940726, @mikachan, @siobhyb.

See #59411.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/blocks/image.php

    r56755 r56808  
    1010 * adding a data-id attribute to the element if core/gallery has added on pre-render.
    1111 *
    12  * @param  array    $attributes The block attributes.
    13  * @param  string   $content    The block content.
    14  * @param  WP_Block $block      The block object.
    15  * @return string Returns the block content with the data-id attribute added.
     12 * @param array    $attributes The block attributes.
     13 * @param string   $content    The block content.
     14 * @param WP_Block $block      The block object.
     15 *
     16 * @return string The block content with the data-id attribute added.
    1617 */
    1718function render_block_core_image( $attributes, $content, $block ) {
    … …  
    7778
    7879/**
    79  * Add the lightboxEnabled flag to the block data.
     80 * Adds the lightboxEnabled flag to the block data.
    8081 *
    8182 * This is used to determine whether the lightbox should be rendered or not.
    8283 *
    83  * @param  array $block Block data.
    84  * @return array        Filtered block data.
     84 * @param array $block Block data.
     85 *
     86 * @return array Filtered block data.
    8587 */
    8688function block_core_image_get_lightbox_settings( $block ) {
    … …  
    114116
    115117/**
    116  * Add the directives and layout needed for the lightbox behavior.
    117  *
    118  * @param  string $block_content        Rendered block content.
    119  * @param  array  $block                Block object.
    120  * @return string                Filtered block content.
     118 * Adds the directives and layout needed for the lightbox behavior.
     119 *
     120 * @param string $block_content Rendered block content.
     121 * @param array  $block         Block object.
     122 *
     123 * @return string Filtered block content.
    121124 */
    122125function block_core_image_render_lightbox( $block_content, $block ) {
    … …  
    125128    $aria_label = __( 'Enlarge image' );
    126129
     130    $processor->next_tag( 'img' );
    127131    $alt_attribute = $processor->get_attribute( 'alt' );
    128132
    129     if ( null !== $alt_attribute ) {
     133    // An empty alt attribute `alt=""` is valid for decorative images.
     134    if ( is_string( $alt_attribute ) ) {
    130135        $alt_attribute = trim( $alt_attribute );
    131136    }
    132137
     138    // It only makes sense to append the alt text to the button aria-label when the alt text is non-empty.
    133139    if ( $alt_attribute ) {
    134140        /* translators: %s: Image alt text. */
    135141        $aria_label = sprintf( __( 'Enlarge image: %s' ), $alt_attribute );
    136142    }
    137     $content = $processor->get_updated_html();
    138143
    139144    // Currently, we are only enabling the zoom animation.
    140145    $lightbox_animation = 'zoom';
    141146
    142     // We want to store the src in the context so we can set it dynamically when the lightbox is opened.
    143     $z = new WP_HTML_Tag_Processor( $content );
    144     $z->next_tag( 'img' );
    145 
     147    // Note: We want to store the `src` in the context so we
     148    // can set it dynamically when the lightbox is opened.
    146149    if ( isset( $block['attrs']['id'] ) ) {
    147150        $img_uploaded_src = wp_get_attachment_url( $block['attrs']['id'] );
    … …  
    150153        $img_height       = $img_metadata['height'];
    151154    } else {
    152         $img_uploaded_src = $z->get_attribute( 'src' );
     155        $img_uploaded_src = $processor->get_attribute( 'src' );
    153156        $img_width        = 'none';
    154157        $img_height       = 'none';
    … …  
    161164    }
    162165
    163     $w = new WP_HTML_Tag_Processor( $content );
     166    $w = new WP_HTML_Tag_Processor( $block_content );
    164167    $w->next_tag( 'figure' );
    165168    $w->add_class( 'wp-lightbox-container' );
    … …  
    181184                        "targetWidth": "%s",
    182185                        "targetHeight": "%s",
    183                         "scaleAttr": "%s"
     186                        "scaleAttr": "%s",
     187                        "dialogLabel": "%s"
    184188                    }
    185189                }
    … …  
    189193            $img_width,
    190194            $img_height,
    191             $scale_attr
     195            $scale_attr,
     196            __( 'Enlarged image' )
    192197        )
    193198    );
    … …  
    201206    $img = null;
    202207    preg_match( '/<img[^>]+>/', $body_content, $img );
    203     $button       =
    204                 '<button
    205                     type="button"
    206                     aria-haspopup="dialog"
    207                     aria-label="' . esc_attr( $aria_label ) . '"
    208                     data-wp-on--click="actions.core.image.showLightbox"
    209                     data-wp-style--width="context.core.image.imageButtonWidth"
    210                     data-wp-style--height="context.core.image.imageButtonHeight"
    211                     data-wp-style--left="context.core.image.imageButtonLeft"
    212                     data-wp-style--top="context.core.image.imageButtonTop"
    213                 >
    214                 </button>'
    215                 . $img[0];
     208
     209    $button =
     210        $img[0]
     211        . '<button
     212            type="button"
     213            aria-haspopup="dialog"
     214            aria-label="' . esc_attr( $aria_label ) . '"
     215            data-wp-on--click="actions.core.image.showLightbox"
     216            data-wp-style--width="context.core.image.imageButtonWidth"
     217            data-wp-style--height="context.core.image.imageButtonHeight"
     218            data-wp-style--left="context.core.image.imageButtonLeft"
     219            data-wp-style--top="context.core.image.imageButtonTop"
     220        ></button>';
     221
    216222    $body_content = preg_replace( '/<img[^>]+>/', $button, $body_content );
    217223
    … …  
    221227    // as the lightbox is opened, while the enlarged one is a full-sized
    222228    // version that will likely still be loading as the animation begins.
    223     $m = new WP_HTML_Tag_Processor( $content );
     229    $m = new WP_HTML_Tag_Processor( $block_content );
    224230    $m->next_tag( 'figure' );
    225231    $m->add_class( 'responsive-image' );
    … …  
    237243    $initial_image_content = $m->get_updated_html();
    238244
    239     $q = new WP_HTML_Tag_Processor( $content );
     245    $q = new WP_HTML_Tag_Processor( $block_content );
    240246    $q->next_tag( 'figure' );
    241247    $q->add_class( 'enlarged-image' );
    … …  
    253259    $enlarged_image_content = $q->get_updated_html();
    254260
    255     $background_color = esc_attr( wp_get_global_styles( array( 'color', 'background' ) ) );
     261    // If the current theme does NOT have a `theme.json`, or the colors are not defined,
     262    // we need to set the background color & close button color to some default values
     263    // because we can't get them from the Global Styles.
     264    $background_color   = '#fff';
     265    $close_button_color = '#000';
     266    if ( wp_theme_has_theme_json() ) {
     267        $global_styles_color = wp_get_global_styles( array( 'color' ) );
     268        if ( ! empty( $global_styles_color['background'] ) ) {
     269            $background_color = esc_attr( $global_styles_color['background'] );
     270        }
     271        if ( ! empty( $global_styles_color['text'] ) ) {
     272            $close_button_color = esc_attr( $global_styles_color['text'] );
     273        }
     274    }
    256275
    257276    $close_button_icon  = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="15" height="15" aria-hidden="true" focusable="false"><path d="M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z"></path></svg>';
    258     $close_button_color = esc_attr( wp_get_global_styles( array( 'color', 'text' ) ) );
    259     $dialog_label       = $alt_attribute ? esc_attr( $alt_attribute ) : esc_attr__( 'Image' );
    260277    $close_button_label = esc_attr__( 'Close' );
    261278
    … …  
    263280        <div data-wp-body="" class="wp-lightbox-overlay $lightbox_animation"
    264281            data-wp-bind--role="selectors.core.image.roleAttribute"
    265             aria-label="$dialog_label"
     282            data-wp-bind--aria-label="selectors.core.image.dialogLabel"
    266283            data-wp-class--initialized="context.core.image.initialized"
    267284            data-wp-class--active="context.core.image.lightboxEnabled"
    268285            data-wp-class--hideAnimationEnabled="context.core.image.hideAnimationEnabled"
    269             data-wp-bind--aria-hidden="!context.core.image.lightboxEnabled"
    270             aria-hidden="true"
    271             data-wp-bind--aria-modal="context.core.image.lightboxEnabled"
    272             aria-modal="false"
     286            data-wp-bind--aria-modal="selectors.core.image.ariaModal"
    273287            data-wp-effect="effects.core.image.initLightbox"
    274288            data-wp-on--keydown="actions.core.image.handleKeydown"
    … …  
    283297                <div class="lightbox-image-container">$initial_image_content</div>
    284298                <div class="lightbox-image-container">$enlarged_image_content</div>
    285                 <div class="scrim" style="background-color: $background_color"></div>
     299                <div class="scrim" style="background-color: $background_color" aria-hidden="true"></div>
    286300        </div>
    287301HTML;
    … …  
    291305
    292306/**
    293  * Ensure that the view script has the `wp-interactivity` dependency.
     307 * Ensures that the view script has the `wp-interactivity` dependency.
    294308 *
    295309 * @since 6.4.0
    296310 *
    297311 * @global WP_Scripts $wp_scripts
     312 *
     313 * @return void
    298314 */
    299315function block_core_image_ensure_interactivity_dependency() {
    … …  
    311327/**
    312328 * Registers the `core/image` block on server.
     329 *
     330 * @return void
    313331 */
    314332function register_block_core_image() {
Note: See TracChangeset for help on using the changeset viewer.