Add new SearchListItem component (https://github.com/woocommerce/woocommerce-blocks/pull/258)
* Add new SearchListItem component Extract the custom functionality from product categories, for re-use in product attributes * Fix error when no breadcrumbs are set * Update snapshot * Remove unnecessary key
This commit is contained in:
parent
d3c8998430
commit
aa9f543834
|
@ -5,16 +5,15 @@ import { __, _n, sprintf } from '@wordpress/i18n';
|
||||||
import { addQueryArgs } from '@wordpress/url';
|
import { addQueryArgs } from '@wordpress/url';
|
||||||
import apiFetch from '@wordpress/api-fetch';
|
import apiFetch from '@wordpress/api-fetch';
|
||||||
import { Component, Fragment } from '@wordpress/element';
|
import { Component, Fragment } from '@wordpress/element';
|
||||||
import { find, first, last } from 'lodash';
|
import { find } from 'lodash';
|
||||||
import { MenuItem, SelectControl } from '@wordpress/components';
|
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
import { SelectControl } from '@wordpress/components';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Internal dependencies
|
* Internal dependencies
|
||||||
*/
|
*/
|
||||||
import './style.scss';
|
|
||||||
import { IconChecked, IconUnchecked } from '../icons';
|
|
||||||
import SearchListControl from '../search-list-control';
|
import SearchListControl from '../search-list-control';
|
||||||
|
import SearchListItem from '../search-list-control/item';
|
||||||
|
|
||||||
class ProductCategoryControl extends Component {
|
class ProductCategoryControl extends Component {
|
||||||
constructor() {
|
constructor() {
|
||||||
|
@ -38,29 +37,10 @@ class ProductCategoryControl extends Component {
|
||||||
} );
|
} );
|
||||||
}
|
}
|
||||||
|
|
||||||
getBreadcrumbsForDisplay( breadcrumbs ) {
|
renderItem( args ) {
|
||||||
if ( breadcrumbs.length === 1 ) {
|
const { item, search, depth = 0 } = args;
|
||||||
return first( breadcrumbs );
|
|
||||||
}
|
|
||||||
if ( breadcrumbs.length === 2 ) {
|
|
||||||
return first( breadcrumbs ) + ' › ' + last( breadcrumbs );
|
|
||||||
}
|
|
||||||
|
|
||||||
return first( breadcrumbs ) + ' … ' + last( breadcrumbs );
|
|
||||||
}
|
|
||||||
|
|
||||||
renderItem( {
|
|
||||||
getHighlightedName,
|
|
||||||
isSelected,
|
|
||||||
item,
|
|
||||||
onSelect,
|
|
||||||
search,
|
|
||||||
depth = 0,
|
|
||||||
} ) {
|
|
||||||
const classes = [
|
const classes = [
|
||||||
'woocommerce-search-list__item',
|
|
||||||
'woocommerce-product-categories__item',
|
'woocommerce-product-categories__item',
|
||||||
`depth-${ depth }`,
|
|
||||||
];
|
];
|
||||||
if ( search.length ) {
|
if ( search.length ) {
|
||||||
classes.push( 'is-searching' );
|
classes.push( 'is-searching' );
|
||||||
|
@ -74,12 +54,10 @@ class ProductCategoryControl extends Component {
|
||||||
`${ item.breadcrumbs.join( ', ' ) }, ${ item.name }`;
|
`${ item.breadcrumbs.join( ', ' ) }, ${ item.name }`;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<MenuItem
|
<SearchListItem
|
||||||
key={ item.id }
|
|
||||||
role="menuitemcheckbox"
|
|
||||||
className={ classes.join( ' ' ) }
|
className={ classes.join( ' ' ) }
|
||||||
onClick={ onSelect( item ) }
|
{ ...args }
|
||||||
isSelected={ isSelected }
|
showCount
|
||||||
aria-label={ sprintf(
|
aria-label={ sprintf(
|
||||||
_n(
|
_n(
|
||||||
'%s, has %d product',
|
'%s, has %d product',
|
||||||
|
@ -90,27 +68,7 @@ class ProductCategoryControl extends Component {
|
||||||
accessibleName,
|
accessibleName,
|
||||||
item.count
|
item.count
|
||||||
) }
|
) }
|
||||||
>
|
|
||||||
<span className="woocommerce-search-list__item-state">
|
|
||||||
{ isSelected ? <IconChecked /> : <IconUnchecked /> }
|
|
||||||
</span>
|
|
||||||
<span className="woocommerce-product-categories__item-label">
|
|
||||||
{ !! item.breadcrumbs.length && (
|
|
||||||
<span className="woocommerce-product-categories__item-prefix">
|
|
||||||
{ this.getBreadcrumbsForDisplay( item.breadcrumbs ) }
|
|
||||||
</span>
|
|
||||||
) }
|
|
||||||
<span
|
|
||||||
className="woocommerce-product-categories__item-name"
|
|
||||||
dangerouslySetInnerHTML={ {
|
|
||||||
__html: getHighlightedName( item.name, search ),
|
|
||||||
} }
|
|
||||||
/>
|
/>
|
||||||
</span>
|
|
||||||
<span className="woocommerce-product-categories__item-count">
|
|
||||||
{ item.count }
|
|
||||||
</span>
|
|
||||||
</MenuItem>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,97 +0,0 @@
|
||||||
.woocommerce-product-categories {
|
|
||||||
.woocommerce-product-categories__item {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.woocommerce-product-categories__item-label {
|
|
||||||
display: flex;
|
|
||||||
flex: 1;
|
|
||||||
|
|
||||||
// Anything deeper than 5 levels will use this fallback depth
|
|
||||||
[class*="depth-"] & {
|
|
||||||
padding-left: $gap-small * 5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.depth-0 & {
|
|
||||||
padding-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.depth-1 & {
|
|
||||||
padding-left: $gap-small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.depth-2 & {
|
|
||||||
padding-left: $gap-small * 2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.depth-3 & {
|
|
||||||
padding-left: $gap-small * 3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.depth-4 & {
|
|
||||||
padding-left: $gap-small * 4;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.woocommerce-product-categories__item {
|
|
||||||
.woocommerce-product-categories__item-name {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.woocommerce-product-categories__item-prefix {
|
|
||||||
display: none;
|
|
||||||
color: $core-grey-dark-300;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.is-searching, &.is-skip-level {
|
|
||||||
.woocommerce-product-categories__item-prefix {
|
|
||||||
display: inline-block;
|
|
||||||
margin-right: $gap-smallest;
|
|
||||||
|
|
||||||
&:after {
|
|
||||||
content: ' ›';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.is-searching {
|
|
||||||
.woocommerce-product-categories__item-name {
|
|
||||||
color: $core-grey-dark-900;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.woocommerce-product-categories__item-count {
|
|
||||||
flex: 0;
|
|
||||||
padding: $gap-smallest/2 $gap-smaller;
|
|
||||||
border: 1px solid $core-grey-light-500;
|
|
||||||
border-radius: 12px;
|
|
||||||
font-size: 0.8em;
|
|
||||||
line-height: 1.4;
|
|
||||||
color: $core-grey-dark-300;
|
|
||||||
background: $white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.woocommerce-product-categories__operator {
|
|
||||||
margin-bottom: $gap;
|
|
||||||
text-align: left;
|
|
||||||
|
|
||||||
.components-base-control__label,
|
|
||||||
.components-select-control__input {
|
|
||||||
display: inline-block;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.components-select-control__input {
|
|
||||||
margin-left: $gap;
|
|
||||||
width: auto;
|
|
||||||
min-width: 15em;
|
|
||||||
|
|
||||||
@include breakpoint( '<480px' ) {
|
|
||||||
margin-left: 0;
|
|
||||||
min-width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -4,7 +4,6 @@
|
||||||
import { __, _n, sprintf } from '@wordpress/i18n';
|
import { __, _n, sprintf } from '@wordpress/i18n';
|
||||||
import {
|
import {
|
||||||
Button,
|
Button,
|
||||||
MenuItem,
|
|
||||||
MenuGroup,
|
MenuGroup,
|
||||||
Spinner,
|
Spinner,
|
||||||
TextControl,
|
TextControl,
|
||||||
|
@ -22,7 +21,7 @@ import { Tag } from '@woocommerce/components';
|
||||||
*/
|
*/
|
||||||
import './style.scss';
|
import './style.scss';
|
||||||
import { buildTermsTree } from './hierarchy';
|
import { buildTermsTree } from './hierarchy';
|
||||||
import { IconChecked, IconUnchecked } from '../icons';
|
import SearchListItem from './item';
|
||||||
|
|
||||||
const defaultMessages = {
|
const defaultMessages = {
|
||||||
clear: __( 'Clear all selected items', 'woo-gutenberg-products-block' ),
|
clear: __( 'Clear all selected items', 'woo-gutenberg-products-block' ),
|
||||||
|
@ -91,45 +90,9 @@ export class SearchListControl extends Component {
|
||||||
return isHierarchical ? buildTermsTree( filteredList, list ) : filteredList;
|
return isHierarchical ? buildTermsTree( filteredList, list ) : filteredList;
|
||||||
}
|
}
|
||||||
|
|
||||||
getHighlightedName( name, search ) {
|
defaultRenderItem( args ) {
|
||||||
if ( ! search ) {
|
|
||||||
return name;
|
|
||||||
}
|
|
||||||
const re = new RegExp( escapeRegExp( search ), 'ig' );
|
|
||||||
return name.replace( re, '<strong>$&</strong>' );
|
|
||||||
}
|
|
||||||
|
|
||||||
defaultRenderItem( {
|
|
||||||
depth = 0,
|
|
||||||
getHighlightedName,
|
|
||||||
item,
|
|
||||||
isSelected,
|
|
||||||
onSelect,
|
|
||||||
search = '',
|
|
||||||
} ) {
|
|
||||||
const classes = [ 'woocommerce-search-list__item' ];
|
|
||||||
if ( this.props.isHierarchical ) {
|
|
||||||
classes.push( `depth-${ depth }` );
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<MenuItem
|
<SearchListItem { ...args } />
|
||||||
key={ item.id }
|
|
||||||
role="menuitemcheckbox"
|
|
||||||
className={ classes.join( ' ' ) }
|
|
||||||
onClick={ onSelect( item ) }
|
|
||||||
isSelected={ isSelected }
|
|
||||||
>
|
|
||||||
<span className="woocommerce-search-list__item-state">
|
|
||||||
{ isSelected ? <IconChecked /> : <IconUnchecked /> }
|
|
||||||
</span>
|
|
||||||
<span
|
|
||||||
className="woocommerce-search-list__item-name"
|
|
||||||
dangerouslySetInnerHTML={ {
|
|
||||||
__html: getHighlightedName( item.name, search ),
|
|
||||||
} }
|
|
||||||
/>
|
|
||||||
</MenuItem>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -142,7 +105,6 @@ export class SearchListControl extends Component {
|
||||||
return list.map( ( item ) => (
|
return list.map( ( item ) => (
|
||||||
<Fragment key={ item.id }>
|
<Fragment key={ item.id }>
|
||||||
{ renderItem( {
|
{ renderItem( {
|
||||||
getHighlightedName: this.getHighlightedName,
|
|
||||||
item,
|
item,
|
||||||
isSelected: this.isSelected( item ),
|
isSelected: this.isSelected( item ),
|
||||||
onSelect: this.onSelect,
|
onSelect: this.onSelect,
|
||||||
|
|
|
@ -0,0 +1,113 @@
|
||||||
|
/**
|
||||||
|
* External dependencies
|
||||||
|
*/
|
||||||
|
import { escapeRegExp, first, last } from 'lodash';
|
||||||
|
import { MenuItem } from '@wordpress/components';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Internal dependencies
|
||||||
|
*/
|
||||||
|
import { IconChecked, IconUnchecked } from '../icons';
|
||||||
|
|
||||||
|
function getHighlightedName( name, search ) {
|
||||||
|
if ( ! search ) {
|
||||||
|
return name;
|
||||||
|
}
|
||||||
|
const re = new RegExp( escapeRegExp( search ), 'ig' );
|
||||||
|
return name.replace( re, '<strong>$&</strong>' );
|
||||||
|
}
|
||||||
|
|
||||||
|
function getBreadcrumbsForDisplay( breadcrumbs ) {
|
||||||
|
if ( breadcrumbs.length === 1 ) {
|
||||||
|
return first( breadcrumbs );
|
||||||
|
}
|
||||||
|
if ( breadcrumbs.length === 2 ) {
|
||||||
|
return first( breadcrumbs ) + ' › ' + last( breadcrumbs );
|
||||||
|
}
|
||||||
|
|
||||||
|
return first( breadcrumbs ) + ' … ' + last( breadcrumbs );
|
||||||
|
}
|
||||||
|
|
||||||
|
const SearchListItem = ( {
|
||||||
|
className,
|
||||||
|
depth = 0,
|
||||||
|
item,
|
||||||
|
isSelected,
|
||||||
|
onSelect,
|
||||||
|
search = '',
|
||||||
|
showCount = false,
|
||||||
|
...props
|
||||||
|
} ) => {
|
||||||
|
const classes = [ className, 'woocommerce-search-list__item' ];
|
||||||
|
classes.push( `depth-${ depth }` );
|
||||||
|
|
||||||
|
const hasBreadcrumbs = item.breadcrumbs && item.breadcrumbs.length;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<MenuItem
|
||||||
|
role="menuitemcheckbox"
|
||||||
|
className={ classes.join( ' ' ) }
|
||||||
|
onClick={ onSelect( item ) }
|
||||||
|
isSelected={ isSelected }
|
||||||
|
{ ...props }
|
||||||
|
>
|
||||||
|
<span className="woocommerce-search-list__item-state">
|
||||||
|
{ isSelected ? <IconChecked /> : <IconUnchecked /> }
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<span className="woocommerce-search-list__item-label">
|
||||||
|
{ hasBreadcrumbs ? (
|
||||||
|
<span className="woocommerce-search-list__item-prefix">
|
||||||
|
{ getBreadcrumbsForDisplay( item.breadcrumbs ) }
|
||||||
|
</span>
|
||||||
|
) : null }
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-name"
|
||||||
|
dangerouslySetInnerHTML={ {
|
||||||
|
__html: getHighlightedName( item.name, search ),
|
||||||
|
} }
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
{ !! showCount && (
|
||||||
|
<span className="woocommerce-search-list__item-count">
|
||||||
|
{ item.count }
|
||||||
|
</span>
|
||||||
|
) }
|
||||||
|
</MenuItem>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
SearchListItem.propTypes = {
|
||||||
|
/**
|
||||||
|
* Additional CSS classes.
|
||||||
|
*/
|
||||||
|
className: PropTypes.string,
|
||||||
|
/**
|
||||||
|
* Depth, non-zero if the list is hierarchical.
|
||||||
|
*/
|
||||||
|
depth: PropTypes.number,
|
||||||
|
/**
|
||||||
|
* Current item to display.
|
||||||
|
*/
|
||||||
|
item: PropTypes.object,
|
||||||
|
/**
|
||||||
|
* Whether this item is selected.
|
||||||
|
*/
|
||||||
|
isSelected: PropTypes.bool,
|
||||||
|
/**
|
||||||
|
* Callback for selecting the item.
|
||||||
|
*/
|
||||||
|
onSelect: PropTypes.func,
|
||||||
|
/**
|
||||||
|
* Search string, used to highlight the substring in the item name.
|
||||||
|
*/
|
||||||
|
search: PropTypes.string,
|
||||||
|
/**
|
||||||
|
* Toggles the "count" bubble on/off.
|
||||||
|
*/
|
||||||
|
showCount: PropTypes.bool,
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SearchListItem;
|
|
@ -91,15 +91,6 @@
|
||||||
border-bottom: 1px solid $core-grey-light-500 !important;
|
border-bottom: 1px solid $core-grey-light-500 !important;
|
||||||
color: $core-grey-dark-500;
|
color: $core-grey-dark-500;
|
||||||
|
|
||||||
.woocommerce-search-list__item-state {
|
|
||||||
flex: 0 0 16px;
|
|
||||||
margin-right: $gap-smaller;
|
|
||||||
}
|
|
||||||
|
|
||||||
.woocommerce-search-list__item-name {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
@include hover-state {
|
@include hover-state {
|
||||||
background: $core-grey-light-100;
|
background: $core-grey-light-100;
|
||||||
}
|
}
|
||||||
|
@ -107,5 +98,64 @@
|
||||||
&:last-of-type {
|
&:last-of-type {
|
||||||
border-bottom: none !important;
|
border-bottom: none !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.woocommerce-search-list__item-state {
|
||||||
|
flex: 0 0 16px;
|
||||||
|
margin-right: $gap-smaller;
|
||||||
|
}
|
||||||
|
|
||||||
|
.woocommerce-search-list__item-label {
|
||||||
|
display: flex;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Anything deeper than 5 levels will use this fallback depth
|
||||||
|
&[class*="depth-"] .woocommerce-search-list__item-label {
|
||||||
|
padding-left: $gap-small * 5;
|
||||||
|
}
|
||||||
|
|
||||||
|
@for $i from 0 to 5 {
|
||||||
|
&.depth-#{$i} .woocommerce-search-list__item-label {
|
||||||
|
padding-left: $gap-small * $i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.woocommerce-search-list__item-name {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.woocommerce-search-list__item-prefix {
|
||||||
|
display: none;
|
||||||
|
color: $core-grey-dark-300;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-searching,
|
||||||
|
&.is-skip-level {
|
||||||
|
.woocommerce-search-list__item-prefix {
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: $gap-smallest;
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
content: " ›";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-searching {
|
||||||
|
.woocommerce-search-list__item-name {
|
||||||
|
color: $core-grey-dark-900;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.woocommerce-search-list__item-count {
|
||||||
|
flex: 0;
|
||||||
|
padding: $gap-smallest/2 $gap-smaller;
|
||||||
|
border: 1px solid $core-grey-light-500;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 0.8em;
|
||||||
|
line-height: 1.4;
|
||||||
|
color: $core-grey-dark-300;
|
||||||
|
background: $white;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -100,6 +100,9 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -108,6 +111,7 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
|
@ -155,6 +159,14 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-prefix"
|
||||||
|
>
|
||||||
|
Apricots
|
||||||
|
</span>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -163,6 +175,7 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
|
@ -210,6 +223,14 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-prefix"
|
||||||
|
>
|
||||||
|
Apricots
|
||||||
|
</span>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -218,6 +239,7 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
|
@ -265,6 +287,14 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-prefix"
|
||||||
|
>
|
||||||
|
Apricots › Elderberry
|
||||||
|
</span>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -273,6 +303,7 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
|
@ -320,6 +351,9 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -328,6 +362,7 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
|
@ -375,6 +410,9 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -383,6 +421,7 @@ exports[`SearchListControl should render a search box and list of hierarchical o
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -445,7 +484,7 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -489,6 +528,9 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -497,10 +539,11 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -544,6 +587,9 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -552,10 +598,11 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -599,6 +646,9 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -607,10 +657,11 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -654,6 +705,9 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -662,10 +716,11 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -709,6 +764,9 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -717,10 +775,11 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -764,6 +823,9 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -772,6 +834,7 @@ exports[`SearchListControl should render a search box and list of options 1`] =
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -834,7 +897,7 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -878,6 +941,9 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -886,10 +952,11 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -933,6 +1000,9 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -941,10 +1011,11 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -988,6 +1059,9 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -996,10 +1070,11 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1043,6 +1118,9 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1051,10 +1129,11 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1098,6 +1177,9 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1106,10 +1188,11 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1153,6 +1236,9 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1161,6 +1247,7 @@ exports[`SearchListControl should render a search box and list of options with a
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1306,7 +1393,7 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1350,6 +1437,9 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1358,10 +1448,11 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1405,6 +1496,9 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1413,10 +1507,11 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1460,6 +1555,9 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1468,10 +1566,11 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1515,6 +1614,9 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1523,10 +1625,11 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1570,6 +1673,9 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1578,10 +1684,11 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1625,6 +1732,9 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1633,6 +1743,7 @@ exports[`SearchListControl should render a search box and list of options, with
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1839,7 +1950,7 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1883,6 +1994,9 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1891,10 +2005,11 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -1938,6 +2053,9 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -1946,6 +2064,7 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -2009,7 +2128,7 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2053,6 +2172,9 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2061,10 +2183,11 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2108,6 +2231,9 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2116,6 +2242,7 @@ exports[`SearchListControl should render a search box with a search term, and on
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -2231,7 +2358,7 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2275,6 +2402,9 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2283,10 +2413,11 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={true}
|
aria-checked={true}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2330,6 +2461,9 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2338,10 +2472,11 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2385,6 +2520,9 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2393,10 +2531,11 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2440,6 +2579,9 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2448,10 +2590,11 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2495,6 +2638,9 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2503,10 +2649,11 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2550,6 +2697,9 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2558,6 +2708,7 @@ exports[`SearchListControl should render a search box, a list of options, and 1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -2718,7 +2869,7 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2762,6 +2913,9 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2770,10 +2924,11 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={true}
|
aria-checked={true}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2817,6 +2972,9 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2825,10 +2983,11 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2872,6 +3031,9 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2880,10 +3042,11 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={true}
|
aria-checked={true}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2927,6 +3090,9 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2935,10 +3101,11 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -2982,6 +3149,9 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -2990,10 +3160,11 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
aria-checked={false}
|
aria-checked={false}
|
||||||
className="components-button components-menu-item__button woocommerce-search-list__item"
|
className="components-button components-menu-item__button woocommerce-search-list__item depth-0"
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
role="menuitemcheckbox"
|
role="menuitemcheckbox"
|
||||||
type="button"
|
type="button"
|
||||||
|
@ -3037,6 +3208,9 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
|
<span
|
||||||
|
className="woocommerce-search-list__item-label"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
className="woocommerce-search-list__item-name"
|
className="woocommerce-search-list__item-name"
|
||||||
dangerouslySetInnerHTML={
|
dangerouslySetInnerHTML={
|
||||||
|
@ -3045,6 +3219,7 @@ exports[`SearchListControl should render a search box, a list of options, and 2
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue