gutenberg / build / scripts / block-library / tab.php

tab.php in Gutenberg 22.3.0, at build/scripts/block-library/tab.php

129 lines 3.4 KB

Raw Download Zip

1	<?php
2	/**
3	* Tabs Block
4	*
5	* @package WordPress
6	*/
7
8	/**
9	* Build typography classnames from named size/family.
10	*
11	* @param array $attributes Block attributes.
12	* @return string Classnames.
13	*/
14	function gutenberg_block_core_tab_get_typography_classes( array $attributes ): string {
15	$typography_classes = array();
16	$has_named_font_family = ! empty( $attributes['fontFamily'] );
17	$has_named_font_size = ! empty( $attributes['fontSize'] );
18
19	if ( $has_named_font_size ) {
20	$typography_classes[] = sprintf( 'has-%s-font-size', esc_attr( (string) $attributes['fontSize'] ) );
21	}
22
23	if ( $has_named_font_family ) {
24	$typography_classes[] = sprintf( 'has-%s-font-family', esc_attr( (string) $attributes['fontFamily'] ) );
25	}
26
27	return implode( ' ', $typography_classes );
28	}
29
30	/**
31	* Build inline typography styles.
32	*
33	* @param array $attributes Block attributes.
34	* @return string Inline CSS.
35	*/
36	function gutenberg_block_core_tab_get_typography_styles( array $attributes ): string {
37	$typography_styles = array();
38
39	if ( ! empty( $attributes['style']['typography']['fontSize'] ) ) {
40	$typography_styles[] = sprintf(
41	'font-size: %s;',
42	gutenberg_get_typography_font_size_value(
43	array(
44	'size' => $attributes['style']['typography']['fontSize'],
45	)
46	)
47	);
48	}
49
50	if ( ! empty( $attributes['style']['typography']['fontFamily'] ) ) {
51	$typography_styles[] = sprintf( 'font-family: %s;', $attributes['style']['typography']['fontFamily'] );
52	}
53
54	return implode( '', $typography_styles );
55	}
56
57	/**
58	* Render callback for core/tab.
59	*
60	* @param array $attributes Block attributes.
61	* @param string $content Block content.
62	*
63	* @return string Updated HTML.
64	*/
65	function gutenberg_block_core_tab_render( array $attributes, string $content ): string {
66	$tag_processor = new WP_HTML_Tag_Processor( $content );
67	$tag_processor->next_tag( array( 'class_name' => 'wp-block-tab' ) );
68	$tab_id = (string) $tag_processor->get_attribute( 'id' );
69
70	/**
71	* Add interactivity to the tab element.
72	*/
73	$tag_processor->set_attribute(
74	'data-wp-interactive',
75	'core/tabs/private'
76	);
77	$tag_processor->set_attribute(
78	'data-wp-context',
79	wp_json_encode(
80	array(
81	'tab' => array(
82	'id' => $tab_id,
83	),
84	)
85	)
86	);
87
88	/**
89	* Process style classnames.
90	*/
91	$classname = (string) $tag_processor->get_attribute( 'class' );
92	$classname .= ' ' . gutenberg_block_core_tab_get_typography_classes( $attributes );
93	$tag_processor->set_attribute( 'class', $classname );
94
95	/**
96	* Process accessibility and interactivity attributes.
97	*/
98	$tag_processor->set_attribute( 'role', 'tabpanel' );
99	$tag_processor->set_attribute( 'aria-labelledby', 'tab__' . $tab_id );
100	$tag_processor->set_attribute( 'data-wp-bind--hidden', '!state.isActiveTab' );
101	$tag_processor->set_attribute( 'data-wp-bind--tabindex', 'state.tabIndexAttribute' );
102
103	/**
104	* Process style attribute.
105	*/
106	$style = (string) $tag_processor->get_attribute( 'style' );
107	$style .= gutenberg_block_core_tab_get_typography_styles( $attributes );
108	$tag_processor->set_attribute( 'style', $style );
109
110	return (string) $tag_processor->get_updated_html();
111	}
112
113	/**
114	* Registers the `core/tab` block on the server.
115	*
116	* @hook init
117	*
118	* @since 6.9.0
119	*/
120	function gutenberg_register_block_core_tab() {
121	register_block_type_from_metadata(
122	__DIR__ . '/tab',
123	array(
124	'render_callback' => 'gutenberg_block_core_tab_render',
125	)
126	);
127	}
128	add_action( 'init', 'gutenberg_register_block_core_tab', 20 );
129