@wordpress/dataviews 0.5.5 → 0.7.0

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","LAYOUT_GRID","BulkActions","defaultGetItemId","item","id","defaultOnSelectionChange","useSomeItemHasAPossibleBulkAction","actions","data","some","action","supportsBulk","isEligible","DataViews","view","onChangeView","fields","search","searchLabel","undefined","getItemId","isLoading","paginationInfo","supportedLayouts","onSelectionChange","onDetailsChange","deferredRendering","selection","setSelection","openedFilter","setOpenedFilter","length","newSelection","filter","includes","onSetSelection","items","map","ViewComponent","find","v","type","component","_fields","field","render","getValue","hasPossibleBulkAction","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, LAYOUT_GRID } from './constants';\nimport BulkActions from './bulk-actions';\n\nconst defaultGetItemId = ( item ) => item.id;\nconst defaultOnSelectionChange = () => {};\n\nfunction useSomeItemHasAPossibleBulkAction( actions, data ) {\n\treturn useMemo( () => {\n\t\treturn data.some( ( item ) => {\n\t\t\treturn actions.some( ( action ) => {\n\t\t\t\treturn action.supportsBulk && action.isEligible( item );\n\t\t\t} );\n\t\t} );\n\t}, [ actions, data ] );\n}\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\n\tconst hasPossibleBulkAction = useSomeItemHasAPossibleBulkAction(\n\t\tactions,\n\t\tdata\n\t);\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=\"top\"\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<HStack\n\t\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\t\tclassName=\"dataviews-filters__container\"\n\t\t\t\t\t\twrap\n\t\t\t\t\t>\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\topenedFilter={ openedFilter }\n\t\t\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t{ [ LAYOUT_TABLE, LAYOUT_GRID ].includes( view.type ) &&\n\t\t\t\t\t\thasPossibleBulkAction && (\n\t\t\t\t\t\t\t<BulkActions\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\tonSelectionChange={ onSetSelection }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t/>\n\t\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\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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"}
+{"version":3,"names":["__experimentalHStack","HStack","useMemo","useState","useCallback","useEffect","Pagination","ViewActions","Filters","Search","VIEW_LAYOUTS","LAYOUT_TABLE","LAYOUT_GRID","BulkActions","defaultGetItemId","item","id","defaultOnSelectionChange","useSomeItemHasAPossibleBulkAction","actions","data","some","action","supportsBulk","isEligible","DataViews","view","onChangeView","fields","search","searchLabel","undefined","getItemId","isLoading","paginationInfo","supportedLayouts","onSelectionChange","onDetailsChange","deferredRendering","selection","setSelection","openedFilter","setOpenedFilter","length","newSelection","filter","includes","onSetSelection","items","map","ViewComponent","find","v","type","component","_fields","field","render","getValue","hasPossibleBulkAction","createElement","className","alignment","justify","wrap","label"],"sources":["@wordpress/dataviews/src/dataviews.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalHStack as HStack } 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\nfunction useSomeItemHasAPossibleBulkAction( actions, data ) {\n\treturn useMemo( () => {\n\t\treturn data.some( ( item ) => {\n\t\t\treturn actions.some( ( action ) => {\n\t\t\t\treturn action.supportsBulk && action.isEligible( item );\n\t\t\t} );\n\t\t} );\n\t}, [ actions, data ] );\n}\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\n\tconst hasPossibleBulkAction = useSomeItemHasAPossibleBulkAction(\n\t\tactions,\n\t\tdata\n\t);\n\treturn (\n\t\t<div className=\"dataviews-wrapper\">\n\t\t\t<HStack\n\t\t\t\talignment=\"top\"\n\t\t\t\tjustify=\"start\"\n\t\t\t\tclassName=\"dataviews-filters__view-actions\"\n\t\t\t>\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{ 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<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{ [ LAYOUT_TABLE, LAYOUT_GRID ].includes( view.type ) &&\n\t\t\t\t\thasPossibleBulkAction && (\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<ViewActions\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\tsupportedLayouts={ supportedLayouts }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t\t<ViewComponent\n\t\t\t\tfields={ _fields }\n\t\t\t\tview={ view }\n\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\tactions={ actions }\n\t\t\t\tdata={ data }\n\t\t\t\tgetItemId={ getItemId }\n\t\t\t\tisLoading={ isLoading }\n\t\t\t\tonSelectionChange={ onSetSelection }\n\t\t\t\tonDetailsChange={ onDetailsChange }\n\t\t\t\tselection={ selection }\n\t\t\t\tdeferredRendering={ deferredRendering }\n\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t/>\n\t\t\t<Pagination\n\t\t\t\tview={ view }\n\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\tpaginationInfo={ paginationInfo }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}

package/build-module/reset-filters.js

@@ -16,6 +16,7 @@ export default function ResetFilter({
     __experimentalIsFocusable: true,
     size: "compact",
     variant: "tertiary",
+    className: "dataviews-filters__reset-button",
     onClick: () => {
       onChangeView({
         ...view,
@@ -24,6 +25,6 @@ export default function ResetFilter({
         filters: []
       });
     }
-  }, __('Reset filters'));
+  }, __('Reset'));
 }
 //# sourceMappingURL=reset-filters.js.map

package/build-module/reset-filters.js.map

@@ -1 +1 @@
-{"version":3,"names":["Button","__","ResetFilter","filters","view","onChangeView","isPrimary","field","some","_filter","isDisabled","search","value","undefined","createElement","disabled","__experimentalIsFocusable","size","variant","onClick","page"],"sources":["@wordpress/dataviews/src/reset-filters.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\nexport default function ResetFilter( { filters, view, onChangeView } ) {\n\tconst isPrimary = ( field ) =>\n\t\tfilters.some(\n\t\t\t( _filter ) => _filter.field === field && _filter.isPrimary\n\t\t);\n\tconst isDisabled =\n\t\t! view.search &&\n\t\t! view.filters?.some(\n\t\t\t( _filter ) =>\n\t\t\t\t_filter.value !== undefined || ! isPrimary( _filter.field )\n\t\t);\n\treturn (\n\t\t<Button\n\t\t\tdisabled={ isDisabled }\n\t\t\t__experimentalIsFocusable\n\t\t\tsize=\"compact\"\n\t\t\tvariant=\"tertiary\"\n\t\t\tonClick={ () => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tpage: 1,\n\t\t\t\t\tsearch: '',\n\t\t\t\t\tfilters: [],\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t{ __( 'Reset filters' ) }\n\t\t</Button>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,EAAE,QAAQ,iBAAiB;AAEpC,eAAe,SAASC,WAAWA,CAAE;EAAEC,OAAO;EAAEC,IAAI;EAAEC;AAAa,CAAC,EAAG;EACtE,MAAMC,SAAS,GAAKC,KAAK,IACxBJ,OAAO,CAACK,IAAI,CACTC,OAAO,IAAMA,OAAO,CAACF,KAAK,KAAKA,KAAK,IAAIE,OAAO,CAACH,SACnD,CAAC;EACF,MAAMI,UAAU,GACf,CAAEN,IAAI,CAACO,MAAM,IACb,CAAEP,IAAI,CAACD,OAAO,EAAEK,IAAI,CACjBC,OAAO,IACRA,OAAO,CAACG,KAAK,KAAKC,SAAS,IAAI,CAAEP,SAAS,CAAEG,OAAO,CAACF,KAAM,CAC5D,CAAC;EACF,OACCO,aAAA,CAACd,MAAM;IACNe,QAAQ,EAAGL,UAAY;IACvBM,yBAAyB;IACzBC,IAAI,EAAC,SAAS;IACdC,OAAO,EAAC,UAAU;IAClBC,OAAO,EAAGA,CAAA,KAAM;MACfd,YAAY,CAAE;QACb,GAAGD,IAAI;QACPgB,IAAI,EAAE,CAAC;QACPT,MAAM,EAAE,EAAE;QACVR,OAAO,EAAE;MACV,CAAE,CAAC;IACJ;EAAG,GAEDF,EAAE,CAAE,eAAgB,CACf,CAAC;AAEX"}
+{"version":3,"names":["Button","__","ResetFilter","filters","view","onChangeView","isPrimary","field","some","_filter","isDisabled","search","value","undefined","createElement","disabled","__experimentalIsFocusable","size","variant","className","onClick","page"],"sources":["@wordpress/dataviews/src/reset-filters.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\nexport default function ResetFilter( { filters, view, onChangeView } ) {\n\tconst isPrimary = ( field ) =>\n\t\tfilters.some(\n\t\t\t( _filter ) => _filter.field === field && _filter.isPrimary\n\t\t);\n\tconst isDisabled =\n\t\t! view.search &&\n\t\t! view.filters?.some(\n\t\t\t( _filter ) =>\n\t\t\t\t_filter.value !== undefined || ! isPrimary( _filter.field )\n\t\t);\n\treturn (\n\t\t<Button\n\t\t\tdisabled={ isDisabled }\n\t\t\t__experimentalIsFocusable\n\t\t\tsize=\"compact\"\n\t\t\tvariant=\"tertiary\"\n\t\t\tclassName=\"dataviews-filters__reset-button\"\n\t\t\tonClick={ () => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tpage: 1,\n\t\t\t\t\tsearch: '',\n\t\t\t\t\tfilters: [],\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t{ __( 'Reset' ) }\n\t\t</Button>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,EAAE,QAAQ,iBAAiB;AAEpC,eAAe,SAASC,WAAWA,CAAE;EAAEC,OAAO;EAAEC,IAAI;EAAEC;AAAa,CAAC,EAAG;EACtE,MAAMC,SAAS,GAAKC,KAAK,IACxBJ,OAAO,CAACK,IAAI,CACTC,OAAO,IAAMA,OAAO,CAACF,KAAK,KAAKA,KAAK,IAAIE,OAAO,CAACH,SACnD,CAAC;EACF,MAAMI,UAAU,GACf,CAAEN,IAAI,CAACO,MAAM,IACb,CAAEP,IAAI,CAACD,OAAO,EAAEK,IAAI,CACjBC,OAAO,IACRA,OAAO,CAACG,KAAK,KAAKC,SAAS,IAAI,CAAEP,SAAS,CAAEG,OAAO,CAACF,KAAM,CAC5D,CAAC;EACF,OACCO,aAAA,CAACd,MAAM;IACNe,QAAQ,EAAGL,UAAY;IACvBM,yBAAyB;IACzBC,IAAI,EAAC,SAAS;IACdC,OAAO,EAAC,UAAU;IAClBC,SAAS,EAAC,iCAAiC;IAC3CC,OAAO,EAAGA,CAAA,KAAM;MACff,YAAY,CAAE;QACb,GAAGD,IAAI;QACPiB,IAAI,EAAE,CAAC;QACPV,MAAM,EAAE,EAAE;QACVR,OAAO,EAAE;MACV,CAAE,CAAC;IACJ;EAAG,GAEDF,EAAE,CAAE,OAAQ,CACP,CAAC;AAEX"}

package/build-module/search-widget.js

@@ -9,11 +9,21 @@ import removeAccents from 'remove-accents';
 /**
  * WordPress dependencies
  */
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { useState, useMemo, useDeferredValue } from '@wordpress/element';
-import { VisuallyHidden, Icon } from '@wordpress/components';
+import { VisuallyHidden, Icon, privateApis as componentsPrivateApis } from '@wordpress/components';
 import { search } from '@wordpress/icons';
 import { SVG, Circle } from '@wordpress/primitives';
+
+/**
+ * Internal dependencies
+ */
+import { unlock } from './lock-unlock';
+const {
+  CompositeV2: Composite,
+  CompositeItemV2: CompositeItem,
+  useCompositeStoreV2: useCompositeStore
+} = unlock(componentsPrivateApis);
 const radioCheck = createElement(SVG, {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 24 24"
@@ -25,9 +35,78 @@ const radioCheck = createElement(SVG, {
 function normalizeSearchInput(input = '') {
   return removeAccents(input.trim().toLowerCase());
 }
-export default function SearchWidget({
+function ListBox({
+  view,
   filter,
+  onChangeView
+}) {
+  const compositeStore = useCompositeStore({
+    virtualFocus: true,
+    focusLoop: true,
+    // When we have no or just one operators, we can set the first item as active.
+    // We do that by passing `undefined` to `defaultActiveId`. Otherwise, we set it to `null`,
+    // so the first item is not selected, since the focus is on the operators control.
+    defaultActiveId: filter.operators?.length === 1 ? undefined : null
+  });
+  const selectedFilter = view.filters.find(_filter => _filter.field === filter.field);
+  const selectedValues = selectedFilter?.value;
+  return createElement(Composite, {
+    store: compositeStore,
+    role: "listbox",
+    className: "dataviews-search-widget-listbox",
+    "aria-label": sprintf( /* translators: List of items for a filter. 1: Filter name. e.g.: "List of: Author". */
+    __('List of: %1$s'), filter.name),
+    onFocusVisible: () => {
+      if (!compositeStore.getState().activeId) {
+        compositeStore.move(compositeStore.first());
+      }
+    },
+    render: createElement(Ariakit.CompositeTypeahead, {
+      store: compositeStore
+    })
+  }, filter.elements.map(element => createElement(Ariakit.CompositeHover, {
+    store: compositeStore,
+    key: element.value,
+    render: createElement(CompositeItem, {
+      render: createElement("div", {
+        "aria-label": element.label,
+        role: "option",
+        className: "dataviews-search-widget-listitem"
+      }),
+      onClick: () => {
+        const currentFilter = view.filters.find(_filter => _filter.field === filter.field);
+        const newFilters = currentFilter ? [...view.filters.map(_filter => {
+          if (_filter.field === filter.field) {
+            return {
+              ..._filter,
+              operator: currentFilter.operator || filter.operators[0],
+              value: element.value
+            };
+          }
+          return _filter;
+        })] : [...view.filters, {
+          field: filter.field,
+          operator: filter.operators[0],
+          value: element.value
+        }];
+        onChangeView({
+          ...view,
+          page: 1,
+          filters: newFilters
+        });
+      }
+    })
+  }, createElement("span", {
+    className: "dataviews-search-widget-listitem-check"
+  }, selectedValues === element.value && createElement(Icon, {
+    icon: radioCheck
+  })), createElement("span", null, element.label, !!element.description && createElement("span", {
+    className: "dataviews-search-widget-listitem-description"
+  }, element.description)))));
+}
+function ComboboxList({
   view,
+  filter,
   onChangeView
 }) {
   const [searchValue, setSearchValue] = useState('');
@@ -82,20 +161,26 @@ export default function SearchWidget({
     return createElement(Ariakit.ComboboxItem, {
       key: element.value,
       value: element.value,
-      className: "dataviews-search-widget-filter-combobox-item",
+      className: "dataviews-search-widget-listitem",
       hideOnClick: false,
       setValueOnClick: false,
       focusOnHover: true
     }, createElement("span", {
-      className: "dataviews-search-widget-filter-combobox-item-check"
+      className: "dataviews-search-widget-listitem-check"
     }, selectedValues === element.value && createElement(Icon, {
       icon: radioCheck
     })), createElement("span", null, createElement(Ariakit.ComboboxItemValue, {
       className: "dataviews-search-widget-filter-combobox-item-value",
       value: element.label
     }), !!element.description && createElement("span", {
-      className: "dataviews-search-widget-filter-combobox-item-description"
+      className: "dataviews-search-widget-listitem-description"
     }, element.description)));
   }), !matches.length && createElement("p", null, __('No results found'))));
 }
+export default function SearchWidget(props) {
+  const Widget = props.filter.elements.length > 10 ? ComboboxList : ListBox;
+  return createElement(Widget, {
+    ...props
+  });
+}
 //# sourceMappingURL=search-widget.js.map

package/build-module/search-widget.js.map

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","removeAccents","__","useState","useMemo","useDeferredValue","VisuallyHidden","Icon","search","SVG","Circle","radioCheck","createElement","xmlns","viewBox","cx","cy","r","normalizeSearchInput","input","trim","toLowerCase","SearchWidget","filter","view","onChangeView","searchValue","setSearchValue","deferredSearchValue","selectedFilter","filters","find","_filter","field","selectedValues","value","matches","normalizedSearch","elements","item","label","includes","ComboboxProvider","setSelectedValue","currentFilter","newFilters","map","operator","operators","page","setValue","className","ComboboxLabel","render","Combobox","autoSelect","placeholder","icon","ComboboxList","alwaysVisible","element","ComboboxItem","key","hideOnClick","setValueOnClick","focusOnHover","ComboboxItemValue","description","length"],"sources":["@wordpress/dataviews/src/search-widget.js"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState, useMemo, useDeferredValue } from '@wordpress/element';\nimport { VisuallyHidden, Icon } from '@wordpress/components';\nimport { search } from '@wordpress/icons';\nimport { SVG, Circle } from '@wordpress/primitives';\n\nconst radioCheck = (\n\t<SVG xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n\t\t<Circle cx={ 12 } cy={ 12 } r={ 3 }></Circle>\n\t</SVG>\n);\n\nfunction normalizeSearchInput( input = '' ) {\n\treturn removeAccents( input.trim().toLowerCase() );\n}\n\nexport default function SearchWidget( { filter, view, onChangeView } ) {\n\tconst [ searchValue, setSearchValue ] = useState( '' );\n\tconst deferredSearchValue = useDeferredValue( searchValue );\n\tconst selectedFilter = view.filters.find(\n\t\t( _filter ) => _filter.field === filter.field\n\t);\n\tconst selectedValues = selectedFilter?.value;\n\tconst matches = useMemo( () => {\n\t\tconst normalizedSearch = normalizeSearchInput( deferredSearchValue );\n\t\treturn filter.elements.filter( ( item ) =>\n\t\t\tnormalizeSearchInput( item.label ).includes( normalizedSearch )\n\t\t);\n\t}, [ filter.elements, deferredSearchValue ] );\n\treturn (\n\t\t<Ariakit.ComboboxProvider\n\t\t\tvalue={ searchValue }\n\t\t\tsetSelectedValue={ ( value ) => {\n\t\t\t\tconst currentFilter = view.filters.find(\n\t\t\t\t\t( _filter ) => _filter.field === filter.field\n\t\t\t\t);\n\t\t\t\tconst newFilters = currentFilter\n\t\t\t\t\t? [\n\t\t\t\t\t\t\t...view.filters.map( ( _filter ) => {\n\t\t\t\t\t\t\t\tif ( _filter.field === filter.field ) {\n\t\t\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t\t\t..._filter,\n\t\t\t\t\t\t\t\t\t\toperator:\n\t\t\t\t\t\t\t\t\t\t\tcurrentFilter.operator ||\n\t\t\t\t\t\t\t\t\t\t\tfilter.operators[ 0 ],\n\t\t\t\t\t\t\t\t\t\tvalue,\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\treturn _filter;\n\t\t\t\t\t\t\t} ),\n\t\t\t\t\t  ]\n\t\t\t\t\t: [\n\t\t\t\t\t\t\t...view.filters,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tfield: filter.field,\n\t\t\t\t\t\t\t\toperator: filter.operators[ 0 ],\n\t\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t  ];\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tpage: 1,\n\t\t\t\t\tfilters: newFilters,\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tsetValue={ setSearchValue }\n\t\t>\n\t\t\t<div className=\"dataviews-search-widget-filter-combobox__wrapper\">\n\t\t\t\t<Ariakit.ComboboxLabel render={ <VisuallyHidden /> }>\n\t\t\t\t\t{ __( 'Search items' ) }\n\t\t\t\t</Ariakit.ComboboxLabel>\n\t\t\t\t<Ariakit.Combobox\n\t\t\t\t\tautoSelect=\"always\"\n\t\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t\t\tclassName=\"dataviews-search-widget-filter-combobox__input\"\n\t\t\t\t/>\n\t\t\t\t<div className=\"dataviews-search-widget-filter-combobox__icon\">\n\t\t\t\t\t<Icon icon={ search } />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<Ariakit.ComboboxList\n\t\t\t\tclassName=\"dataviews-search-widget-filter-combobox-list\"\n\t\t\t\talwaysVisible\n\t\t\t>\n\t\t\t\t{ matches.map( ( element ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Ariakit.ComboboxItem\n\t\t\t\t\t\t\tkey={ element.value }\n\t\t\t\t\t\t\tvalue={ element.value }\n\t\t\t\t\t\t\tclassName=\"dataviews-search-widget-filter-combobox-item\"\n\t\t\t\t\t\t\thideOnClick={ false }\n\t\t\t\t\t\t\tsetValueOnClick={ false }\n\t\t\t\t\t\t\tfocusOnHover\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span className=\"dataviews-search-widget-filter-combobox-item-check\">\n\t\t\t\t\t\t\t\t{ selectedValues === element.value && (\n\t\t\t\t\t\t\t\t\t<Icon icon={ radioCheck } />\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t<Ariakit.ComboboxItemValue\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-search-widget-filter-combobox-item-value\"\n\t\t\t\t\t\t\t\t\tvalue={ element.label }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{ !! element.description && (\n\t\t\t\t\t\t\t\t\t<span className=\"dataviews-search-widget-filter-combobox-item-description\">\n\t\t\t\t\t\t\t\t\t\t{ element.description }\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</span>\n\t\t\t\t\t\t</Ariakit.ComboboxItem>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t{ ! matches.length && <p>{ __( 'No results found' ) }</p> }\n\t\t\t</Ariakit.ComboboxList>\n\t\t</Ariakit.ComboboxProvider>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["Ariakit","removeAccents","__","sprintf","useState","useMemo","useDeferredValue","VisuallyHidden","Icon","privateApis","componentsPrivateApis","search","SVG","Circle","unlock","CompositeV2","Composite","CompositeItemV2","CompositeItem","useCompositeStoreV2","useCompositeStore","radioCheck","createElement","xmlns","viewBox","cx","cy","r","normalizeSearchInput","input","trim","toLowerCase","ListBox","view","filter","onChangeView","compositeStore","virtualFocus","focusLoop","defaultActiveId","operators","length","undefined","selectedFilter","filters","find","_filter","field","selectedValues","value","store","role","className","name","onFocusVisible","getState","activeId","move","first","render","CompositeTypeahead","elements","map","element","CompositeHover","key","label","onClick","currentFilter","newFilters","operator","page","icon","description","ComboboxList","searchValue","setSearchValue","deferredSearchValue","matches","normalizedSearch","item","includes","ComboboxProvider","setSelectedValue","setValue","ComboboxLabel","Combobox","autoSelect","placeholder","alwaysVisible","ComboboxItem","hideOnClick","setValueOnClick","focusOnHover","ComboboxItemValue","SearchWidget","props","Widget"],"sources":["@wordpress/dataviews/src/search-widget.js"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useState, useMemo, useDeferredValue } from '@wordpress/element';\nimport {\n\tVisuallyHidden,\n\tIcon,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { search } from '@wordpress/icons';\nimport { SVG, Circle } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\n\nconst {\n\tCompositeV2: Composite,\n\tCompositeItemV2: CompositeItem,\n\tuseCompositeStoreV2: useCompositeStore,\n} = unlock( componentsPrivateApis );\n\nconst radioCheck = (\n\t<SVG xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n\t\t<Circle cx={ 12 } cy={ 12 } r={ 3 }></Circle>\n\t</SVG>\n);\n\nfunction normalizeSearchInput( input = '' ) {\n\treturn removeAccents( input.trim().toLowerCase() );\n}\n\nfunction ListBox( { view, filter, onChangeView } ) {\n\tconst compositeStore = useCompositeStore( {\n\t\tvirtualFocus: true,\n\t\tfocusLoop: true,\n\t\t// When we have no or just one operators, we can set the first item as active.\n\t\t// We do that by passing `undefined` to `defaultActiveId`. Otherwise, we set it to `null`,\n\t\t// so the first item is not selected, since the focus is on the operators control.\n\t\tdefaultActiveId: filter.operators?.length === 1 ? undefined : null,\n\t} );\n\tconst selectedFilter = view.filters.find(\n\t\t( _filter ) => _filter.field === filter.field\n\t);\n\tconst selectedValues = selectedFilter?.value;\n\treturn (\n\t\t<Composite\n\t\t\tstore={ compositeStore }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"dataviews-search-widget-listbox\"\n\t\t\taria-label={ sprintf(\n\t\t\t\t/* translators: List of items for a filter. 1: Filter name. e.g.: \"List of: Author\". */\n\t\t\t\t__( 'List of: %1$s' ),\n\t\t\t\tfilter.name\n\t\t\t) }\n\t\t\tonFocusVisible={ () => {\n\t\t\t\tif ( ! compositeStore.getState().activeId ) {\n\t\t\t\t\tcompositeStore.move( compositeStore.first() );\n\t\t\t\t}\n\t\t\t} }\n\t\t\trender={ <Ariakit.CompositeTypeahead store={ compositeStore } /> }\n\t\t>\n\t\t\t{ filter.elements.map( ( element ) => (\n\t\t\t\t<Ariakit.CompositeHover\n\t\t\t\t\tstore={ compositeStore }\n\t\t\t\t\tkey={ element.value }\n\t\t\t\t\trender={\n\t\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\taria-label={ element.label }\n\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-search-widget-listitem\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tconst currentFilter = view.filters.find(\n\t\t\t\t\t\t\t\t\t( _filter ) =>\n\t\t\t\t\t\t\t\t\t\t_filter.field === filter.field\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tconst newFilters = currentFilter\n\t\t\t\t\t\t\t\t\t? [\n\t\t\t\t\t\t\t\t\t\t\t...view.filters.map(\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\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t_filter.field ===\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfilter.field\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\treturn {\n\t\t\t\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\t\t\t\toperator:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcurrentFilter.operator ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfilter\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t.operators[ 0 ],\n\t\t\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\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\treturn _filter;\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  ]\n\t\t\t\t\t\t\t\t\t: [\n\t\t\t\t\t\t\t\t\t\t\t...view.filters,\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: filter.operators[ 0 ],\n\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},\n\t\t\t\t\t\t\t\t\t  ];\n\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\t\tfilters: newFilters,\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>\n\t\t\t\t\t<span className=\"dataviews-search-widget-listitem-check\">\n\t\t\t\t\t\t{ selectedValues === element.value && (\n\t\t\t\t\t\t\t<Icon icon={ radioCheck } />\n\t\t\t\t\t\t) }\n\t\t\t\t\t</span>\n\t\t\t\t\t<span>\n\t\t\t\t\t\t{ element.label }\n\t\t\t\t\t\t{ !! element.description && (\n\t\t\t\t\t\t\t<span className=\"dataviews-search-widget-listitem-description\">\n\t\t\t\t\t\t\t\t{ element.description }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</span>\n\t\t\t\t</Ariakit.CompositeHover>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\nfunction ComboboxList( { view, filter, onChangeView } ) {\n\tconst [ searchValue, setSearchValue ] = useState( '' );\n\tconst deferredSearchValue = useDeferredValue( searchValue );\n\tconst selectedFilter = view.filters.find(\n\t\t( _filter ) => _filter.field === filter.field\n\t);\n\tconst selectedValues = selectedFilter?.value;\n\tconst matches = useMemo( () => {\n\t\tconst normalizedSearch = normalizeSearchInput( deferredSearchValue );\n\t\treturn filter.elements.filter( ( item ) =>\n\t\t\tnormalizeSearchInput( item.label ).includes( normalizedSearch )\n\t\t);\n\t}, [ filter.elements, deferredSearchValue ] );\n\treturn (\n\t\t<Ariakit.ComboboxProvider\n\t\t\tvalue={ searchValue }\n\t\t\tsetSelectedValue={ ( value ) => {\n\t\t\t\tconst currentFilter = view.filters.find(\n\t\t\t\t\t( _filter ) => _filter.field === filter.field\n\t\t\t\t);\n\t\t\t\tconst newFilters = currentFilter\n\t\t\t\t\t? [\n\t\t\t\t\t\t\t...view.filters.map( ( _filter ) => {\n\t\t\t\t\t\t\t\tif ( _filter.field === filter.field ) {\n\t\t\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t\t\t..._filter,\n\t\t\t\t\t\t\t\t\t\toperator:\n\t\t\t\t\t\t\t\t\t\t\tcurrentFilter.operator ||\n\t\t\t\t\t\t\t\t\t\t\tfilter.operators[ 0 ],\n\t\t\t\t\t\t\t\t\t\tvalue,\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\treturn _filter;\n\t\t\t\t\t\t\t} ),\n\t\t\t\t\t  ]\n\t\t\t\t\t: [\n\t\t\t\t\t\t\t...view.filters,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tfield: filter.field,\n\t\t\t\t\t\t\t\toperator: filter.operators[ 0 ],\n\t\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t  ];\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tpage: 1,\n\t\t\t\t\tfilters: newFilters,\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tsetValue={ setSearchValue }\n\t\t>\n\t\t\t<div className=\"dataviews-search-widget-filter-combobox__wrapper\">\n\t\t\t\t<Ariakit.ComboboxLabel render={ <VisuallyHidden /> }>\n\t\t\t\t\t{ __( 'Search items' ) }\n\t\t\t\t</Ariakit.ComboboxLabel>\n\t\t\t\t<Ariakit.Combobox\n\t\t\t\t\tautoSelect=\"always\"\n\t\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t\t\tclassName=\"dataviews-search-widget-filter-combobox__input\"\n\t\t\t\t/>\n\t\t\t\t<div className=\"dataviews-search-widget-filter-combobox__icon\">\n\t\t\t\t\t<Icon icon={ search } />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<Ariakit.ComboboxList\n\t\t\t\tclassName=\"dataviews-search-widget-filter-combobox-list\"\n\t\t\t\talwaysVisible\n\t\t\t>\n\t\t\t\t{ matches.map( ( element ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Ariakit.ComboboxItem\n\t\t\t\t\t\t\tkey={ element.value }\n\t\t\t\t\t\t\tvalue={ element.value }\n\t\t\t\t\t\t\tclassName=\"dataviews-search-widget-listitem\"\n\t\t\t\t\t\t\thideOnClick={ false }\n\t\t\t\t\t\t\tsetValueOnClick={ false }\n\t\t\t\t\t\t\tfocusOnHover\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span className=\"dataviews-search-widget-listitem-check\">\n\t\t\t\t\t\t\t\t{ selectedValues === element.value && (\n\t\t\t\t\t\t\t\t\t<Icon icon={ radioCheck } />\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t<Ariakit.ComboboxItemValue\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-search-widget-filter-combobox-item-value\"\n\t\t\t\t\t\t\t\t\tvalue={ element.label }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{ !! element.description && (\n\t\t\t\t\t\t\t\t\t<span className=\"dataviews-search-widget-listitem-description\">\n\t\t\t\t\t\t\t\t\t\t{ element.description }\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</span>\n\t\t\t\t\t\t</Ariakit.ComboboxItem>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t{ ! matches.length && <p>{ __( 'No results found' ) }</p> }\n\t\t\t</Ariakit.ComboboxList>\n\t\t</Ariakit.ComboboxProvider>\n\t);\n}\n\nexport default function SearchWidget( props ) {\n\tconst Widget = props.filter.elements.length > 10 ? ComboboxList : ListBox;\n\treturn <Widget { ...props } />;\n}\n"],"mappings":"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"}

package/build-module/view-actions.js.map

@@ -1 +1 @@
-{"version":3,"names":["Button","privateApis","componentsPrivateApis","__","memo","settings","unlock","VIEW_LAYOUTS","SORTING_DIRECTIONS","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuRadioItemV2","DropdownMenuRadioItem","DropdownMenuCheckboxItemV2","DropdownMenuCheckboxItem","DropdownMenuItemLabelV2","DropdownMenuItemLabel","ViewTypeMenu","view","onChangeView","supportedLayouts","_availableViews","filter","_view","includes","type","length","activeView","find","v","createElement","trigger","suffix","label","map","availableView","key","value","name","checked","hideOnClick","onChange","e","target","PAGE_SIZE_VALUES","PageSizeMenu","perPage","size","page","FieldsVisibilityMenu","fields","hidableFields","field","enableHiding","id","layout","mediaField","hiddenFields","header","SortMenu","sortableFields","enableSorting","currentSortedField","sort","sortedDirection","direction","style","minWidth","Object","entries","info","isChecked","undefined","ViewActions","icon"],"sources":["@wordpress/dataviews/src/view-actions.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { memo } from '@wordpress/element';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\nimport { VIEW_LAYOUTS, SORTING_DIRECTIONS } from './constants';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuRadioItemV2: DropdownMenuRadioItem,\n\tDropdownMenuCheckboxItemV2: DropdownMenuCheckboxItem,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n} = unlock( componentsPrivateApis );\n\nfunction ViewTypeMenu( { view, onChangeView, supportedLayouts } ) {\n\tlet _availableViews = VIEW_LAYOUTS;\n\tif ( supportedLayouts ) {\n\t\t_availableViews = _availableViews.filter( ( _view ) =>\n\t\t\tsupportedLayouts.includes( _view.type )\n\t\t);\n\t}\n\tif ( _availableViews.length === 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = _availableViews.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">{ activeView.label }</span>\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{ __( 'Layout' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ _availableViews.map( ( availableView ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ availableView.type }\n\t\t\t\t\t\tvalue={ availableView.type }\n\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\tchecked={ availableView.type === view.type }\n\t\t\t\t\t\thideOnClick={ true }\n\t\t\t\t\t\tonChange={ ( e ) => {\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\ttype: e.target.value,\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{ availableView.label }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nconst PAGE_SIZE_VALUES = [ 10, 20, 50, 100 ];\nfunction PageSizeMenu( { view, onChangeView } ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={ <span aria-hidden=\"true\">{ view.perPage }</span> }\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Items per page' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ PAGE_SIZE_VALUES.map( ( size ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ size }\n\t\t\t\t\t\tvalue={ size }\n\t\t\t\t\t\tname=\"view-actions-page-size\"\n\t\t\t\t\t\tchecked={ view.perPage === size }\n\t\t\t\t\t\tonChange={ () => {\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\t// `e.target.value` holds the same value as `size` but as a string,\n\t\t\t\t\t\t\t\t// so we use `size` directly to avoid parsing to int.\n\t\t\t\t\t\t\t\tperPage: size,\n\t\t\t\t\t\t\t\tpage: 1,\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>{ size }</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction FieldsVisibilityMenu( { view, onChangeView, fields } ) {\n\tconst hidableFields = fields.filter(\n\t\t( field ) =>\n\t\t\tfield.enableHiding !== false && field.id !== view.layout.mediaField\n\t);\n\tif ( ! hidableFields?.length ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Fields' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ hidableFields?.map( ( field ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuCheckboxItem\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\tvalue={ field.id }\n\t\t\t\t\t\tchecked={ ! view.hiddenFields?.includes( field.id ) }\n\t\t\t\t\t\tonChange={ () => {\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\thiddenFields: view.hiddenFields?.includes(\n\t\t\t\t\t\t\t\t\tfield.id\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t? view.hiddenFields.filter(\n\t\t\t\t\t\t\t\t\t\t\t( id ) => id !== field.id\n\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\t...( view.hiddenFields || [] ),\n\t\t\t\t\t\t\t\t\t\t\tfield.id,\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} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuCheckboxItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction SortMenu( { fields, view, onChangeView } ) {\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( ! sortableFields?.length ) {\n\t\treturn null;\n\t}\n\tconst currentSortedField = fields.find(\n\t\t( field ) => field.id === view.sort?.field\n\t);\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t{ currentSortedField?.header }\n\t\t\t\t\t\t</span>\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{ __( 'Sort by' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ sortableFields?.map( ( field ) => {\n\t\t\t\tconst sortedDirection = view.sort?.direction;\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t{ field.header }\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\tstyle={ {\n\t\t\t\t\t\t\tminWidth: '220px',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ Object.entries( SORTING_DIRECTIONS ).map(\n\t\t\t\t\t\t\t( [ direction, info ] ) => {\n\t\t\t\t\t\t\t\tconst isChecked =\n\t\t\t\t\t\t\t\t\tcurrentSortedField !== undefined &&\n\t\t\t\t\t\t\t\t\tsortedDirection === direction &&\n\t\t\t\t\t\t\t\t\tfield.id === currentSortedField.id;\n\n\t\t\t\t\t\t\t\tconst value = `${ field.id }-${ direction }`;\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\t\t\t\t\t// All sorting radio items share the same name, so that\n\t\t\t\t\t\t\t\t\t\t// selecting a sorting option automatically deselects the\n\t\t\t\t\t\t\t\t\t\t// previously selected one, even if it is displayed in\n\t\t\t\t\t\t\t\t\t\t// another submenu. The field and direction are passed via\n\t\t\t\t\t\t\t\t\t\t// the `value` prop.\n\t\t\t\t\t\t\t\t\t\tname=\"view-actions-sorting\"\n\t\t\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\t\t\tchecked={ isChecked }\n\t\t\t\t\t\t\t\t\t\tonChange={ () => {\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\tsort: {\n\t\t\t\t\t\t\t\t\t\t\t\t\tfield: field.id,\n\t\t\t\t\t\t\t\t\t\t\t\t\tdirection,\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{ info.label }\n\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t</DropdownMenuRadioItem>\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</DropdownMenu>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nconst ViewActions = memo( function ViewActions( {\n\tfields,\n\tview,\n\tonChangeView,\n\tsupportedLayouts,\n} ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\ticon={ settings }\n\t\t\t\t\tlabel={ __( 'View options' ) }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<DropdownMenuGroup>\n\t\t\t\t<ViewTypeMenu\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\tsupportedLayouts={ supportedLayouts }\n\t\t\t\t/>\n\t\t\t\t<SortMenu\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/>\n\t\t\t\t<FieldsVisibilityMenu\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/>\n\t\t\t\t<PageSizeMenu view={ view } onChangeView={ onChangeView } />\n\t\t\t</DropdownMenuGroup>\n\t\t</DropdownMenu>\n\t);\n} );\n\nexport default ViewActions;\n"],"mappings":"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"}
+{"version":3,"names":["Button","privateApis","componentsPrivateApis","__","memo","settings","unlock","VIEW_LAYOUTS","SORTING_DIRECTIONS","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuRadioItemV2","DropdownMenuRadioItem","DropdownMenuCheckboxItemV2","DropdownMenuCheckboxItem","DropdownMenuItemLabelV2","DropdownMenuItemLabel","ViewTypeMenu","view","onChangeView","supportedLayouts","_availableViews","filter","_view","includes","type","length","activeView","find","v","createElement","trigger","suffix","label","map","availableView","key","value","name","checked","hideOnClick","onChange","e","target","PAGE_SIZE_VALUES","PageSizeMenu","perPage","size","page","FieldsVisibilityMenu","fields","hidableFields","field","enableHiding","id","layout","mediaField","hiddenFields","header","SortMenu","sortableFields","enableSorting","currentSortedField","sort","sortedDirection","direction","style","minWidth","Object","entries","info","isChecked","undefined","ViewActions","icon"],"sources":["@wordpress/dataviews/src/view-actions.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { memo } from '@wordpress/element';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\nimport { VIEW_LAYOUTS, SORTING_DIRECTIONS } from './constants';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuRadioItemV2: DropdownMenuRadioItem,\n\tDropdownMenuCheckboxItemV2: DropdownMenuCheckboxItem,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n} = unlock( componentsPrivateApis );\n\nfunction ViewTypeMenu( { view, onChangeView, supportedLayouts } ) {\n\tlet _availableViews = VIEW_LAYOUTS;\n\tif ( supportedLayouts ) {\n\t\t_availableViews = _availableViews.filter( ( _view ) =>\n\t\t\tsupportedLayouts.includes( _view.type )\n\t\t);\n\t}\n\tif ( _availableViews.length === 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = _availableViews.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">{ activeView.label }</span>\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{ __( 'Layout' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ _availableViews.map( ( availableView ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ availableView.type }\n\t\t\t\t\t\tvalue={ availableView.type }\n\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\tchecked={ availableView.type === view.type }\n\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\tonChange={ ( e ) => {\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\ttype: e.target.value,\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{ availableView.label }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nconst PAGE_SIZE_VALUES = [ 10, 20, 50, 100 ];\nfunction PageSizeMenu( { view, onChangeView } ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={ <span aria-hidden=\"true\">{ view.perPage }</span> }\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Items per page' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ PAGE_SIZE_VALUES.map( ( size ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ size }\n\t\t\t\t\t\tvalue={ size }\n\t\t\t\t\t\tname=\"view-actions-page-size\"\n\t\t\t\t\t\tchecked={ view.perPage === size }\n\t\t\t\t\t\tonChange={ () => {\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\t// `e.target.value` holds the same value as `size` but as a string,\n\t\t\t\t\t\t\t\t// so we use `size` directly to avoid parsing to int.\n\t\t\t\t\t\t\t\tperPage: size,\n\t\t\t\t\t\t\t\tpage: 1,\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>{ size }</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction FieldsVisibilityMenu( { view, onChangeView, fields } ) {\n\tconst hidableFields = fields.filter(\n\t\t( field ) =>\n\t\t\tfield.enableHiding !== false && field.id !== view.layout.mediaField\n\t);\n\tif ( ! hidableFields?.length ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Fields' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ hidableFields?.map( ( field ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuCheckboxItem\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\tvalue={ field.id }\n\t\t\t\t\t\tchecked={ ! view.hiddenFields?.includes( field.id ) }\n\t\t\t\t\t\tonChange={ () => {\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\thiddenFields: view.hiddenFields?.includes(\n\t\t\t\t\t\t\t\t\tfield.id\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t? view.hiddenFields.filter(\n\t\t\t\t\t\t\t\t\t\t\t( id ) => id !== field.id\n\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\t...( view.hiddenFields || [] ),\n\t\t\t\t\t\t\t\t\t\t\tfield.id,\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} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuCheckboxItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction SortMenu( { fields, view, onChangeView } ) {\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( ! sortableFields?.length ) {\n\t\treturn null;\n\t}\n\tconst currentSortedField = fields.find(\n\t\t( field ) => field.id === view.sort?.field\n\t);\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t{ currentSortedField?.header }\n\t\t\t\t\t\t</span>\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{ __( 'Sort by' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ sortableFields?.map( ( field ) => {\n\t\t\t\tconst sortedDirection = view.sort?.direction;\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t{ field.header }\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\tstyle={ {\n\t\t\t\t\t\t\tminWidth: '220px',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ Object.entries( SORTING_DIRECTIONS ).map(\n\t\t\t\t\t\t\t( [ direction, info ] ) => {\n\t\t\t\t\t\t\t\tconst isChecked =\n\t\t\t\t\t\t\t\t\tcurrentSortedField !== undefined &&\n\t\t\t\t\t\t\t\t\tsortedDirection === direction &&\n\t\t\t\t\t\t\t\t\tfield.id === currentSortedField.id;\n\n\t\t\t\t\t\t\t\tconst value = `${ field.id }-${ direction }`;\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\t\t\t\t\t// All sorting radio items share the same name, so that\n\t\t\t\t\t\t\t\t\t\t// selecting a sorting option automatically deselects the\n\t\t\t\t\t\t\t\t\t\t// previously selected one, even if it is displayed in\n\t\t\t\t\t\t\t\t\t\t// another submenu. The field and direction are passed via\n\t\t\t\t\t\t\t\t\t\t// the `value` prop.\n\t\t\t\t\t\t\t\t\t\tname=\"view-actions-sorting\"\n\t\t\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\t\t\tchecked={ isChecked }\n\t\t\t\t\t\t\t\t\t\tonChange={ () => {\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\tsort: {\n\t\t\t\t\t\t\t\t\t\t\t\t\tfield: field.id,\n\t\t\t\t\t\t\t\t\t\t\t\t\tdirection,\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{ info.label }\n\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t</DropdownMenuRadioItem>\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</DropdownMenu>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nconst ViewActions = memo( function ViewActions( {\n\tfields,\n\tview,\n\tonChangeView,\n\tsupportedLayouts,\n} ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\ticon={ settings }\n\t\t\t\t\tlabel={ __( 'View options' ) }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<DropdownMenuGroup>\n\t\t\t\t<ViewTypeMenu\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\tsupportedLayouts={ supportedLayouts }\n\t\t\t\t/>\n\t\t\t\t<SortMenu\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/>\n\t\t\t\t<FieldsVisibilityMenu\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/>\n\t\t\t\t<PageSizeMenu view={ view } onChangeView={ onChangeView } />\n\t\t\t</DropdownMenuGroup>\n\t\t</DropdownMenu>\n\t);\n} );\n\nexport default ViewActions;\n"],"mappings":"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"}

package/build-module/view-grid.js

@@ -7,10 +7,9 @@ import classnames from 'classnames';
 /**
  * WordPress dependencies
  */
-import { __experimentalGrid as Grid, __experimentalHStack as HStack, __experimentalVStack as VStack, Tooltip } from '@wordpress/components';
+import { __experimentalGrid as Grid, __experimentalHStack as HStack, __experimentalVStack as VStack, Tooltip, Spinner } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useAsyncList } from '@wordpress/compose';
-import { useState } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -29,7 +28,6 @@ function GridItem({
   primaryField,
   visibleFields
 }) {
-  const [hasNoPointerEvents, setHasNoPointerEvents] = useState(false);
   const hasBulkAction = useHasAPossibleBulkAction(actions, item);
   const id = getItemId(item);
   const isSelected = selection.includes(id);
@@ -37,12 +35,12 @@ function GridItem({
     spacing: 0,
     key: id,
     className: classnames('dataviews-view-grid__card', {
-      'is-selected': hasBulkAction && isSelected,
-      'has-no-pointer-events': hasNoPointerEvents
+      'is-selected': hasBulkAction && isSelected
     }),
-    onMouseDown: event => {
+    onClickCapture: event => {
       if (hasBulkAction && (event.ctrlKey || event.metaKey)) {
-        setHasNoPointerEvents(true);
+        event.stopPropagation();
+        event.preventDefault();
         if (!isSelected) {
           onSelectionChange(data.filter(_item => {
             const itemId = getItemId?.(_item);
@@ -55,11 +53,6 @@ function GridItem({
           }));
         }
       }
-    },
-    onClick: () => {
-      if (hasNoPointerEvents) {
-        setHasNoPointerEvents(false);
-      }
     }
   }, createElement("div", {
     className: "dataviews-view-grid__media"
@@ -150,6 +143,6 @@ export default function ViewGrid({
       'dataviews-loading': isLoading,
       'dataviews-no-results': !isLoading
     })
-  }, createElement("p", null, isLoading ? __('Loading…') : __('No results'))));
+  }, createElement("p", null, isLoading ? createElement(Spinner, null) : __('No results'))));
 }
 //# sourceMappingURL=view-grid.js.map

package/build-module/view-grid.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","__experimentalGrid","Grid","__experimentalHStack","HStack","__experimentalVStack","VStack","Tooltip","__","useAsyncList","useState","ItemActions","SingleSelectionCheckbox","useHasAPossibleBulkAction","GridItem","selection","data","onSelectionChange","getItemId","item","actions","mediaField","primaryField","visibleFields","hasNoPointerEvents","setHasNoPointerEvents","hasBulkAction","id","isSelected","includes","createElement","spacing","key","className","onMouseDown","event","ctrlKey","metaKey","filter","_item","itemId","onClick","render","justify","disabled","isCompact","map","field","renderedValue","text","header","placement","ViewGrid","fields","view","isLoading","deferredRendering","find","layout","hiddenFields","shownData","step","usedData","hasData","length","Fragment","gap","columns","alignment"],"sources":["@wordpress/dataviews/src/view-grid.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tTooltip,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useAsyncList } from '@wordpress/compose';\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\nimport SingleSelectionCheckbox from './single-selection-checkbox';\n\nimport { useHasAPossibleBulkAction } from './bulk-actions';\n\nfunction GridItem( {\n\tselection,\n\tdata,\n\tonSelectionChange,\n\tgetItemId,\n\titem,\n\tactions,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n} ) {\n\tconst [ hasNoPointerEvents, setHasNoPointerEvents ] = useState( false );\n\tconst hasBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst id = getItemId( item );\n\tconst isSelected = selection.includes( id );\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 0 }\n\t\t\tkey={ id }\n\t\t\tclassName={ classnames( 'dataviews-view-grid__card', {\n\t\t\t\t'is-selected': hasBulkAction && isSelected,\n\t\t\t\t'has-no-pointer-events': hasNoPointerEvents,\n\t\t\t} ) }\n\t\t\tonMouseDown={ ( event ) => {\n\t\t\t\tif ( hasBulkAction && ( event.ctrlKey || event.metaKey ) ) {\n\t\t\t\t\tsetHasNoPointerEvents( true );\n\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId === id ||\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\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} else {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId !== id &&\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\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}\n\t\t\t} }\n\t\t\tonClick={ () => {\n\t\t\t\tif ( hasNoPointerEvents ) {\n\t\t\t\t\tsetHasNoPointerEvents( false );\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t{ mediaField?.render( { item } ) }\n\t\t\t</div>\n\t\t\t<HStack\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews-view-grid__title-actions\"\n\t\t\t>\n\t\t\t\t<SingleSelectionCheckbox\n\t\t\t\t\tid={ id }\n\t\t\t\t\titem={ item }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\tdisabled={ ! hasBulkAction }\n\t\t\t\t/>\n\t\t\t\t<HStack className=\"dataviews-view-grid__primary-field\">\n\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t</HStack>\n\t\t\t\t<ItemActions item={ item } actions={ actions } isCompact />\n\t\t\t</HStack>\n\t\t\t<VStack className=\"dataviews-view-grid__fields\" spacing={ 3 }>\n\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\titem,\n\t\t\t\t\t} );\n\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field\"\n\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Tooltip text={ field.header } placement=\"left\">\n\t\t\t\t\t\t\t\t<div className=\"dataviews-view-grid__field-value\">\n\t\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</VStack>\n\t\t</VStack>\n\t);\n}\n\nexport default function ViewGrid( {\n\tdata,\n\tfields,\n\tview,\n\tactions,\n\tisLoading,\n\tgetItemId,\n\tdeferredRendering,\n\tselection,\n\tonSelectionChange,\n} ) {\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst visibleFields = fields.filter(\n\t\t( field ) =>\n\t\t\t! view.hiddenFields.includes( field.id ) &&\n\t\t\t! [ view.layout.mediaField, view.layout.primaryField ].includes(\n\t\t\t\tfield.id\n\t\t\t)\n\t);\n\tconst shownData = useAsyncList( data, { step: 3 } );\n\tconst usedData = deferredRendering ? shownData : data;\n\tconst hasData = !! usedData?.length;\n\treturn (\n\t\t<>\n\t\t\t{ hasData && (\n\t\t\t\t<Grid\n\t\t\t\t\tgap={ 6 }\n\t\t\t\t\tcolumns={ 2 }\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tclassName=\"dataviews-view-grid\"\n\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t>\n\t\t\t\t\t{ usedData.map( ( item ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\t\tvisibleFields={ visibleFields }\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</Grid>\n\t\t\t) }\n\t\t\t{ ! hasData && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames( {\n\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<p>{ isLoading ? __( 'Loading…' ) : __( 'No results' ) }</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["classnames","__experimentalGrid","Grid","__experimentalHStack","HStack","__experimentalVStack","VStack","Tooltip","Spinner","__","useAsyncList","ItemActions","SingleSelectionCheckbox","useHasAPossibleBulkAction","GridItem","selection","data","onSelectionChange","getItemId","item","actions","mediaField","primaryField","visibleFields","hasBulkAction","id","isSelected","includes","createElement","spacing","key","className","onClickCapture","event","ctrlKey","metaKey","stopPropagation","preventDefault","filter","_item","itemId","render","justify","disabled","isCompact","map","field","renderedValue","text","header","placement","ViewGrid","fields","view","isLoading","deferredRendering","find","layout","hiddenFields","shownData","step","usedData","hasData","length","Fragment","gap","columns","alignment"],"sources":["@wordpress/dataviews/src/view-grid.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tTooltip,\n\tSpinner,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useAsyncList } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\nimport SingleSelectionCheckbox from './single-selection-checkbox';\n\nimport { useHasAPossibleBulkAction } from './bulk-actions';\n\nfunction GridItem( {\n\tselection,\n\tdata,\n\tonSelectionChange,\n\tgetItemId,\n\titem,\n\tactions,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n} ) {\n\tconst hasBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst id = getItemId( item );\n\tconst isSelected = selection.includes( id );\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 0 }\n\t\t\tkey={ id }\n\t\t\tclassName={ classnames( 'dataviews-view-grid__card', {\n\t\t\t\t'is-selected': hasBulkAction && isSelected,\n\t\t\t} ) }\n\t\t\tonClickCapture={ ( event ) => {\n\t\t\t\tif ( hasBulkAction && ( event.ctrlKey || event.metaKey ) ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId === id ||\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\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} else {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId !== id &&\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\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}\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t{ mediaField?.render( { item } ) }\n\t\t\t</div>\n\t\t\t<HStack\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews-view-grid__title-actions\"\n\t\t\t>\n\t\t\t\t<SingleSelectionCheckbox\n\t\t\t\t\tid={ id }\n\t\t\t\t\titem={ item }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\tdisabled={ ! hasBulkAction }\n\t\t\t\t/>\n\t\t\t\t<HStack className=\"dataviews-view-grid__primary-field\">\n\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t</HStack>\n\t\t\t\t<ItemActions item={ item } actions={ actions } isCompact />\n\t\t\t</HStack>\n\t\t\t<VStack className=\"dataviews-view-grid__fields\" spacing={ 3 }>\n\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\titem,\n\t\t\t\t\t} );\n\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field\"\n\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Tooltip text={ field.header } placement=\"left\">\n\t\t\t\t\t\t\t\t<div className=\"dataviews-view-grid__field-value\">\n\t\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</VStack>\n\t\t</VStack>\n\t);\n}\n\nexport default function ViewGrid( {\n\tdata,\n\tfields,\n\tview,\n\tactions,\n\tisLoading,\n\tgetItemId,\n\tdeferredRendering,\n\tselection,\n\tonSelectionChange,\n} ) {\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst visibleFields = fields.filter(\n\t\t( field ) =>\n\t\t\t! view.hiddenFields.includes( field.id ) &&\n\t\t\t! [ view.layout.mediaField, view.layout.primaryField ].includes(\n\t\t\t\tfield.id\n\t\t\t)\n\t);\n\tconst shownData = useAsyncList( data, { step: 3 } );\n\tconst usedData = deferredRendering ? shownData : data;\n\tconst hasData = !! usedData?.length;\n\treturn (\n\t\t<>\n\t\t\t{ hasData && (\n\t\t\t\t<Grid\n\t\t\t\t\tgap={ 6 }\n\t\t\t\t\tcolumns={ 2 }\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tclassName=\"dataviews-view-grid\"\n\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t>\n\t\t\t\t\t{ usedData.map( ( item ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\t\tvisibleFields={ visibleFields }\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</Grid>\n\t\t\t) }\n\t\t\t{ ! hasData && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames( {\n\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SACCC,kBAAkB,IAAIC,IAAI,EAC1BC,oBAAoB,IAAIC,MAAM,EAC9BC,oBAAoB,IAAIC,MAAM,EAC9BC,OAAO,EACPC,OAAO,QACD,uBAAuB;AAC9B,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA,OAAOC,WAAW,MAAM,gBAAgB;AACxC,OAAOC,uBAAuB,MAAM,6BAA6B;AAEjE,SAASC,yBAAyB,QAAQ,gBAAgB;AAE1D,SAASC,QAAQA,CAAE;EAClBC,SAAS;EACTC,IAAI;EACJC,iBAAiB;EACjBC,SAAS;EACTC,IAAI;EACJC,OAAO;EACPC,UAAU;EACVC,YAAY;EACZC;AACD,CAAC,EAAG;EACH,MAAMC,aAAa,GAAGX,yBAAyB,CAAEO,OAAO,EAAED,IAAK,CAAC;EAChE,MAAMM,EAAE,GAAGP,SAAS,CAAEC,IAAK,CAAC;EAC5B,MAAMO,UAAU,GAAGX,SAAS,CAACY,QAAQ,CAAEF,EAAG,CAAC;EAC3C,OACCG,aAAA,CAACtB,MAAM;IACNuB,OAAO,EAAG,CAAG;IACbC,GAAG,EAAGL,EAAI;IACVM,SAAS,EAAG/B,UAAU,CAAE,2BAA2B,EAAE;MACpD,aAAa,EAAEwB,aAAa,IAAIE;IACjC,CAAE,CAAG;IACLM,cAAc,EAAKC,KAAK,IAAM;MAC7B,IAAKT,aAAa,KAAMS,KAAK,CAACC,OAAO,IAAID,KAAK,CAACE,OAAO,CAAE,EAAG;QAC1DF,KAAK,CAACG,eAAe,CAAC,CAAC;QACvBH,KAAK,CAACI,cAAc,CAAC,CAAC;QACtB,IAAK,CAAEX,UAAU,EAAG;UACnBT,iBAAiB,CAChBD,IAAI,CAACsB,MAAM,CAAIC,KAAK,IAAM;YACzB,MAAMC,MAAM,GAAGtB,SAAS,GAAIqB,KAAM,CAAC;YACnC,OACCC,MAAM,KAAKf,EAAE,IACbV,SAAS,CAACY,QAAQ,CAAEa,MAAO,CAAC;UAE9B,CAAE,CACH,CAAC;QACF,CAAC,MAAM;UACNvB,iBAAiB,CAChBD,IAAI,CAACsB,MAAM,CAAIC,KAAK,IAAM;YACzB,MAAMC,MAAM,GAAGtB,SAAS,GAAIqB,KAAM,CAAC;YACnC,OACCC,MAAM,KAAKf,EAAE,IACbV,SAAS,CAACY,QAAQ,CAAEa,MAAO,CAAC;UAE9B,CAAE,CACH,CAAC;QACF;MACD;IACD;EAAG,GAEHZ,aAAA;IAAKG,SAAS,EAAC;EAA4B,GACxCV,UAAU,EAAEoB,MAAM,CAAE;IAAEtB;EAAK,CAAE,CAC3B,CAAC,EACNS,aAAA,CAACxB,MAAM;IACNsC,OAAO,EAAC,eAAe;IACvBX,SAAS,EAAC;EAAoC,GAE9CH,aAAA,CAAChB,uBAAuB;IACvBa,EAAE,EAAGA,EAAI;IACTN,IAAI,EAAGA,IAAM;IACbJ,SAAS,EAAGA,SAAW;IACvBE,iBAAiB,EAAGA,iBAAmB;IACvCC,SAAS,EAAGA,SAAW;IACvBF,IAAI,EAAGA,IAAM;IACbM,YAAY,EAAGA,YAAc;IAC7BqB,QAAQ,EAAG,CAAEnB;EAAe,CAC5B,CAAC,EACFI,aAAA,CAACxB,MAAM;IAAC2B,SAAS,EAAC;EAAoC,GACnDT,YAAY,EAAEmB,MAAM,CAAE;IAAEtB;EAAK,CAAE,CAC1B,CAAC,EACTS,aAAA,CAACjB,WAAW;IAACQ,IAAI,EAAGA,IAAM;IAACC,OAAO,EAAGA,OAAS;IAACwB,SAAS;EAAA,CAAE,CACnD,CAAC,EACThB,aAAA,CAACtB,MAAM;IAACyB,SAAS,EAAC,6BAA6B;IAACF,OAAO,EAAG;EAAG,GAC1DN,aAAa,CAACsB,GAAG,CAAIC,KAAK,IAAM;IACjC,MAAMC,aAAa,GAAGD,KAAK,CAACL,MAAM,CAAE;MACnCtB;IACD,CAAE,CAAC;IACH,IAAK,CAAE4B,aAAa,EAAG;MACtB,OAAO,IAAI;IACZ;IACA,OACCnB,aAAA,CAACtB,MAAM;MACNyB,SAAS,EAAC,4BAA4B;MACtCD,GAAG,EAAGgB,KAAK,CAACrB,EAAI;MAChBI,OAAO,EAAG;IAAG,GAEbD,aAAA,CAACrB,OAAO;MAACyC,IAAI,EAAGF,KAAK,CAACG,MAAQ;MAACC,SAAS,EAAC;IAAM,GAC9CtB,aAAA;MAAKG,SAAS,EAAC;IAAkC,GAC9CgB,aACE,CACG,CACF,CAAC;EAEX,CAAE,CACK,CACD,CAAC;AAEX;AAEA,eAAe,SAASI,QAAQA,CAAE;EACjCnC,IAAI;EACJoC,MAAM;EACNC,IAAI;EACJjC,OAAO;EACPkC,SAAS;EACTpC,SAAS;EACTqC,iBAAiB;EACjBxC,SAAS;EACTE;AACD,CAAC,EAAG;EACH,MAAMI,UAAU,GAAG+B,MAAM,CAACI,IAAI,CAC3BV,KAAK,IAAMA,KAAK,CAACrB,EAAE,KAAK4B,IAAI,CAACI,MAAM,CAACpC,UACvC,CAAC;EACD,MAAMC,YAAY,GAAG8B,MAAM,CAACI,IAAI,CAC7BV,KAAK,IAAMA,KAAK,CAACrB,EAAE,KAAK4B,IAAI,CAACI,MAAM,CAACnC,YACvC,CAAC;EACD,MAAMC,aAAa,GAAG6B,MAAM,CAACd,MAAM,CAChCQ,KAAK,IACN,CAAEO,IAAI,CAACK,YAAY,CAAC/B,QAAQ,CAAEmB,KAAK,CAACrB,EAAG,CAAC,IACxC,CAAE,CAAE4B,IAAI,CAACI,MAAM,CAACpC,UAAU,EAAEgC,IAAI,CAACI,MAAM,CAACnC,YAAY,CAAE,CAACK,QAAQ,CAC9DmB,KAAK,CAACrB,EACP,CACF,CAAC;EACD,MAAMkC,SAAS,GAAGjD,YAAY,CAAEM,IAAI,EAAE;IAAE4C,IAAI,EAAE;EAAE,CAAE,CAAC;EACnD,MAAMC,QAAQ,GAAGN,iBAAiB,GAAGI,SAAS,GAAG3C,IAAI;EACrD,MAAM8C,OAAO,GAAG,CAAC,CAAED,QAAQ,EAAEE,MAAM;EACnC,OACCnC,aAAA,CAAAoC,QAAA,QACGF,OAAO,IACRlC,aAAA,CAAC1B,IAAI;IACJ+D,GAAG,EAAG,CAAG;IACTC,OAAO,EAAG,CAAG;IACbC,SAAS,EAAC,KAAK;IACfpC,SAAS,EAAC,qBAAqB;IAC/B,aAAYuB;EAAW,GAErBO,QAAQ,CAAChB,GAAG,CAAI1B,IAAI,IAAM;IAC3B,OACCS,aAAA,CAACd,QAAQ;MACRgB,GAAG,EAAGZ,SAAS,CAAEC,IAAK,CAAG;MACzBJ,SAAS,EAAGA,SAAW;MACvBC,IAAI,EAAGA,IAAM;MACbC,iBAAiB,EAAGA,iBAAmB;MACvCC,SAAS,EAAGA,SAAW;MACvBC,IAAI,EAAGA,IAAM;MACbC,OAAO,EAAGA,OAAS;MACnBC,UAAU,EAAGA,UAAY;MACzBC,YAAY,EAAGA,YAAc;MAC7BC,aAAa,EAAGA;IAAe,CAC/B,CAAC;EAEJ,CAAE,CACG,CACN,EACC,CAAEuC,OAAO,IACVlC,aAAA;IACCG,SAAS,EAAG/B,UAAU,CAAE;MACvB,mBAAmB,EAAEsD,SAAS;MAC9B,sBAAsB,EAAE,CAAEA;IAC3B,CAAE;EAAG,GAEL1B,aAAA,YAAK0B,SAAS,GAAG1B,aAAA,CAACpB,OAAO,MAAE,CAAC,GAAGC,EAAE,CAAE,YAAa,CAAM,CAClD,CAEL,CAAC;AAEL"}

package/build-module/view-list.js

@@ -8,7 +8,7 @@ import classNames from 'classnames';
  * WordPress dependencies
  */
 import { useAsyncList } from '@wordpress/compose';
-import { __experimentalHStack as HStack, __experimentalVStack as VStack, Button } from '@wordpress/components';
+import { __experimentalHStack as HStack, __experimentalVStack as VStack, Button, Spinner } from '@wordpress/components';
 import { ENTER, SPACE } from '@wordpress/keycodes';
 import { info } from '@wordpress/icons';
 import { __ } from '@wordpress/i18n';
@@ -45,7 +45,7 @@ export default function ViewList({
         'dataviews-loading': isLoading,
         'dataviews-no-results': !hasData && !isLoading
       })
-    }, !hasData && createElement("p", null, isLoading ? __('Loading…') : __('No results')));
+    }, !hasData && createElement("p", null, isLoading ? createElement(Spinner, null) : __('No results')));
   }
   return createElement("ul", {
     className: "dataviews-view-list"

package/build-module/view-list.js.map

@@ -1 +1 @@
-{"version":3,"names":["classNames","useAsyncList","__experimentalHStack","HStack","__experimentalVStack","VStack","Button","ENTER","SPACE","info","__","ViewList","view","fields","data","isLoading","getItemId","onSelectionChange","onDetailsChange","selection","deferredRendering","shownData","step","usedData","mediaField","find","field","id","layout","primaryField","visibleFields","filter","hiddenFields","includes","onEnter","item","event","keyCode","hasData","length","createElement","className","map","key","role","tabIndex","onKeyDown","onClick","spacing","justify","alignment","render","icon","label","size"],"sources":["@wordpress/dataviews/src/view-list.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useAsyncList } from '@wordpress/compose';\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tButton,\n} from '@wordpress/components';\nimport { ENTER, SPACE } from '@wordpress/keycodes';\nimport { info } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\nexport default function ViewList( {\n\tview,\n\tfields,\n\tdata,\n\tisLoading,\n\tgetItemId,\n\tonSelectionChange,\n\tonDetailsChange,\n\tselection,\n\tdeferredRendering,\n} ) {\n\tconst shownData = useAsyncList( data, { step: 3 } );\n\tconst usedData = deferredRendering ? shownData : data;\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst visibleFields = fields.filter(\n\t\t( field ) =>\n\t\t\t! view.hiddenFields.includes( field.id ) &&\n\t\t\t! [ view.layout.primaryField, view.layout.mediaField ].includes(\n\t\t\t\tfield.id\n\t\t\t)\n\t);\n\n\tconst onEnter = ( item ) => ( event ) => {\n\t\tconst { keyCode } = event;\n\t\tif ( [ ENTER, SPACE ].includes( keyCode ) ) {\n\t\t\tonSelectionChange( [ item ] );\n\t\t}\n\t};\n\n\tconst hasData = usedData?.length;\n\tif ( ! hasData ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={ classNames( {\n\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t'dataviews-no-results': ! hasData && ! isLoading,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ ! hasData && (\n\t\t\t\t\t<p>{ isLoading ? __( 'Loading…' ) : __( 'No results' ) }</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<ul className=\"dataviews-view-list\">\n\t\t\t{ usedData.map( ( item ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\tclassName={ classNames( {\n\t\t\t\t\t\t\t'is-selected': selection.includes( item.id ),\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack className=\"dataviews-view-list__item-wrapper\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t\ttabIndex={ 0 }\n\t\t\t\t\t\t\t\taria-pressed={ selection.includes( item.id ) }\n\t\t\t\t\t\t\t\tonKeyDown={ onEnter( item ) }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__item\"\n\t\t\t\t\t\t\t\tonClick={ () => onSelectionChange( [ item ] ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\t\t\t\t\talignment=\"flex-start\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-list__media-wrapper\">\n\t\t\t\t\t\t\t\t\t\t{ mediaField?.render( { item } ) || (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-list__media-placeholder\"></div>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t\t\t\t\t\t<span className=\"dataviews-view-list__primary-field\">\n\t\t\t\t\t\t\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-list__fields\">\n\t\t\t\t\t\t\t\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\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\tkey={ field.id }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__field\"\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{ field.render( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem,\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</span>\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</div>\n\t\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{ onDetailsChange && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__details-button\"\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\tonDetailsChange( [ item ] )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\ticon={ info }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'View details' ) }\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ul>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["classNames","useAsyncList","__experimentalHStack","HStack","__experimentalVStack","VStack","Button","Spinner","ENTER","SPACE","info","__","ViewList","view","fields","data","isLoading","getItemId","onSelectionChange","onDetailsChange","selection","deferredRendering","shownData","step","usedData","mediaField","find","field","id","layout","primaryField","visibleFields","filter","hiddenFields","includes","onEnter","item","event","keyCode","hasData","length","createElement","className","map","key","role","tabIndex","onKeyDown","onClick","spacing","justify","alignment","render","icon","label","size"],"sources":["@wordpress/dataviews/src/view-list.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useAsyncList } from '@wordpress/compose';\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tButton,\n\tSpinner,\n} from '@wordpress/components';\nimport { ENTER, SPACE } from '@wordpress/keycodes';\nimport { info } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\nexport default function ViewList( {\n\tview,\n\tfields,\n\tdata,\n\tisLoading,\n\tgetItemId,\n\tonSelectionChange,\n\tonDetailsChange,\n\tselection,\n\tdeferredRendering,\n} ) {\n\tconst shownData = useAsyncList( data, { step: 3 } );\n\tconst usedData = deferredRendering ? shownData : data;\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst visibleFields = fields.filter(\n\t\t( field ) =>\n\t\t\t! view.hiddenFields.includes( field.id ) &&\n\t\t\t! [ view.layout.primaryField, view.layout.mediaField ].includes(\n\t\t\t\tfield.id\n\t\t\t)\n\t);\n\n\tconst onEnter = ( item ) => ( event ) => {\n\t\tconst { keyCode } = event;\n\t\tif ( [ ENTER, SPACE ].includes( keyCode ) ) {\n\t\t\tonSelectionChange( [ item ] );\n\t\t}\n\t};\n\n\tconst hasData = usedData?.length;\n\tif ( ! hasData ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={ classNames( {\n\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t'dataviews-no-results': ! hasData && ! isLoading,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ ! hasData && (\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<ul className=\"dataviews-view-list\">\n\t\t\t{ usedData.map( ( item ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\tclassName={ classNames( {\n\t\t\t\t\t\t\t'is-selected': selection.includes( item.id ),\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack className=\"dataviews-view-list__item-wrapper\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t\ttabIndex={ 0 }\n\t\t\t\t\t\t\t\taria-pressed={ selection.includes( item.id ) }\n\t\t\t\t\t\t\t\tonKeyDown={ onEnter( item ) }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__item\"\n\t\t\t\t\t\t\t\tonClick={ () => onSelectionChange( [ item ] ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\t\t\t\t\talignment=\"flex-start\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-list__media-wrapper\">\n\t\t\t\t\t\t\t\t\t\t{ mediaField?.render( { item } ) || (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-list__media-placeholder\"></div>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t\t\t\t\t\t<span className=\"dataviews-view-list__primary-field\">\n\t\t\t\t\t\t\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-list__fields\">\n\t\t\t\t\t\t\t\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\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\tkey={ field.id }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__field\"\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{ field.render( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem,\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</span>\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</div>\n\t\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{ onDetailsChange && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__details-button\"\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\tonDetailsChange( [ item ] )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\ticon={ info }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'View details' ) }\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ul>\n\t);\n}\n"],"mappings":"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"}

package/build-module/view-table.js

@@ -10,7 +10,7 @@ import classnames from 'classnames';
 import { __ } from '@wordpress/i18n';
 import { useAsyncList } from '@wordpress/compose';
 import { unseen, funnel } from '@wordpress/icons';
-import { Button, Icon, privateApis as componentsPrivateApis, CheckboxControl } from '@wordpress/components';
+import { Button, Icon, privateApis as componentsPrivateApis, CheckboxControl, Spinner } from '@wordpress/components';
 import { forwardRef, useEffect, useId, useRef, useState, Children, Fragment, useMemo } from '@wordpress/element';
 
 /**
@@ -254,9 +254,7 @@ function ViewTable({
     desc: 'descending'
   };
   const primaryField = fields.find(field => field.id === view.layout.primaryField);
-  return createElement("div", {
-    className: "dataviews-view-table-wrapper"
-  }, createElement("table", {
+  return createElement(Fragment, null, createElement("table", {
     className: "dataviews-view-table",
     "aria-busy": isLoading,
     "aria-describedby": tableNoticeId
@@ -324,7 +322,7 @@ function ViewTable({
       'dataviews-no-results': !hasData && !isLoading
     }),
     id: tableNoticeId
-  }, !hasData && createElement("p", null, isLoading ? __('Loading…') : __('No results'))));
+  }, !hasData && createElement("p", null, isLoading ? createElement(Spinner, null) : __('No results'))));
 }
 export default ViewTable;
 //# sourceMappingURL=view-table.js.map