@wordpress/dataviews 0.4.0 → 0.5.0

package/build-module/add-filter.js.map

@@ -1 +1 @@
-{"version":3,"names":["privateApis","componentsPrivateApis","Button","funnel","__","sprintf","Children","Fragment","unlock","LAYOUT_LIST","OPERATORS","DropdownMenuRadioItemCustom","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuRadioItemV2","DropdownMenuRadioItem","DropdownMenuSeparatorV2","DropdownMenuSeparator","DropdownMenuItemLabelV2","DropdownMenuItemLabel","DropdownMenuItemHelpTextV2","DropdownMenuItemHelpText","WithSeparators","children","toArray","filter","Boolean","map","child","i","createElement","key","AddFilter","filters","view","onChangeView","length","filterCount","reduce","acc","value","undefined","trigger","__experimentalIsFocusable","label","size","icon","className","type","style","minWidth","filterInView","find","f","field","otherFilters","activeElement","elements","element","activeOperator","operator","operators","suffix","name","isActive","checked","onChange","e","page","target","description","Object","entries","disabled","hideOnClick","onClick","toLowerCase","search"],"sources":["@wordpress/dataviews/src/add-filter.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tprivateApis as componentsPrivateApis,\n\tButton,\n} from '@wordpress/components';\nimport { funnel } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Children, Fragment } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\nimport { LAYOUT_LIST, OPERATORS } from './constants';\nimport { DropdownMenuRadioItemCustom } from './dropdown-menu-helper';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuRadioItemV2: DropdownMenuRadioItem,\n\tDropdownMenuSeparatorV2: DropdownMenuSeparator,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n\tDropdownMenuItemHelpTextV2: DropdownMenuItemHelpText,\n} = unlock( componentsPrivateApis );\n\nfunction WithSeparators( { children } ) {\n\treturn Children.toArray( children )\n\t\t.filter( Boolean )\n\t\t.map( ( child, i ) => (\n\t\t\t<Fragment key={ i }>\n\t\t\t\t{ i > 0 && <DropdownMenuSeparator /> }\n\t\t\t\t{ child }\n\t\t\t</Fragment>\n\t\t) );\n}\n\nexport default function AddFilter( { filters, view, onChangeView } ) {\n\tif ( filters.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tconst filterCount = view.filters.reduce( ( acc, filter ) => {\n\t\tif ( filter.value !== undefined ) {\n\t\t\treturn acc + 1;\n\t\t}\n\t\treturn acc;\n\t}, 0 );\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\tlabel={ __( 'Filters' ) }\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\ticon={ funnel }\n\t\t\t\t\tclassName=\"dataviews-filters-button\"\n\t\t\t\t>\n\t\t\t\t\t{ view.type === LAYOUT_LIST && filterCount > 0 ? (\n\t\t\t\t\t\t<span className=\"dataviews-filters-count\">\n\t\t\t\t\t\t\t{ filterCount }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) : null }\n\t\t\t\t</Button>\n\t\t\t}\n\t\t\tstyle={ {\n\t\t\t\tminWidth: '230px',\n\t\t\t} }\n\t\t>\n\t\t\t<WithSeparators>\n\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t{ filters.map( ( filter ) => {\n\t\t\t\t\t\tconst filterInView = view.filters.find(\n\t\t\t\t\t\t\t( f ) => f.field === filter.field\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst otherFilters = view.filters.filter(\n\t\t\t\t\t\t\t( f ) => f.field !== filter.field\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst activeElement = filter.elements.find(\n\t\t\t\t\t\t\t( element ) => element.value === filterInView?.value\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst activeOperator =\n\t\t\t\t\t\t\tfilterInView?.operator || filter.operators[ 0 ];\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\t\tkey={ filter.field }\n\t\t\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t\t\tactiveElement && (\n\t\t\t\t\t\t\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ activeOperator in\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tOPERATORS &&\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t`${ OPERATORS[ activeOperator ].label } ` }\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ activeElement.label }\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t{ filter.name }\n\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tminWidth: '200px',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<WithSeparators>\n\t\t\t\t\t\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t\t\t\t\t\t{ filter.elements.map( ( element ) => {\n\t\t\t\t\t\t\t\t\t\t\tconst isActive =\n\t\t\t\t\t\t\t\t\t\t\t\tactiveElement?.value ===\n\t\t\t\t\t\t\t\t\t\t\t\telement.value;\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<DropdownMenuRadioItemCustom\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={ element.value }\n\t\t\t\t\t\t\t\t\t\t\t\t\tname={ `add-filter-${ filter.field }` }\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={ element.value }\n\t\t\t\t\t\t\t\t\t\t\t\t\tchecked={ isActive }\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={ ( e ) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfilters: [\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...otherFilters,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield: filter.field,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\toperator:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveOperator,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue: isActive\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: e\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.target\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.value,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{ element.label }\n\t\t\t\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ !! element.description && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<DropdownMenuItemHelpText>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\telement.description\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemHelpText>\n\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t</DropdownMenuRadioItemCustom>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t\t\t</DropdownMenuGroup>\n\t\t\t\t\t\t\t\t\t{ filter.operators.length > 1 && (\n\t\t\t\t\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tOPERATORS[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveOperator\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t]?.label\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Conditions' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ Object.entries( OPERATORS ).map(\n\t\t\t\t\t\t\t\t\t\t\t\t( [\n\t\t\t\t\t\t\t\t\t\t\t\t\toperator,\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ label, key },\n\t\t\t\t\t\t\t\t\t\t\t\t] ) => (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tname={ `add-filter-${ filter.field }-conditions` }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={ operator }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tchecked={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tactiveOperator ===\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\toperator\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={ ( e ) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfilters: [\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...otherFilters,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield: filter.field,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\toperator:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\te\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.target\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.value,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue: filterInView?.value,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</DropdownMenu>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\t\tkey={ 'reset-filter-' + filter.name }\n\t\t\t\t\t\t\t\t\t\tdisabled={ ! activeElement }\n\t\t\t\t\t\t\t\t\t\thideOnClick={ false }\n\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\t\t\t\t\tfilters: view.filters.filter(\n\t\t\t\t\t\t\t\t\t\t\t\t\t( f ) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tf.field !== filter.field\n\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t/* translators: 1: Filter name. e.g.: \"Reset Author\". */\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Reset %1$s' ),\n\t\t\t\t\t\t\t\t\t\t\t\tfilter.name.toLowerCase()\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t\t</WithSeparators>\n\t\t\t\t\t\t\t</DropdownMenu>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</DropdownMenuGroup>\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tdisabled={\n\t\t\t\t\t\tview.search === '' && view.filters?.length === 0\n\t\t\t\t\t}\n\t\t\t\t\thideOnClick={ false }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\tfilters: [],\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Reset filters' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t</WithSeparators>\n\t\t</DropdownMenu>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["privateApis","componentsPrivateApis","Button","plus","__","forwardRef","unlock","DropdownMenuV2","DropdownMenu","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuItemLabelV2","DropdownMenuItemLabel","AddFilter","filters","view","onChangeView","setOpenedFilter","ref","length","every","isPrimary","inactiveFilters","filter","isVisible","createElement","trigger","__experimentalIsFocusable","size","icon","className","variant","disabled","map","key","field","onClick","page","value","undefined","operator","operators","name"],"sources":["@wordpress/dataviews/src/add-filter.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tprivateApis as componentsPrivateApis,\n\tButton,\n} from '@wordpress/components';\nimport { plus } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n} = unlock( componentsPrivateApis );\n\nfunction AddFilter( { filters, view, onChangeView, setOpenedFilter }, ref ) {\n\tif ( ! filters.length || filters.every( ( { isPrimary } ) => isPrimary ) ) {\n\t\treturn null;\n\t}\n\tconst inactiveFilters = filters.filter( ( filter ) => ! filter.isVisible );\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\ticon={ plus }\n\t\t\t\t\tclassName=\"dataviews-filters-button\"\n\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\tdisabled={ ! inactiveFilters.length }\n\t\t\t\t\tref={ ref }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Add filter' ) }\n\t\t\t\t</Button>\n\t\t\t}\n\t\t>\n\t\t\t{ inactiveFilters.map( ( filter ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\tkey={ filter.field }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tsetOpenedFilter( filter.field );\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\tfilters: [\n\t\t\t\t\t\t\t\t\t...( view.filters || [] ),\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tfield: filter.field,\n\t\t\t\t\t\t\t\t\t\tvalue: undefined,\n\t\t\t\t\t\t\t\t\t\toperator: filter.operators[ 0 ],\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ filter.name }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nexport default forwardRef( AddFilter );\n"],"mappings":";AAAA;AACA;AACA;AACA,SACCA,WAAW,IAAIC,qBAAqB,EACpCC,MAAM,QACA,uBAAuB;AAC9B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,SAASC,MAAM,QAAQ,eAAe;AAEtC,MAAM;EACLC,cAAc,EAAEC,YAAY;EAC5BC,kBAAkB,EAAEC,gBAAgB;EACpCC,uBAAuB,EAAEC;AAC1B,CAAC,GAAGN,MAAM,CAAEL,qBAAsB,CAAC;AAEnC,SAASY,SAASA,CAAE;EAAEC,OAAO;EAAEC,IAAI;EAAEC,YAAY;EAAEC;AAAgB,CAAC,EAAEC,GAAG,EAAG;EAC3E,IAAK,CAAEJ,OAAO,CAACK,MAAM,IAAIL,OAAO,CAACM,KAAK,CAAE,CAAE;IAAEC;EAAU,CAAC,KAAMA,SAAU,CAAC,EAAG;IAC1E,OAAO,IAAI;EACZ;EACA,MAAMC,eAAe,GAAGR,OAAO,CAACS,MAAM,CAAIA,MAAM,IAAM,CAAEA,MAAM,CAACC,SAAU,CAAC;EAC1E,OACCC,aAAA,CAACjB,YAAY;IACZkB,OAAO,EACND,aAAA,CAACvB,MAAM;MACNyB,yBAAyB;MACzBC,IAAI,EAAC,SAAS;MACdC,IAAI,EAAG1B,IAAM;MACb2B,SAAS,EAAC,0BAA0B;MACpCC,OAAO,EAAC,UAAU;MAClBC,QAAQ,EAAG,CAAEV,eAAe,CAACH,MAAQ;MACrCD,GAAG,EAAGA;IAAK,GAETd,EAAE,CAAE,YAAa,CACZ;EACR,GAECkB,eAAe,CAACW,GAAG,CAAIV,MAAM,IAAM;IACpC,OACCE,aAAA,CAACf,gBAAgB;MAChBwB,GAAG,EAAGX,MAAM,CAACY,KAAO;MACpBC,OAAO,EAAGA,CAAA,KAAM;QACfnB,eAAe,CAAEM,MAAM,CAACY,KAAM,CAAC;QAC/BnB,YAAY,CAAE;UACb,GAAGD,IAAI;UACPsB,IAAI,EAAE,CAAC;UACPvB,OAAO,EAAE,CACR,IAAKC,IAAI,CAACD,OAAO,IAAI,EAAE,CAAE,EACzB;YACCqB,KAAK,EAAEZ,MAAM,CAACY,KAAK;YACnBG,KAAK,EAAEC,SAAS;YAChBC,QAAQ,EAAEjB,MAAM,CAACkB,SAAS,CAAE,CAAC;UAC9B,CAAC;QAEH,CAAE,CAAC;MACJ;IAAG,GAEHhB,aAAA,CAACb,qBAAqB,QACnBW,MAAM,CAACmB,IACa,CACN,CAAC;EAErB,CAAE,CACW,CAAC;AAEjB;AAEA,eAAerC,UAAU,CAAEQ,SAAU,CAAC"}

package/build-module/dataviews.js

@@ -12,7 +12,7 @@ import Pagination from './pagination';
 import ViewActions from './view-actions';
 import Filters from './filters';
 import Search from './search';
-import { VIEW_LAYOUTS, LAYOUT_TABLE } from './constants';
+import { VIEW_LAYOUTS, LAYOUT_TABLE, LAYOUT_GRID } from './constants';
 import BulkActions from './bulk-actions';
 const defaultGetItemId = item => item.id;
 const defaultOnSelectionChange = () => {};
@@ -33,17 +33,18 @@ export default function DataViews({
   deferredRendering = false
 }) {
   const [selection, setSelection] = useState([]);
+  const [openedFilter, setOpenedFilter] = useState(null);
   useEffect(() => {
-    if (selection.length > 0 && selection.some(id => !data.some(item => item.id === id))) {
-      const newSelection = selection.filter(id => data.some(item => item.id === id));
+    if (selection.length > 0 && selection.some(id => !data.some(item => getItemId(item) === id))) {
+      const newSelection = selection.filter(id => data.some(item => getItemId(item) === id));
       setSelection(newSelection);
-      onSelectionChange(data.filter(item => newSelection.includes(item.id)));
+      onSelectionChange(data.filter(item => newSelection.includes(getItemId(item))));
     }
-  }, [selection, data, onSelectionChange]);
+  }, [selection, data, getItemId, onSelectionChange]);
   const onSetSelection = useCallback(items => {
-    setSelection(items.map(item => item.id));
+    setSelection(items.map(item => getItemId(item)));
     onSelectionChange(items);
-  }, [setSelection, onSelectionChange]);
+  }, [setSelection, getItemId, onSelectionChange]);
   const ViewComponent = VIEW_LAYOUTS.find(v => v.type === view.type).component;
   const _fields = useMemo(() => {
     return fields.map(field => ({
@@ -54,23 +55,17 @@ export default function DataViews({
   return createElement("div", {
     className: "dataviews-wrapper"
   }, createElement(VStack, {
-    spacing: 0,
+    spacing: 3,
     justify: "flex-start"
   }, createElement(HStack, {
     alignment: "flex-start",
-    className: "dataviews-filters__view-actions"
-  }, createElement(HStack, {
     justify: "start",
-    wrap: true
+    className: "dataviews-filters__view-actions"
   }, search && createElement(Search, {
     label: searchLabel,
     view: view,
     onChangeView: onChangeView
-  }), createElement(Filters, {
-    fields: _fields,
-    view: view,
-    onChangeView: onChangeView
-  })), view.type === LAYOUT_TABLE && createElement(BulkActions, {
+  }), [LAYOUT_TABLE, LAYOUT_GRID].includes(view.type) && createElement(BulkActions, {
     actions: actions,
     data: data,
     onSelectionChange: onSetSelection,
@@ -81,6 +76,16 @@ export default function DataViews({
     view: view,
     onChangeView: onChangeView,
     supportedLayouts: supportedLayouts
+  })), createElement(HStack, {
+    justify: "start",
+    className: "dataviews-filters__container",
+    wrap: true
+  }, createElement(Filters, {
+    fields: _fields,
+    view: view,
+    onChangeView: onChangeView,
+    openedFilter: openedFilter,
+    setOpenedFilter: setOpenedFilter
   })), createElement(ViewComponent, {
     fields: _fields,
     view: view,
@@ -92,7 +97,8 @@ export default function DataViews({
     onSelectionChange: onSetSelection,
     onDetailsChange: onDetailsChange,
     selection: selection,
-    deferredRendering: deferredRendering
+    deferredRendering: deferredRendering,
+    setOpenedFilter: setOpenedFilter
   }), createElement(Pagination, {
     view: view,
     onChangeView: onChangeView,

package/build-module/dataviews.js.map

@@ -1 +1 @@
-{"version":3,"names":["__experimentalVStack","VStack","__experimentalHStack","HStack","useMemo","useState","useCallback","useEffect","Pagination","ViewActions","Filters","Search","VIEW_LAYOUTS","LAYOUT_TABLE","BulkActions","defaultGetItemId","item","id","defaultOnSelectionChange","DataViews","view","onChangeView","fields","search","searchLabel","undefined","actions","data","getItemId","isLoading","paginationInfo","supportedLayouts","onSelectionChange","onDetailsChange","deferredRendering","selection","setSelection","length","some","newSelection","filter","includes","onSetSelection","items","map","ViewComponent","find","v","type","component","_fields","field","render","getValue","createElement","className","spacing","justify","alignment","wrap","label"],"sources":["@wordpress/dataviews/src/dataviews.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useMemo, useState, useCallback, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Pagination from './pagination';\nimport ViewActions from './view-actions';\nimport Filters from './filters';\nimport Search from './search';\nimport { VIEW_LAYOUTS, LAYOUT_TABLE } from './constants';\nimport BulkActions from './bulk-actions';\n\nconst defaultGetItemId = ( item ) => item.id;\nconst defaultOnSelectionChange = () => {};\n\nexport default function DataViews( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tisLoading = false,\n\tpaginationInfo,\n\tsupportedLayouts,\n\tonSelectionChange = defaultOnSelectionChange,\n\tonDetailsChange = null,\n\tdeferredRendering = false,\n} ) {\n\tconst [ selection, setSelection ] = useState( [] );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\tselection.length > 0 &&\n\t\t\tselection.some(\n\t\t\t\t( id ) => ! data.some( ( item ) => item.id === id )\n\t\t\t)\n\t\t) {\n\t\t\tconst newSelection = selection.filter( ( id ) =>\n\t\t\t\tdata.some( ( item ) => item.id === id )\n\t\t\t);\n\t\t\tsetSelection( newSelection );\n\t\t\tonSelectionChange(\n\t\t\t\tdata.filter( ( item ) => newSelection.includes( item.id ) )\n\t\t\t);\n\t\t}\n\t}, [ selection, data, onSelectionChange ] );\n\n\tconst onSetSelection = useCallback(\n\t\t( items ) => {\n\t\t\tsetSelection( items.map( ( item ) => item.id ) );\n\t\t\tonSelectionChange( items );\n\t\t},\n\t\t[ setSelection, onSelectionChange ]\n\t);\n\n\tconst ViewComponent = VIEW_LAYOUTS.find(\n\t\t( v ) => v.type === view.type\n\t).component;\n\tconst _fields = useMemo( () => {\n\t\treturn fields.map( ( field ) => ( {\n\t\t\t...field,\n\t\t\trender: field.render || field.getValue,\n\t\t} ) );\n\t}, [ fields ] );\n\treturn (\n\t\t<div className=\"dataviews-wrapper\">\n\t\t\t<VStack spacing={ 0 } justify=\"flex-start\">\n\t\t\t\t<HStack\n\t\t\t\t\talignment=\"flex-start\"\n\t\t\t\t\tclassName=\"dataviews-filters__view-actions\"\n\t\t\t\t>\n\t\t\t\t\t<HStack justify=\"start\" wrap>\n\t\t\t\t\t\t{ search && (\n\t\t\t\t\t\t\t<Search\n\t\t\t\t\t\t\t\tlabel={ searchLabel }\n\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<Filters\n\t\t\t\t\t\t\tfields={ _fields }\n\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t{ view.type === LAYOUT_TABLE && (\n\t\t\t\t\t\t<BulkActions\n\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\tonSelectionChange={ onSetSelection }\n\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t<ViewActions\n\t\t\t\t\t\tfields={ _fields }\n\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\tsupportedLayouts={ supportedLayouts }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t\t<ViewComponent\n\t\t\t\t\tfields={ _fields }\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\tactions={ actions }\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\tisLoading={ isLoading }\n\t\t\t\t\tonSelectionChange={ onSetSelection }\n\t\t\t\t\tonDetailsChange={ onDetailsChange }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tdeferredRendering={ deferredRendering }\n\t\t\t\t/>\n\t\t\t\t<Pagination\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\tpaginationInfo={ paginationInfo }\n\t\t\t\t/>\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["__experimentalVStack","VStack","__experimentalHStack","HStack","useMemo","useState","useCallback","useEffect","Pagination","ViewActions","Filters","Search","VIEW_LAYOUTS","LAYOUT_TABLE","LAYOUT_GRID","BulkActions","defaultGetItemId","item","id","defaultOnSelectionChange","DataViews","view","onChangeView","fields","search","searchLabel","undefined","actions","data","getItemId","isLoading","paginationInfo","supportedLayouts","onSelectionChange","onDetailsChange","deferredRendering","selection","setSelection","openedFilter","setOpenedFilter","length","some","newSelection","filter","includes","onSetSelection","items","map","ViewComponent","find","v","type","component","_fields","field","render","getValue","createElement","className","spacing","justify","alignment","label","wrap"],"sources":["@wordpress/dataviews/src/dataviews.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useMemo, useState, useCallback, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Pagination from './pagination';\nimport ViewActions from './view-actions';\nimport Filters from './filters';\nimport Search from './search';\nimport { VIEW_LAYOUTS, LAYOUT_TABLE, LAYOUT_GRID } from './constants';\nimport BulkActions from './bulk-actions';\n\nconst defaultGetItemId = ( item ) => item.id;\nconst defaultOnSelectionChange = () => {};\n\nexport default function DataViews( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tisLoading = false,\n\tpaginationInfo,\n\tsupportedLayouts,\n\tonSelectionChange = defaultOnSelectionChange,\n\tonDetailsChange = null,\n\tdeferredRendering = false,\n} ) {\n\tconst [ selection, setSelection ] = useState( [] );\n\tconst [ openedFilter, setOpenedFilter ] = useState( null );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\tselection.length > 0 &&\n\t\t\tselection.some(\n\t\t\t\t( id ) => ! data.some( ( item ) => getItemId( item ) === id )\n\t\t\t)\n\t\t) {\n\t\t\tconst newSelection = selection.filter( ( id ) =>\n\t\t\t\tdata.some( ( item ) => getItemId( item ) === id )\n\t\t\t);\n\t\t\tsetSelection( newSelection );\n\t\t\tonSelectionChange(\n\t\t\t\tdata.filter( ( item ) =>\n\t\t\t\t\tnewSelection.includes( getItemId( item ) )\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\t}, [ selection, data, getItemId, onSelectionChange ] );\n\n\tconst onSetSelection = useCallback(\n\t\t( items ) => {\n\t\t\tsetSelection( items.map( ( item ) => getItemId( item ) ) );\n\t\t\tonSelectionChange( items );\n\t\t},\n\t\t[ setSelection, getItemId, onSelectionChange ]\n\t);\n\n\tconst ViewComponent = VIEW_LAYOUTS.find(\n\t\t( v ) => v.type === view.type\n\t).component;\n\tconst _fields = useMemo( () => {\n\t\treturn fields.map( ( field ) => ( {\n\t\t\t...field,\n\t\t\trender: field.render || field.getValue,\n\t\t} ) );\n\t}, [ fields ] );\n\treturn (\n\t\t<div className=\"dataviews-wrapper\">\n\t\t\t<VStack spacing={ 3 } justify=\"flex-start\">\n\t\t\t\t<HStack\n\t\t\t\t\talignment=\"flex-start\"\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\tclassName=\"dataviews-filters__view-actions\"\n\t\t\t\t>\n\t\t\t\t\t{ search && (\n\t\t\t\t\t\t<Search\n\t\t\t\t\t\t\tlabel={ searchLabel }\n\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ [ LAYOUT_TABLE, LAYOUT_GRID ].includes( view.type ) && (\n\t\t\t\t\t\t<BulkActions\n\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\tonSelectionChange={ onSetSelection }\n\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t<ViewActions\n\t\t\t\t\t\tfields={ _fields }\n\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\tsupportedLayouts={ supportedLayouts }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\tclassName=\"dataviews-filters__container\"\n\t\t\t\t\twrap\n\t\t\t\t>\n\t\t\t\t\t<Filters\n\t\t\t\t\t\tfields={ _fields }\n\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\topenedFilter={ openedFilter }\n\t\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t\t<ViewComponent\n\t\t\t\t\tfields={ _fields }\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\tactions={ actions }\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\tisLoading={ isLoading }\n\t\t\t\t\tonSelectionChange={ onSetSelection }\n\t\t\t\t\tonDetailsChange={ onDetailsChange }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tdeferredRendering={ deferredRendering }\n\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t/>\n\t\t\t\t<Pagination\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\tpaginationInfo={ paginationInfo }\n\t\t\t\t/>\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}

package/build-module/filter-summary.js

@@ -1,26 +1,23 @@
 import { createElement } from "react";
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+
 /**
  * WordPress dependencies
  */
-import { Button, privateApis as componentsPrivateApis, Icon } from '@wordpress/components';
-import { chevronDown } from '@wordpress/icons';
+import { Dropdown, Button, __experimentalVStack as VStack, __experimentalHStack as HStack, FlexItem, SelectControl, Tooltip, Icon } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
-import { Children, Fragment } from '@wordpress/element';
+import { useRef, createInterpolateElement } from '@wordpress/element';
+import { closeSmall } from '@wordpress/icons';
+import { ENTER, SPACE } from '@wordpress/keycodes';
 
 /**
  * Internal dependencies
  */
+import SearchWidget from './search-widget';
 import { OPERATOR_IN, OPERATOR_NOT_IN, OPERATORS } from './constants';
-import { unlock } from './lock-unlock';
-import { DropdownMenuRadioItemCustom } from './dropdown-menu-helper';
-const {
-  DropdownMenuV2: DropdownMenu,
-  DropdownMenuGroupV2: DropdownMenuGroup,
-  DropdownMenuItemV2: DropdownMenuItem,
-  DropdownMenuSeparatorV2: DropdownMenuSeparator,
-  DropdownMenuItemLabelV2: DropdownMenuItemLabel,
-  DropdownMenuItemHelpTextV2: DropdownMenuItemHelpText
-} = unlock(componentsPrivateApis);
 const FilterText = ({
   activeElement,
   filterInView,
@@ -29,91 +26,196 @@ const FilterText = ({
   if (activeElement === undefined) {
     return filter.name;
   }
+  const filterTextWrappers = {
+    Span1: createElement("span", {
+      className: "dataviews-filter-summary__filter-text-name"
+    }),
+    Span2: createElement("span", {
+      className: "dataviews-filter-summary__filter-text-value"
+    })
+  };
   if (activeElement !== undefined && filterInView?.operator === OPERATOR_IN) {
-    return sprintf( /* translators: 1: Filter name. 2: Filter value. e.g.: "Author is Admin". */
-    __('%1$s is %2$s'), filter.name, activeElement.label);
+    return createInterpolateElement(sprintf( /* translators: 1: Filter name. 2: Filter value. e.g.: "Author is Admin". */
+    __('<Span1>%1$s </Span1><Span2>is %2$s</Span2>'), filter.name, activeElement.label), filterTextWrappers);
   }
   if (activeElement !== undefined && filterInView?.operator === OPERATOR_NOT_IN) {
-    return sprintf( /* translators: 1: Filter name. 2: Filter value. e.g.: "Author is not Admin". */
-    __('%1$s is not %2$s'), filter.name, activeElement.label);
+    return createInterpolateElement(sprintf( /* translators: 1: Filter name. 2: Filter value. e.g.: "Author is not Admin". */
+    __('<Span1>%1$s </Span1><Span2>is not %2$s</Span2>'), filter.name, activeElement.label), filterTextWrappers);
   }
   return sprintf( /* translators: 1: Filter name e.g.: "Unknown status for Author". */
   __('Unknown status for %1$s'), filter.name);
 };
-function WithSeparators({
-  children
+function OperatorSelector({
+  filter,
+  view,
+  onChangeView
 }) {
-  return Children.toArray(children).filter(Boolean).map((child, i) => createElement(Fragment, {
-    key: i
-  }, i > 0 && createElement(DropdownMenuSeparator, null), child));
+  const operatorOptions = filter.operators?.map(operator => ({
+    value: operator,
+    label: OPERATORS[operator]?.label
+  }));
+  const currentFilter = view.filters.find(_filter => _filter.field === filter.field);
+  const value = currentFilter?.operator || filter.operators[0];
+  return operatorOptions.length > 1 && createElement(HStack, {
+    spacing: 2,
+    justify: "flex-start",
+    className: "dataviews-filter-summary__operators-container"
+  }, createElement(FlexItem, {
+    className: "dataviews-filter-summary__operators-filter-name"
+  }, filter.name), createElement(SelectControl, {
+    label: __('Conditions'),
+    value: value,
+    options: operatorOptions,
+    onChange: newValue => {
+      const newFilters = currentFilter ? [...view.filters.map(_filter => {
+        if (_filter.field === filter.field) {
+          return {
+            ..._filter,
+            operator: newValue
+          };
+        }
+        return _filter;
+      })] : [...view.filters, {
+        field: filter.field,
+        operator: newValue
+      }];
+      onChangeView({
+        ...view,
+        page: 1,
+        filters: newFilters
+      });
+    },
+    size: "small",
+    __nextHasNoMarginBottom: true,
+    hideLabelFromVision: true
+  }));
 }
-export default function FilterSummary({
+function ResetFilter({
   filter,
   view,
-  onChangeView
+  onChangeView,
+  addFilterRef
 }) {
+  const isDisabled = filter.isPrimary && view.filters.find(_filter => _filter.field === filter.field)?.value === undefined;
+  return createElement("div", {
+    className: "dataviews-filter-summary__reset"
+  }, createElement(Button, {
+    disabled: isDisabled,
+    __experimentalIsFocusable: true,
+    size: "compact",
+    variant: "tertiary",
+    style: {
+      justifyContent: 'center',
+      width: '100%'
+    },
+    onClick: () => {
+      onChangeView({
+        ...view,
+        page: 1,
+        filters: view.filters.filter(_filter => _filter.field !== filter.field)
+      });
+      // If the filter is not primary and can be removed, it will be added
+      // back to the available filters from `Add filter` component.
+      if (!filter.isPrimary) {
+        addFilterRef.current?.focus();
+      }
+    }
+  }, filter.isPrimary ? __('Reset') : __('Remove')));
+}
+export default function FilterSummary({
+  addFilterRef,
+  openedFilter,
+  ...commonProps
+}) {
+  const toggleRef = useRef();
+  const {
+    filter,
+    view,
+    onChangeView
+  } = commonProps;
   const filterInView = view.filters.find(f => f.field === filter.field);
-  const otherFilters = view.filters.filter(f => f.field !== filter.field);
   const activeElement = filter.elements.find(element => element.value === filterInView?.value);
-  const activeOperator = filterInView?.operator || filter.operators[0];
-  return createElement(DropdownMenu, {
-    key: filter.field,
-    trigger: createElement(Button, {
-      variant: "tertiary",
-      size: "compact",
-      label: filter.name
+  const isPrimary = filter.isPrimary;
+  const hasValues = filterInView?.value !== undefined;
+  const canResetOrRemove = !isPrimary || hasValues;
+  return createElement(Dropdown, {
+    defaultOpen: openedFilter === filter.field,
+    contentClassName: "dataviews-filter-summary__popover",
+    popoverProps: {
+      placement: 'bottom-start',
+      role: 'dialog'
+    },
+    onClose: () => {
+      toggleRef.current?.focus();
+    },
+    renderToggle: ({
+      isOpen,
+      onToggle
+    }) => createElement("div", {
+      className: "dataviews-filter-summary__chip-container"
+    }, createElement(Tooltip, {
+      text: sprintf( /* translators: 1: Filter name. */
+      __('Filter by: %1$s'), filter.name.toLowerCase()),
+      placement: "top"
+    }, createElement("div", {
+      className: classnames('dataviews-filter-summary__chip', {
+        'has-reset': canResetOrRemove,
+        'has-values': hasValues
+      }),
+      role: "button",
+      tabIndex: 0,
+      onClick: onToggle,
+      onKeyDown: event => {
+        if ([ENTER, SPACE].includes(event.keyCode)) {
+          onToggle();
+          event.preventDefault();
+        }
+      },
+      "aria-pressed": isOpen,
+      "aria-expanded": isOpen,
+      ref: toggleRef
     }, createElement(FilterText, {
       activeElement: activeElement,
       filterInView: filterInView,
       filter: filter
-    }), createElement(Icon, {
-      icon: chevronDown,
-      style: {
-        flexShrink: 0
+    }))), canResetOrRemove && createElement(Tooltip, {
+      text: isPrimary ? __('Reset') : __('Remove'),
+      placement: "top"
+    }, createElement("button", {
+      className: classnames('dataviews-filter-summary__chip-remove', {
+        'has-values': hasValues
+      }),
+      onClick: () => {
+        onChangeView({
+          ...view,
+          page: 1,
+          filters: view.filters.filter(_filter => _filter.field !== filter.field)
+        });
+        // If the filter is not primary and can be removed, it will be added
+        // back to the available filters from `Add filter` component.
+        if (!isPrimary) {
+          addFilterRef.current?.focus();
+        } else {
+          // If is primary, focus the toggle button.
+          toggleRef.current?.focus();
+        }
       }
-    }))
-  }, createElement(WithSeparators, null, createElement(DropdownMenuGroup, null, filter.elements.map(element => {
-    const isActive = activeElement?.value === element.value;
-    return createElement(DropdownMenuRadioItemCustom, {
-      key: element.value,
-      name: `filter-summary-${filter.field}`,
-      value: element.value,
-      checked: isActive,
-      onClick: () => onChangeView({
-        ...view,
-        page: 1,
-        filters: [...otherFilters, {
-          field: filter.field,
-          operator: activeOperator,
-          value: isActive ? undefined : element.value
-        }]
-      })
-    }, createElement(DropdownMenuItemLabel, null, element.label), !!element.description && createElement(DropdownMenuItemHelpText, null, element.description));
-  })), filter.operators.length > 1 && createElement(DropdownMenu, {
-    trigger: createElement(DropdownMenuItem, {
-      suffix: createElement("span", {
-        "aria-hidden": "true"
-      }, OPERATORS[activeOperator]?.label)
-    }, createElement(DropdownMenuItemLabel, null, __('Conditions')))
-  }, Object.entries(OPERATORS).map(([operator, {
-    label,
-    key
-  }]) => createElement(DropdownMenuRadioItemCustom, {
-    key: key,
-    name: `filter-summary-${filter.field}-conditions`,
-    value: operator,
-    checked: activeOperator === operator,
-    onChange: e => {
-      onChangeView({
-        ...view,
-        page: 1,
-        filters: [...otherFilters, {
-          field: filter.field,
-          operator: e.target.value,
-          value: filterInView?.value
-        }]
-      });
+    }, createElement(Icon, {
+      icon: closeSmall
+    })))),
+    renderContent: () => {
+      return createElement(VStack, {
+        spacing: 0,
+        justify: "flex-start"
+      }, createElement(OperatorSelector, {
+        ...commonProps
+      }), createElement(SearchWidget, {
+        ...commonProps
+      }), createElement(ResetFilter, {
+        ...commonProps,
+        addFilterRef: addFilterRef
+      }));
     }
-  }, createElement(DropdownMenuItemLabel, null, label))))));
+  });
 }
 //# sourceMappingURL=filter-summary.js.map

package/build-module/filter-summary.js.map

@@ -1 +1 @@
-{"version":3,"names":["Button","privateApis","componentsPrivateApis","Icon","chevronDown","__","sprintf","Children","Fragment","OPERATOR_IN","OPERATOR_NOT_IN","OPERATORS","unlock","DropdownMenuRadioItemCustom","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuSeparatorV2","DropdownMenuSeparator","DropdownMenuItemLabelV2","DropdownMenuItemLabel","DropdownMenuItemHelpTextV2","DropdownMenuItemHelpText","FilterText","activeElement","filterInView","filter","undefined","name","operator","label","WithSeparators","children","toArray","Boolean","map","child","i","createElement","key","FilterSummary","view","onChangeView","filters","find","f","field","otherFilters","elements","element","value","activeOperator","operators","trigger","variant","size","icon","style","flexShrink","isActive","checked","onClick","page","description","length","suffix","Object","entries","onChange","e","target"],"sources":["@wordpress/dataviews/src/filter-summary.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tprivateApis as componentsPrivateApis,\n\tIcon,\n} from '@wordpress/components';\nimport { chevronDown } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Children, Fragment } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { OPERATOR_IN, OPERATOR_NOT_IN, OPERATORS } from './constants';\nimport { unlock } from './lock-unlock';\nimport { DropdownMenuRadioItemCustom } from './dropdown-menu-helper';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuSeparatorV2: DropdownMenuSeparator,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n\tDropdownMenuItemHelpTextV2: DropdownMenuItemHelpText,\n} = unlock( componentsPrivateApis );\n\nconst FilterText = ( { activeElement, filterInView, filter } ) => {\n\tif ( activeElement === undefined ) {\n\t\treturn filter.name;\n\t}\n\n\tif (\n\t\tactiveElement !== undefined &&\n\t\tfilterInView?.operator === OPERATOR_IN\n\t) {\n\t\treturn sprintf(\n\t\t\t/* translators: 1: Filter name. 2: Filter value. e.g.: \"Author is Admin\". */\n\t\t\t__( '%1$s is %2$s' ),\n\t\t\tfilter.name,\n\t\t\tactiveElement.label\n\t\t);\n\t}\n\n\tif (\n\t\tactiveElement !== undefined &&\n\t\tfilterInView?.operator === OPERATOR_NOT_IN\n\t) {\n\t\treturn sprintf(\n\t\t\t/* translators: 1: Filter name. 2: Filter value. e.g.: \"Author is not Admin\". */\n\t\t\t__( '%1$s is not %2$s' ),\n\t\t\tfilter.name,\n\t\t\tactiveElement.label\n\t\t);\n\t}\n\n\treturn sprintf(\n\t\t/* translators: 1: Filter name e.g.: \"Unknown status for Author\". */\n\t\t__( 'Unknown status for %1$s' ),\n\t\tfilter.name\n\t);\n};\n\nfunction WithSeparators( { children } ) {\n\treturn Children.toArray( children )\n\t\t.filter( Boolean )\n\t\t.map( ( child, i ) => (\n\t\t\t<Fragment key={ i }>\n\t\t\t\t{ i > 0 && <DropdownMenuSeparator /> }\n\t\t\t\t{ child }\n\t\t\t</Fragment>\n\t\t) );\n}\n\nexport default function FilterSummary( { filter, view, onChangeView } ) {\n\tconst filterInView = view.filters.find( ( f ) => f.field === filter.field );\n\tconst otherFilters = view.filters.filter(\n\t\t( f ) => f.field !== filter.field\n\t);\n\tconst activeElement = filter.elements.find(\n\t\t( element ) => element.value === filterInView?.value\n\t);\n\tconst activeOperator = filterInView?.operator || filter.operators[ 0 ];\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\tkey={ filter.field }\n\t\t\ttrigger={\n\t\t\t\t<Button variant=\"tertiary\" size=\"compact\" label={ filter.name }>\n\t\t\t\t\t<FilterText\n\t\t\t\t\t\tactiveElement={ activeElement }\n\t\t\t\t\t\tfilterInView={ filterInView }\n\t\t\t\t\t\tfilter={ filter }\n\t\t\t\t\t/>\n\t\t\t\t\t<Icon icon={ chevronDown } style={ { flexShrink: 0 } } />\n\t\t\t\t</Button>\n\t\t\t}\n\t\t>\n\t\t\t<WithSeparators>\n\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t{ filter.elements.map( ( element ) => {\n\t\t\t\t\t\tconst isActive = activeElement?.value === element.value;\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<DropdownMenuRadioItemCustom\n\t\t\t\t\t\t\t\tkey={ element.value }\n\t\t\t\t\t\t\t\tname={ `filter-summary-${ filter.field }` }\n\t\t\t\t\t\t\t\tvalue={ element.value }\n\t\t\t\t\t\t\t\tchecked={ isActive }\n\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\t\t\tfilters: [\n\t\t\t\t\t\t\t\t\t\t\t...otherFilters,\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\tfield: filter.field,\n\t\t\t\t\t\t\t\t\t\t\t\toperator: activeOperator,\n\t\t\t\t\t\t\t\t\t\t\t\tvalue: isActive\n\t\t\t\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t: element.value,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t{ element.label }\n\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t{ !! element.description && (\n\t\t\t\t\t\t\t\t\t<DropdownMenuItemHelpText>\n\t\t\t\t\t\t\t\t\t\t{ element.description }\n\t\t\t\t\t\t\t\t\t</DropdownMenuItemHelpText>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</DropdownMenuRadioItemCustom>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</DropdownMenuGroup>\n\t\t\t\t{ filter.operators.length > 1 && (\n\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t{ OPERATORS[ activeOperator ]?.label }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t{ __( 'Conditions' ) }\n\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ Object.entries( OPERATORS ).map(\n\t\t\t\t\t\t\t( [ operator, { label, key } ] ) => (\n\t\t\t\t\t\t\t\t<DropdownMenuRadioItemCustom\n\t\t\t\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t\t\t\tname={ `filter-summary-${ filter.field }-conditions` }\n\t\t\t\t\t\t\t\t\tvalue={ operator }\n\t\t\t\t\t\t\t\t\tchecked={ activeOperator === operator }\n\t\t\t\t\t\t\t\t\tonChange={ ( e ) => {\n\t\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\t\t\t\tfilters: [\n\t\t\t\t\t\t\t\t\t\t\t\t...otherFilters,\n\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\tfield: filter.field,\n\t\t\t\t\t\t\t\t\t\t\t\t\toperator: e.target.value,\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue: filterInView?.value,\n\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t</DropdownMenuRadioItemCustom>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) }\n\t\t\t\t\t</DropdownMenu>\n\t\t\t\t) }\n\t\t\t</WithSeparators>\n\t\t</DropdownMenu>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["classnames","Dropdown","Button","__experimentalVStack","VStack","__experimentalHStack","HStack","FlexItem","SelectControl","Tooltip","Icon","__","sprintf","useRef","createInterpolateElement","closeSmall","ENTER","SPACE","SearchWidget","OPERATOR_IN","OPERATOR_NOT_IN","OPERATORS","FilterText","activeElement","filterInView","filter","undefined","name","filterTextWrappers","Span1","createElement","className","Span2","operator","label","OperatorSelector","view","onChangeView","operatorOptions","operators","map","value","currentFilter","filters","find","_filter","field","length","spacing","justify","options","onChange","newValue","newFilters","page","size","__nextHasNoMarginBottom","hideLabelFromVision","ResetFilter","addFilterRef","isDisabled","isPrimary","disabled","__experimentalIsFocusable","variant","style","justifyContent","width","onClick","current","focus","FilterSummary","openedFilter","commonProps","toggleRef","f","elements","element","hasValues","canResetOrRemove","defaultOpen","contentClassName","popoverProps","placement","role","onClose","renderToggle","isOpen","onToggle","text","toLowerCase","tabIndex","onKeyDown","event","includes","keyCode","preventDefault","ref","icon","renderContent"],"sources":["@wordpress/dataviews/src/filter-summary.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tDropdown,\n\tButton,\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\tFlexItem,\n\tSelectControl,\n\tTooltip,\n\tIcon,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useRef, createInterpolateElement } from '@wordpress/element';\nimport { closeSmall } from '@wordpress/icons';\nimport { ENTER, SPACE } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport SearchWidget from './search-widget';\nimport { OPERATOR_IN, OPERATOR_NOT_IN, OPERATORS } from './constants';\n\nconst FilterText = ( { activeElement, filterInView, filter } ) => {\n\tif ( activeElement === undefined ) {\n\t\treturn filter.name;\n\t}\n\n\tconst filterTextWrappers = {\n\t\tSpan1: <span className=\"dataviews-filter-summary__filter-text-name\" />,\n\t\tSpan2: <span className=\"dataviews-filter-summary__filter-text-value\" />,\n\t};\n\n\tif (\n\t\tactiveElement !== undefined &&\n\t\tfilterInView?.operator === OPERATOR_IN\n\t) {\n\t\treturn createInterpolateElement(\n\t\t\tsprintf(\n\t\t\t\t/* translators: 1: Filter name. 2: Filter value. e.g.: \"Author is Admin\". */\n\t\t\t\t__( '<Span1>%1$s </Span1><Span2>is %2$s</Span2>' ),\n\t\t\t\tfilter.name,\n\t\t\t\tactiveElement.label\n\t\t\t),\n\t\t\tfilterTextWrappers\n\t\t);\n\t}\n\n\tif (\n\t\tactiveElement !== undefined &&\n\t\tfilterInView?.operator === OPERATOR_NOT_IN\n\t) {\n\t\treturn createInterpolateElement(\n\t\t\tsprintf(\n\t\t\t\t/* translators: 1: Filter name. 2: Filter value. e.g.: \"Author is not Admin\". */\n\t\t\t\t__( '<Span1>%1$s </Span1><Span2>is not %2$s</Span2>' ),\n\t\t\t\tfilter.name,\n\t\t\t\tactiveElement.label\n\t\t\t),\n\t\t\tfilterTextWrappers\n\t\t);\n\t}\n\n\treturn sprintf(\n\t\t/* translators: 1: Filter name e.g.: \"Unknown status for Author\". */\n\t\t__( 'Unknown status for %1$s' ),\n\t\tfilter.name\n\t);\n};\n\nfunction OperatorSelector( { filter, view, onChangeView } ) {\n\tconst operatorOptions = filter.operators?.map( ( operator ) => ( {\n\t\tvalue: operator,\n\t\tlabel: OPERATORS[ operator ]?.label,\n\t} ) );\n\tconst currentFilter = view.filters.find(\n\t\t( _filter ) => _filter.field === filter.field\n\t);\n\tconst value = currentFilter?.operator || filter.operators[ 0 ];\n\treturn (\n\t\toperatorOptions.length > 1 && (\n\t\t\t<HStack\n\t\t\t\tspacing={ 2 }\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tclassName=\"dataviews-filter-summary__operators-container\"\n\t\t\t>\n\t\t\t\t<FlexItem className=\"dataviews-filter-summary__operators-filter-name\">\n\t\t\t\t\t{ filter.name }\n\t\t\t\t</FlexItem>\n\n\t\t\t\t<SelectControl\n\t\t\t\t\tlabel={ __( 'Conditions' ) }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\toptions={ operatorOptions }\n\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\tconst newFilters = currentFilter\n\t\t\t\t\t\t\t? [\n\t\t\t\t\t\t\t\t\t...view.filters.map( ( _filter ) => {\n\t\t\t\t\t\t\t\t\t\tif ( _filter.field === filter.field ) {\n\t\t\t\t\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t\t\t\t\t..._filter,\n\t\t\t\t\t\t\t\t\t\t\t\toperator: newValue,\n\t\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn _filter;\n\t\t\t\t\t\t\t\t\t} ),\n\t\t\t\t\t\t\t  ]\n\t\t\t\t\t\t\t: [\n\t\t\t\t\t\t\t\t\t...view.filters,\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tfield: filter.field,\n\t\t\t\t\t\t\t\t\t\toperator: newValue,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t  ];\n\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\tfilters: newFilters,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t)\n\t);\n}\n\nfunction ResetFilter( { filter, view, onChangeView, addFilterRef } ) {\n\tconst isDisabled =\n\t\tfilter.isPrimary &&\n\t\tview.filters.find( ( _filter ) => _filter.field === filter.field )\n\t\t\t?.value === undefined;\n\treturn (\n\t\t<div className=\"dataviews-filter-summary__reset\">\n\t\t\t<Button\n\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t\tsize=\"compact\"\n\t\t\t\tvariant=\"tertiary\"\n\t\t\t\tstyle={ { justifyContent: 'center', width: '100%' } }\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t...view,\n\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\tfilters: view.filters.filter(\n\t\t\t\t\t\t\t( _filter ) => _filter.field !== filter.field\n\t\t\t\t\t\t),\n\t\t\t\t\t} );\n\t\t\t\t\t// If the filter is not primary and can be removed, it will be added\n\t\t\t\t\t// back to the available filters from `Add filter` component.\n\t\t\t\t\tif ( ! filter.isPrimary ) {\n\t\t\t\t\t\taddFilterRef.current?.focus();\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ filter.isPrimary ? __( 'Reset' ) : __( 'Remove' ) }\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n\nexport default function FilterSummary( {\n\taddFilterRef,\n\topenedFilter,\n\t...commonProps\n} ) {\n\tconst toggleRef = useRef();\n\tconst { filter, view, onChangeView } = commonProps;\n\tconst filterInView = view.filters.find( ( f ) => f.field === filter.field );\n\tconst activeElement = filter.elements.find(\n\t\t( element ) => element.value === filterInView?.value\n\t);\n\tconst isPrimary = filter.isPrimary;\n\tconst hasValues = filterInView?.value !== undefined;\n\tconst canResetOrRemove = ! isPrimary || hasValues;\n\treturn (\n\t\t<Dropdown\n\t\t\tdefaultOpen={ openedFilter === filter.field }\n\t\t\tcontentClassName=\"dataviews-filter-summary__popover\"\n\t\t\tpopoverProps={ { placement: 'bottom-start', role: 'dialog' } }\n\t\t\tonClose={ () => {\n\t\t\t\ttoggleRef.current?.focus();\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t<div className=\"dataviews-filter-summary__chip-container\">\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\ttext={ sprintf(\n\t\t\t\t\t\t\t/* translators: 1: Filter name. */\n\t\t\t\t\t\t\t__( 'Filter by: %1$s' ),\n\t\t\t\t\t\t\tfilter.name.toLowerCase()\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'dataviews-filter-summary__chip',\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t'has-reset': canResetOrRemove,\n\t\t\t\t\t\t\t\t\t'has-values': hasValues,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\ttabIndex={ 0 }\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t[ ENTER, SPACE ].includes( event.keyCode )\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taria-pressed={ isOpen }\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\tref={ toggleRef }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<FilterText\n\t\t\t\t\t\t\t\tactiveElement={ activeElement }\n\t\t\t\t\t\t\t\tfilterInView={ filterInView }\n\t\t\t\t\t\t\t\tfilter={ filter }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t\t{ canResetOrRemove && (\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\ttext={ isPrimary ? __( 'Reset' ) : __( 'Remove' ) }\n\t\t\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t'dataviews-filter-summary__chip-remove',\n\t\t\t\t\t\t\t\t\t{ 'has-values': hasValues }\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\t\t\tfilters: view.filters.filter(\n\t\t\t\t\t\t\t\t\t\t\t( _filter ) =>\n\t\t\t\t\t\t\t\t\t\t\t\t_filter.field !== filter.field\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t// If the filter is not primary and can be removed, it will be added\n\t\t\t\t\t\t\t\t\t// back to the available filters from `Add filter` component.\n\t\t\t\t\t\t\t\t\tif ( ! isPrimary ) {\n\t\t\t\t\t\t\t\t\t\taddFilterRef.current?.focus();\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t// If is primary, focus the toggle button.\n\t\t\t\t\t\t\t\t\t\ttoggleRef.current?.focus();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Icon icon={ closeSmall } />\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\trenderContent={ () => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 0 } justify=\"flex-start\">\n\t\t\t\t\t\t<OperatorSelector { ...commonProps } />\n\t\t\t\t\t\t<SearchWidget { ...commonProps } />\n\t\t\t\t\t\t<ResetFilter\n\t\t\t\t\t\t\t{ ...commonProps }\n\t\t\t\t\t\t\taddFilterRef={ addFilterRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],"mappings":"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"}