@wordpress/dataviews 0.2.0 → 0.3.0

package/build-module/pagination.js.map

@@ -1 +1 @@
-{"version":3,"names":["Button","__experimentalHStack","HStack","__experimentalText","Text","__experimentalNumberControl","NumberControl","createInterpolateElement","sprintf","__","_x","_n","chevronRight","chevronLeft","previous","next","Pagination","view","onChangeView","paginationInfo","totalItems","totalPages","createElement","expanded","spacing","justify","className","variant","onClick","page","disabled","__experimentalIsFocusable","label","icon","showTooltip","size","CurrenPageControl","min","max","onChange","value","_value","step","isDragEnabled","spinControls"],"sources":["@wordpress/dataviews/src/pagination.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalHStack as HStack,\n\t__experimentalText as Text,\n\t__experimentalNumberControl as NumberControl,\n} from '@wordpress/components';\nimport { createInterpolateElement } from '@wordpress/element';\nimport { sprintf, __, _x, _n } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft, previous, next } from '@wordpress/icons';\n\nfunction Pagination( {\n\tview,\n\tonChangeView,\n\tpaginationInfo: { totalItems = 0, totalPages },\n} ) {\n\tif ( ! totalItems || ! totalPages ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<HStack\n\t\t\texpanded={ false }\n\t\t\tspacing={ 3 }\n\t\t\tjustify=\"space-between\"\n\t\t\tclassName=\"dataviews-pagination\"\n\t\t>\n\t\t\t<Text variant=\"muted\">\n\t\t\t\t{\n\t\t\t\t\t// translators: %s: Total number of entries.\n\t\t\t\t\tsprintf(\n\t\t\t\t\t\t// translators: %s: Total number of entries.\n\t\t\t\t\t\t_n( '%s item', '%s items', totalItems ),\n\t\t\t\t\t\ttotalItems\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t</Text>\n\t\t\t{ !! totalItems && totalPages !== 1 && (\n\t\t\t\t<HStack expanded={ false } spacing={ 3 }>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tonChangeView( { ...view, page: 1 } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisabled={ view.page === 1 }\n\t\t\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\t\t\tlabel={ __( 'First page' ) }\n\t\t\t\t\t\t\ticon={ previous }\n\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tonChangeView( { ...view, page: view.page - 1 } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisabled={ view.page === 1 }\n\t\t\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\t\t\tlabel={ __( 'Previous page' ) }\n\t\t\t\t\t\t\ticon={ chevronLeft }\n\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t// translators: %1$s: Current page number, %2$s: Total number of pages.\n\t\t\t\t\t\t\t\t_x( '<CurrenPageControl /> of %2$s', 'paging' ),\n\t\t\t\t\t\t\t\tview.page,\n\t\t\t\t\t\t\t\ttotalPages\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tCurrenPageControl: (\n\t\t\t\t\t\t\t\t\t<NumberControl\n\t\t\t\t\t\t\t\t\t\taria-label={ __( 'Current page' ) }\n\t\t\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\t\t\tmax={ totalPages }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t\t\t\tconst _value = +value;\n\t\t\t\t\t\t\t\t\t\t\tif (\n\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_value < 1 ||\n\t\t\t\t\t\t\t\t\t\t\t\t_value > totalPages\n\t\t\t\t\t\t\t\t\t\t\t) {\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}\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: _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\tstep=\"1\"\n\t\t\t\t\t\t\t\t\t\tvalue={ view.page }\n\t\t\t\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\t\t\t\tspinControls=\"none\"\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</HStack>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tonChangeView( { ...view, page: view.page + 1 } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisabled={ view.page >= totalPages }\n\t\t\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\t\t\tlabel={ __( 'Next page' ) }\n\t\t\t\t\t\t\ticon={ chevronRight }\n\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tonChangeView( { ...view, page: totalPages } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisabled={ view.page >= totalPages }\n\t\t\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\t\t\tlabel={ __( 'Last page' ) }\n\t\t\t\t\t\t\ticon={ next }\n\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t</HStack>\n\t);\n}\n\nexport default Pagination;\n"],"mappings":"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"}
+{"version":3,"names":["Button","__experimentalHStack","HStack","SelectControl","createInterpolateElement","memo","sprintf","__","_x","chevronRight","chevronLeft","Pagination","view","onChangeView","paginationInfo","totalItems","totalPages","createElement","expanded","spacing","justify","className","page","CurrenPageControl","value","options","Array","from","map","_","i","label","onChange","newValue","size","__nextHasNoMarginBottom","onClick","disabled","__experimentalIsFocusable","icon","showTooltip","tooltipPosition"],"sources":["@wordpress/dataviews/src/pagination.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalHStack as HStack,\n\tSelectControl,\n} from '@wordpress/components';\nimport { createInterpolateElement, memo } from '@wordpress/element';\nimport { sprintf, __, _x } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft } from '@wordpress/icons';\n\nconst Pagination = memo( function Pagination( {\n\tview,\n\tonChangeView,\n\tpaginationInfo: { totalItems = 0, totalPages },\n} ) {\n\tif ( ! totalItems || ! totalPages ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t!! totalItems &&\n\t\ttotalPages !== 1 && (\n\t\t\t<HStack\n\t\t\t\texpanded={ false }\n\t\t\t\tspacing={ 6 }\n\t\t\t\tjustify=\"end\"\n\t\t\t\tclassName=\"dataviews-pagination\"\n\t\t\t>\n\t\t\t\t<HStack justify=\"flex-start\" expanded={ false } spacing={ 2 }>\n\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t// translators: %1$s: Current page number, %2$s: Total number of pages.\n\t\t\t\t\t\t\t_x(\n\t\t\t\t\t\t\t\t'Page <CurrenPageControl /> of %2$s',\n\t\t\t\t\t\t\t\t'paging'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tview.page,\n\t\t\t\t\t\t\ttotalPages\n\t\t\t\t\t\t),\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tCurrenPageControl: (\n\t\t\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\t\t\taria-label={ __( 'Current page' ) }\n\t\t\t\t\t\t\t\t\tvalue={ view.page }\n\t\t\t\t\t\t\t\t\toptions={ Array.from(\n\t\t\t\t\t\t\t\t\t\tArray( totalPages )\n\t\t\t\t\t\t\t\t\t).map( ( _, i ) => {\n\t\t\t\t\t\t\t\t\t\tconst page = i + 1;\n\t\t\t\t\t\t\t\t\t\treturn { value: page, label: page };\n\t\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t\t\tonChange={ ( newValue ) => {\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: +newValue,\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\tsize={ 'compact' }\n\t\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\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</HStack>\n\t\t\t\t<HStack expanded={ false } spacing={ 1 }>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\tonChangeView( { ...view, page: view.page - 1 } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdisabled={ view.page === 1 }\n\t\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\t\tlabel={ __( 'Previous page' ) }\n\t\t\t\t\t\ticon={ chevronLeft }\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\tonChangeView( { ...view, page: view.page + 1 } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdisabled={ view.page >= totalPages }\n\t\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\t\tlabel={ __( 'Next page' ) }\n\t\t\t\t\t\ticon={ chevronRight }\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t</HStack>\n\t\t)\n\t);\n} );\n\nexport default Pagination;\n"],"mappings":"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"}

package/build-module/reset-filters.js

@@ -4,23 +4,23 @@ import { createElement } from "react";
  */
 import { Button } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
-export default (({
+export default function ResetFilter({
   view,
   onChangeView
-}) => {
+}) {
   return createElement(Button, {
     disabled: view.search === '' && view.filters?.length === 0,
     __experimentalIsFocusable: true,
     size: "compact",
     variant: "tertiary",
     onClick: () => {
-      onChangeView(currentView => ({
-        ...currentView,
+      onChangeView({
+        ...view,
         page: 1,
         search: '',
         filters: []
-      }));
+      });
     }
   }, __('Reset filters'));
-});
+}
 //# sourceMappingURL=reset-filters.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["Button","__","view","onChangeView","createElement","disabled","search","filters","length","__experimentalIsFocusable","size","variant","onClick","currentView","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 ( { view, onChangeView } ) => {\n\treturn (\n\t\t<Button\n\t\t\tdisabled={ view.search === '' && view.filters?.length === 0 }\n\t\t\t__experimentalIsFocusable\n\t\t\tsize=\"compact\"\n\t\t\tvariant=\"tertiary\"\n\t\t\tonClick={ () => {\n\t\t\t\tonChangeView( ( currentView ) => ( {\n\t\t\t\t\t...currentView,\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,gBAAe,CAAE;EAAEC,IAAI;EAAEC;AAAa,CAAC,KAAM;EAC5C,OACCC,aAAA,CAACJ,MAAM;IACNK,QAAQ,EAAGH,IAAI,CAACI,MAAM,KAAK,EAAE,IAAIJ,IAAI,CAACK,OAAO,EAAEC,MAAM,KAAK,CAAG;IAC7DC,yBAAyB;IACzBC,IAAI,EAAC,SAAS;IACdC,OAAO,EAAC,UAAU;IAClBC,OAAO,EAAGA,CAAA,KAAM;MACfT,YAAY,CAAIU,WAAW,KAAQ;QAClC,GAAGA,WAAW;QACdC,IAAI,EAAE,CAAC;QACPR,MAAM,EAAE,EAAE;QACVC,OAAO,EAAE;MACV,CAAC,CAAG,CAAC;IACN;EAAG,GAEDN,EAAE,CAAE,eAAgB,CACf,CAAC;AAEX,CAAC"}
+{"version":3,"names":["Button","__","ResetFilter","view","onChangeView","createElement","disabled","search","filters","length","__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( { view, onChangeView } ) {\n\treturn (\n\t\t<Button\n\t\t\tdisabled={ view.search === '' && view.filters?.length === 0 }\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,IAAI;EAAEC;AAAa,CAAC,EAAG;EAC7D,OACCC,aAAA,CAACL,MAAM;IACNM,QAAQ,EAAGH,IAAI,CAACI,MAAM,KAAK,EAAE,IAAIJ,IAAI,CAACK,OAAO,EAAEC,MAAM,KAAK,CAAG;IAC7DC,yBAAyB;IACzBC,IAAI,EAAC,SAAS;IACdC,OAAO,EAAC,UAAU;IAClBC,OAAO,EAAGA,CAAA,KAAM;MACfT,YAAY,CAAE;QACb,GAAGD,IAAI;QACPW,IAAI,EAAE,CAAC;QACPP,MAAM,EAAE,EAAE;QACVC,OAAO,EAAE;MACV,CAAE,CAAC;IACJ;EAAG,GAEDP,EAAE,CAAE,eAAgB,CACf,CAAC;AAEX"}

package/build-module/search.js

@@ -3,10 +3,10 @@ import { createElement } from "react";
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { useEffect, useRef } from '@wordpress/element';
+import { useEffect, useRef, memo } from '@wordpress/element';
 import { SearchControl } from '@wordpress/components';
 import { useDebouncedInput } from '@wordpress/compose';
-export default function Search({
+const Search = memo(function Search({
   label,
   view,
   onChangeView
@@ -20,11 +20,11 @@ export default function Search({
     onChangeViewRef.current = onChangeView;
   }, [onChangeView]);
   useEffect(() => {
-    onChangeViewRef.current(currentView => ({
-      ...currentView,
+    onChangeViewRef.current({
+      ...view,
       page: 1,
       search: debouncedSearch
-    }));
+    });
   }, [debouncedSearch]);
   const searchLabel = label || __('Filter list');
   return createElement(SearchControl, {
@@ -35,5 +35,6 @@ export default function Search({
     placeholder: searchLabel,
     size: "compact"
   });
-}
+});
+export default Search;
 //# sourceMappingURL=search.js.map

package/build-module/search.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","useEffect","useRef","SearchControl","useDebouncedInput","Search","label","view","onChangeView","search","setSearch","debouncedSearch","onChangeViewRef","current","currentView","page","searchLabel","createElement","__nextHasNoMarginBottom","onChange","value","placeholder","size"],"sources":["@wordpress/dataviews/src/search.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { SearchControl } from '@wordpress/components';\nimport { useDebouncedInput } from '@wordpress/compose';\n\nexport default function Search( { label, view, onChangeView } ) {\n\tconst [ search, setSearch, debouncedSearch ] = useDebouncedInput(\n\t\tview.search\n\t);\n\tuseEffect( () => {\n\t\tsetSearch( view.search );\n\t}, [ view ] );\n\tconst onChangeViewRef = useRef( onChangeView );\n\tuseEffect( () => {\n\t\tonChangeViewRef.current = onChangeView;\n\t}, [ onChangeView ] );\n\tuseEffect( () => {\n\t\tonChangeViewRef.current( ( currentView ) => ( {\n\t\t\t...currentView,\n\t\t\tpage: 1,\n\t\t\tsearch: debouncedSearch,\n\t\t} ) );\n\t}, [ debouncedSearch ] );\n\tconst searchLabel = label || __( 'Filter list' );\n\treturn (\n\t\t<SearchControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tonChange={ setSearch }\n\t\t\tvalue={ search }\n\t\t\tlabel={ searchLabel }\n\t\t\tplaceholder={ searchLabel }\n\t\t\tsize=\"compact\"\n\t\t/>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;AACtD,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,iBAAiB,QAAQ,oBAAoB;AAEtD,eAAe,SAASC,MAAMA,CAAE;EAAEC,KAAK;EAAEC,IAAI;EAAEC;AAAa,CAAC,EAAG;EAC/D,MAAM,CAAEC,MAAM,EAAEC,SAAS,EAAEC,eAAe,CAAE,GAAGP,iBAAiB,CAC/DG,IAAI,CAACE,MACN,CAAC;EACDR,SAAS,CAAE,MAAM;IAChBS,SAAS,CAAEH,IAAI,CAACE,MAAO,CAAC;EACzB,CAAC,EAAE,CAAEF,IAAI,CAAG,CAAC;EACb,MAAMK,eAAe,GAAGV,MAAM,CAAEM,YAAa,CAAC;EAC9CP,SAAS,CAAE,MAAM;IAChBW,eAAe,CAACC,OAAO,GAAGL,YAAY;EACvC,CAAC,EAAE,CAAEA,YAAY,CAAG,CAAC;EACrBP,SAAS,CAAE,MAAM;IAChBW,eAAe,CAACC,OAAO,CAAIC,WAAW,KAAQ;MAC7C,GAAGA,WAAW;MACdC,IAAI,EAAE,CAAC;MACPN,MAAM,EAAEE;IACT,CAAC,CAAG,CAAC;EACN,CAAC,EAAE,CAAEA,eAAe,CAAG,CAAC;EACxB,MAAMK,WAAW,GAAGV,KAAK,IAAIN,EAAE,CAAE,aAAc,CAAC;EAChD,OACCiB,aAAA,CAACd,aAAa;IACbe,uBAAuB;IACvBC,QAAQ,EAAGT,SAAW;IACtBU,KAAK,EAAGX,MAAQ;IAChBH,KAAK,EAAGU,WAAa;IACrBK,WAAW,EAAGL,WAAa;IAC3BM,IAAI,EAAC;EAAS,CACd,CAAC;AAEJ"}
+{"version":3,"names":["__","useEffect","useRef","memo","SearchControl","useDebouncedInput","Search","label","view","onChangeView","search","setSearch","debouncedSearch","onChangeViewRef","current","page","searchLabel","createElement","__nextHasNoMarginBottom","onChange","value","placeholder","size"],"sources":["@wordpress/dataviews/src/search.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useEffect, useRef, memo } from '@wordpress/element';\nimport { SearchControl } from '@wordpress/components';\nimport { useDebouncedInput } from '@wordpress/compose';\n\nconst Search = memo( function Search( { label, view, onChangeView } ) {\n\tconst [ search, setSearch, debouncedSearch ] = useDebouncedInput(\n\t\tview.search\n\t);\n\tuseEffect( () => {\n\t\tsetSearch( view.search );\n\t}, [ view ] );\n\tconst onChangeViewRef = useRef( onChangeView );\n\tuseEffect( () => {\n\t\tonChangeViewRef.current = onChangeView;\n\t}, [ onChangeView ] );\n\tuseEffect( () => {\n\t\tonChangeViewRef.current( {\n\t\t\t...view,\n\t\t\tpage: 1,\n\t\t\tsearch: debouncedSearch,\n\t\t} );\n\t}, [ debouncedSearch ] );\n\tconst searchLabel = label || __( 'Filter list' );\n\treturn (\n\t\t<SearchControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tonChange={ setSearch }\n\t\t\tvalue={ search }\n\t\t\tlabel={ searchLabel }\n\t\t\tplaceholder={ searchLabel }\n\t\t\tsize=\"compact\"\n\t\t/>\n\t);\n} );\n\nexport default Search;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,EAAEC,MAAM,EAAEC,IAAI,QAAQ,oBAAoB;AAC5D,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,iBAAiB,QAAQ,oBAAoB;AAEtD,MAAMC,MAAM,GAAGH,IAAI,CAAE,SAASG,MAAMA,CAAE;EAAEC,KAAK;EAAEC,IAAI;EAAEC;AAAa,CAAC,EAAG;EACrE,MAAM,CAAEC,MAAM,EAAEC,SAAS,EAAEC,eAAe,CAAE,GAAGP,iBAAiB,CAC/DG,IAAI,CAACE,MACN,CAAC;EACDT,SAAS,CAAE,MAAM;IAChBU,SAAS,CAAEH,IAAI,CAACE,MAAO,CAAC;EACzB,CAAC,EAAE,CAAEF,IAAI,CAAG,CAAC;EACb,MAAMK,eAAe,GAAGX,MAAM,CAAEO,YAAa,CAAC;EAC9CR,SAAS,CAAE,MAAM;IAChBY,eAAe,CAACC,OAAO,GAAGL,YAAY;EACvC,CAAC,EAAE,CAAEA,YAAY,CAAG,CAAC;EACrBR,SAAS,CAAE,MAAM;IAChBY,eAAe,CAACC,OAAO,CAAE;MACxB,GAAGN,IAAI;MACPO,IAAI,EAAE,CAAC;MACPL,MAAM,EAAEE;IACT,CAAE,CAAC;EACJ,CAAC,EAAE,CAAEA,eAAe,CAAG,CAAC;EACxB,MAAMI,WAAW,GAAGT,KAAK,IAAIP,EAAE,CAAE,aAAc,CAAC;EAChD,OACCiB,aAAA,CAACb,aAAa;IACbc,uBAAuB;IACvBC,QAAQ,EAAGR,SAAW;IACtBS,KAAK,EAAGV,MAAQ;IAChBH,KAAK,EAAGS,WAAa;IACrBK,WAAW,EAAGL,WAAa;IAC3BM,IAAI,EAAC;EAAS,CACd,CAAC;AAEJ,CAAE,CAAC;AAEH,eAAehB,MAAM"}

package/build-module/utils.js

@@ -0,0 +1,63 @@
+/**
+ * Helper util to sort data by text fields, when sorting is done client side.
+ *
+ * @param {Object}   params            Function params.
+ * @param {Object[]} params.data       Data to sort.
+ * @param {Object}   params.view       Current view object.
+ * @param {Object[]} params.fields     Array of available fields.
+ * @param {string[]} params.textFields Array of the field ids to sort.
+ *
+ * @return {Object[]} Sorted data.
+ */
+export const sortByTextFields = ({
+  data,
+  view,
+  fields,
+  textFields
+}) => {
+  const sortedData = [...data];
+  const fieldId = view.sort.field;
+  if (textFields.includes(fieldId)) {
+    const fieldToSort = fields.find(field => {
+      return field.id === fieldId;
+    });
+    sortedData.sort((a, b) => {
+      var _fieldToSort$getValue, _fieldToSort$getValue2;
+      const valueA = (_fieldToSort$getValue = fieldToSort.getValue({
+        item: a
+      })) !== null && _fieldToSort$getValue !== void 0 ? _fieldToSort$getValue : '';
+      const valueB = (_fieldToSort$getValue2 = fieldToSort.getValue({
+        item: b
+      })) !== null && _fieldToSort$getValue2 !== void 0 ? _fieldToSort$getValue2 : '';
+      return view.sort.direction === 'asc' ? valueA.localeCompare(valueB) : valueB.localeCompare(valueA);
+    });
+  }
+  return sortedData;
+};
+
+/**
+ * Helper util to get the paginated data and the paginateInfo needed,
+ * when pagination is done client side.
+ *
+ * @param {Object}   params      Function params.
+ * @param {Object[]} params.data Available data.
+ * @param {Object}   params.view Current view object.
+ *
+ * @return {Object} Paginated data and paginationInfo.
+ */
+export function getPaginationResults({
+  data,
+  view
+}) {
+  const start = (view.page - 1) * view.perPage;
+  const totalItems = data?.length || 0;
+  data = data?.slice(start, start + view.perPage);
+  return {
+    data,
+    paginationInfo: {
+      totalItems,
+      totalPages: Math.ceil(totalItems / view.perPage)
+    }
+  };
+}
+//# sourceMappingURL=utils.js.map

package/build-module/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sortByTextFields","data","view","fields","textFields","sortedData","fieldId","sort","field","includes","fieldToSort","find","id","a","b","_fieldToSort$getValue","_fieldToSort$getValue2","valueA","getValue","item","valueB","direction","localeCompare","getPaginationResults","start","page","perPage","totalItems","length","slice","paginationInfo","totalPages","Math","ceil"],"sources":["@wordpress/dataviews/src/utils.js"],"sourcesContent":["/**\n * Helper util to sort data by text fields, when sorting is done client side.\n *\n * @param {Object}   params            Function params.\n * @param {Object[]} params.data       Data to sort.\n * @param {Object}   params.view       Current view object.\n * @param {Object[]} params.fields     Array of available fields.\n * @param {string[]} params.textFields Array of the field ids to sort.\n *\n * @return {Object[]} Sorted data.\n */\nexport const sortByTextFields = ( { data, view, fields, textFields } ) => {\n\tconst sortedData = [ ...data ];\n\tconst fieldId = view.sort.field;\n\tif ( textFields.includes( fieldId ) ) {\n\t\tconst fieldToSort = fields.find( ( field ) => {\n\t\t\treturn field.id === fieldId;\n\t\t} );\n\t\tsortedData.sort( ( a, b ) => {\n\t\t\tconst valueA = fieldToSort.getValue( { item: a } ) ?? '';\n\t\t\tconst valueB = fieldToSort.getValue( { item: b } ) ?? '';\n\t\t\treturn view.sort.direction === 'asc'\n\t\t\t\t? valueA.localeCompare( valueB )\n\t\t\t\t: valueB.localeCompare( valueA );\n\t\t} );\n\t}\n\treturn sortedData;\n};\n\n/**\n * Helper util to get the paginated data and the paginateInfo needed,\n * when pagination is done client side.\n *\n * @param {Object}   params      Function params.\n * @param {Object[]} params.data Available data.\n * @param {Object}   params.view Current view object.\n *\n * @return {Object} Paginated data and paginationInfo.\n */\nexport function getPaginationResults( { data, view } ) {\n\tconst start = ( view.page - 1 ) * view.perPage;\n\tconst totalItems = data?.length || 0;\n\tdata = data?.slice( start, start + view.perPage );\n\treturn {\n\t\tdata,\n\t\tpaginationInfo: {\n\t\t\ttotalItems,\n\t\t\ttotalPages: Math.ceil( totalItems / view.perPage ),\n\t\t},\n\t};\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMA,gBAAgB,GAAGA,CAAE;EAAEC,IAAI;EAAEC,IAAI;EAAEC,MAAM;EAAEC;AAAW,CAAC,KAAM;EACzE,MAAMC,UAAU,GAAG,CAAE,GAAGJ,IAAI,CAAE;EAC9B,MAAMK,OAAO,GAAGJ,IAAI,CAACK,IAAI,CAACC,KAAK;EAC/B,IAAKJ,UAAU,CAACK,QAAQ,CAAEH,OAAQ,CAAC,EAAG;IACrC,MAAMI,WAAW,GAAGP,MAAM,CAACQ,IAAI,CAAIH,KAAK,IAAM;MAC7C,OAAOA,KAAK,CAACI,EAAE,KAAKN,OAAO;IAC5B,CAAE,CAAC;IACHD,UAAU,CAACE,IAAI,CAAE,CAAEM,CAAC,EAAEC,CAAC,KAAM;MAAA,IAAAC,qBAAA,EAAAC,sBAAA;MAC5B,MAAMC,MAAM,IAAAF,qBAAA,GAAGL,WAAW,CAACQ,QAAQ,CAAE;QAAEC,IAAI,EAAEN;MAAE,CAAE,CAAC,cAAAE,qBAAA,cAAAA,qBAAA,GAAI,EAAE;MACxD,MAAMK,MAAM,IAAAJ,sBAAA,GAAGN,WAAW,CAACQ,QAAQ,CAAE;QAAEC,IAAI,EAAEL;MAAE,CAAE,CAAC,cAAAE,sBAAA,cAAAA,sBAAA,GAAI,EAAE;MACxD,OAAOd,IAAI,CAACK,IAAI,CAACc,SAAS,KAAK,KAAK,GACjCJ,MAAM,CAACK,aAAa,CAAEF,MAAO,CAAC,GAC9BA,MAAM,CAACE,aAAa,CAAEL,MAAO,CAAC;IAClC,CAAE,CAAC;EACJ;EACA,OAAOZ,UAAU;AAClB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASkB,oBAAoBA,CAAE;EAAEtB,IAAI;EAAEC;AAAK,CAAC,EAAG;EACtD,MAAMsB,KAAK,GAAG,CAAEtB,IAAI,CAACuB,IAAI,GAAG,CAAC,IAAKvB,IAAI,CAACwB,OAAO;EAC9C,MAAMC,UAAU,GAAG1B,IAAI,EAAE2B,MAAM,IAAI,CAAC;EACpC3B,IAAI,GAAGA,IAAI,EAAE4B,KAAK,CAAEL,KAAK,EAAEA,KAAK,GAAGtB,IAAI,CAACwB,OAAQ,CAAC;EACjD,OAAO;IACNzB,IAAI;IACJ6B,cAAc,EAAE;MACfH,UAAU;MACVI,UAAU,EAAEC,IAAI,CAACC,IAAI,CAAEN,UAAU,GAAGzB,IAAI,CAACwB,OAAQ;IAClD;EACD,CAAC;AACF"}

package/build-module/view-actions.js

@@ -1,22 +1,23 @@
-import { createElement, Fragment } from "react";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */
-import { Button, Icon, privateApis as componentsPrivateApis } from '@wordpress/components';
-import { chevronRightSmall, check, arrowUp, arrowDown } from '@wordpress/icons';
+import { Button, privateApis as componentsPrivateApis } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
+import { memo } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import { unlock } from './lock-unlock';
-import { VIEW_LAYOUTS, LAYOUT_TABLE } from './constants';
+import { VIEW_LAYOUTS, LAYOUT_TABLE, SORTING_DIRECTIONS } from './constants';
 const {
   DropdownMenuV2: DropdownMenu,
   DropdownMenuGroupV2: DropdownMenuGroup,
   DropdownMenuItemV2: DropdownMenuItem,
-  DropdownSubMenuV2: DropdownSubMenu,
-  DropdownSubMenuTriggerV2: DropdownSubMenuTrigger
+  DropdownMenuRadioItemV2: DropdownMenuRadioItem,
+  DropdownMenuCheckboxItemV2: DropdownMenuCheckboxItem,
+  DropdownMenuItemLabelV2: DropdownMenuItemLabel
 } = unlock(componentsPrivateApis);
 function ViewTypeMenu({
   view,
@@ -31,29 +32,26 @@ function ViewTypeMenu({
     return null;
   }
   const activeView = _availableViews.find(v => view.type === v.type);
-  return createElement(DropdownSubMenu, {
-    trigger: createElement(DropdownSubMenuTrigger, {
-      suffix: createElement(Fragment, null, activeView.label, createElement(Icon, {
-        icon: chevronRightSmall
-      }))
-    }, __('Layout'))
+  return createElement(DropdownMenu, {
+    trigger: createElement(DropdownMenuItem, {
+      suffix: createElement("span", {
+        "aria-hidden": "true"
+      }, activeView.label)
+    }, createElement(DropdownMenuItemLabel, null, __('Layout')))
   }, _availableViews.map(availableView => {
-    return createElement(DropdownMenuItem, {
+    return createElement(DropdownMenuRadioItem, {
       key: availableView.type,
-      role: "menuitemradio",
-      "aria-checked": availableView.id === view.type,
-      prefix: availableView.type === view.type && createElement(Icon, {
-        icon: check
-      }),
-      onSelect: event => {
-        // We need to handle this on DropDown component probably..
-        event.preventDefault();
+      value: availableView.type,
+      name: "view-actions-available-view",
+      checked: availableView.type === view.type,
+      hideOnClick: true,
+      onChange: e => {
         onChangeView({
           ...view,
-          type: availableView.type
+          type: e.target.value
         });
       }
-    }, availableView.label);
+    }, createElement(DropdownMenuItemLabel, null, availableView.label));
   }));
 }
 const PAGE_SIZE_VALUES = [10, 20, 50, 100];
@@ -61,30 +59,28 @@ function PageSizeMenu({
   view,
   onChangeView
 }) {
-  return createElement(DropdownSubMenu, {
-    trigger: createElement(DropdownSubMenuTrigger, {
-      suffix: createElement(Fragment, null, view.perPage, createElement(Icon, {
-        icon: chevronRightSmall
-      }))
-    }, __('Rows per page'))
+  return createElement(DropdownMenu, {
+    trigger: createElement(DropdownMenuItem, {
+      suffix: createElement("span", {
+        "aria-hidden": "true"
+      }, view.perPage)
+    }, createElement(DropdownMenuItemLabel, null, __('Rows per page')))
   }, PAGE_SIZE_VALUES.map(size => {
-    return createElement(DropdownMenuItem, {
+    return createElement(DropdownMenuRadioItem, {
       key: size,
-      role: "menuitemradio",
-      "aria-checked": view.perPage === size,
-      prefix: view.perPage === size && createElement(Icon, {
-        icon: check
-      }),
-      onSelect: event => {
-        // We need to handle this on DropDown component probably..
-        event.preventDefault();
+      value: size,
+      name: "view-actions-page-size",
+      checked: view.perPage === size,
+      onChange: () => {
         onChangeView({
           ...view,
+          // `e.target.value` holds the same value as `size` but as a string,
+          // so we use `size` directly to avoid parsing to int.
           perPage: size,
           page: 1
         });
       }
-    }, size);
+    }, createElement(DropdownMenuItemLabel, null, size));
   }));
 }
 function FieldsVisibilityMenu({
@@ -96,41 +92,22 @@ function FieldsVisibilityMenu({
   if (!hidableFields?.length) {
     return null;
   }
-  return createElement(DropdownSubMenu, {
-    trigger: createElement(DropdownSubMenuTrigger, {
-      suffix: createElement(Icon, {
-        icon: chevronRightSmall
-      })
-    }, __('Fields'))
+  return createElement(DropdownMenu, {
+    trigger: createElement(DropdownMenuItem, null, createElement(DropdownMenuItemLabel, null, __('Fields')))
   }, hidableFields?.map(field => {
-    return createElement(DropdownMenuItem, {
+    return createElement(DropdownMenuCheckboxItem, {
       key: field.id,
-      role: "menuitemcheckbox",
-      prefix: !view.hiddenFields?.includes(field.id) && createElement(Icon, {
-        icon: check
-      }),
-      onSelect: event => {
-        event.preventDefault();
+      value: field.id,
+      checked: !view.hiddenFields?.includes(field.id),
+      onChange: () => {
         onChangeView({
           ...view,
           hiddenFields: view.hiddenFields?.includes(field.id) ? view.hiddenFields.filter(id => id !== field.id) : [...(view.hiddenFields || []), field.id]
         });
       }
-    }, field.header);
+    }, createElement(DropdownMenuItemLabel, null, field.header));
   }));
 }
-
-// This object is used to construct the sorting options per sortable field.
-const sortingItemsInfo = {
-  asc: {
-    icon: arrowUp,
-    label: __('Sort ascending')
-  },
-  desc: {
-    icon: arrowDown,
-    label: __('Sort descending')
-  }
-};
 function SortMenu({
   fields,
   view,
@@ -141,36 +118,35 @@ function SortMenu({
     return null;
   }
   const currentSortedField = fields.find(field => field.id === view.sort?.field);
-  return createElement(DropdownSubMenu, {
-    trigger: createElement(DropdownSubMenuTrigger, {
-      suffix: createElement(Fragment, null, currentSortedField?.header, createElement(Icon, {
-        icon: chevronRightSmall
-      }))
-    }, __('Sort by'))
+  return createElement(DropdownMenu, {
+    trigger: createElement(DropdownMenuItem, {
+      suffix: createElement("span", {
+        "aria-hidden": "true"
+      }, currentSortedField?.header)
+    }, createElement(DropdownMenuItemLabel, null, __('Sort by')))
   }, sortableFields?.map(field => {
     const sortedDirection = view.sort?.direction;
-    return createElement(DropdownSubMenu, {
+    return createElement(DropdownMenu, {
       key: field.id,
-      trigger: createElement(DropdownSubMenuTrigger, {
-        suffix: createElement(Icon, {
-          icon: chevronRightSmall
-        })
-      }, field.header),
-      side: "left"
-    }, Object.entries(sortingItemsInfo).map(([direction, info]) => {
-      const isActive = currentSortedField && sortedDirection === direction && field.id === currentSortedField.id;
-      return createElement(DropdownMenuItem, {
-        key: direction,
-        role: "menuitemradio",
-        "aria-checked": isActive,
-        prefix: createElement(Icon, {
-          icon: info.icon
-        }),
-        suffix: isActive && createElement(Icon, {
-          icon: check
-        }),
-        onSelect: event => {
-          event.preventDefault();
+      trigger: createElement(DropdownMenuItem, null, createElement(DropdownMenuItemLabel, null, field.header)),
+      style: {
+        minWidth: '220px'
+      }
+    }, Object.entries(SORTING_DIRECTIONS).map(([direction, info]) => {
+      const isChecked = currentSortedField !== undefined && sortedDirection === direction && field.id === currentSortedField.id;
+      const value = `${field.id}-${direction}`;
+      return createElement(DropdownMenuRadioItem, {
+        key: value
+        // All sorting radio items share the same name, so that
+        // selecting a sorting option automatically deselects the
+        // previously selected one, even if it is displayed in
+        // another submenu. The field and direction are passed via
+        // the `value` prop.
+        ,
+        name: "view-actions-sorting",
+        value: value,
+        checked: isChecked,
+        onChange: () => {
           onChangeView({
             ...view,
             sort: {
@@ -179,11 +155,11 @@ function SortMenu({
             }
           });
         }
-      }, info.label);
+      }, createElement(DropdownMenuItemLabel, null, info.label));
     }));
   }));
 }
-export default function ViewActions({
+const ViewActions = memo(function ViewActions({
   fields,
   view,
   onChangeView,
@@ -191,12 +167,11 @@ export default function ViewActions({
 }) {
   return createElement(DropdownMenu, {
     trigger: createElement(Button, {
-      variant: "tertiary",
       size: "compact",
       icon: VIEW_LAYOUTS.find(v => v.type === view.type)?.icon || VIEW_LAYOUTS.find(v => v.type === LAYOUT_TABLE).icon,
       label: __('View options')
     })
-  }, createElement(DropdownMenuGroup, null, createElement(ViewTypeMenu, {
+  }, createElement(DropdownMenuGroup, null, window?.__experimentalAdminViews && createElement(ViewTypeMenu, {
     view: view,
     onChangeView: onChangeView,
     supportedLayouts: supportedLayouts
@@ -212,5 +187,6 @@ export default function ViewActions({
     view: view,
     onChangeView: onChangeView
   })));
-}
+});
+export default ViewActions;
 //# sourceMappingURL=view-actions.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["Button","Icon","privateApis","componentsPrivateApis","chevronRightSmall","check","arrowUp","arrowDown","__","unlock","VIEW_LAYOUTS","LAYOUT_TABLE","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownSubMenuV2","DropdownSubMenu","DropdownSubMenuTriggerV2","DropdownSubMenuTrigger","ViewTypeMenu","view","onChangeView","supportedLayouts","_availableViews","filter","_view","includes","type","length","activeView","find","v","createElement","trigger","suffix","Fragment","label","icon","map","availableView","key","role","id","prefix","onSelect","event","preventDefault","PAGE_SIZE_VALUES","PageSizeMenu","perPage","size","page","FieldsVisibilityMenu","fields","hidableFields","field","enableHiding","layout","mediaField","hiddenFields","header","sortingItemsInfo","asc","desc","SortMenu","sortableFields","enableSorting","currentSortedField","sort","sortedDirection","direction","side","Object","entries","info","isActive","ViewActions","variant"],"sources":["@wordpress/dataviews/src/view-actions.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { chevronRightSmall, check, arrowUp, arrowDown } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\nimport { VIEW_LAYOUTS, LAYOUT_TABLE } from './constants';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownSubMenuV2: DropdownSubMenu,\n\tDropdownSubMenuTriggerV2: DropdownSubMenuTrigger,\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<DropdownSubMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownSubMenuTrigger\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ activeView.label }\n\t\t\t\t\t\t\t<Icon icon={ chevronRightSmall } />\n\t\t\t\t\t\t</>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t</DropdownSubMenuTrigger>\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<DropdownMenuItem\n\t\t\t\t\t\tkey={ availableView.type }\n\t\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\t\taria-checked={ availableView.id === view.type }\n\t\t\t\t\t\tprefix={\n\t\t\t\t\t\t\tavailableView.type === view.type && (\n\t\t\t\t\t\t\t\t<Icon icon={ check } />\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\t// We need to handle this on DropDown component probably..\n\t\t\t\t\t\t\tevent.preventDefault();\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: availableView.type,\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{ availableView.label }\n\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownSubMenu>\n\t);\n}\n\nconst PAGE_SIZE_VALUES = [ 10, 20, 50, 100 ];\nfunction PageSizeMenu( { view, onChangeView } ) {\n\treturn (\n\t\t<DropdownSubMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownSubMenuTrigger\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ view.perPage }\n\t\t\t\t\t\t\t<Icon icon={ chevronRightSmall } />\n\t\t\t\t\t\t</>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ /* TODO: probably label per view type. */ }\n\t\t\t\t\t{ __( 'Rows per page' ) }\n\t\t\t\t</DropdownSubMenuTrigger>\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<DropdownMenuItem\n\t\t\t\t\t\tkey={ size }\n\t\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\t\taria-checked={ view.perPage === size }\n\t\t\t\t\t\tprefix={\n\t\t\t\t\t\t\tview.perPage === size && <Icon icon={ check } />\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\t// We need to handle this on DropDown component probably..\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tonChangeView( { ...view, perPage: size, page: 1 } );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ size }\n\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownSubMenu>\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<DropdownSubMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownSubMenuTrigger\n\t\t\t\t\tsuffix={ <Icon icon={ chevronRightSmall } /> }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Fields' ) }\n\t\t\t\t</DropdownSubMenuTrigger>\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<DropdownMenuItem\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t\tprefix={\n\t\t\t\t\t\t\t! view.hiddenFields?.includes( field.id ) && (\n\t\t\t\t\t\t\t\t<Icon icon={ check } />\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\tevent.preventDefault();\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{ field.header }\n\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownSubMenu>\n\t);\n}\n\n// This object is used to construct the sorting options per sortable field.\nconst sortingItemsInfo = {\n\tasc: { icon: arrowUp, label: __( 'Sort ascending' ) },\n\tdesc: { icon: arrowDown, label: __( 'Sort descending' ) },\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<DropdownSubMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownSubMenuTrigger\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ currentSortedField?.header }\n\t\t\t\t\t\t\t<Icon icon={ chevronRightSmall } />\n\t\t\t\t\t\t</>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Sort by' ) }\n\t\t\t\t</DropdownSubMenuTrigger>\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<DropdownSubMenu\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<DropdownSubMenuTrigger\n\t\t\t\t\t\t\t\tsuffix={ <Icon icon={ chevronRightSmall } /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t</DropdownSubMenuTrigger>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tside=\"left\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ Object.entries( sortingItemsInfo ).map(\n\t\t\t\t\t\t\t( [ direction, info ] ) => {\n\t\t\t\t\t\t\t\tconst isActive =\n\t\t\t\t\t\t\t\t\tcurrentSortedField &&\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\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\t\t\t\t\t\taria-checked={ isActive }\n\t\t\t\t\t\t\t\t\t\tprefix={ <Icon icon={ info.icon } /> }\n\t\t\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t\t\tisActive && <Icon icon={ check } />\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\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{ info.label }\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}\n\t\t\t\t\t\t) }\n\t\t\t\t\t</DropdownSubMenu>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownSubMenu>\n\t);\n}\n\nexport default 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\tvariant=\"tertiary\"\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\ticon={\n\t\t\t\t\t\tVIEW_LAYOUTS.find( ( v ) => v.type === view.type )\n\t\t\t\t\t\t\t?.icon ||\n\t\t\t\t\t\tVIEW_LAYOUTS.find( ( v ) => v.type === LAYOUT_TABLE )\n\t\t\t\t\t\t\t.icon\n\t\t\t\t\t}\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"],"mappings":"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"}
+{"version":3,"names":["Button","privateApis","componentsPrivateApis","__","memo","unlock","VIEW_LAYOUTS","LAYOUT_TABLE","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","window","__experimentalAdminViews"],"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';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\nimport { VIEW_LAYOUTS, LAYOUT_TABLE, 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{ /* TODO: probably label per view type. */ }\n\t\t\t\t\t\t{ __( 'Rows 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={\n\t\t\t\t\t\tVIEW_LAYOUTS.find( ( v ) => v.type === view.type )\n\t\t\t\t\t\t\t?.icon ||\n\t\t\t\t\t\tVIEW_LAYOUTS.find( ( v ) => v.type === LAYOUT_TABLE )\n\t\t\t\t\t\t\t.icon\n\t\t\t\t\t}\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{ window?.__experimentalAdminViews && (\n\t\t\t\t\t<ViewTypeMenu\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) }\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

@@ -28,10 +28,10 @@ export default function ViewGrid({
     gap: 8,
     columns: 2,
     alignment: "top",
-    className: "dataviews-grid-view"
-  }, usedData.map((item, index) => createElement(VStack, {
+    className: "dataviews-view-grid"
+  }, usedData.map(item => createElement(VStack, {
     spacing: 3,
-    key: getItemId?.(item) || index,
+    key: getItemId(item),
     className: "dataviews-view-grid__card"
   }, createElement("div", {
     className: "dataviews-view-grid__media"
@@ -64,9 +64,7 @@ export default function ViewGrid({
       className: "dataviews-view-grid__field-header"
     }, field.header), createElement("div", {
       className: "dataviews-view-grid__field-value"
-    }, field.render({
-      item
-    })));
+    }, renderedValue));
   })))));
 }
 //# sourceMappingURL=view-grid.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["FlexBlock","__experimentalGrid","Grid","__experimentalHStack","HStack","__experimentalVStack","VStack","useAsyncList","ItemActions","ViewGrid","data","fields","view","actions","getItemId","deferredRendering","mediaField","find","field","id","layout","primaryField","visibleFields","filter","hiddenFields","includes","shownData","step","usedData","createElement","gap","columns","alignment","className","map","item","index","spacing","key","render","justify","isCompact","renderedValue","header"],"sources":["@wordpress/dataviews/src/view-grid.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tFlexBlock,\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useAsyncList } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\n\nexport default function ViewGrid( {\n\tdata,\n\tfields,\n\tview,\n\tactions,\n\tgetItemId,\n\tdeferredRendering,\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\treturn (\n\t\t<Grid\n\t\t\tgap={ 8 }\n\t\t\tcolumns={ 2 }\n\t\t\talignment=\"top\"\n\t\t\tclassName=\"dataviews-grid-view\"\n\t\t>\n\t\t\t{ usedData.map( ( item, index ) => (\n\t\t\t\t<VStack\n\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\tkey={ getItemId?.( item ) || index }\n\t\t\t\t\tclassName=\"dataviews-view-grid__card\"\n\t\t\t\t>\n\t\t\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t\t\t{ mediaField?.render( { item } ) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tclassName=\"dataviews-view-grid__primary-field\"\n\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t<ItemActions\n\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\tisCompact\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t<VStack\n\t\t\t\t\t\tclassName=\"dataviews-view-grid__fields\"\n\t\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field\"\n\t\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-grid__field-header\">\n\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t</div>\n\t\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\t{ field.render( { item } ) }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</VStack>\n\t\t\t\t</VStack>\n\t\t\t) ) }\n\t\t</Grid>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["FlexBlock","__experimentalGrid","Grid","__experimentalHStack","HStack","__experimentalVStack","VStack","useAsyncList","ItemActions","ViewGrid","data","fields","view","actions","getItemId","deferredRendering","mediaField","find","field","id","layout","primaryField","visibleFields","filter","hiddenFields","includes","shownData","step","usedData","createElement","gap","columns","alignment","className","map","item","spacing","key","render","justify","isCompact","renderedValue","header"],"sources":["@wordpress/dataviews/src/view-grid.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tFlexBlock,\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useAsyncList } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\n\nexport default function ViewGrid( {\n\tdata,\n\tfields,\n\tview,\n\tactions,\n\tgetItemId,\n\tdeferredRendering,\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\treturn (\n\t\t<Grid\n\t\t\tgap={ 8 }\n\t\t\tcolumns={ 2 }\n\t\t\talignment=\"top\"\n\t\t\tclassName=\"dataviews-view-grid\"\n\t\t>\n\t\t\t{ usedData.map( ( item ) => (\n\t\t\t\t<VStack\n\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\tclassName=\"dataviews-view-grid__card\"\n\t\t\t\t>\n\t\t\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t\t\t{ mediaField?.render( { item } ) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tclassName=\"dataviews-view-grid__primary-field\"\n\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t<ItemActions\n\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\tisCompact\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t<VStack\n\t\t\t\t\t\tclassName=\"dataviews-view-grid__fields\"\n\t\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field\"\n\t\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-grid__field-header\">\n\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t</div>\n\t\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\t{ renderedValue }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</VStack>\n\t\t\t\t</VStack>\n\t\t\t) ) }\n\t\t</Grid>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SACCA,SAAS,EACTC,kBAAkB,IAAIC,IAAI,EAC1BC,oBAAoB,IAAIC,MAAM,EAC9BC,oBAAoB,IAAIC,MAAM,QACxB,uBAAuB;AAC9B,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA,OAAOC,WAAW,MAAM,gBAAgB;AAExC,eAAe,SAASC,QAAQA,CAAE;EACjCC,IAAI;EACJC,MAAM;EACNC,IAAI;EACJC,OAAO;EACPC,SAAS;EACTC;AACD,CAAC,EAAG;EACH,MAAMC,UAAU,GAAGL,MAAM,CAACM,IAAI,CAC3BC,KAAK,IAAMA,KAAK,CAACC,EAAE,KAAKP,IAAI,CAACQ,MAAM,CAACJ,UACvC,CAAC;EACD,MAAMK,YAAY,GAAGV,MAAM,CAACM,IAAI,CAC7BC,KAAK,IAAMA,KAAK,CAACC,EAAE,KAAKP,IAAI,CAACQ,MAAM,CAACC,YACvC,CAAC;EACD,MAAMC,aAAa,GAAGX,MAAM,CAACY,MAAM,CAChCL,KAAK,IACN,CAAEN,IAAI,CAACY,YAAY,CAACC,QAAQ,CAAEP,KAAK,CAACC,EAAG,CAAC,IACxC,CAAE,CAAEP,IAAI,CAACQ,MAAM,CAACJ,UAAU,EAAEJ,IAAI,CAACQ,MAAM,CAACC,YAAY,CAAE,CAACI,QAAQ,CAC9DP,KAAK,CAACC,EACP,CACF,CAAC;EACD,MAAMO,SAAS,GAAGnB,YAAY,CAAEG,IAAI,EAAE;IAAEiB,IAAI,EAAE;EAAE,CAAE,CAAC;EACnD,MAAMC,QAAQ,GAAGb,iBAAiB,GAAGW,SAAS,GAAGhB,IAAI;EACrD,OACCmB,aAAA,CAAC3B,IAAI;IACJ4B,GAAG,EAAG,CAAG;IACTC,OAAO,EAAG,CAAG;IACbC,SAAS,EAAC,KAAK;IACfC,SAAS,EAAC;EAAqB,GAE7BL,QAAQ,CAACM,GAAG,CAAIC,IAAI,IACrBN,aAAA,CAACvB,MAAM;IACN8B,OAAO,EAAG,CAAG;IACbC,GAAG,EAAGvB,SAAS,CAAEqB,IAAK,CAAG;IACzBF,SAAS,EAAC;EAA2B,GAErCJ,aAAA;IAAKI,SAAS,EAAC;EAA4B,GACxCjB,UAAU,EAAEsB,MAAM,CAAE;IAAEH;EAAK,CAAE,CAC3B,CAAC,EACNN,aAAA,CAACzB,MAAM;IACN6B,SAAS,EAAC,oCAAoC;IAC9CM,OAAO,EAAC;EAAe,GAEvBV,aAAA,CAAC7B,SAAS,QACPqB,YAAY,EAAEiB,MAAM,CAAE;IAAEH;EAAK,CAAE,CACvB,CAAC,EACZN,aAAA,CAACrB,WAAW;IACX2B,IAAI,EAAGA,IAAM;IACbtB,OAAO,EAAGA,OAAS;IACnB2B,SAAS;EAAA,CACT,CACM,CAAC,EACTX,aAAA,CAACvB,MAAM;IACN2B,SAAS,EAAC,6BAA6B;IACvCG,OAAO,EAAG;EAAG,GAEXd,aAAa,CAACY,GAAG,CAAIhB,KAAK,IAAM;IACjC,MAAMuB,aAAa,GAAGvB,KAAK,CAACoB,MAAM,CAAE;MACnCH;IACD,CAAE,CAAC;IACH,IAAK,CAAEM,aAAa,EAAG;MACtB,OAAO,IAAI;IACZ;IACA,OACCZ,aAAA,CAACvB,MAAM;MACN2B,SAAS,EAAC,4BAA4B;MACtCI,GAAG,EAAGnB,KAAK,CAACC,EAAI;MAChBiB,OAAO,EAAG;IAAG,GAEbP,aAAA;MAAKI,SAAS,EAAC;IAAmC,GAC/Cf,KAAK,CAACwB,MACJ,CAAC,EACNb,aAAA;MAAKI,SAAS,EAAC;IAAkC,GAC9CQ,aACE,CACE,CAAC;EAEX,CAAE,CACK,CACD,CACP,CACG,CAAC;AAET"}