@wordpress/edit-site 5.23.0 → 5.24.0

package/build/components/dataviews/view-grid.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.ViewGrid = ViewGrid;
 var _react = require("react");
 var _components = require("@wordpress/components");
+var _compose = require("@wordpress/compose");
 var _itemActions = _interopRequireDefault(require("./item-actions"));
 /**
  * WordPress dependencies
@@ -20,40 +21,62 @@ function ViewGrid({
   data,
   fields,
   view,
-  actions
+  actions,
+  getItemId
 }) {
   const mediaField = fields.find(field => field.id === view.layout.mediaField);
-  const visibleFields = fields.filter(field => !view.hiddenFields.includes(field.id) && field.id !== view.layout.mediaField);
+  const primaryField = fields.find(field => field.id === view.layout.primaryField);
+  const visibleFields = fields.filter(field => !view.hiddenFields.includes(field.id) && ![view.layout.mediaField, view.layout.primaryField].includes(field.id));
+  const shownData = (0, _compose.useAsyncList)(data, {
+    step: 3
+  });
   return (0, _react.createElement)(_components.__experimentalGrid, {
     gap: 8,
     columns: 2,
-    alignment: "top"
-  }, data.map((item, index) => {
-    return (0, _react.createElement)(_components.__experimentalVStack, {
-      key: index
-    }, (0, _react.createElement)("div", {
-      className: "dataviews-view-grid__media"
-    }, mediaField?.render({
+    alignment: "top",
+    className: "dataviews-grid-view"
+  }, shownData.map((item, index) => (0, _react.createElement)(_components.__experimentalVStack, {
+    spacing: 3,
+    key: getItemId?.(item) || index,
+    className: "dataviews-view-grid__card"
+  }, (0, _react.createElement)("div", {
+    className: "dataviews-view-grid__media"
+  }, mediaField?.render({
+    item,
+    view
+  })), (0, _react.createElement)(_components.__experimentalHStack, {
+    className: "dataviews-view-grid__title",
+    justify: "space-between"
+  }, primaryField?.render({
+    item,
+    view
+  }), (0, _react.createElement)(_itemActions.default, {
+    item: item,
+    actions: actions,
+    isCompact: true
+  })), (0, _react.createElement)(_components.__experimentalVStack, {
+    className: "dataviews-view-grid__fields",
+    spacing: 3
+  }, visibleFields.map(field => {
+    const renderedValue = field.render({
       item,
       view
-    }) || (0, _react.createElement)(_components.Placeholder, {
-      withIllustration: true,
-      style: {
-        width: '100%',
-        minHeight: '200px'
-      }
-    })), (0, _react.createElement)(_components.__experimentalHStack, {
-      justify: "space-between",
-      alignment: "top"
-    }, (0, _react.createElement)(_components.FlexBlock, null, (0, _react.createElement)(_components.__experimentalVStack, null, visibleFields.map(field => (0, _react.createElement)("div", {
-      key: field.id
+    });
+    if (!renderedValue) {
+      return null;
+    }
+    return (0, _react.createElement)(_components.__experimentalVStack, {
+      className: "dataviews-view-grid__field",
+      key: field.id,
+      spacing: 1
+    }, (0, _react.createElement)("div", {
+      className: "dataviews-view-grid__field-header"
+    }, field.header), (0, _react.createElement)("div", {
+      className: "dataviews-view-grid__field-value"
     }, field.render({
       item,
       view
-    }))))), (0, _react.createElement)(_components.FlexBlock, null, (0, _react.createElement)(_itemActions.default, {
-      item: item,
-      actions: actions
-    }))));
-  }));
+    })));
+  })))));
 }
 //# sourceMappingURL=view-grid.js.map

package/build/components/dataviews/view-grid.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_itemActions","_interopRequireDefault","ViewGrid","data","fields","view","actions","mediaField","find","field","id","layout","visibleFields","filter","hiddenFields","includes","_react","createElement","__experimentalGrid","gap","columns","alignment","map","item","index","__experimentalVStack","key","className","render","Placeholder","withIllustration","style","width","minHeight","__experimentalHStack","justify","FlexBlock","default"],"sources":["@wordpress/edit-site/src/components/dataviews/view-grid.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tFlexBlock,\n\tPlaceholder,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\n\nexport function ViewGrid( { data, fields, view, actions } ) {\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst visibleFields = fields.filter(\n\t\t( field ) =>\n\t\t\t! view.hiddenFields.includes( field.id ) &&\n\t\t\tfield.id !== view.layout.mediaField\n\t);\n\treturn (\n\t\t<Grid gap={ 8 } columns={ 2 } alignment=\"top\">\n\t\t\t{ data.map( ( item, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack key={ index }>\n\t\t\t\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t\t\t\t{ mediaField?.render( { item, view } ) || (\n\t\t\t\t\t\t\t\t<Placeholder\n\t\t\t\t\t\t\t\t\twithIllustration\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\tminHeight: '200px',\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</div>\n\n\t\t\t\t\t\t<HStack justify=\"space-between\" alignment=\"top\">\n\t\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t\t<VStack>\n\t\t\t\t\t\t\t\t\t{ visibleFields.map( ( field ) => (\n\t\t\t\t\t\t\t\t\t\t<div key={ field.id }>\n\t\t\t\t\t\t\t\t\t\t\t{ field.render( { item, view } ) }\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t\t<ItemActions\n\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Grid>\n\t);\n}\n"],"mappings":";;;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAWA,IAAAC,YAAA,GAAAC,sBAAA,CAAAF,OAAA;AAdA;AACA;AACA;;AASA;AACA;AACA;;AAGO,SAASG,QAAQA,CAAE;EAAEC,IAAI;EAAEC,MAAM;EAAEC,IAAI;EAAEC;AAAQ,CAAC,EAAG;EAC3D,MAAMC,UAAU,GAAGH,MAAM,CAACI,IAAI,CAC3BC,KAAK,IAAMA,KAAK,CAACC,EAAE,KAAKL,IAAI,CAACM,MAAM,CAACJ,UACvC,CAAC;EACD,MAAMK,aAAa,GAAGR,MAAM,CAACS,MAAM,CAChCJ,KAAK,IACN,CAAEJ,IAAI,CAACS,YAAY,CAACC,QAAQ,CAAEN,KAAK,CAACC,EAAG,CAAC,IACxCD,KAAK,CAACC,EAAE,KAAKL,IAAI,CAACM,MAAM,CAACJ,UAC3B,CAAC;EACD,OACC,IAAAS,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAAoB,kBAAI;IAACC,GAAG,EAAG,CAAG;IAACC,OAAO,EAAG,CAAG;IAACC,SAAS,EAAC;EAAK,GAC1ClB,IAAI,CAACmB,GAAG,CAAE,CAAEC,IAAI,EAAEC,KAAK,KAAM;IAC9B,OACC,IAAAR,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAA2B,oBAAM;MAACC,GAAG,EAAGF;IAAO,GACpB,IAAAR,MAAA,CAAAC,aAAA;MAAKU,SAAS,EAAC;IAA4B,GACxCpB,UAAU,EAAEqB,MAAM,CAAE;MAAEL,IAAI;MAAElB;IAAK,CAAE,CAAC,IACrC,IAAAW,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAA+B,WAAW;MACXC,gBAAgB;MAChBC,KAAK,EAAG;QACPC,KAAK,EAAE,MAAM;QACbC,SAAS,EAAE;MACZ;IAAG,CACH,CAEE,CAAC,EAEN,IAAAjB,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAAoC,oBAAM;MAACC,OAAO,EAAC,eAAe;MAACd,SAAS,EAAC;IAAK,GAC9C,IAAAL,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAAsC,SAAS,QACT,IAAApB,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAA2B,oBAAM,QACJb,aAAa,CAACU,GAAG,CAAIb,KAAK,IAC3B,IAAAO,MAAA,CAAAC,aAAA;MAAKS,GAAG,EAAGjB,KAAK,CAACC;IAAI,GAClBD,KAAK,CAACmB,MAAM,CAAE;MAAEL,IAAI;MAAElB;IAAK,CAAE,CAC3B,CACJ,CACK,CACE,CAAC,EACZ,IAAAW,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAAsC,SAAS,QACT,IAAApB,MAAA,CAAAC,aAAA,EAACjB,YAAA,CAAAqC,OAAW;MACXd,IAAI,EAAGA,IAAM;MACbjB,OAAO,EAAGA;IAAS,CACnB,CACS,CACJ,CACD,CAAC;EAEX,CAAE,CACG,CAAC;AAET"}
+{"version":3,"names":["_components","require","_compose","_itemActions","_interopRequireDefault","ViewGrid","data","fields","view","actions","getItemId","mediaField","find","field","id","layout","primaryField","visibleFields","filter","hiddenFields","includes","shownData","useAsyncList","step","_react","createElement","__experimentalGrid","gap","columns","alignment","className","map","item","index","__experimentalVStack","spacing","key","render","__experimentalHStack","justify","default","isCompact","renderedValue","header"],"sources":["@wordpress/edit-site/src/components/dataviews/view-grid.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\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 function ViewGrid( { data, fields, view, actions, getItemId } ) {\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\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{ shownData.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, view } ) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tclassName=\"dataviews-view-grid__title\"\n\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ primaryField?.render( { item, view } ) }\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\tview,\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, view } ) }\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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"}

package/build/components/dataviews/view-list.js

@@ -8,11 +8,13 @@ exports.default = void 0;
 var _react = require("react");
 var _reactTable = require("@tanstack/react-table");
 var _i18n = require("@wordpress/i18n");
+var _compose = require("@wordpress/compose");
 var _icons = require("@wordpress/icons");
 var _components = require("@wordpress/components");
 var _element = require("@wordpress/element");
 var _lockUnlock = require("../../lock-unlock");
 var _itemActions = _interopRequireDefault(require("./item-actions"));
+var _constants = require("./constants");
 /**
  * External dependencies
  */
@@ -26,12 +28,12 @@ var _itemActions = _interopRequireDefault(require("./item-actions"));
  */
 
 const {
-  DropdownMenuV2,
-  DropdownMenuGroupV2,
-  DropdownMenuItemV2,
-  DropdownMenuSeparatorV2,
-  DropdownSubMenuV2,
-  DropdownSubMenuTriggerV2
+  DropdownMenuV2: DropdownMenu,
+  DropdownMenuGroupV2: DropdownMenuGroup,
+  DropdownMenuItemV2: DropdownMenuItem,
+  DropdownMenuSeparatorV2: DropdownMenuSeparator,
+  DropdownSubMenuV2: DropdownSubMenu,
+  DropdownSubMenuTriggerV2: DropdownSubMenuTrigger
 } = (0, _lockUnlock.unlock)(_components.privateApis);
 const EMPTY_OBJECT = {};
 const sortingItemsInfo = {
@@ -63,17 +65,14 @@ function HeaderMenu({
   }
   const sortedDirection = header.column.getIsSorted();
   let filter;
-  if (header.column.columnDef.filters?.length > 0 && header.column.columnDef.filters.some(f => 'string' === typeof f && f === 'in')) {
+  if (header.column.columnDef.type === _constants.ENUMERATION_TYPE) {
     filter = {
       field: header.column.columnDef.id,
-      elements: [{
-        value: '',
-        label: (0, _i18n.__)('All')
-      }, ...(header.column.columnDef.elements || [])]
+      elements: header.column.columnDef.elements || []
     };
   }
   const isFilterable = !!filter;
-  return (0, _react.createElement)(DropdownMenuV2, {
+  return (0, _react.createElement)(DropdownMenu, {
     align: "start",
     trigger: (0, _react.createElement)(_components.Button, {
       icon: sortIcons[header.column.getIsSorted()],
@@ -83,7 +82,7 @@ function HeaderMenu({
         padding: 0
       }
     })
-  }, (0, _react.createElement)(WithSeparators, null, isSortable && (0, _react.createElement)(DropdownMenuGroupV2, null, Object.entries(sortingItemsInfo).map(([direction, info]) => (0, _react.createElement)(DropdownMenuItemV2, {
+  }, (0, _react.createElement)(WithSeparators, null, isSortable && (0, _react.createElement)(DropdownMenuGroup, null, Object.entries(sortingItemsInfo).map(([direction, info]) => (0, _react.createElement)(DropdownMenuItem, {
     key: direction,
     prefix: (0, _react.createElement)(_components.Icon, {
       icon: info.icon
@@ -102,7 +101,7 @@ function HeaderMenu({
         }]);
       }
     }
-  }, info.label))), isHidable && (0, _react.createElement)(DropdownMenuItemV2, {
+  }, info.label))), isHidable && (0, _react.createElement)(DropdownMenuItem, {
     prefix: (0, _react.createElement)(_components.Icon, {
       icon: _icons.unseen
     }),
@@ -110,9 +109,9 @@ function HeaderMenu({
       event.preventDefault();
       header.column.getToggleVisibilityHandler()(event);
     }
-  }, (0, _i18n.__)('Hide')), isFilterable && (0, _react.createElement)(DropdownMenuGroupV2, null, (0, _react.createElement)(DropdownSubMenuV2, {
+  }, (0, _i18n.__)('Hide')), isFilterable && (0, _react.createElement)(DropdownMenuGroup, null, (0, _react.createElement)(DropdownSubMenu, {
     key: filter.field,
-    trigger: (0, _react.createElement)(DropdownSubMenuTriggerV2, {
+    trigger: (0, _react.createElement)(DropdownSubMenuTrigger, {
       prefix: (0, _react.createElement)(_components.Icon, {
         icon: _icons.funnel
       }),
@@ -124,11 +123,6 @@ function HeaderMenu({
     let isActive = false;
     const columnFilters = dataView.getState().columnFilters;
     const columnFilter = columnFilters.find(f => Object.keys(f)[0].split(':')[0] === filter.field);
-
-    // Set the empty item as active if the filter is not set.
-    if (!columnFilter && element.value === '') {
-      isActive = true;
-    }
     if (columnFilter) {
       const value = Object.values(columnFilter)[0];
       // Intentionally use loose comparison, so it does type conversion.
@@ -136,7 +130,7 @@ function HeaderMenu({
       isActive = element.value == value; // eslint-disable-line eqeqeq
     }
 
-    return (0, _react.createElement)(DropdownMenuItemV2, {
+    return (0, _react.createElement)(DropdownMenuItem, {
       key: element.value,
       suffix: isActive && (0, _react.createElement)(_components.Icon, {
         icon: _icons.check
@@ -144,15 +138,11 @@ function HeaderMenu({
       onSelect: () => {
         const otherFilters = columnFilters?.filter(f => {
           const [field, operator] = Object.keys(f)[0].split(':');
-          return field !== filter.field || operator !== 'in';
+          return field !== filter.field || operator !== _constants.OPERATOR_IN;
         });
-        if (element.value === '') {
-          dataView.setColumnFilters(otherFilters);
-        } else {
-          dataView.setColumnFilters([...otherFilters, {
-            [filter.field + ':in']: element.value
-          }]);
-        }
+        dataView.setColumnFilters([...otherFilters, {
+          [filter.field + ':in']: isActive ? undefined : element.value
+        }]);
       }
     }, element.label);
   })))));
@@ -162,7 +152,7 @@ function WithSeparators({
 }) {
   return _element.Children.toArray(children).filter(Boolean).map((child, i) => (0, _react.createElement)(_element.Fragment, {
     key: i
-  }, i > 0 && (0, _react.createElement)(DropdownMenuSeparatorV2, null), child));
+  }, i > 0 && (0, _react.createElement)(DropdownMenuSeparator, null), child));
 }
 function ViewList({
   view,
@@ -170,6 +160,7 @@ function ViewList({
   fields,
   actions,
   data,
+  getItemId,
   isLoading = false,
   paginationInfo
 }) {
@@ -269,8 +260,9 @@ function ViewList({
       value
     };
   });
+  const shownData = (0, _compose.useAsyncList)(data);
   const dataView = (0, _reactTable.useReactTable)({
-    data,
+    data: shownData,
     columns,
     manualSorting: true,
     manualFiltering: true,
@@ -289,6 +281,7 @@ function ViewList({
       },
       columnVisibility: columnVisibility !== null && columnVisibility !== void 0 ? columnVisibility : EMPTY_OBJECT
     },
+    getRowId: getItemId,
     onSortingChange: sortingUpdater => {
       onChangeView(currentView => {
         const sort = typeof sortingUpdater === 'function' ? sortingUpdater(currentView.sort ? [{
@@ -383,6 +376,7 @@ function ViewList({
     colSpan: header.colSpan,
     style: {
       width: header.column.columnDef.width || undefined,
+      minWidth: header.column.columnDef.minWidth || undefined,
       maxWidth: header.column.columnDef.maxWidth || undefined
     },
     "data-field-id": header.id
@@ -392,9 +386,10 @@ function ViewList({
   })))))), (0, _react.createElement)("tbody", null, rows.map(row => (0, _react.createElement)("tr", {
     key: row.id
   }, row.getVisibleCells().map(cell => (0, _react.createElement)("td", {
-    key: cell.id,
+    key: cell.column.id,
     style: {
       width: cell.column.columnDef.width || undefined,
+      minWidth: cell.column.columnDef.minWidth || undefined,
       maxWidth: cell.column.columnDef.maxWidth || undefined
     }
   }, (0, _reactTable.flexRender)(cell.column.columnDef.cell, cell.getContext()))))))), !hasRows && (0, _react.createElement)("p", null, (0, _i18n.__)('no results')));

package/build/components/dataviews/view-list.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reactTable","require","_i18n","_icons","_components","_element","_lockUnlock","_itemActions","_interopRequireDefault","DropdownMenuV2","DropdownMenuGroupV2","DropdownMenuItemV2","DropdownMenuSeparatorV2","DropdownSubMenuV2","DropdownSubMenuTriggerV2","unlock","componentsPrivateApis","EMPTY_OBJECT","sortingItemsInfo","asc","icon","arrowUp","label","__","desc","arrowDown","sortIcons","chevronUp","chevronDown","HeaderMenu","dataView","header","isPlaceholder","text","flexRender","column","columnDef","getContext","isSortable","getCanSort","isHidable","getCanHide","sortedDirection","getIsSorted","filter","filters","length","some","f","field","id","elements","value","isFilterable","_react","createElement","align","trigger","Button","iconPosition","style","padding","WithSeparators","Object","entries","map","direction","info","key","prefix","Icon","suffix","check","onSelect","event","preventDefault","resetSorting","setSorting","unseen","getToggleVisibilityHandler","funnel","chevronRightSmall","element","isActive","columnFilters","getState","columnFilter","find","keys","split","values","otherFilters","operator","setColumnFilters","children","Children","toArray","Boolean","child","i","Fragment","ViewList","view","onChangeView","fields","actions","data","isLoading","paginationInfo","columns","useMemo","_columns","render","getValue","cell","props","item","row","original","accessorFn","push","default","enableHiding","columnVisibility","hiddenFields","reduce","accumulator","fieldId","toTanStackColumnFilters","fromTanStackColumnFilters","useReactTable","manualSorting","manualFiltering","manualPagination","enableRowSelection","state","sorting","sort","globalFilter","search","pagination","pageIndex","page","pageSize","perPage","onSortingChange","sortingUpdater","currentView","onColumnVisibilityChange","columnVisibilityUpdater","onGlobalFilterChange","onColumnFiltersChange","columnFiltersUpdater","onPaginationChange","paginationUpdater","getCoreRowModel","getFilteredRowModel","getSortedRowModel","getPaginationRowModel","pageCount","totalPages","rows","getRowModel","hasRows","className","getHeaderGroups","headerGroup","headers","colSpan","width","undefined","maxWidth","getVisibleCells","_default","exports"],"sources":["@wordpress/edit-site/src/components/dataviews/view-list.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tgetCoreRowModel,\n\tgetFilteredRowModel,\n\tgetSortedRowModel,\n\tgetPaginationRowModel,\n\tuseReactTable,\n\tflexRender,\n} from '@tanstack/react-table';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tchevronDown,\n\tchevronUp,\n\tunseen,\n\tcheck,\n\tarrowUp,\n\tarrowDown,\n\tchevronRightSmall,\n\tfunnel,\n} from '@wordpress/icons';\nimport {\n\tButton,\n\tIcon,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useMemo, Children, Fragment } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport ItemActions from './item-actions';\n\nconst {\n\tDropdownMenuV2,\n\tDropdownMenuGroupV2,\n\tDropdownMenuItemV2,\n\tDropdownMenuSeparatorV2,\n\tDropdownSubMenuV2,\n\tDropdownSubMenuTriggerV2,\n} = unlock( componentsPrivateApis );\n\nconst EMPTY_OBJECT = {};\nconst sortingItemsInfo = {\n\tasc: { icon: arrowUp, label: __( 'Sort ascending' ) },\n\tdesc: { icon: arrowDown, label: __( 'Sort descending' ) },\n};\nconst sortIcons = { asc: chevronUp, desc: chevronDown };\nfunction HeaderMenu( { dataView, header } ) {\n\tif ( header.isPlaceholder ) {\n\t\treturn null;\n\t}\n\tconst text = flexRender(\n\t\theader.column.columnDef.header,\n\t\theader.getContext()\n\t);\n\tconst isSortable = !! header.column.getCanSort();\n\tconst isHidable = !! header.column.getCanHide();\n\tif ( ! isSortable && ! isHidable ) {\n\t\treturn text;\n\t}\n\tconst sortedDirection = header.column.getIsSorted();\n\n\tlet filter;\n\tif (\n\t\theader.column.columnDef.filters?.length > 0 &&\n\t\theader.column.columnDef.filters.some(\n\t\t\t( f ) => 'string' === typeof f && f === 'in'\n\t\t)\n\t) {\n\t\tfilter = {\n\t\t\tfield: header.column.columnDef.id,\n\t\t\telements: [\n\t\t\t\t{\n\t\t\t\t\tvalue: '',\n\t\t\t\t\tlabel: __( 'All' ),\n\t\t\t\t},\n\t\t\t\t...( header.column.columnDef.elements || [] ),\n\t\t\t],\n\t\t};\n\t}\n\tconst isFilterable = !! filter;\n\n\treturn (\n\t\t<DropdownMenuV2\n\t\t\talign=\"start\"\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\ticon={ sortIcons[ header.column.getIsSorted() ] }\n\t\t\t\t\ticonPosition=\"right\"\n\t\t\t\t\ttext={ text }\n\t\t\t\t\tstyle={ { padding: 0 } }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<WithSeparators>\n\t\t\t\t{ isSortable && (\n\t\t\t\t\t<DropdownMenuGroupV2>\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\t<DropdownMenuItemV2\n\t\t\t\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\t\t\t\tprefix={ <Icon icon={ info.icon } /> }\n\t\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t\tsortedDirection === direction && (\n\t\t\t\t\t\t\t\t\t\t\t<Icon icon={ check } />\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\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\tif ( sortedDirection === direction ) {\n\t\t\t\t\t\t\t\t\t\t\tdataView.resetSorting();\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tdataView.setSorting( [\n\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\tid: header.column.id,\n\t\t\t\t\t\t\t\t\t\t\t\t\tdesc: direction === 'desc',\n\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t] );\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ info.label }\n\t\t\t\t\t\t\t\t</DropdownMenuItemV2>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) }\n\t\t\t\t\t</DropdownMenuGroupV2>\n\t\t\t\t) }\n\t\t\t\t{ isHidable && (\n\t\t\t\t\t<DropdownMenuItemV2\n\t\t\t\t\t\tprefix={ <Icon icon={ unseen } /> }\n\t\t\t\t\t\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\theader.column.getToggleVisibilityHandler()( event );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Hide' ) }\n\t\t\t\t\t</DropdownMenuItemV2>\n\t\t\t\t) }\n\t\t\t\t{ isFilterable && (\n\t\t\t\t\t<DropdownMenuGroupV2>\n\t\t\t\t\t\t<DropdownSubMenuV2\n\t\t\t\t\t\t\tkey={ filter.field }\n\t\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t\t<DropdownSubMenuTriggerV2\n\t\t\t\t\t\t\t\t\tprefix={ <Icon icon={ funnel } /> }\n\t\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t\t<Icon icon={ chevronRightSmall } />\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Filter by' ) }\n\t\t\t\t\t\t\t\t</DropdownSubMenuTriggerV2>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ filter.elements.map( ( element ) => {\n\t\t\t\t\t\t\t\tlet isActive = false;\n\t\t\t\t\t\t\t\tconst columnFilters =\n\t\t\t\t\t\t\t\t\tdataView.getState().columnFilters;\n\t\t\t\t\t\t\t\tconst columnFilter = columnFilters.find(\n\t\t\t\t\t\t\t\t\t( f ) =>\n\t\t\t\t\t\t\t\t\t\tObject.keys( f )[ 0 ].split(\n\t\t\t\t\t\t\t\t\t\t\t':'\n\t\t\t\t\t\t\t\t\t\t)[ 0 ] === filter.field\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t// Set the empty item as active if the filter is not set.\n\t\t\t\t\t\t\t\tif ( ! columnFilter && element.value === '' ) {\n\t\t\t\t\t\t\t\t\tisActive = true;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\tif ( columnFilter ) {\n\t\t\t\t\t\t\t\t\tconst value =\n\t\t\t\t\t\t\t\t\t\tObject.values( columnFilter )[ 0 ];\n\t\t\t\t\t\t\t\t\t// Intentionally use loose comparison, so it does type conversion.\n\t\t\t\t\t\t\t\t\t// This covers the case where a top-level filter for the same field converts a number into a string.\n\t\t\t\t\t\t\t\t\tisActive = element.value == value; // eslint-disable-line eqeqeq\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<DropdownMenuItemV2\n\t\t\t\t\t\t\t\t\t\tkey={ element.value }\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={ () => {\n\t\t\t\t\t\t\t\t\t\t\tconst otherFilters =\n\t\t\t\t\t\t\t\t\t\t\t\tcolumnFilters?.filter(\n\t\t\t\t\t\t\t\t\t\t\t\t\t( f ) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst [\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\toperator,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t] =\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tObject.keys(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tf\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)[ 0 ].split( ':' );\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\tfield !==\n\t\t\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\t\toperator !== 'in'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tif ( element.value === '' ) {\n\t\t\t\t\t\t\t\t\t\t\t\tdataView.setColumnFilters(\n\t\t\t\t\t\t\t\t\t\t\t\t\totherFilters\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} else {\n\t\t\t\t\t\t\t\t\t\t\t\tdataView.setColumnFilters( [\n\t\t\t\t\t\t\t\t\t\t\t\t\t...otherFilters,\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\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\t':in' ]: element.value,\n\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t] );\n\t\t\t\t\t\t\t\t\t\t\t}\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{ element.label }\n\t\t\t\t\t\t\t\t\t</DropdownMenuItemV2>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</DropdownSubMenuV2>\n\t\t\t\t\t</DropdownMenuGroupV2>\n\t\t\t\t) }\n\t\t\t</WithSeparators>\n\t\t</DropdownMenuV2>\n\t);\n}\n\nfunction WithSeparators( { children } ) {\n\treturn Children.toArray( children )\n\t\t.filter( Boolean )\n\t\t.map( ( child, i ) => (\n\t\t\t<Fragment key={ i }>\n\t\t\t\t{ i > 0 && <DropdownMenuSeparatorV2 /> }\n\t\t\t\t{ child }\n\t\t\t</Fragment>\n\t\t) );\n}\n\nfunction ViewList( {\n\tview,\n\tonChangeView,\n\tfields,\n\tactions,\n\tdata,\n\tisLoading = false,\n\tpaginationInfo,\n} ) {\n\tconst columns = useMemo( () => {\n\t\tconst _columns = fields.map( ( field ) => {\n\t\t\tconst { render, getValue, ...column } = field;\n\t\t\tcolumn.cell = ( props ) =>\n\t\t\t\trender( { item: props.row.original, view } );\n\t\t\tif ( getValue ) {\n\t\t\t\tcolumn.accessorFn = ( item ) => getValue( { item } );\n\t\t\t}\n\t\t\treturn column;\n\t\t} );\n\t\tif ( actions?.length ) {\n\t\t\t_columns.push( {\n\t\t\t\theader: __( 'Actions' ),\n\t\t\t\tid: 'actions',\n\t\t\t\tcell: ( props ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<ItemActions\n\t\t\t\t\t\t\titem={ props.row.original }\n\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t},\n\t\t\t\tenableHiding: false,\n\t\t\t} );\n\t\t}\n\n\t\treturn _columns;\n\t}, [ fields, actions, view ] );\n\n\tconst columnVisibility = useMemo( () => {\n\t\tif ( ! view.hiddenFields?.length ) {\n\t\t\treturn;\n\t\t}\n\t\treturn view.hiddenFields.reduce(\n\t\t\t( accumulator, fieldId ) => ( {\n\t\t\t\t...accumulator,\n\t\t\t\t[ fieldId ]: false,\n\t\t\t} ),\n\t\t\t{}\n\t\t);\n\t}, [ view.hiddenFields ] );\n\n\t/**\n\t * Transform the filters from the view format into the tanstack columns filter format.\n\t *\n\t * Input:\n\t *\n\t * view.filters = [\n\t *   { field: 'date', operator: 'before', value: '2020-01-01' },\n\t *   { field: 'date', operator: 'after', value: '2020-01-01' },\n\t * ]\n\t *\n\t * Output:\n\t *\n\t * columnFilters = [\n\t *   { \"date:before\": '2020-01-01' },\n\t *   { \"date:after\": '2020-01-01' }\n\t * ]\n\t *\n\t * @param {Array} filters The view filters to transform.\n\t * @return {Array} The transformed TanStack column filters.\n\t */\n\tconst toTanStackColumnFilters = ( filters ) =>\n\t\tfilters?.map( ( filter ) => ( {\n\t\t\t[ filter.field + ':' + filter.operator ]: filter.value,\n\t\t} ) );\n\n\t/**\n\t * Transform the filters from the view format into the tanstack columns filter format.\n\t *\n\t * Input:\n\t *\n\t * columnFilters = [\n\t *   { \"date:before\": '2020-01-01'},\n\t *   { \"date:after\": '2020-01-01' }\n\t * ]\n\t *\n\t * Output:\n\t *\n\t * view.filters = [\n\t *   { field: 'date', operator: 'before', value: '2020-01-01' },\n\t *   { field: 'date', operator: 'after', value: '2020-01-01' },\n\t * ]\n\t *\n\t * @param {Array} filters The TanStack column filters to transform.\n\t * @return {Array} The transformed view filters.\n\t */\n\tconst fromTanStackColumnFilters = ( filters ) =>\n\t\tfilters.map( ( filter ) => {\n\t\t\tconst [ key, value ] = Object.entries( filter )[ 0 ];\n\t\t\tconst [ field, operator ] = key.split( ':' );\n\t\t\treturn { field, operator, value };\n\t\t} );\n\n\tconst dataView = useReactTable( {\n\t\tdata,\n\t\tcolumns,\n\t\tmanualSorting: true,\n\t\tmanualFiltering: true,\n\t\tmanualPagination: true,\n\t\tenableRowSelection: true,\n\t\tstate: {\n\t\t\tsorting: view.sort\n\t\t\t\t? [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tid: view.sort.field,\n\t\t\t\t\t\t\tdesc: view.sort.direction === 'desc',\n\t\t\t\t\t\t},\n\t\t\t\t  ]\n\t\t\t\t: [],\n\t\t\tglobalFilter: view.search,\n\t\t\tcolumnFilters: toTanStackColumnFilters( view.filters ),\n\t\t\tpagination: {\n\t\t\t\tpageIndex: view.page,\n\t\t\t\tpageSize: view.perPage,\n\t\t\t},\n\t\t\tcolumnVisibility: columnVisibility ?? EMPTY_OBJECT,\n\t\t},\n\t\tonSortingChange: ( sortingUpdater ) => {\n\t\t\tonChangeView( ( currentView ) => {\n\t\t\t\tconst sort =\n\t\t\t\t\ttypeof sortingUpdater === 'function'\n\t\t\t\t\t\t? sortingUpdater(\n\t\t\t\t\t\t\t\tcurrentView.sort\n\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\t\tid: currentView.sort.field,\n\t\t\t\t\t\t\t\t\t\t\t\tdesc:\n\t\t\t\t\t\t\t\t\t\t\t\t\tcurrentView.sort\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t.direction === 'desc',\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  )\n\t\t\t\t\t\t: sortingUpdater;\n\t\t\t\tif ( ! sort.length ) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...currentView,\n\t\t\t\t\t\tsort: {},\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t\tconst [ { id, desc } ] = sort;\n\t\t\t\treturn {\n\t\t\t\t\t...currentView,\n\t\t\t\t\tsort: { field: id, direction: desc ? 'desc' : 'asc' },\n\t\t\t\t};\n\t\t\t} );\n\t\t},\n\t\tonColumnVisibilityChange: ( columnVisibilityUpdater ) => {\n\t\t\tonChangeView( ( currentView ) => {\n\t\t\t\tconst hiddenFields = Object.entries(\n\t\t\t\t\tcolumnVisibilityUpdater()\n\t\t\t\t).reduce(\n\t\t\t\t\t( accumulator, [ fieldId, value ] ) => {\n\t\t\t\t\t\tif ( value ) {\n\t\t\t\t\t\t\treturn accumulator.filter(\n\t\t\t\t\t\t\t\t( id ) => id !== fieldId\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn [ ...accumulator, fieldId ];\n\t\t\t\t\t},\n\t\t\t\t\t[ ...( currentView.hiddenFields || [] ) ]\n\t\t\t\t);\n\t\t\t\treturn {\n\t\t\t\t\t...currentView,\n\t\t\t\t\thiddenFields,\n\t\t\t\t};\n\t\t\t} );\n\t\t},\n\t\tonGlobalFilterChange: ( value ) => {\n\t\t\tonChangeView( { ...view, search: value, page: 1 } );\n\t\t},\n\t\tonColumnFiltersChange: ( columnFiltersUpdater ) => {\n\t\t\tonChangeView( {\n\t\t\t\t...view,\n\t\t\t\tfilters: fromTanStackColumnFilters( columnFiltersUpdater() ),\n\t\t\t\tpage: 1,\n\t\t\t} );\n\t\t},\n\t\tonPaginationChange: ( paginationUpdater ) => {\n\t\t\tonChangeView( ( currentView ) => {\n\t\t\t\tconst { pageIndex, pageSize } = paginationUpdater( {\n\t\t\t\t\tpageIndex: currentView.page,\n\t\t\t\t\tpageSize: currentView.perPage,\n\t\t\t\t} );\n\t\t\t\treturn { ...view, page: pageIndex, perPage: pageSize };\n\t\t\t} );\n\t\t},\n\t\tgetCoreRowModel: getCoreRowModel(),\n\t\tgetFilteredRowModel: getFilteredRowModel(),\n\t\tgetSortedRowModel: getSortedRowModel(),\n\t\tgetPaginationRowModel: getPaginationRowModel(),\n\t\tpageCount: paginationInfo.totalPages,\n\t} );\n\n\tconst { rows } = dataView.getRowModel();\n\tconst hasRows = !! rows?.length;\n\tif ( isLoading ) {\n\t\t// TODO:Add spinner or progress bar..\n\t\treturn <h3>{ __( 'Loading' ) }</h3>;\n\t}\n\treturn (\n\t\t<div className=\"dataviews-list-view-wrapper\">\n\t\t\t{ hasRows && (\n\t\t\t\t<table className=\"dataviews-list-view\">\n\t\t\t\t\t<thead>\n\t\t\t\t\t\t{ dataView.getHeaderGroups().map( ( headerGroup ) => (\n\t\t\t\t\t\t\t<tr key={ headerGroup.id }>\n\t\t\t\t\t\t\t\t{ headerGroup.headers.map( ( header ) => (\n\t\t\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t\t\tkey={ header.id }\n\t\t\t\t\t\t\t\t\t\tcolSpan={ header.colSpan }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef.width ||\n\t\t\t\t\t\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\t\t\t\t\tmaxWidth:\n\t\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef\n\t\t\t\t\t\t\t\t\t\t\t\t\t.maxWidth || undefined,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tdata-field-id={ header.id }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<HeaderMenu\n\t\t\t\t\t\t\t\t\t\t\tdataView={ dataView }\n\t\t\t\t\t\t\t\t\t\t\theader={ header }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</thead>\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t{ rows.map( ( row ) => (\n\t\t\t\t\t\t\t<tr key={ row.id }>\n\t\t\t\t\t\t\t\t{ row.getVisibleCells().map( ( cell ) => (\n\t\t\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t\t\tkey={ cell.id }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef.width ||\n\t\t\t\t\t\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\t\t\t\t\tmaxWidth:\n\t\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef\n\t\t\t\t\t\t\t\t\t\t\t\t\t.maxWidth || undefined,\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{ flexRender(\n\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef.cell,\n\t\t\t\t\t\t\t\t\t\t\tcell.getContext()\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</tbody>\n\t\t\t\t</table>\n\t\t\t) }\n\t\t\t{ ! hasRows && <p>{ __( 'no results' ) }</p> }\n\t\t</div>\n\t);\n}\n\nexport default ViewList;\n"],"mappings":"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"}
+{"version":3,"names":["_reactTable","require","_i18n","_compose","_icons","_components","_element","_lockUnlock","_itemActions","_interopRequireDefault","_constants","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuSeparatorV2","DropdownMenuSeparator","DropdownSubMenuV2","DropdownSubMenu","DropdownSubMenuTriggerV2","DropdownSubMenuTrigger","unlock","componentsPrivateApis","EMPTY_OBJECT","sortingItemsInfo","asc","icon","arrowUp","label","__","desc","arrowDown","sortIcons","chevronUp","chevronDown","HeaderMenu","dataView","header","isPlaceholder","text","flexRender","column","columnDef","getContext","isSortable","getCanSort","isHidable","getCanHide","sortedDirection","getIsSorted","filter","type","ENUMERATION_TYPE","field","id","elements","isFilterable","_react","createElement","align","trigger","Button","iconPosition","style","padding","WithSeparators","Object","entries","map","direction","info","key","prefix","Icon","suffix","check","onSelect","event","preventDefault","resetSorting","setSorting","unseen","getToggleVisibilityHandler","funnel","chevronRightSmall","element","isActive","columnFilters","getState","columnFilter","find","f","keys","split","value","values","otherFilters","operator","OPERATOR_IN","setColumnFilters","undefined","children","Children","toArray","Boolean","child","i","Fragment","ViewList","view","onChangeView","fields","actions","data","getItemId","isLoading","paginationInfo","columns","useMemo","_columns","render","getValue","cell","props","item","row","original","accessorFn","length","push","default","enableHiding","columnVisibility","hiddenFields","reduce","accumulator","fieldId","toTanStackColumnFilters","filters","fromTanStackColumnFilters","shownData","useAsyncList","useReactTable","manualSorting","manualFiltering","manualPagination","enableRowSelection","state","sorting","sort","globalFilter","search","pagination","pageIndex","page","pageSize","perPage","getRowId","onSortingChange","sortingUpdater","currentView","onColumnVisibilityChange","columnVisibilityUpdater","onGlobalFilterChange","onColumnFiltersChange","columnFiltersUpdater","onPaginationChange","paginationUpdater","getCoreRowModel","getFilteredRowModel","getSortedRowModel","getPaginationRowModel","pageCount","totalPages","rows","getRowModel","hasRows","className","getHeaderGroups","headerGroup","headers","colSpan","width","minWidth","maxWidth","getVisibleCells","_default","exports"],"sources":["@wordpress/edit-site/src/components/dataviews/view-list.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tgetCoreRowModel,\n\tgetFilteredRowModel,\n\tgetSortedRowModel,\n\tgetPaginationRowModel,\n\tuseReactTable,\n\tflexRender,\n} from '@tanstack/react-table';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useAsyncList } from '@wordpress/compose';\nimport {\n\tchevronDown,\n\tchevronUp,\n\tunseen,\n\tcheck,\n\tarrowUp,\n\tarrowDown,\n\tchevronRightSmall,\n\tfunnel,\n} from '@wordpress/icons';\nimport {\n\tButton,\n\tIcon,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useMemo, Children, Fragment } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport ItemActions from './item-actions';\nimport { ENUMERATION_TYPE, OPERATOR_IN } from './constants';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuSeparatorV2: DropdownMenuSeparator,\n\tDropdownSubMenuV2: DropdownSubMenu,\n\tDropdownSubMenuTriggerV2: DropdownSubMenuTrigger,\n} = unlock( componentsPrivateApis );\n\nconst EMPTY_OBJECT = {};\nconst sortingItemsInfo = {\n\tasc: { icon: arrowUp, label: __( 'Sort ascending' ) },\n\tdesc: { icon: arrowDown, label: __( 'Sort descending' ) },\n};\nconst sortIcons = { asc: chevronUp, desc: chevronDown };\n\nfunction HeaderMenu( { dataView, header } ) {\n\tif ( header.isPlaceholder ) {\n\t\treturn null;\n\t}\n\tconst text = flexRender(\n\t\theader.column.columnDef.header,\n\t\theader.getContext()\n\t);\n\tconst isSortable = !! header.column.getCanSort();\n\tconst isHidable = !! header.column.getCanHide();\n\tif ( ! isSortable && ! isHidable ) {\n\t\treturn text;\n\t}\n\tconst sortedDirection = header.column.getIsSorted();\n\n\tlet filter;\n\tif ( header.column.columnDef.type === ENUMERATION_TYPE ) {\n\t\tfilter = {\n\t\t\tfield: header.column.columnDef.id,\n\t\t\telements: header.column.columnDef.elements || [],\n\t\t};\n\t}\n\tconst isFilterable = !! filter;\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\talign=\"start\"\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\ticon={ sortIcons[ header.column.getIsSorted() ] }\n\t\t\t\t\ticonPosition=\"right\"\n\t\t\t\t\ttext={ text }\n\t\t\t\t\tstyle={ { padding: 0 } }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<WithSeparators>\n\t\t\t\t{ isSortable && (\n\t\t\t\t\t<DropdownMenuGroup>\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\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\t\t\t\tprefix={ <Icon icon={ info.icon } /> }\n\t\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t\tsortedDirection === direction && (\n\t\t\t\t\t\t\t\t\t\t\t<Icon icon={ check } />\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\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\tif ( sortedDirection === direction ) {\n\t\t\t\t\t\t\t\t\t\t\tdataView.resetSorting();\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tdataView.setSorting( [\n\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\tid: header.column.id,\n\t\t\t\t\t\t\t\t\t\t\t\t\tdesc: direction === 'desc',\n\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t] );\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ info.label }\n\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) }\n\t\t\t\t\t</DropdownMenuGroup>\n\t\t\t\t) }\n\t\t\t\t{ isHidable && (\n\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\tprefix={ <Icon icon={ unseen } /> }\n\t\t\t\t\t\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\theader.column.getToggleVisibilityHandler()( event );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Hide' ) }\n\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t) }\n\t\t\t\t{ isFilterable && (\n\t\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t\t<DropdownSubMenu\n\t\t\t\t\t\t\tkey={ filter.field }\n\t\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t\t<DropdownSubMenuTrigger\n\t\t\t\t\t\t\t\t\tprefix={ <Icon icon={ funnel } /> }\n\t\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t\t<Icon icon={ chevronRightSmall } />\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Filter by' ) }\n\t\t\t\t\t\t\t\t</DropdownSubMenuTrigger>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ filter.elements.map( ( element ) => {\n\t\t\t\t\t\t\t\tlet isActive = false;\n\t\t\t\t\t\t\t\tconst columnFilters =\n\t\t\t\t\t\t\t\t\tdataView.getState().columnFilters;\n\t\t\t\t\t\t\t\tconst columnFilter = columnFilters.find(\n\t\t\t\t\t\t\t\t\t( f ) =>\n\t\t\t\t\t\t\t\t\t\tObject.keys( f )[ 0 ].split(\n\t\t\t\t\t\t\t\t\t\t\t':'\n\t\t\t\t\t\t\t\t\t\t)[ 0 ] === filter.field\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\tif ( columnFilter ) {\n\t\t\t\t\t\t\t\t\tconst value =\n\t\t\t\t\t\t\t\t\t\tObject.values( columnFilter )[ 0 ];\n\t\t\t\t\t\t\t\t\t// Intentionally use loose comparison, so it does type conversion.\n\t\t\t\t\t\t\t\t\t// This covers the case where a top-level filter for the same field converts a number into a string.\n\t\t\t\t\t\t\t\t\tisActive = element.value == value; // eslint-disable-line eqeqeq\n\t\t\t\t\t\t\t\t}\n\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={ element.value }\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={ () => {\n\t\t\t\t\t\t\t\t\t\t\tconst otherFilters =\n\t\t\t\t\t\t\t\t\t\t\t\tcolumnFilters?.filter(\n\t\t\t\t\t\t\t\t\t\t\t\t\t( f ) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst [\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\toperator,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t] =\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tObject.keys(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tf\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)[ 0 ].split( ':' );\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\tfield !==\n\t\t\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\t\toperator !==\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tOPERATOR_IN\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tdataView.setColumnFilters( [\n\t\t\t\t\t\t\t\t\t\t\t\t...otherFilters,\n\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ filter.field + ':in' ]:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisActive\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: element.value,\n\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t] );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ element.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</DropdownSubMenu>\n\t\t\t\t\t</DropdownMenuGroup>\n\t\t\t\t) }\n\t\t\t</WithSeparators>\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction WithSeparators( { children } ) {\n\treturn Children.toArray( children )\n\t\t.filter( Boolean )\n\t\t.map( ( child, i ) => (\n\t\t\t<Fragment key={ i }>\n\t\t\t\t{ i > 0 && <DropdownMenuSeparator /> }\n\t\t\t\t{ child }\n\t\t\t</Fragment>\n\t\t) );\n}\n\nfunction ViewList( {\n\tview,\n\tonChangeView,\n\tfields,\n\tactions,\n\tdata,\n\tgetItemId,\n\tisLoading = false,\n\tpaginationInfo,\n} ) {\n\tconst columns = useMemo( () => {\n\t\tconst _columns = fields.map( ( field ) => {\n\t\t\tconst { render, getValue, ...column } = field;\n\t\t\tcolumn.cell = ( props ) =>\n\t\t\t\trender( { item: props.row.original, view } );\n\t\t\tif ( getValue ) {\n\t\t\t\tcolumn.accessorFn = ( item ) => getValue( { item } );\n\t\t\t}\n\t\t\treturn column;\n\t\t} );\n\t\tif ( actions?.length ) {\n\t\t\t_columns.push( {\n\t\t\t\theader: __( 'Actions' ),\n\t\t\t\tid: 'actions',\n\t\t\t\tcell: ( props ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<ItemActions\n\t\t\t\t\t\t\titem={ props.row.original }\n\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t},\n\t\t\t\tenableHiding: false,\n\t\t\t} );\n\t\t}\n\n\t\treturn _columns;\n\t}, [ fields, actions, view ] );\n\n\tconst columnVisibility = useMemo( () => {\n\t\tif ( ! view.hiddenFields?.length ) {\n\t\t\treturn;\n\t\t}\n\t\treturn view.hiddenFields.reduce(\n\t\t\t( accumulator, fieldId ) => ( {\n\t\t\t\t...accumulator,\n\t\t\t\t[ fieldId ]: false,\n\t\t\t} ),\n\t\t\t{}\n\t\t);\n\t}, [ view.hiddenFields ] );\n\n\t/**\n\t * Transform the filters from the view format into the tanstack columns filter format.\n\t *\n\t * Input:\n\t *\n\t * view.filters = [\n\t *   { field: 'date', operator: 'before', value: '2020-01-01' },\n\t *   { field: 'date', operator: 'after', value: '2020-01-01' },\n\t * ]\n\t *\n\t * Output:\n\t *\n\t * columnFilters = [\n\t *   { \"date:before\": '2020-01-01' },\n\t *   { \"date:after\": '2020-01-01' }\n\t * ]\n\t *\n\t * @param {Array} filters The view filters to transform.\n\t * @return {Array} The transformed TanStack column filters.\n\t */\n\tconst toTanStackColumnFilters = ( filters ) =>\n\t\tfilters?.map( ( filter ) => ( {\n\t\t\t[ filter.field + ':' + filter.operator ]: filter.value,\n\t\t} ) );\n\n\t/**\n\t * Transform the filters from the view format into the tanstack columns filter format.\n\t *\n\t * Input:\n\t *\n\t * columnFilters = [\n\t *   { \"date:before\": '2020-01-01'},\n\t *   { \"date:after\": '2020-01-01' }\n\t * ]\n\t *\n\t * Output:\n\t *\n\t * view.filters = [\n\t *   { field: 'date', operator: 'before', value: '2020-01-01' },\n\t *   { field: 'date', operator: 'after', value: '2020-01-01' },\n\t * ]\n\t *\n\t * @param {Array} filters The TanStack column filters to transform.\n\t * @return {Array} The transformed view filters.\n\t */\n\tconst fromTanStackColumnFilters = ( filters ) =>\n\t\tfilters.map( ( filter ) => {\n\t\t\tconst [ key, value ] = Object.entries( filter )[ 0 ];\n\t\t\tconst [ field, operator ] = key.split( ':' );\n\t\t\treturn { field, operator, value };\n\t\t} );\n\n\tconst shownData = useAsyncList( data );\n\tconst dataView = useReactTable( {\n\t\tdata: shownData,\n\t\tcolumns,\n\t\tmanualSorting: true,\n\t\tmanualFiltering: true,\n\t\tmanualPagination: true,\n\t\tenableRowSelection: true,\n\t\tstate: {\n\t\t\tsorting: view.sort\n\t\t\t\t? [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tid: view.sort.field,\n\t\t\t\t\t\t\tdesc: view.sort.direction === 'desc',\n\t\t\t\t\t\t},\n\t\t\t\t  ]\n\t\t\t\t: [],\n\t\t\tglobalFilter: view.search,\n\t\t\tcolumnFilters: toTanStackColumnFilters( view.filters ),\n\t\t\tpagination: {\n\t\t\t\tpageIndex: view.page,\n\t\t\t\tpageSize: view.perPage,\n\t\t\t},\n\t\t\tcolumnVisibility: columnVisibility ?? EMPTY_OBJECT,\n\t\t},\n\t\tgetRowId: getItemId,\n\t\tonSortingChange: ( sortingUpdater ) => {\n\t\t\tonChangeView( ( currentView ) => {\n\t\t\t\tconst sort =\n\t\t\t\t\ttypeof sortingUpdater === 'function'\n\t\t\t\t\t\t? sortingUpdater(\n\t\t\t\t\t\t\t\tcurrentView.sort\n\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\t\tid: currentView.sort.field,\n\t\t\t\t\t\t\t\t\t\t\t\tdesc:\n\t\t\t\t\t\t\t\t\t\t\t\t\tcurrentView.sort\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t.direction === 'desc',\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  )\n\t\t\t\t\t\t: sortingUpdater;\n\t\t\t\tif ( ! sort.length ) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...currentView,\n\t\t\t\t\t\tsort: {},\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t\tconst [ { id, desc } ] = sort;\n\t\t\t\treturn {\n\t\t\t\t\t...currentView,\n\t\t\t\t\tsort: { field: id, direction: desc ? 'desc' : 'asc' },\n\t\t\t\t};\n\t\t\t} );\n\t\t},\n\t\tonColumnVisibilityChange: ( columnVisibilityUpdater ) => {\n\t\t\tonChangeView( ( currentView ) => {\n\t\t\t\tconst hiddenFields = Object.entries(\n\t\t\t\t\tcolumnVisibilityUpdater()\n\t\t\t\t).reduce(\n\t\t\t\t\t( accumulator, [ fieldId, value ] ) => {\n\t\t\t\t\t\tif ( value ) {\n\t\t\t\t\t\t\treturn accumulator.filter(\n\t\t\t\t\t\t\t\t( id ) => id !== fieldId\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn [ ...accumulator, fieldId ];\n\t\t\t\t\t},\n\t\t\t\t\t[ ...( currentView.hiddenFields || [] ) ]\n\t\t\t\t);\n\t\t\t\treturn {\n\t\t\t\t\t...currentView,\n\t\t\t\t\thiddenFields,\n\t\t\t\t};\n\t\t\t} );\n\t\t},\n\t\tonGlobalFilterChange: ( value ) => {\n\t\t\tonChangeView( { ...view, search: value, page: 1 } );\n\t\t},\n\t\tonColumnFiltersChange: ( columnFiltersUpdater ) => {\n\t\t\tonChangeView( {\n\t\t\t\t...view,\n\t\t\t\tfilters: fromTanStackColumnFilters( columnFiltersUpdater() ),\n\t\t\t\tpage: 1,\n\t\t\t} );\n\t\t},\n\t\tonPaginationChange: ( paginationUpdater ) => {\n\t\t\tonChangeView( ( currentView ) => {\n\t\t\t\tconst { pageIndex, pageSize } = paginationUpdater( {\n\t\t\t\t\tpageIndex: currentView.page,\n\t\t\t\t\tpageSize: currentView.perPage,\n\t\t\t\t} );\n\t\t\t\treturn { ...view, page: pageIndex, perPage: pageSize };\n\t\t\t} );\n\t\t},\n\t\tgetCoreRowModel: getCoreRowModel(),\n\t\tgetFilteredRowModel: getFilteredRowModel(),\n\t\tgetSortedRowModel: getSortedRowModel(),\n\t\tgetPaginationRowModel: getPaginationRowModel(),\n\t\tpageCount: paginationInfo.totalPages,\n\t} );\n\n\tconst { rows } = dataView.getRowModel();\n\tconst hasRows = !! rows?.length;\n\tif ( isLoading ) {\n\t\t// TODO:Add spinner or progress bar..\n\t\treturn <h3>{ __( 'Loading' ) }</h3>;\n\t}\n\treturn (\n\t\t<div className=\"dataviews-list-view-wrapper\">\n\t\t\t{ hasRows && (\n\t\t\t\t<table className=\"dataviews-list-view\">\n\t\t\t\t\t<thead>\n\t\t\t\t\t\t{ dataView.getHeaderGroups().map( ( headerGroup ) => (\n\t\t\t\t\t\t\t<tr key={ headerGroup.id }>\n\t\t\t\t\t\t\t\t{ headerGroup.headers.map( ( header ) => (\n\t\t\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t\t\tkey={ header.id }\n\t\t\t\t\t\t\t\t\t\tcolSpan={ header.colSpan }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef.width ||\n\t\t\t\t\t\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\t\t\t\t\tminWidth:\n\t\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef\n\t\t\t\t\t\t\t\t\t\t\t\t\t.minWidth || undefined,\n\t\t\t\t\t\t\t\t\t\t\tmaxWidth:\n\t\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef\n\t\t\t\t\t\t\t\t\t\t\t\t\t.maxWidth || undefined,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tdata-field-id={ header.id }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<HeaderMenu\n\t\t\t\t\t\t\t\t\t\t\tdataView={ dataView }\n\t\t\t\t\t\t\t\t\t\t\theader={ header }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</thead>\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t{ rows.map( ( row ) => (\n\t\t\t\t\t\t\t<tr key={ row.id }>\n\t\t\t\t\t\t\t\t{ row.getVisibleCells().map( ( cell ) => (\n\t\t\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t\t\tkey={ cell.column.id }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef.width ||\n\t\t\t\t\t\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\t\t\t\t\tminWidth:\n\t\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef\n\t\t\t\t\t\t\t\t\t\t\t\t\t.minWidth || undefined,\n\t\t\t\t\t\t\t\t\t\t\tmaxWidth:\n\t\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef\n\t\t\t\t\t\t\t\t\t\t\t\t\t.maxWidth || undefined,\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{ flexRender(\n\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef.cell,\n\t\t\t\t\t\t\t\t\t\t\tcell.getContext()\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</tbody>\n\t\t\t\t</table>\n\t\t\t) }\n\t\t\t{ ! hasRows && <p>{ __( 'no results' ) }</p> }\n\t\t</div>\n\t);\n}\n\nexport default ViewList;\n"],"mappings":"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"}

package/build/components/editor/index.js

@@ -89,23 +89,20 @@ function Editor({
     contextPost,
     editorMode,
     canvasMode,
+    renderingMode,
     blockEditorMode,
     isRightSidebarOpen,
     isInserterOpen,
     isListViewOpen,
     showIconLabels,
-    showBlockBreadcrumbs,
-    hasPageContentFocus,
-    pageContentFocusType
+    showBlockBreadcrumbs
   } = (0, _data.useSelect)(select => {
     const {
       getEditedPostContext,
       getEditorMode,
       getCanvasMode,
       isInserterOpened,
-      isListViewOpened,
-      hasPageContentFocus: _hasPageContentFocus,
-      getPageContentFocusType
+      isListViewOpened
     } = (0, _lockUnlock.unlock)(select(_store.store));
     const {
       __unstableGetEditorMode
@@ -116,6 +113,9 @@ function Editor({
     const {
       getEntityRecord
     } = select(_coreData.store);
+    const {
+      getRenderingMode
+    } = select(_editor.store);
     const _context = getEditedPostContext();
 
     // The currently selected entity to display.
@@ -125,16 +125,18 @@ function Editor({
       contextPost: _context?.postId ? getEntityRecord('postType', _context.postType, _context.postId) : undefined,
       editorMode: getEditorMode(),
       canvasMode: getCanvasMode(),
+      renderingMode: getRenderingMode(),
       blockEditorMode: __unstableGetEditorMode(),
       isInserterOpen: isInserterOpened(),
       isListViewOpen: isListViewOpened(),
       isRightSidebarOpen: getActiveComplementaryArea(_store.store.name),
       showIconLabels: select(_preferences.store).get('core/edit-site', 'showIconLabels'),
-      showBlockBreadcrumbs: select(_preferences.store).get('core/edit-site', 'showBlockBreadcrumbs'),
-      hasPageContentFocus: _hasPageContentFocus(),
-      pageContentFocusType: getPageContentFocusType()
+      showBlockBreadcrumbs: select(_preferences.store).get('core/edit-site', 'showBlockBreadcrumbs')
     };
   }, []);
+  const {
+    setRenderingMode
+  } = (0, _data.useDispatch)(_editor.store);
   const isViewMode = canvasMode === 'view';
   const isEditMode = canvasMode === 'edit';
   const showVisualEditor = isViewMode || editorMode === 'visual';
@@ -142,7 +144,7 @@ function Editor({
   const shouldShowInserter = isEditMode && showVisualEditor && isInserterOpen;
   const shouldShowListView = isEditMode && showVisualEditor && isListViewOpen;
   const secondarySidebarLabel = isListViewOpen ? (0, _i18n.__)('List View') : (0, _i18n.__)('Block Library');
-  const postWithTemplate = context?.postId;
+  const postWithTemplate = !!context?.postId;
   let title;
   if (hasLoadedPost) {
     var _POST_TYPE_LABELS$edi;
@@ -157,21 +159,16 @@ function Editor({
   const loadingProgressId = (0, _compose.useInstanceId)(_canvasLoader.default, 'edit-site-editor__loading-progress');
   const settings = (0, _useSiteEditorSettings.useSpecificEditorSettings)();
   const isReady = !isLoading && (postWithTemplate && !!contextPost && !!editedPost || !postWithTemplate && !!editedPost);
-  const mode = (0, _element.useMemo)(() => {
-    if (isViewMode) {
-      return postWithTemplate ? 'template-locked' : 'all';
-    }
-    if (isEditMode && pageContentFocusType === 'hideTemplate') {
-      return 'post-only';
-    }
-    if (postWithTemplate && hasPageContentFocus) {
-      return 'template-locked';
-    }
-    if (postWithTemplate && !hasPageContentFocus) {
-      return 'template-only';
+
+  // This is the only reliable way I've found to reinitialize the rendering mode
+  // when the canvas mode or the edited entity changes.
+  (0, _element.useEffect)(() => {
+    if (canvasMode === 'edit' && postWithTemplate) {
+      setRenderingMode('template-locked');
+    } else {
+      setRenderingMode('all');
     }
-    return 'all';
-  }, [isViewMode, isEditMode, postWithTemplate, pageContentFocusType, hasPageContentFocus]);
+  }, [canvasMode, postWithTemplate, setRenderingMode]);
   return (0, _react.createElement)(_react.Fragment, null, !isReady ? (0, _react.createElement)(_canvasLoader.default, {
     id: loadingProgressId
   }) : null, isEditMode && (0, _react.createElement)(_welcomeGuide.default, null), hasLoadedPost && !editedPost && (0, _react.createElement)(_components.Notice, {
@@ -181,8 +178,7 @@ function Editor({
     post: postWithTemplate ? contextPost : editedPost,
     __unstableTemplate: postWithTemplate ? editedPost : undefined,
     settings: settings,
-    useSubRegistry: false,
-    mode: mode
+    useSubRegistry: false
   }, (0, _react.createElement)(_sidebarEditMode.SidebarComplementaryAreaFills, null), isEditMode && (0, _react.createElement)(_startTemplateOptions.default, null), (0, _react.createElement)(_interface.InterfaceSkeleton, {
     isDistractionFree: true,
     enableRegionNavigation: false,
@@ -200,7 +196,7 @@ function Editor({
       scope: "core/edit-site"
     }), (0, _react.createElement)(_sidebarFixedBottom.SidebarFixedBottomSlot, null)),
     footer: shouldShowBlockBreadcrumbs && (0, _react.createElement)(_blockEditor.BlockBreadcrumb, {
-      rootLabelText: hasPageContentFocus ? (0, _i18n.__)('Page') : (0, _i18n.__)('Template')
+      rootLabelText: postWithTemplate && renderingMode !== 'template-only' ? (0, _i18n.__)('Page') : (0, _i18n.__)('Template')
     }),
     labels: {
       ...interfaceLabels,