[Summary view] [Print] [Text view]

   1  <?php
   2  /**
   3   * Server-side rendering of the `core/button` block.
   4   *
   5   * @package WordPress
   6   */
   7  
   8  /**
   9   * Renders the `core/button` block on the server,
  10   *
  11   * @since 6.6.0
  12   *
  13   * @param array  $attributes The block attributes.
  14   * @param string $content    The block content.
  15   *
  16   * @return string The block content.
  17   */
  18  function render_block_core_button( $attributes, $content ) {
  19      $p = new WP_HTML_Tag_Processor( $content );
  20  
  21      /*
  22       * The button block can render an `<a>` or `<button>` and also has a
  23       * `<div>` wrapper. Find the a or button tag.
  24       */
  25      $tag = null;
  26      while ( $p->next_tag() ) {
  27          $tag = $p->get_tag();
  28          if ( 'A' === $tag || 'BUTTON' === $tag ) {
  29              break;
  30          }
  31      }
  32  
  33      /*
  34       * If this happens, the likelihood is there's no block content,
  35       * or the block has been modified by a plugin.
  36       */
  37      if ( null === $tag ) {
  38          return $content;
  39      }
  40  
  41      // If the next token is the closing tag, the button is empty.
  42      $is_empty = true;
  43      while ( $p->next_token() && $tag !== $p->get_token_name() && $is_empty ) {
  44          if ( '#comment' !== $p->get_token_type() ) {
  45              /**
  46               * Anything else implies this is not empty.
  47               * This might include any text content (including a space),
  48               * inline images or other HTML.
  49               */
  50              $is_empty = false;
  51          }
  52      }
  53  
  54      /*
  55       * When there's no text, render nothing for the block.
  56       * See https://github.com/WordPress/gutenberg/issues/17221 for the
  57       * reasoning behind this.
  58       */
  59      if ( $is_empty ) {
  60          return '';
  61      }
  62  
  63      // Background skips serialization, so apply it to the link element, like the color support does.
  64      $background = $attributes['style']['background'] ?? null;
  65  
  66      if ( is_array( $background ) ) {
  67          $background_styles = array(
  68              'backgroundImage'      => $background['backgroundImage'] ?? null,
  69              'backgroundSize'       => $background['backgroundSize'] ?? null,
  70              'backgroundPosition'   => $background['backgroundPosition'] ?? null,
  71              'backgroundRepeat'     => $background['backgroundRepeat'] ?? null,
  72              'backgroundAttachment' => $background['backgroundAttachment'] ?? null,
  73              'gradient'             => $background['gradient'] ?? null,
  74          );
  75  
  76          // Mirror the background block support defaults.
  77          if ( ! empty( $background_styles['backgroundImage'] ) ) {
  78              $background_styles['backgroundSize'] = $background_styles['backgroundSize'] ?? 'cover';
  79              if ( 'contain' === $background_styles['backgroundSize'] && ! $background_styles['backgroundPosition'] ) {
  80                  $background_styles['backgroundPosition'] = '50% 50%';
  81              }
  82          }
  83  
  84          $styles = wp_style_engine_get_styles( array( 'background' => $background_styles ) );
  85  
  86          if ( ! empty( $styles['css'] ) ) {
  87              $processor = new WP_HTML_Tag_Processor( $content );
  88              while ( $processor->next_tag() ) {
  89                  if ( $tag !== $processor->get_tag() ) {
  90                      continue;
  91                  }
  92  
  93                  $existing_style = $processor->get_attribute( 'style' );
  94                  if ( is_string( $existing_style ) && '' !== $existing_style ) {
  95                      $separator = str_ends_with( $existing_style, ';' ) ? '' : ';';
  96                      $processor->set_attribute( 'style', $existing_style . $separator . $styles['css'] );
  97                  } else {
  98                      $processor->set_attribute( 'style', $styles['css'] );
  99                  }
 100  
 101                  if ( ! empty( $background_styles['backgroundImage'] ) || ! empty( $background_styles['gradient'] ) ) {
 102                      $processor->add_class( 'has-background' );
 103                  }
 104                  break;
 105              }
 106              $content = $processor->get_updated_html();
 107          }
 108      }
 109  
 110      $width = $attributes['style']['dimensions']['width'] ?? null;
 111  
 112      if ( is_string( $width ) && '' !== $width ) {
 113          // Resolve preset references to their actual values.
 114          $resolved_width = $width;
 115          $is_preset      = str_starts_with( $width, 'var:preset|dimension|' );
 116  
 117          if ( $is_preset ) {
 118              $slug              = substr( $width, strlen( 'var:preset|dimension|' ) );
 119              $dimension_presets = wp_get_global_settings(
 120                  array( 'dimensions', 'dimensionSizes' ),
 121                  array( 'block_name' => 'core/button' )
 122              );
 123  
 124              // Search origins in priority order: custom > theme > default.
 125              if ( is_array( $dimension_presets ) ) {
 126                  foreach ( array( 'custom', 'theme', 'default' ) as $origin ) {
 127                      if ( empty( $dimension_presets[ $origin ] ) || ! is_array( $dimension_presets[ $origin ] ) ) {
 128                          continue;
 129                      }
 130                      foreach ( $dimension_presets[ $origin ] as $preset ) {
 131                          if ( isset( $preset['slug'] ) && $preset['slug'] === $slug ) {
 132                              $resolved_width = $preset['size'] ?? $width;
 133                              break 2;
 134                          }
 135                      }
 136                  }
 137              }
 138          }
 139  
 140          $is_percentage = str_ends_with( $resolved_width, '%' );
 141  
 142          $processor = new WP_HTML_Tag_Processor( $content );
 143          // Target the outer wrapper div.
 144          if ( $processor->next_tag( array( 'class_name' => 'wp-block-button' ) ) ) {
 145              $processor->add_class( 'has-custom-width' );
 146              $existing_style = $processor->get_attribute( 'style' );
 147              $existing_style = is_string( $existing_style ) ? $existing_style : '';
 148  
 149              if ( $is_percentage ) {
 150                  $numeric_width = (float) $resolved_width;
 151                  $processor->add_class( 'wp-block-button__width' );
 152  
 153                  // Maintain legacy class for the standard percentage widths.
 154                  $legacy_widths = array(
 155                      '25%'  => 'wp-block-button__width-25',
 156                      '50%'  => 'wp-block-button__width-50',
 157                      '75%'  => 'wp-block-button__width-75',
 158                      '100%' => 'wp-block-button__width-100',
 159                  );
 160                  if ( isset( $legacy_widths[ $resolved_width ] ) ) {
 161                      $processor->add_class( $legacy_widths[ $resolved_width ] );
 162                  }
 163  
 164                  $width_style = "--wp--block-button--width: $numeric_width;";
 165                  $processor->set_attribute( 'style', $width_style . ( $existing_style ? ' ' . $existing_style : '' ) );
 166              } else {
 167                  $css_value   = $is_preset
 168                      ? 'var(--wp--preset--dimension--' . _wp_to_kebab_case( $slug ) . ')'
 169                      : $width;
 170                  $width_style = "width: $css_value;";
 171                  $processor->set_attribute( 'style', $width_style . ( $existing_style ? ' ' . $existing_style : '' ) );
 172              }
 173  
 174              $content = $processor->get_updated_html();
 175          }
 176      }
 177  
 178      return $content;
 179  }
 180  
 181  /**
 182   * Registers the `core/button` block on server.
 183   *
 184   * @since 6.6.0
 185   */
 186  function register_block_core_button() {
 187      register_block_type_from_metadata(
 188          __DIR__ . '/button',
 189          array(
 190              'render_callback' => 'render_block_core_button',
 191          )
 192      );
 193  }
 194  add_action( 'init', 'register_block_core_button' );