WP_Navigation_Block_Renderer::get_responsive_container_markup() │ private static │ WP 6.5.0

Get the responsive container markup

Метод класса: WP_Navigation_Block_Renderer{}

Хуков нет.

Возвращает

Строку. Returns the container markup.

Использование

$result = WP_Navigation_Block_Renderer::get_responsive_container_markup( $attributes, $inner_blocks, $inner_blocks_html );
$attributes(массив) (обязательный)
The block attributes.
$inner_blocks(WP_Block_List) (обязательный)
The list of inner blocks.
$inner_blocks_html(строка) (обязательный)
The markup for the inner blocks.

Список изменений

С версии 6.5.0 Введена.

Код WP_Navigation_Block_Renderer::get_responsive_container_markup() WP 6.7.1

wp-includes/blocks/navigation.php 
private static function get_responsive_container_markup( $attributes, $inner_blocks, $inner_blocks_html ) {
	$is_interactive  = static::is_interactive( $attributes, $inner_blocks );
	$colors          = block_core_navigation_build_css_colors( $attributes );
	$modal_unique_id = wp_unique_id( 'modal-' );

	$is_hidden_by_default = isset( $attributes['overlayMenu'] ) && 'always' === $attributes['overlayMenu'];

	$responsive_container_classes = array(
		'wp-block-navigation__responsive-container',
		$is_hidden_by_default ? 'hidden-by-default' : '',
		implode( ' ', $colors['overlay_css_classes'] ),
	);
	$open_button_classes          = array(
		'wp-block-navigation__responsive-container-open',
		$is_hidden_by_default ? 'always-shown' : '',
	);

	$should_display_icon_label = isset( $attributes['hasIcon'] ) && true === $attributes['hasIcon'];
	$toggle_button_icon        = '<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><rect x="4" y="7.5" width="16" height="1.5" /><rect x="4" y="15" width="16" height="1.5" /></svg>';
	if ( isset( $attributes['icon'] ) ) {
		if ( 'menu' === $attributes['icon'] ) {
			$toggle_button_icon = '<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 5v1.5h14V5H5zm0 7.8h14v-1.5H5v1.5zM5 19h14v-1.5H5V19z" /></svg>';
		}
	}
	$toggle_button_content       = $should_display_icon_label ? $toggle_button_icon : __( 'Menu' );
	$toggle_close_button_icon    = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" 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>';
	$toggle_close_button_content = $should_display_icon_label ? $toggle_close_button_icon : __( 'Close' );
	$toggle_aria_label_open      = $should_display_icon_label ? 'aria-label="' . __( 'Open menu' ) . '"' : ''; // Open button label.
	$toggle_aria_label_close     = $should_display_icon_label ? 'aria-label="' . __( 'Close menu' ) . '"' : ''; // Close button label.

	// Add Interactivity API directives to the markup if needed.
	$open_button_directives          = '';
	$responsive_container_directives = '';
	$responsive_dialog_directives    = '';
	$close_button_directives         = '';
	if ( $is_interactive ) {
		$open_button_directives                  = '
			data-wp-on-async--click="actions.openMenuOnClick"
			data-wp-on--keydown="actions.handleMenuKeydown"
		';
		$responsive_container_directives         = '
			data-wp-class--has-modal-open="state.isMenuOpen"
			data-wp-class--is-menu-open="state.isMenuOpen"
			data-wp-watch="callbacks.initMenu"
			data-wp-on--keydown="actions.handleMenuKeydown"
			data-wp-on-async--focusout="actions.handleMenuFocusout"
			tabindex="-1"
		';
		$responsive_dialog_directives            = '
			data-wp-bind--aria-modal="state.ariaModal"
			data-wp-bind--aria-label="state.ariaLabel"
			data-wp-bind--role="state.roleAttribute"
		';
		$close_button_directives                 = '
			data-wp-on-async--click="actions.closeMenuOnClick"
		';
		$responsive_container_content_directives = '
			data-wp-watch="callbacks.focusFirstElement"
		';
	}

	$overlay_inline_styles = esc_attr( safecss_filter_attr( $colors['overlay_inline_styles'] ) );

	return sprintf(
		'<button aria-haspopup="dialog" %3$s class="%6$s" %10$s>%8$s</button>
			<div class="%5$s" %7$s id="%1$s" %11$s>
				<div class="wp-block-navigation__responsive-close" tabindex="-1">
					<div class="wp-block-navigation__responsive-dialog" %12$s>
						<button %4$s class="wp-block-navigation__responsive-container-close" %13$s>%9$s</button>
						<div class="wp-block-navigation__responsive-container-content" %14$s id="%1$s-content">
							%2$s
						</div>
					</div>
				</div>
			</div>',
		esc_attr( $modal_unique_id ),
		$inner_blocks_html,
		$toggle_aria_label_open,
		$toggle_aria_label_close,
		esc_attr( implode( ' ', $responsive_container_classes ) ),
		esc_attr( implode( ' ', $open_button_classes ) ),
		( ! empty( $overlay_inline_styles ) ) ? "style=\"$overlay_inline_styles\"" : '',
		$toggle_button_content,
		$toggle_close_button_content,
		$open_button_directives,
		$responsive_container_directives,
		$responsive_dialog_directives,
		$close_button_directives,
		$responsive_container_content_directives
	);
}