true,
'align' => '',
'className' => '',
'label' => __( 'Search', 'woocommerce' ),
'placeholder' => __( 'Search products…', 'woocommerce' ),
)
);
/**
* Product Search event.
*
* Listens for product search form submission, and on submission fires a WP Hook named
* `experimental__woocommerce_blocks-product-search`. This can be used by tracking extensions such as Google
* Analytics to track searches.
*/
$this->asset_api->add_inline_script(
'wp-hooks',
"
window.addEventListener( 'DOMContentLoaded', () => {
const forms = document.querySelectorAll( '.wc-block-product-search form' );
for ( const form of forms ) {
form.addEventListener( 'submit', ( event ) => {
const field = form.querySelector( '.wc-block-product-search__field' );
if ( field && field.value ) {
wp.hooks.doAction( 'experimental__woocommerce_blocks-product-search', { event: event, searchTerm: field.value } );
}
} );
}
} );
",
'after'
);
$input_id = 'wc-block-search__input-' . ( ++$instance_id );
$wrapper_attributes = get_block_wrapper_attributes(
array(
'class' => implode(
' ',
array_filter(
[
'wc-block-product-search',
$attributes['align'] ? 'align' . $attributes['align'] : '',
]
)
),
)
);
$label_markup = $attributes['hasLabel'] ? sprintf(
'',
esc_attr( $input_id ),
esc_html( $attributes['label'] )
) : sprintf(
'',
esc_attr( $input_id ),
esc_html( $attributes['label'] )
);
$input_markup = sprintf(
'',
esc_attr( $input_id ),
esc_attr( $attributes['placeholder'] )
);
$button_markup = sprintf(
'',
esc_attr__( 'Search', 'woocommerce' )
);
$field_markup = '
' . $input_markup . $button_markup . '
';
return sprintf(
'',
$wrapper_attributes,
esc_url( home_url( '/' ) ),
$label_markup . $field_markup
);
}
}