| @@ -190,10 +190,34 @@ | ||
| 190 | 190 | data-wp-on--focusout="actions.handleSearchFocusout" |
| 191 | 191 | '; |
| 192 | 192 | } |
| 193 | 193 | |
| 194 | + /* | |
| 195 | + * The semantic <search> landmark wrapper is opt-in to preserve back | |
| 196 | + * compatibility with themes targeting <form role="search">. The block | |
| 197 | + * exposes a per-instance HTML element selector with three values: | |
| 198 | + * | |
| 199 | + * - 'search' forces the <search> wrapper | |
| 200 | + * - 'form' forces the original <form role="search"> markup | |
| 201 | + * - empty defers to the 'search-element' html5 sub-feature | |
| 202 | + * ( add_theme_support( 'html5', array( 'search-element' ) ) ), | |
| 203 | + * matching the opt-in added to get_search_form() in core | |
| 204 | + */ | |
| 205 | + $tag_name = $attributes['tagName'] ?? ''; | |
| 206 | + $use_search_element = 'search' === $tag_name || ( '' === $tag_name && current_theme_supports( 'html5', 'search-element' ) ); | |
| 207 | + | |
| 208 | + /* | |
| 209 | + * Only the wrapper markup differs between the semantic <search> landmark | |
| 210 | + * and the classic <form role="search">. Positional specifiers keep a | |
| 211 | + * single argument list usable by both formats, since the action URL | |
| 212 | + * precedes the wrapper attributes in the <search> variant. | |
| 213 | + */ | |
| 214 | + $format = $use_search_element | |
| 215 | + ? '<search %2$s %3$s><form method="get" action="%1$s">%4$s</form></search>' | |
| 216 | + : '<form role="search" method="get" action="%1$s" %2$s %3$s>%4$s</form>'; | |
| 217 | + | |
| 194 | 218 | return sprintf( |
| 195 | - '<form role="search" method="get" action="%1s" %2s %3s>%4s</form>', | |
| 219 | + $format, | |
| 196 | 220 | esc_url( home_url( '/' ) ), |
| 197 | 221 | $wrapper_attributes, |
| 198 | 222 | $form_directives, |
| 199 | 223 | $label . $field_markup |
| @@ -335,9 +359,9 @@ | ||
| 335 | 359 | * be positioning the button "inside". |
| 336 | 360 | * |
| 337 | 361 | * @since 5.8.0 |
| 338 | 362 | * |
| 339 | - * @param array $attributes The block attributes. | |
| 363 | + * @param array $attributes The block attributes. | |
| 340 | 364 | * |
| 341 | 365 | * @return array Style HTML attribute. |
| 342 | 366 | */ |
| 343 | 367 | function gutenberg_styles_for_block_core_search( $attributes ) { |
