diff options
Diffstat (limited to '')
| -rw-r--r-- | wp-includes/blocks/search.php | 104 | ||||
| -rw-r--r-- | wp-includes/blocks/search/block.json | 5 | ||||
| -rw-r--r-- | wp-includes/blocks/search/editor-rtl.css | 1 | ||||
| -rw-r--r-- | wp-includes/blocks/search/editor-rtl.min.css | 2 | ||||
| -rw-r--r-- | wp-includes/blocks/search/editor.css | 1 | ||||
| -rw-r--r-- | wp-includes/blocks/search/editor.min.css | 2 | ||||
| -rw-r--r-- | wp-includes/blocks/search/style-rtl.css | 54 | ||||
| -rw-r--r-- | wp-includes/blocks/search/style-rtl.min.css | 2 | ||||
| -rw-r--r-- | wp-includes/blocks/search/style.css | 54 | ||||
| -rw-r--r-- | wp-includes/blocks/search/style.min.css | 2 | ||||
| -rw-r--r-- | wp-includes/blocks/search/view.asset.php | 2 | ||||
| -rw-r--r-- | wp-includes/blocks/search/view.js | 187 | ||||
| -rw-r--r-- | wp-includes/blocks/search/view.min.asset.php | 2 | ||||
| -rw-r--r-- | wp-includes/blocks/search/view.min.js | 2 |
14 files changed, 213 insertions, 207 deletions
diff --git a/wp-includes/blocks/search.php b/wp-includes/blocks/search.php index f00ecfe..ca8c70e 100644 --- a/wp-includes/blocks/search.php +++ b/wp-includes/blocks/search.php @@ -16,7 +16,7 @@ * * @return string The search block markup. */ -function render_block_core_search( $attributes, $content, $block ) { +function render_block_core_search( $attributes ) { // Older versions of the Search block defaulted the label and buttonText // attributes to `__( 'Search' )` meaning that many posts contain `<!-- // wp:search /-->`. Support these by defaulting an undefined label and @@ -36,7 +36,6 @@ function render_block_core_search( $attributes, $content, $block ) { $show_button = ( ! empty( $attributes['buttonPosition'] ) && 'no-button' === $attributes['buttonPosition'] ) ? false : true; $button_position = $show_button ? $attributes['buttonPosition'] : null; $query_params = ( ! empty( $attributes['query'] ) ) ? $attributes['query'] : array(); - $button_behavior = ( ! empty( $attributes['buttonBehavior'] ) ) ? $attributes['buttonBehavior'] : 'default'; $button = ''; $query_params_markup = ''; $inline_styles = styles_for_block_core_search( $attributes ); @@ -48,7 +47,7 @@ function render_block_core_search( $attributes, $content, $block ) { $border_color_classes = get_border_color_classes_for_block_core_search( $attributes ); // This variable is a constant and its value is always false at this moment. // It is defined this way because some values depend on it, in case it changes in the future. - $open_by_default = 'false'; + $open_by_default = false; $label_inner_html = empty( $attributes['label'] ) ? __( 'Search' ) : wp_kses_post( $attributes['label'] ); $label = new WP_HTML_Tag_Processor( sprintf( '<label %1$s>%2$s</label>', $inline_styles['label'], $label_inner_html ) ); @@ -78,28 +77,29 @@ function render_block_core_search( $attributes, $content, $block ) { $input->set_attribute( 'value', get_search_query() ); $input->set_attribute( 'placeholder', $attributes['placeholder'] ); - $is_expandable_searchfield = 'button-only' === $button_position && 'expand-searchfield' === $button_behavior; + // If it's interactive, enqueue the script module and add the directives. + $is_expandable_searchfield = 'button-only' === $button_position; if ( $is_expandable_searchfield ) { - $input->set_attribute( 'data-wp-bind--aria-hidden', '!context.core.search.isSearchInputVisible' ); - $input->set_attribute( 'data-wp-bind--tabindex', 'selectors.core.search.tabindex' ); - // Adding these attributes manually is needed until the Interactivity API SSR logic is added to core. - $input->set_attribute( 'aria-hidden', 'true' ); - $input->set_attribute( 'tabindex', '-1' ); - } + $suffix = wp_scripts_get_suffix(); + if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { + $module_url = gutenberg_url( '/build/interactivity/search.min.js' ); + } - // If the script already exists, there is no point in removing it from viewScript. - $view_js_file = 'wp-block-search-view'; - if ( ! wp_script_is( $view_js_file ) ) { - $script_handles = $block->block_type->view_script_handles; + wp_register_script_module( + '@wordpress/block-library/search', + isset( $module_url ) ? $module_url : includes_url( "blocks/search/view{$suffix}.js" ), + array( '@wordpress/interactivity' ), + defined( 'GUTENBERG_VERSION' ) ? GUTENBERG_VERSION : get_bloginfo( 'version' ) + ); + wp_enqueue_script_module( '@wordpress/block-library/search' ); - // If the script is not needed, and it is still in the `view_script_handles`, remove it. - if ( ! $is_expandable_searchfield && in_array( $view_js_file, $script_handles, true ) ) { - $block->block_type->view_script_handles = array_diff( $script_handles, array( $view_js_file ) ); - } - // If the script is needed, but it was previously removed, add it again. - if ( $is_expandable_searchfield && ! in_array( $view_js_file, $script_handles, true ) ) { - $block->block_type->view_script_handles = array_merge( $script_handles, array( $view_js_file ) ); - } + $input->set_attribute( 'data-wp-bind--aria-hidden', '!context.isSearchInputVisible' ); + $input->set_attribute( 'data-wp-bind--tabindex', 'state.tabindex' ); + + // Adding these attributes manually is needed until the Interactivity API + // SSR logic is added to core. + $input->set_attribute( 'aria-hidden', 'true' ); + $input->set_attribute( 'tabindex', '-1' ); } } @@ -144,13 +144,15 @@ function render_block_core_search( $attributes, $content, $block ) { if ( $button->next_tag() ) { $button->add_class( implode( ' ', $button_classes ) ); - if ( 'expand-searchfield' === $attributes['buttonBehavior'] && 'button-only' === $attributes['buttonPosition'] ) { - $button->set_attribute( 'data-wp-bind--aria-label', 'selectors.core.search.ariaLabel' ); - $button->set_attribute( 'data-wp-bind--aria-controls', 'selectors.core.search.ariaControls' ); - $button->set_attribute( 'data-wp-bind--aria-expanded', 'context.core.search.isSearchInputVisible' ); - $button->set_attribute( 'data-wp-bind--type', 'selectors.core.search.type' ); - $button->set_attribute( 'data-wp-on--click', 'actions.core.search.openSearchInput' ); - // Adding these attributes manually is needed until the Interactivity API SSR logic is added to core. + if ( 'button-only' === $attributes['buttonPosition'] ) { + $button->set_attribute( 'data-wp-bind--aria-label', 'state.ariaLabel' ); + $button->set_attribute( 'data-wp-bind--aria-controls', 'state.ariaControls' ); + $button->set_attribute( 'data-wp-bind--aria-expanded', 'context.isSearchInputVisible' ); + $button->set_attribute( 'data-wp-bind--type', 'state.type' ); + $button->set_attribute( 'data-wp-on--click', 'actions.openSearchInput' ); + + // Adding these attributes manually is needed until the Interactivity + // API SSR logic is added to core. $button->set_attribute( 'aria-label', __( 'Expand search field' ) ); $button->set_attribute( 'aria-controls', 'wp-block-search__input-' . $input_id ); $button->set_attribute( 'aria-expanded', 'false' ); @@ -172,15 +174,25 @@ function render_block_core_search( $attributes, $content, $block ) { array( 'class' => $classnames ) ); $form_directives = ''; + + // If it's interactive, add the directives. if ( $is_expandable_searchfield ) { $aria_label_expanded = __( 'Submit Search' ); $aria_label_collapsed = __( 'Expand search field' ); + $form_context = wp_interactivity_data_wp_context( + array( + 'isSearchInputVisible' => $open_by_default, + 'inputId' => $input_id, + 'ariaLabelExpanded' => $aria_label_expanded, + 'ariaLabelCollapsed' => $aria_label_collapsed, + ) + ); $form_directives = ' - data-wp-interactive - data-wp-context=\'{ "core": { "search": { "isSearchInputVisible": ' . $open_by_default . ', "inputId": "' . $input_id . '", "ariaLabelExpanded": "' . $aria_label_expanded . '", "ariaLabelCollapsed": "' . $aria_label_collapsed . '" } } }\' - data-wp-class--wp-block-search__searchfield-hidden="!context.core.search.isSearchInputVisible" - data-wp-on--keydown="actions.core.search.handleSearchKeydown" - data-wp-on--focusout="actions.core.search.handleSearchFocusout" + data-wp-interactive="core/search"' + . $form_context . + 'data-wp-class--wp-block-search__searchfield-hidden="!context.isSearchInputVisible" + data-wp-on--keydown="actions.handleSearchKeydown" + data-wp-on--focusout="actions.handleSearchFocusout" '; } @@ -207,25 +219,6 @@ function register_block_core_search() { add_action( 'init', 'register_block_core_search' ); /** - * Ensure that the view script has the `wp-interactivity` dependency. - * - * @since 6.4.0 - * - * @global WP_Scripts $wp_scripts - */ -function block_core_search_ensure_interactivity_dependency() { - global $wp_scripts; - if ( - isset( $wp_scripts->registered['wp-block-search-view'] ) && - ! in_array( 'wp-interactivity', $wp_scripts->registered['wp-block-search-view']->deps, true ) - ) { - $wp_scripts->registered['wp-block-search-view']->deps[] = 'wp-interactivity'; - } -} - -add_action( 'wp_print_scripts', 'block_core_search_ensure_interactivity_dependency' ); - -/** * Builds the correct top level classnames for the 'core/search' block. * * @param array $attributes The block attributes. @@ -249,10 +242,7 @@ function classnames_for_block_core_search( $attributes ) { } if ( 'button-only' === $attributes['buttonPosition'] ) { - $classnames[] = 'wp-block-search__button-only'; - if ( ! empty( $attributes['buttonBehavior'] ) && 'expand-searchfield' === $attributes['buttonBehavior'] ) { - $classnames[] = 'wp-block-search__button-behavior-expand wp-block-search__searchfield-hidden'; - } + $classnames[] = 'wp-block-search__button-only wp-block-search__searchfield-hidden'; } } diff --git a/wp-includes/blocks/search/block.json b/wp-includes/blocks/search/block.json index 5669a90..8d5e208 100644 --- a/wp-includes/blocks/search/block.json +++ b/wp-includes/blocks/search/block.json @@ -43,10 +43,6 @@ "type": "object", "default": {} }, - "buttonBehavior": { - "type": "string", - "default": "expand-searchfield" - }, "isSearchFieldHidden": { "type": "boolean", "default": false @@ -91,7 +87,6 @@ }, "html": false }, - "viewScript": "file:./view.min.js", "editorStyle": "wp-block-search-editor", "style": "wp-block-search" } diff --git a/wp-includes/blocks/search/editor-rtl.css b/wp-includes/blocks/search/editor-rtl.css index 05eeacf..26babe4 100644 --- a/wp-includes/blocks/search/editor-rtl.css +++ b/wp-includes/blocks/search/editor-rtl.css @@ -8,6 +8,7 @@ display:flex; height:auto; justify-content:center; + text-align:center; } .wp-block-search__components-button-group{ margin-top:10px; diff --git a/wp-includes/blocks/search/editor-rtl.min.css b/wp-includes/blocks/search/editor-rtl.min.css index b9c22f4..f24037c 100644 --- a/wp-includes/blocks/search/editor-rtl.min.css +++ b/wp-includes/blocks/search/editor-rtl.min.css @@ -1 +1 @@ -.wp-block[data-align=center] .wp-block-search .wp-block-search__inside-wrapper{margin:auto}.wp-block-search .wp-block-search__button{align-items:center;border-radius:initial;display:flex;height:auto;justify-content:center}.wp-block-search__components-button-group{margin-top:10px}
\ No newline at end of file +.wp-block[data-align=center] .wp-block-search .wp-block-search__inside-wrapper{margin:auto}.wp-block-search .wp-block-search__button{align-items:center;border-radius:initial;display:flex;height:auto;justify-content:center;text-align:center}.wp-block-search__components-button-group{margin-top:10px}
\ No newline at end of file diff --git a/wp-includes/blocks/search/editor.css b/wp-includes/blocks/search/editor.css index 05eeacf..26babe4 100644 --- a/wp-includes/blocks/search/editor.css +++ b/wp-includes/blocks/search/editor.css @@ -8,6 +8,7 @@ display:flex; height:auto; justify-content:center; + text-align:center; } .wp-block-search__components-button-group{ margin-top:10px; diff --git a/wp-includes/blocks/search/editor.min.css b/wp-includes/blocks/search/editor.min.css index b9c22f4..f24037c 100644 --- a/wp-includes/blocks/search/editor.min.css +++ b/wp-includes/blocks/search/editor.min.css @@ -1 +1 @@ -.wp-block[data-align=center] .wp-block-search .wp-block-search__inside-wrapper{margin:auto}.wp-block-search .wp-block-search__button{align-items:center;border-radius:initial;display:flex;height:auto;justify-content:center}.wp-block-search__components-button-group{margin-top:10px}
\ No newline at end of file +.wp-block[data-align=center] .wp-block-search .wp-block-search__inside-wrapper{margin:auto}.wp-block-search .wp-block-search__button{align-items:center;border-radius:initial;display:flex;height:auto;justify-content:center;text-align:center}.wp-block-search__components-button-group{margin-top:10px}
\ No newline at end of file diff --git a/wp-includes/blocks/search/style-rtl.css b/wp-includes/blocks/search/style-rtl.css index ff60086..755681c 100644 --- a/wp-includes/blocks/search/style-rtl.css +++ b/wp-includes/blocks/search/style-rtl.css @@ -6,9 +6,11 @@ line-height:0; } .wp-block-search__button svg{ - fill:currentColor; + height:1.25em; min-height:24px; min-width:24px; + width:1.25em; + fill:currentColor; vertical-align:text-bottom; } @@ -43,8 +45,33 @@ .wp-block-search.wp-block-search__button-only .wp-block-search__button{ flex-shrink:0; margin-right:0; + max-width:100%; +} +.wp-block-search.wp-block-search__button-only .wp-block-search__button[aria-expanded=true]{ max-width:calc(100% - 100px); } +.wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper{ + min-width:0 !important; + transition-property:width; +} +.wp-block-search.wp-block-search__button-only .wp-block-search__input{ + flex-basis:100%; + transition-duration:.3s; +} +.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden,.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{ + overflow:hidden; +} +.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__input{ + border-left-width:0 !important; + border-right-width:0 !important; + flex-basis:0; + flex-grow:0; + margin:0; + min-width:0 !important; + padding-left:0 !important; + padding-right:0 !important; + width:0 !important; +} :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper){ border:1px solid #949494; @@ -67,29 +94,6 @@ margin:auto; } -.wp-block-search__button-behavior-expand .wp-block-search__inside-wrapper{ - min-width:0 !important; - transition-property:width; -} -.wp-block-search__button-behavior-expand .wp-block-search__input{ - flex-basis:100%; - transition-duration:.3s; -} -.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden,.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{ - overflow:hidden; -} -.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden .wp-block-search__input{ - border-left-width:0 !important; - border-right-width:0 !important; - flex-basis:0; - flex-grow:0; - margin:0; - min-width:0 !important; - padding-left:0 !important; - padding-right:0 !important; - width:0 !important; -} - -.wp-block[data-align=right] .wp-block-search__button-behavior-expand .wp-block-search__inside-wrapper{ +.wp-block[data-align=right] .wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper{ float:left; }
\ No newline at end of file diff --git a/wp-includes/blocks/search/style-rtl.min.css b/wp-includes/blocks/search/style-rtl.min.css index 73dea5a..19f9266 100644 --- a/wp-includes/blocks/search/style-rtl.min.css +++ b/wp-includes/blocks/search/style-rtl.min.css @@ -1 +1 @@ -.wp-block-search__button{margin-right:10px;word-break:normal}.wp-block-search__button.has-icon{line-height:0}.wp-block-search__button svg{fill:currentColor;min-height:24px;min-width:24px;vertical-align:text-bottom}:where(.wp-block-search__button){border:1px solid #ccc;padding:6px 10px}.wp-block-search__inside-wrapper{display:flex;flex:auto;flex-wrap:nowrap;max-width:100%}.wp-block-search__label{width:100%}.wp-block-search__input{-webkit-appearance:initial;appearance:none;border:1px solid #949494;flex-grow:1;margin-left:0;margin-right:0;min-width:3rem;padding:8px;text-decoration:unset!important}.wp-block-search.wp-block-search__button-only .wp-block-search__button{flex-shrink:0;margin-right:0;max-width:calc(100% - 100px)}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper){border:1px solid #949494;box-sizing:border-box;padding:4px}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input{border:none;border-radius:0;padding:0 4px}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input:focus{outline:none}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) :where(.wp-block-search__button){padding:4px 8px}.wp-block-search.aligncenter .wp-block-search__inside-wrapper{margin:auto}.wp-block-search__button-behavior-expand .wp-block-search__inside-wrapper{min-width:0!important;transition-property:width}.wp-block-search__button-behavior-expand .wp-block-search__input{flex-basis:100%;transition-duration:.3s}.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden,.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{overflow:hidden}.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden .wp-block-search__input{border-left-width:0!important;border-right-width:0!important;flex-basis:0;flex-grow:0;margin:0;min-width:0!important;padding-left:0!important;padding-right:0!important;width:0!important}.wp-block[data-align=right] .wp-block-search__button-behavior-expand .wp-block-search__inside-wrapper{float:left}
\ No newline at end of file +.wp-block-search__button{margin-right:10px;word-break:normal}.wp-block-search__button.has-icon{line-height:0}.wp-block-search__button svg{height:1.25em;min-height:24px;min-width:24px;width:1.25em;fill:currentColor;vertical-align:text-bottom}:where(.wp-block-search__button){border:1px solid #ccc;padding:6px 10px}.wp-block-search__inside-wrapper{display:flex;flex:auto;flex-wrap:nowrap;max-width:100%}.wp-block-search__label{width:100%}.wp-block-search__input{-webkit-appearance:initial;appearance:none;border:1px solid #949494;flex-grow:1;margin-left:0;margin-right:0;min-width:3rem;padding:8px;text-decoration:unset!important}.wp-block-search.wp-block-search__button-only .wp-block-search__button{flex-shrink:0;margin-right:0;max-width:100%}.wp-block-search.wp-block-search__button-only .wp-block-search__button[aria-expanded=true]{max-width:calc(100% - 100px)}.wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper{min-width:0!important;transition-property:width}.wp-block-search.wp-block-search__button-only .wp-block-search__input{flex-basis:100%;transition-duration:.3s}.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden,.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{overflow:hidden}.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__input{border-left-width:0!important;border-right-width:0!important;flex-basis:0;flex-grow:0;margin:0;min-width:0!important;padding-left:0!important;padding-right:0!important;width:0!important}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper){border:1px solid #949494;box-sizing:border-box;padding:4px}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input{border:none;border-radius:0;padding:0 4px}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input:focus{outline:none}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) :where(.wp-block-search__button){padding:4px 8px}.wp-block-search.aligncenter .wp-block-search__inside-wrapper{margin:auto}.wp-block[data-align=right] .wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper{float:left}
\ No newline at end of file diff --git a/wp-includes/blocks/search/style.css b/wp-includes/blocks/search/style.css index 91fe4f7..536a2d1 100644 --- a/wp-includes/blocks/search/style.css +++ b/wp-includes/blocks/search/style.css @@ -6,9 +6,11 @@ line-height:0; } .wp-block-search__button svg{ - fill:currentColor; + height:1.25em; min-height:24px; min-width:24px; + width:1.25em; + fill:currentColor; vertical-align:text-bottom; } @@ -43,8 +45,33 @@ .wp-block-search.wp-block-search__button-only .wp-block-search__button{ flex-shrink:0; margin-left:0; + max-width:100%; +} +.wp-block-search.wp-block-search__button-only .wp-block-search__button[aria-expanded=true]{ max-width:calc(100% - 100px); } +.wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper{ + min-width:0 !important; + transition-property:width; +} +.wp-block-search.wp-block-search__button-only .wp-block-search__input{ + flex-basis:100%; + transition-duration:.3s; +} +.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden,.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{ + overflow:hidden; +} +.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__input{ + border-left-width:0 !important; + border-right-width:0 !important; + flex-basis:0; + flex-grow:0; + margin:0; + min-width:0 !important; + padding-left:0 !important; + padding-right:0 !important; + width:0 !important; +} :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper){ border:1px solid #949494; @@ -67,29 +94,6 @@ margin:auto; } -.wp-block-search__button-behavior-expand .wp-block-search__inside-wrapper{ - min-width:0 !important; - transition-property:width; -} -.wp-block-search__button-behavior-expand .wp-block-search__input{ - flex-basis:100%; - transition-duration:.3s; -} -.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden,.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{ - overflow:hidden; -} -.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden .wp-block-search__input{ - border-left-width:0 !important; - border-right-width:0 !important; - flex-basis:0; - flex-grow:0; - margin:0; - min-width:0 !important; - padding-left:0 !important; - padding-right:0 !important; - width:0 !important; -} - -.wp-block[data-align=right] .wp-block-search__button-behavior-expand .wp-block-search__inside-wrapper{ +.wp-block[data-align=right] .wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper{ float:right; }
\ No newline at end of file diff --git a/wp-includes/blocks/search/style.min.css b/wp-includes/blocks/search/style.min.css index c744f37..82d39a5 100644 --- a/wp-includes/blocks/search/style.min.css +++ b/wp-includes/blocks/search/style.min.css @@ -1 +1 @@ -.wp-block-search__button{margin-left:10px;word-break:normal}.wp-block-search__button.has-icon{line-height:0}.wp-block-search__button svg{fill:currentColor;min-height:24px;min-width:24px;vertical-align:text-bottom}:where(.wp-block-search__button){border:1px solid #ccc;padding:6px 10px}.wp-block-search__inside-wrapper{display:flex;flex:auto;flex-wrap:nowrap;max-width:100%}.wp-block-search__label{width:100%}.wp-block-search__input{-webkit-appearance:initial;appearance:none;border:1px solid #949494;flex-grow:1;margin-left:0;margin-right:0;min-width:3rem;padding:8px;text-decoration:unset!important}.wp-block-search.wp-block-search__button-only .wp-block-search__button{flex-shrink:0;margin-left:0;max-width:calc(100% - 100px)}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper){border:1px solid #949494;box-sizing:border-box;padding:4px}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input{border:none;border-radius:0;padding:0 4px}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input:focus{outline:none}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) :where(.wp-block-search__button){padding:4px 8px}.wp-block-search.aligncenter .wp-block-search__inside-wrapper{margin:auto}.wp-block-search__button-behavior-expand .wp-block-search__inside-wrapper{min-width:0!important;transition-property:width}.wp-block-search__button-behavior-expand .wp-block-search__input{flex-basis:100%;transition-duration:.3s}.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden,.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{overflow:hidden}.wp-block-search__button-behavior-expand.wp-block-search__searchfield-hidden .wp-block-search__input{border-left-width:0!important;border-right-width:0!important;flex-basis:0;flex-grow:0;margin:0;min-width:0!important;padding-left:0!important;padding-right:0!important;width:0!important}.wp-block[data-align=right] .wp-block-search__button-behavior-expand .wp-block-search__inside-wrapper{float:right}
\ No newline at end of file +.wp-block-search__button{margin-left:10px;word-break:normal}.wp-block-search__button.has-icon{line-height:0}.wp-block-search__button svg{height:1.25em;min-height:24px;min-width:24px;width:1.25em;fill:currentColor;vertical-align:text-bottom}:where(.wp-block-search__button){border:1px solid #ccc;padding:6px 10px}.wp-block-search__inside-wrapper{display:flex;flex:auto;flex-wrap:nowrap;max-width:100%}.wp-block-search__label{width:100%}.wp-block-search__input{-webkit-appearance:initial;appearance:none;border:1px solid #949494;flex-grow:1;margin-left:0;margin-right:0;min-width:3rem;padding:8px;text-decoration:unset!important}.wp-block-search.wp-block-search__button-only .wp-block-search__button{flex-shrink:0;margin-left:0;max-width:100%}.wp-block-search.wp-block-search__button-only .wp-block-search__button[aria-expanded=true]{max-width:calc(100% - 100px)}.wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper{min-width:0!important;transition-property:width}.wp-block-search.wp-block-search__button-only .wp-block-search__input{flex-basis:100%;transition-duration:.3s}.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden,.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{overflow:hidden}.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__input{border-left-width:0!important;border-right-width:0!important;flex-basis:0;flex-grow:0;margin:0;min-width:0!important;padding-left:0!important;padding-right:0!important;width:0!important}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper){border:1px solid #949494;box-sizing:border-box;padding:4px}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input{border:none;border-radius:0;padding:0 4px}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input:focus{outline:none}:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) :where(.wp-block-search__button){padding:4px 8px}.wp-block-search.aligncenter .wp-block-search__inside-wrapper{margin:auto}.wp-block[data-align=right] .wp-block-search.wp-block-search__button-only .wp-block-search__inside-wrapper{float:right}
\ No newline at end of file diff --git a/wp-includes/blocks/search/view.asset.php b/wp-includes/blocks/search/view.asset.php index 9ecb989..e9b5021 100644 --- a/wp-includes/blocks/search/view.asset.php +++ b/wp-includes/blocks/search/view.asset.php @@ -1 +1 @@ -<?php return array('dependencies' => array(), 'version' => 'bbd4958a430d8ba14c4c'); +<?php return array('dependencies' => array(), 'version' => '2a0784014283afdd3c25'); diff --git a/wp-includes/blocks/search/view.js b/wp-includes/blocks/search/view.js index 9d18abf..2234847 100644 --- a/wp-includes/blocks/search/view.js +++ b/wp-includes/blocks/search/view.js @@ -1,101 +1,112 @@ -"use strict"; -(self["__WordPressPrivateInteractivityAPI__"] = self["__WordPressPrivateInteractivityAPI__"] || []).push([[222],{ +import * as __WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__ from "@wordpress/interactivity"; +/******/ // The require scope +/******/ var __webpack_require__ = {}; +/******/ +/************************************************************************/ +/******/ /* webpack/runtime/define property getters */ +/******/ (() => { +/******/ // define getter functions for harmony exports +/******/ __webpack_require__.d = (exports, definition) => { +/******/ for(var key in definition) { +/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { +/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); +/******/ } +/******/ } +/******/ }; +/******/ })(); +/******/ +/******/ /* webpack/runtime/hasOwnProperty shorthand */ +/******/ (() => { +/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop)) +/******/ })(); +/******/ +/************************************************************************/ +var __webpack_exports__ = {}; -/***/ 534: -/***/ (function(__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) { - -/* harmony import */ var _wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(754); +;// CONCATENATED MODULE: external "@wordpress/interactivity" +var x = (y) => { + var x = {}; __webpack_require__.d(x, y); return x +} +var y = (x) => (() => (x)) +const interactivity_namespaceObject = x({ ["getContext"]: () => (__WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__.getContext), ["getElement"]: () => (__WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__.getElement), ["store"]: () => (__WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__.store) }); +;// CONCATENATED MODULE: ./node_modules/@wordpress/block-library/build-module/search/view.js /** * WordPress dependencies */ -(0,_wordpress_interactivity__WEBPACK_IMPORTED_MODULE_0__/* .store */ .h)({ - selectors: { - core: { - search: { - ariaLabel: ({ - context - }) => { - const { - ariaLabelCollapsed, - ariaLabelExpanded - } = context.core.search; - return context.core.search.isSearchInputVisible ? ariaLabelExpanded : ariaLabelCollapsed; - }, - ariaControls: ({ - context - }) => { - return context.core.search.isSearchInputVisible ? null : context.core.search.inputId; - }, - type: ({ - context - }) => { - return context.core.search.isSearchInputVisible ? 'submit' : 'button'; - }, - tabindex: ({ - context - }) => { - return context.core.search.isSearchInputVisible ? '0' : '-1'; - } - } +const { + actions +} = (0,interactivity_namespaceObject.store)('core/search', { + state: { + get ariaLabel() { + const { + isSearchInputVisible, + ariaLabelCollapsed, + ariaLabelExpanded + } = (0,interactivity_namespaceObject.getContext)(); + return isSearchInputVisible ? ariaLabelExpanded : ariaLabelCollapsed; + }, + get ariaControls() { + const { + isSearchInputVisible, + inputId + } = (0,interactivity_namespaceObject.getContext)(); + return isSearchInputVisible ? null : inputId; + }, + get type() { + const { + isSearchInputVisible + } = (0,interactivity_namespaceObject.getContext)(); + return isSearchInputVisible ? 'submit' : 'button'; + }, + get tabindex() { + const { + isSearchInputVisible + } = (0,interactivity_namespaceObject.getContext)(); + return isSearchInputVisible ? '0' : '-1'; } }, actions: { - core: { - search: { - openSearchInput: ({ - context, - event, - ref - }) => { - if (!context.core.search.isSearchInputVisible) { - event.preventDefault(); - context.core.search.isSearchInputVisible = true; - ref.parentElement.querySelector('input').focus(); - } - }, - closeSearchInput: ({ - context - }) => { - context.core.search.isSearchInputVisible = false; - }, - handleSearchKeydown: store => { - const { - actions, - event, - ref - } = store; - // If Escape close the menu. - if (event?.key === 'Escape') { - actions.core.search.closeSearchInput(store); - ref.querySelector('button').focus(); - } - }, - handleSearchFocusout: store => { - const { - actions, - event, - ref - } = store; - // If focus is outside search form, and in the document, close menu - // event.target === The element losing focus - // event.relatedTarget === The element receiving focus (if any) - // When focusout is outside the document, - // `window.document.activeElement` doesn't change. - if (!ref.contains(event.relatedTarget) && event.target !== window.document.activeElement) { - actions.core.search.closeSearchInput(store); - } - } + openSearchInput(event) { + const ctx = (0,interactivity_namespaceObject.getContext)(); + const { + ref + } = (0,interactivity_namespaceObject.getElement)(); + if (!ctx.isSearchInputVisible) { + event.preventDefault(); + ctx.isSearchInputVisible = true; + ref.parentElement.querySelector('input').focus(); + } + }, + closeSearchInput() { + const ctx = (0,interactivity_namespaceObject.getContext)(); + ctx.isSearchInputVisible = false; + }, + handleSearchKeydown(event) { + const { + ref + } = (0,interactivity_namespaceObject.getElement)(); + // If Escape close the menu. + if (event?.key === 'Escape') { + actions.closeSearchInput(); + ref.querySelector('button').focus(); + } + }, + handleSearchFocusout(event) { + const { + ref + } = (0,interactivity_namespaceObject.getElement)(); + // If focus is outside search form, and in the document, close menu + // event.target === The element losing focus + // event.relatedTarget === The element receiving focus (if any) + // When focusout is outside the document, + // `window.document.activeElement` doesn't change. + if (!ref.contains(event.relatedTarget) && event.target !== window.document.activeElement) { + actions.closeSearchInput(); } } } +}, { + lock: true }); -/***/ }) - -}, -/******/ function(__webpack_require__) { // webpackRuntimeModules -/******/ var __webpack_exec__ = function(moduleId) { return __webpack_require__(__webpack_require__.s = moduleId); } -/******/ var __webpack_exports__ = (__webpack_exec__(534)); -/******/ } -]);
\ No newline at end of file diff --git a/wp-includes/blocks/search/view.min.asset.php b/wp-includes/blocks/search/view.min.asset.php index dc204c9..f9f2fdd 100644 --- a/wp-includes/blocks/search/view.min.asset.php +++ b/wp-includes/blocks/search/view.min.asset.php @@ -1 +1 @@ -<?php return array('dependencies' => array(), 'version' => 'ff76b5016de2df424c55'); +<?php return array('dependencies' => array(), 'version' => '765a40956d200c79d99e'); diff --git a/wp-includes/blocks/search/view.min.js b/wp-includes/blocks/search/view.min.js index f38519d..3f154f9 100644 --- a/wp-includes/blocks/search/view.min.js +++ b/wp-includes/blocks/search/view.min.js @@ -1 +1 @@ -"use strict";(self.__WordPressPrivateInteractivityAPI__=self.__WordPressPrivateInteractivityAPI__||[]).push([[222],{534:function(e,t,c){(0,c(754).h)({selectors:{core:{search:{ariaLabel:({context:e})=>{const{ariaLabelCollapsed:t,ariaLabelExpanded:c}=e.core.search;return e.core.search.isSearchInputVisible?c:t},ariaControls:({context:e})=>e.core.search.isSearchInputVisible?null:e.core.search.inputId,type:({context:e})=>e.core.search.isSearchInputVisible?"submit":"button",tabindex:({context:e})=>e.core.search.isSearchInputVisible?"0":"-1"}}},actions:{core:{search:{openSearchInput:({context:e,event:t,ref:c})=>{e.core.search.isSearchInputVisible||(t.preventDefault(),e.core.search.isSearchInputVisible=!0,c.parentElement.querySelector("input").focus())},closeSearchInput:({context:e})=>{e.core.search.isSearchInputVisible=!1},handleSearchKeydown:e=>{const{actions:t,event:c,ref:r}=e;"Escape"===c?.key&&(t.core.search.closeSearchInput(e),r.querySelector("button").focus())},handleSearchFocusout:e=>{const{actions:t,event:c,ref:r}=e;r.contains(c.relatedTarget)||c.target===window.document.activeElement||t.core.search.closeSearchInput(e)}}}}})}},function(e){var t;t=534,e(e.s=t)}]);
\ No newline at end of file +import*as e from"@wordpress/interactivity";var t={d:(e,n)=>{for(var r in n)t.o(n,r)&&!t.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:n[r]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)};const n=(e=>{var n={};return t.d(n,e),n})({getContext:()=>e.getContext,getElement:()=>e.getElement,store:()=>e.store}),{actions:r}=(0,n.store)("core/search",{state:{get ariaLabel(){const{isSearchInputVisible:e,ariaLabelCollapsed:t,ariaLabelExpanded:r}=(0,n.getContext)();return e?r:t},get ariaControls(){const{isSearchInputVisible:e,inputId:t}=(0,n.getContext)();return e?null:t},get type(){const{isSearchInputVisible:e}=(0,n.getContext)();return e?"submit":"button"},get tabindex(){const{isSearchInputVisible:e}=(0,n.getContext)();return e?"0":"-1"}},actions:{openSearchInput(e){const t=(0,n.getContext)(),{ref:r}=(0,n.getElement)();t.isSearchInputVisible||(e.preventDefault(),t.isSearchInputVisible=!0,r.parentElement.querySelector("input").focus())},closeSearchInput(){(0,n.getContext)().isSearchInputVisible=!1},handleSearchKeydown(e){const{ref:t}=(0,n.getElement)();"Escape"===e?.key&&(r.closeSearchInput(),t.querySelector("button").focus())},handleSearchFocusout(e){const{ref:t}=(0,n.getElement)();t.contains(e.relatedTarget)||e.target===window.document.activeElement||r.closeSearchInput()}}},{lock:!0});
\ No newline at end of file |