@wordpress/dataviews 4.9.1-next.cd6172eb0.0 → 4.11.0

package/build/dataviews-layouts/grid/index.js

@@ -1,3 +1,4 @@
+/* wp:polyfill */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -8,6 +9,8 @@ exports.default = ViewGrid;
 var _clsx = _interopRequireDefault(require("clsx"));
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
+var _compose = require("@wordpress/compose");
+var _lockUnlock = require("../../lock-unlock");
 var _dataviewsItemActions = _interopRequireDefault(require("../../components/dataviews-item-actions"));
 var _dataviewsSelectionCheckbox = _interopRequireDefault(require("../../components/dataviews-selection-checkbox"));
 var _dataviewsBulkActions = require("../../components/dataviews-bulk-actions");
@@ -26,7 +29,11 @@ var _jsxRuntime = require("react/jsx-runtime");
  * Internal dependencies
  */
 
+const {
+  Badge
+} = (0, _lockUnlock.unlock)(_components.privateApis);
 function GridItem({
+  view,
   selection,
   onChangeSelection,
   onClickItem,
@@ -35,18 +42,25 @@ function GridItem({
   item,
   actions,
   mediaField,
-  primaryField,
-  visibleFields,
+  titleField,
+  descriptionField,
+  regularFields,
   badgeFields,
-  columnFields
+  hasBulkActions
 }) {
+  const {
+    showTitle = true,
+    showMedia = true,
+    showDescription = true
+  } = view;
   const hasBulkAction = (0, _dataviewsBulkActions.useHasAPossibleBulkAction)(actions, item);
   const id = getItemId(item);
+  const instanceId = (0, _compose.useInstanceId)(GridItem);
   const isSelected = selection.includes(id);
   const renderedMediaField = mediaField?.render ? /*#__PURE__*/(0, _jsxRuntime.jsx)(mediaField.render, {
     item: item
   }) : null;
-  const renderedPrimaryField = primaryField?.render ? /*#__PURE__*/(0, _jsxRuntime.jsx)(primaryField.render, {
+  const renderedTitleField = showTitle && titleField?.render ? /*#__PURE__*/(0, _jsxRuntime.jsx)(titleField.render, {
     item: item
   }) : null;
   const clickableMediaItemProps = (0, _getClickableItemProps.default)({
@@ -55,12 +69,28 @@ function GridItem({
     onClickItem,
     className: 'dataviews-view-grid__media'
   });
-  const clickablePrimaryItemProps = (0, _getClickableItemProps.default)({
+  const clickableTitleItemProps = (0, _getClickableItemProps.default)({
     item,
     isItemClickable,
     onClickItem,
-    className: 'dataviews-view-grid__primary-field'
+    className: 'dataviews-view-grid__title-field dataviews-title-field'
   });
+  let mediaA11yProps;
+  let titleA11yProps;
+  if (isItemClickable(item) && onClickItem) {
+    if (renderedTitleField) {
+      mediaA11yProps = {
+        'aria-labelledby': `dataviews-view-grid__title-field-${instanceId}`
+      };
+      titleA11yProps = {
+        id: `dataviews-view-grid__title-field-${instanceId}`
+      };
+    } else {
+      mediaA11yProps = {
+        'aria-label': (0, _i18n.__)('Navigate to item')
+      };
+    }
+  }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalVStack, {
     spacing: 0,
     className: (0, _clsx.default)('dataviews-view-grid__card', {
@@ -76,70 +106,77 @@ function GridItem({
         onChangeSelection(selection.includes(id) ? selection.filter(itemId => id !== itemId) : [...selection, id]);
       }
     },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: [showMedia && renderedMediaField && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       ...clickableMediaItemProps,
+      ...mediaA11yProps,
       children: renderedMediaField
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsSelectionCheckbox.default, {
+    }), hasBulkActions && showMedia && renderedMediaField && /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsSelectionCheckbox.default, {
       item: item,
       selection: selection,
       onChangeSelection: onChangeSelection,
       getItemId: getItemId,
-      primaryField: primaryField,
+      titleField: titleField,
       disabled: !hasBulkAction
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
       justify: "space-between",
       className: "dataviews-view-grid__title-actions",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        ...clickablePrimaryItemProps,
-        children: renderedPrimaryField
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsItemActions.default, {
+        ...clickableTitleItemProps,
+        ...titleA11yProps,
+        children: renderedTitleField
+      }), !!actions?.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsItemActions.default, {
         item: item,
         actions: actions,
         isCompact: true
       })]
-    }), !!badgeFields?.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalHStack, {
-      className: "dataviews-view-grid__badge-fields",
-      spacing: 2,
-      wrap: true,
-      alignment: "top",
-      justify: "flex-start",
-      children: badgeFields.map(field => {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
-          className: "dataviews-view-grid__field-value",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(field.render, {
-            item: item
-          })
-        }, field.id);
-      })
-    }), !!visibleFields?.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalVStack, {
-      className: "dataviews-view-grid__fields",
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalVStack, {
       spacing: 1,
-      children: visibleFields.map(field => {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Flex, {
-          className: (0, _clsx.default)('dataviews-view-grid__field', columnFields?.includes(field.id) ? 'is-column' : 'is-row'),
-          gap: 1,
-          justify: "flex-start",
-          expanded: true,
-          style: {
-            height: 'auto'
-          },
-          direction: columnFields?.includes(field.id) ? 'column' : 'row',
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
-              className: "dataviews-view-grid__field-name",
-              children: field.header
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
-              className: "dataviews-view-grid__field-value",
-              style: {
-                maxHeight: 'none'
-              },
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(field.render, {
-                item: item
-              })
-            })]
-          })
-        }, field.id);
-      })
+      children: [showDescription && descriptionField?.render && /*#__PURE__*/(0, _jsxRuntime.jsx)(descriptionField.render, {
+        item: item
+      }), !!badgeFields?.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalHStack, {
+        className: "dataviews-view-grid__badge-fields",
+        spacing: 2,
+        wrap: true,
+        alignment: "top",
+        justify: "flex-start",
+        children: badgeFields.map(field => {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
+            className: "dataviews-view-grid__field-value",
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(field.render, {
+              item: item
+            })
+          }, field.id);
+        })
+      }), !!regularFields?.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalVStack, {
+        className: "dataviews-view-grid__fields",
+        spacing: 1,
+        children: regularFields.map(field => {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Flex, {
+            className: "dataviews-view-grid__field",
+            gap: 1,
+            justify: "flex-start",
+            expanded: true,
+            style: {
+              height: 'auto'
+            },
+            direction: "row",
+            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
+                className: "dataviews-view-grid__field-name",
+                children: field.header
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
+                className: "dataviews-view-grid__field-value",
+                style: {
+                  maxHeight: 'none'
+                },
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(field.render, {
+                  item: item
+                })
+              })]
+            })
+          }, field.id);
+        })
+      })]
     })]
   }, id);
 }
@@ -155,27 +192,31 @@ function ViewGrid({
   selection,
   view
 }) {
-  const mediaField = fields.find(field => field.id === view.layout?.mediaField);
-  const primaryField = fields.find(field => field.id === view.layout?.primaryField);
-  const viewFields = view.fields || fields.map(field => field.id);
+  var _view$fields;
+  const titleField = fields.find(field => field.id === view?.titleField);
+  const mediaField = fields.find(field => field.id === view?.mediaField);
+  const descriptionField = fields.find(field => field.id === view?.descriptionField);
+  const otherFields = (_view$fields = view.fields) !== null && _view$fields !== void 0 ? _view$fields : [];
   const {
-    visibleFields,
+    regularFields,
     badgeFields
-  } = fields.reduce((accumulator, field) => {
-    if (!viewFields.includes(field.id) || [view.layout?.mediaField, view?.layout?.primaryField].includes(field.id)) {
+  } = otherFields.reduce((accumulator, fieldId) => {
+    const field = fields.find(f => f.id === fieldId);
+    if (!field) {
       return accumulator;
     }
     // If the field is a badge field, add it to the badgeFields array
     // otherwise add it to the rest visibleFields array.
-    const key = view.layout?.badgeFields?.includes(field.id) ? 'badgeFields' : 'visibleFields';
+    const key = view.layout?.badgeFields?.includes(fieldId) ? 'badgeFields' : 'regularFields';
     accumulator[key].push(field);
     return accumulator;
   }, {
-    visibleFields: [],
+    regularFields: [],
     badgeFields: []
   });
   const hasData = !!data?.length;
   const updatedPreviewSize = (0, _previewSizePicker.useUpdatedPreviewSizeOnViewportChange)();
+  const hasBulkActions = (0, _dataviewsBulkActions.useSomeItemHasAPossibleBulkAction)(actions, data);
   const usedPreviewSize = updatedPreviewSize || view.layout?.previewSize;
   const gridStyle = usedPreviewSize ? {
     gridTemplateColumns: `repeat(${usedPreviewSize}, minmax(0, 1fr))`
@@ -190,6 +231,7 @@ function ViewGrid({
       "aria-busy": isLoading,
       children: data.map(item => {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridItem, {
+          view: view,
           selection: selection,
           onChangeSelection: onChangeSelection,
           onClickItem: onClickItem,
@@ -198,10 +240,11 @@ function ViewGrid({
           item: item,
           actions: actions,
           mediaField: mediaField,
-          primaryField: primaryField,
-          visibleFields: visibleFields,
+          titleField: titleField,
+          descriptionField: descriptionField,
+          regularFields: regularFields,
           badgeFields: badgeFields,
-          columnFields: view.layout?.columnFields
+          hasBulkActions: hasBulkActions
         }, getItemId(item));
       })
     }), !hasData && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/build/dataviews-layouts/grid/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_components","_i18n","_dataviewsItemActions","_dataviewsSelectionCheckbox","_dataviewsBulkActions","_getClickableItemProps","_previewSizePicker","_jsxRuntime","GridItem","selection","onChangeSelection","onClickItem","isItemClickable","getItemId","item","actions","mediaField","primaryField","visibleFields","badgeFields","columnFields","hasBulkAction","useHasAPossibleBulkAction","id","isSelected","includes","renderedMediaField","render","jsx","renderedPrimaryField","clickableMediaItemProps","getClickableItemProps","className","clickablePrimaryItemProps","jsxs","__experimentalVStack","spacing","clsx","onClickCapture","event","ctrlKey","metaKey","stopPropagation","preventDefault","filter","itemId","children","default","disabled","__experimentalHStack","justify","isCompact","length","wrap","alignment","map","field","FlexItem","Flex","gap","expanded","style","height","direction","Fragment","header","maxHeight","ViewGrid","data","fields","isLoading","view","find","layout","viewFields","reduce","accumulator","key","push","hasData","updatedPreviewSize","useUpdatedPreviewSizeOnViewportChange","usedPreviewSize","previewSize","gridStyle","gridTemplateColumns","__experimentalGrid","columns","Spinner","__"],"sources":["@wordpress/dataviews/src/dataviews-layouts/grid/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tSpinner,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from '../../components/dataviews-item-actions';\nimport SingleSelectionCheckbox from '../../components/dataviews-selection-checkbox';\nimport { useHasAPossibleBulkAction } from '../../components/dataviews-bulk-actions';\nimport type { Action, NormalizedField, ViewGridProps } from '../../types';\nimport type { SetSelection } from '../../private-types';\nimport getClickableItemProps from '../utils/get-clickable-item-props';\nimport { useUpdatedPreviewSizeOnViewportChange } from './preview-size-picker';\n\ninterface GridItemProps< Item > {\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\tgetItemId: ( item: Item ) => string;\n\tonClickItem?: ( item: Item ) => void;\n\tisItemClickable: ( item: Item ) => boolean;\n\titem: Item;\n\tactions: Action< Item >[];\n\tmediaField?: NormalizedField< Item >;\n\tprimaryField?: NormalizedField< Item >;\n\tvisibleFields: NormalizedField< Item >[];\n\tbadgeFields: NormalizedField< Item >[];\n\tcolumnFields?: string[];\n}\n\nfunction GridItem< Item >( {\n\tselection,\n\tonChangeSelection,\n\tonClickItem,\n\tisItemClickable,\n\tgetItemId,\n\titem,\n\tactions,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n\tbadgeFields,\n\tcolumnFields,\n}: GridItemProps< Item > ) {\n\tconst hasBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst id = getItemId( item );\n\tconst isSelected = selection.includes( id );\n\tconst renderedMediaField = mediaField?.render ? (\n\t\t<mediaField.render item={ item } />\n\t) : null;\n\tconst renderedPrimaryField = primaryField?.render ? (\n\t\t<primaryField.render item={ item } />\n\t) : null;\n\n\tconst clickableMediaItemProps = getClickableItemProps( {\n\t\titem,\n\t\tisItemClickable,\n\t\tonClickItem,\n\t\tclassName: 'dataviews-view-grid__media',\n\t} );\n\n\tconst clickablePrimaryItemProps = getClickableItemProps( {\n\t\titem,\n\t\tisItemClickable,\n\t\tonClickItem,\n\t\tclassName: 'dataviews-view-grid__primary-field',\n\t} );\n\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 0 }\n\t\t\tkey={ id }\n\t\t\tclassName={ clsx( 'dataviews-view-grid__card', {\n\t\t\t\t'is-selected': hasBulkAction && isSelected,\n\t\t\t} ) }\n\t\t\tonClickCapture={ ( event ) => {\n\t\t\t\tif ( event.ctrlKey || event.metaKey ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! hasBulkAction ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.includes( id )\n\t\t\t\t\t\t\t? selection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t\t\t: [ ...selection, id ]\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t<div { ...clickableMediaItemProps }>{ renderedMediaField }</div>\n\t\t\t<SingleSelectionCheckbox\n\t\t\t\titem={ item }\n\t\t\t\tselection={ selection }\n\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\tgetItemId={ getItemId }\n\t\t\t\tprimaryField={ primaryField }\n\t\t\t\tdisabled={ ! hasBulkAction }\n\t\t\t/>\n\t\t\t<HStack\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews-view-grid__title-actions\"\n\t\t\t>\n\t\t\t\t<div { ...clickablePrimaryItemProps }>\n\t\t\t\t\t{ renderedPrimaryField }\n\t\t\t\t</div>\n\t\t\t\t<ItemActions item={ item } actions={ actions } isCompact />\n\t\t\t</HStack>\n\t\t\t{ !! badgeFields?.length && (\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"dataviews-view-grid__badge-fields\"\n\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\twrap\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t>\n\t\t\t\t\t{ badgeFields.map( ( field ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<field.render item={ item } />\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ !! visibleFields?.length && (\n\t\t\t\t<VStack className=\"dataviews-view-grid__fields\" spacing={ 1 }>\n\t\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'dataviews-view-grid__field',\n\t\t\t\t\t\t\t\t\tcolumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t\t? 'is-column'\n\t\t\t\t\t\t\t\t\t\t: 'is-row'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tgap={ 1 }\n\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\texpanded\n\t\t\t\t\t\t\t\tstyle={ { height: 'auto' } }\n\t\t\t\t\t\t\t\tdirection={\n\t\t\t\t\t\t\t\t\tcolumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t\t? 'column'\n\t\t\t\t\t\t\t\t\t\t: 'row'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<FlexItem className=\"dataviews-view-grid__field-name\">\n\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t\t\t\tstyle={ { maxHeight: 'none' } }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<field.render item={ item } />\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t</Flex>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default function ViewGrid< Item >( {\n\tactions,\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading,\n\tonChangeSelection,\n\tonClickItem,\n\tisItemClickable,\n\tselection,\n\tview,\n}: ViewGridProps< Item > ) {\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 viewFields = view.fields || fields.map( ( field ) => field.id );\n\tconst { visibleFields, badgeFields } = fields.reduce(\n\t\t( accumulator: Record< string, NormalizedField< Item >[] >, field ) => {\n\t\t\tif (\n\t\t\t\t! viewFields.includes( field.id ) ||\n\t\t\t\t[\n\t\t\t\t\tview.layout?.mediaField,\n\t\t\t\t\tview?.layout?.primaryField,\n\t\t\t\t].includes( field.id )\n\t\t\t) {\n\t\t\t\treturn accumulator;\n\t\t\t}\n\t\t\t// If the field is a badge field, add it to the badgeFields array\n\t\t\t// otherwise add it to the rest visibleFields array.\n\t\t\tconst key = view.layout?.badgeFields?.includes( field.id )\n\t\t\t\t? 'badgeFields'\n\t\t\t\t: 'visibleFields';\n\t\t\taccumulator[ key ].push( field );\n\t\t\treturn accumulator;\n\t\t},\n\t\t{ visibleFields: [], badgeFields: [] }\n\t);\n\tconst hasData = !! data?.length;\n\tconst updatedPreviewSize = useUpdatedPreviewSizeOnViewportChange();\n\tconst usedPreviewSize = updatedPreviewSize || view.layout?.previewSize;\n\tconst gridStyle = usedPreviewSize\n\t\t? {\n\t\t\t\tgridTemplateColumns: `repeat(${ usedPreviewSize }, minmax(0, 1fr))`,\n\t\t  }\n\t\t: {};\n\treturn (\n\t\t<>\n\t\t\t{ hasData && (\n\t\t\t\t<Grid\n\t\t\t\t\tgap={ 8 }\n\t\t\t\t\tcolumns={ 2 }\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tclassName=\"dataviews-view-grid\"\n\t\t\t\t\tstyle={ gridStyle }\n\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t>\n\t\t\t\t\t{ data.map( ( item ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\tonClickItem={ onClickItem }\n\t\t\t\t\t\t\t\tisItemClickable={ isItemClickable }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\t\tvisibleFields={ visibleFields }\n\t\t\t\t\t\t\t\tbadgeFields={ badgeFields }\n\t\t\t\t\t\t\t\tcolumnFields={ view.layout?.columnFields }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</Grid>\n\t\t\t) }\n\t\t\t{ ! hasData && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_components","_i18n","_compose","_lockUnlock","_dataviewsItemActions","_dataviewsSelectionCheckbox","_dataviewsBulkActions","_getClickableItemProps","_previewSizePicker","_jsxRuntime","Badge","unlock","componentsPrivateApis","GridItem","view","selection","onChangeSelection","onClickItem","isItemClickable","getItemId","item","actions","mediaField","titleField","descriptionField","regularFields","badgeFields","hasBulkActions","showTitle","showMedia","showDescription","hasBulkAction","useHasAPossibleBulkAction","id","instanceId","useInstanceId","isSelected","includes","renderedMediaField","render","jsx","renderedTitleField","clickableMediaItemProps","getClickableItemProps","className","clickableTitleItemProps","mediaA11yProps","titleA11yProps","__","jsxs","__experimentalVStack","spacing","clsx","onClickCapture","event","ctrlKey","metaKey","stopPropagation","preventDefault","filter","itemId","children","default","disabled","__experimentalHStack","justify","length","isCompact","wrap","alignment","map","field","Flex","gap","expanded","style","height","direction","Fragment","FlexItem","header","maxHeight","ViewGrid","data","fields","isLoading","_view$fields","find","otherFields","reduce","accumulator","fieldId","f","key","layout","push","hasData","updatedPreviewSize","useUpdatedPreviewSizeOnViewportChange","useSomeItemHasAPossibleBulkAction","usedPreviewSize","previewSize","gridStyle","gridTemplateColumns","__experimentalGrid","columns","Spinner"],"sources":["@wordpress/dataviews/src/dataviews-layouts/grid/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tSpinner,\n\tFlex,\n\tFlexItem,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport ItemActions from '../../components/dataviews-item-actions';\nimport DataViewsSelectionCheckbox from '../../components/dataviews-selection-checkbox';\nimport {\n\tuseHasAPossibleBulkAction,\n\tuseSomeItemHasAPossibleBulkAction,\n} from '../../components/dataviews-bulk-actions';\nimport type {\n\tAction,\n\tNormalizedField,\n\tViewGrid as ViewGridType,\n\tViewGridProps,\n} from '../../types';\nimport type { SetSelection } from '../../private-types';\nimport getClickableItemProps from '../utils/get-clickable-item-props';\nimport { useUpdatedPreviewSizeOnViewportChange } from './preview-size-picker';\nconst { Badge } = unlock( componentsPrivateApis );\n\ninterface GridItemProps< Item > {\n\tview: ViewGridType;\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\tgetItemId: ( item: Item ) => string;\n\tonClickItem?: ( item: Item ) => void;\n\tisItemClickable: ( item: Item ) => boolean;\n\titem: Item;\n\tactions: Action< Item >[];\n\ttitleField?: NormalizedField< Item >;\n\tmediaField?: NormalizedField< Item >;\n\tdescriptionField?: NormalizedField< Item >;\n\tregularFields: NormalizedField< Item >[];\n\tbadgeFields: NormalizedField< Item >[];\n\thasBulkActions: boolean;\n}\n\nfunction GridItem< Item >( {\n\tview,\n\tselection,\n\tonChangeSelection,\n\tonClickItem,\n\tisItemClickable,\n\tgetItemId,\n\titem,\n\tactions,\n\tmediaField,\n\ttitleField,\n\tdescriptionField,\n\tregularFields,\n\tbadgeFields,\n\thasBulkActions,\n}: GridItemProps< Item > ) {\n\tconst { showTitle = true, showMedia = true, showDescription = true } = view;\n\tconst hasBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst id = getItemId( item );\n\tconst instanceId = useInstanceId( GridItem );\n\tconst isSelected = selection.includes( id );\n\tconst renderedMediaField = mediaField?.render ? (\n\t\t<mediaField.render item={ item } />\n\t) : null;\n\tconst renderedTitleField =\n\t\tshowTitle && titleField?.render ? (\n\t\t\t<titleField.render item={ item } />\n\t\t) : null;\n\n\tconst clickableMediaItemProps = getClickableItemProps( {\n\t\titem,\n\t\tisItemClickable,\n\t\tonClickItem,\n\t\tclassName: 'dataviews-view-grid__media',\n\t} );\n\n\tconst clickableTitleItemProps = getClickableItemProps( {\n\t\titem,\n\t\tisItemClickable,\n\t\tonClickItem,\n\t\tclassName: 'dataviews-view-grid__title-field dataviews-title-field',\n\t} );\n\n\tlet mediaA11yProps;\n\tlet titleA11yProps;\n\tif ( isItemClickable( item ) && onClickItem ) {\n\t\tif ( renderedTitleField ) {\n\t\t\tmediaA11yProps = {\n\t\t\t\t'aria-labelledby': `dataviews-view-grid__title-field-${ instanceId }`,\n\t\t\t};\n\t\t\ttitleA11yProps = {\n\t\t\t\tid: `dataviews-view-grid__title-field-${ instanceId }`,\n\t\t\t};\n\t\t} else {\n\t\t\tmediaA11yProps = {\n\t\t\t\t'aria-label': __( 'Navigate to item' ),\n\t\t\t};\n\t\t}\n\t}\n\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 0 }\n\t\t\tkey={ id }\n\t\t\tclassName={ clsx( 'dataviews-view-grid__card', {\n\t\t\t\t'is-selected': hasBulkAction && isSelected,\n\t\t\t} ) }\n\t\t\tonClickCapture={ ( event ) => {\n\t\t\t\tif ( event.ctrlKey || event.metaKey ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! hasBulkAction ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.includes( id )\n\t\t\t\t\t\t\t? selection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t\t\t: [ ...selection, id ]\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t{ showMedia && renderedMediaField && (\n\t\t\t\t<div { ...clickableMediaItemProps } { ...mediaA11yProps }>\n\t\t\t\t\t{ renderedMediaField }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ hasBulkActions && showMedia && renderedMediaField && (\n\t\t\t\t<DataViewsSelectionCheckbox\n\t\t\t\t\titem={ item }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\tdisabled={ ! hasBulkAction }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<HStack\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews-view-grid__title-actions\"\n\t\t\t>\n\t\t\t\t<div { ...clickableTitleItemProps } { ...titleA11yProps }>\n\t\t\t\t\t{ renderedTitleField }\n\t\t\t\t</div>\n\t\t\t\t{ !! actions?.length && (\n\t\t\t\t\t<ItemActions item={ item } actions={ actions } isCompact />\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t{ showDescription && descriptionField?.render && (\n\t\t\t\t\t<descriptionField.render item={ item } />\n\t\t\t\t) }\n\t\t\t\t{ !! badgeFields?.length && (\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tclassName=\"dataviews-view-grid__badge-fields\"\n\t\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\t\twrap\n\t\t\t\t\t\talignment=\"top\"\n\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ badgeFields.map( ( field ) => {\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Badge\n\t\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<field.render item={ item } />\n\t\t\t\t\t\t\t\t</Badge>\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) }\n\t\t\t\t{ !! regularFields?.length && (\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={ 1 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ regularFields.map( ( field ) => {\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Flex\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\tgap={ 1 }\n\t\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\t\texpanded\n\t\t\t\t\t\t\t\t\tstyle={ { height: 'auto' } }\n\t\t\t\t\t\t\t\t\tdirection=\"row\"\n\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<FlexItem className=\"dataviews-view-grid__field-name\">\n\t\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={ { maxHeight: 'none' } }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<field.render item={ item } />\n\t\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t</Flex>\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) }\n\t\t\t</VStack>\n\t\t</VStack>\n\t);\n}\n\nexport default function ViewGrid< Item >( {\n\tactions,\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading,\n\tonChangeSelection,\n\tonClickItem,\n\tisItemClickable,\n\tselection,\n\tview,\n}: ViewGridProps< Item > ) {\n\tconst titleField = fields.find(\n\t\t( field ) => field.id === view?.titleField\n\t);\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view?.mediaField\n\t);\n\tconst descriptionField = fields.find(\n\t\t( field ) => field.id === view?.descriptionField\n\t);\n\tconst otherFields = view.fields ?? [];\n\tconst { regularFields, badgeFields } = otherFields.reduce(\n\t\t(\n\t\t\taccumulator: Record< string, NormalizedField< Item >[] >,\n\t\t\tfieldId\n\t\t) => {\n\t\t\tconst field = fields.find( ( f ) => f.id === fieldId );\n\t\t\tif ( ! field ) {\n\t\t\t\treturn accumulator;\n\t\t\t}\n\t\t\t// If the field is a badge field, add it to the badgeFields array\n\t\t\t// otherwise add it to the rest visibleFields array.\n\t\t\tconst key = view.layout?.badgeFields?.includes( fieldId )\n\t\t\t\t? 'badgeFields'\n\t\t\t\t: 'regularFields';\n\t\t\taccumulator[ key ].push( field );\n\t\t\treturn accumulator;\n\t\t},\n\t\t{ regularFields: [], badgeFields: [] }\n\t);\n\tconst hasData = !! data?.length;\n\tconst updatedPreviewSize = useUpdatedPreviewSizeOnViewportChange();\n\tconst hasBulkActions = useSomeItemHasAPossibleBulkAction( actions, data );\n\tconst usedPreviewSize = updatedPreviewSize || view.layout?.previewSize;\n\tconst gridStyle = usedPreviewSize\n\t\t? {\n\t\t\t\tgridTemplateColumns: `repeat(${ usedPreviewSize }, minmax(0, 1fr))`,\n\t\t  }\n\t\t: {};\n\treturn (\n\t\t<>\n\t\t\t{ hasData && (\n\t\t\t\t<Grid\n\t\t\t\t\tgap={ 8 }\n\t\t\t\t\tcolumns={ 2 }\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tclassName=\"dataviews-view-grid\"\n\t\t\t\t\tstyle={ gridStyle }\n\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t>\n\t\t\t\t\t{ data.map( ( item ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\tonClickItem={ onClickItem }\n\t\t\t\t\t\t\t\tisItemClickable={ isItemClickable }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\t\t\tdescriptionField={ descriptionField }\n\t\t\t\t\t\t\t\tregularFields={ regularFields }\n\t\t\t\t\t\t\t\tbadgeFields={ badgeFields }\n\t\t\t\t\t\t\t\thasBulkActions={ hasBulkActions }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</Grid>\n\t\t\t) }\n\t\t\t{ ! hasData && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/dataviews-layouts/grid/preview-size-picker.js

@@ -8,7 +8,6 @@ exports.default = PreviewSizePicker;
 exports.useUpdatedPreviewSizeOnViewportChange = useUpdatedPreviewSizeOnViewportChange;
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
-var _compose = require("@wordpress/compose");
 var _element = require("@wordpress/element");
 var _dataviewsContext = _interopRequireDefault(require("../../components/dataviews-context"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -47,36 +46,34 @@ const viewportBreaks = {
     default: 2
   }
 };
+
+/**
+ * Breakpoints were adjusted from media queries breakpoints to account for
+ * the sidebar width. This was done to match the existing styles we had.
+ */
+const BREAKPOINTS = {
+  xhuge: 1520,
+  huge: 1140,
+  xlarge: 780,
+  large: 480,
+  mobile: 0
+};
 function useViewPortBreakpoint() {
-  const isXHuge = (0, _compose.useViewportMatch)('xhuge', '>=');
-  const isHuge = (0, _compose.useViewportMatch)('huge', '>=');
-  const isXlarge = (0, _compose.useViewportMatch)('xlarge', '>=');
-  const isLarge = (0, _compose.useViewportMatch)('large', '>=');
-  const isMobile = (0, _compose.useViewportMatch)('mobile', '>=');
-  if (isXHuge) {
-    return 'xhuge';
-  }
-  if (isHuge) {
-    return 'huge';
-  }
-  if (isXlarge) {
-    return 'xlarge';
-  }
-  if (isLarge) {
-    return 'large';
-  }
-  if (isMobile) {
-    return 'mobile';
+  const containerWidth = (0, _element.useContext)(_dataviewsContext.default).containerWidth;
+  for (const [key, value] of Object.entries(BREAKPOINTS)) {
+    if (containerWidth >= value) {
+      return key;
+    }
   }
-  return null;
+  return 'mobile';
 }
 function useUpdatedPreviewSizeOnViewportChange() {
-  const viewport = useViewPortBreakpoint();
   const view = (0, _element.useContext)(_dataviewsContext.default).view;
+  const viewport = useViewPortBreakpoint();
   return (0, _element.useMemo)(() => {
     const previewSize = view.layout?.previewSize;
     let newPreviewSize;
-    if (!viewport || !previewSize) {
+    if (!previewSize) {
       return;
     }
     const breakValues = viewportBreaks[viewport];
@@ -93,7 +90,7 @@ function PreviewSizePicker() {
   const viewport = useViewPortBreakpoint();
   const context = (0, _element.useContext)(_dataviewsContext.default);
   const view = context.view;
-  const breakValues = viewportBreaks[viewport || 'mobile'];
+  const breakValues = viewportBreaks[viewport];
   const previewSizeToUse = view.layout?.previewSize || breakValues.default;
   const marks = (0, _element.useMemo)(() => Array.from({
     length: breakValues.max - breakValues.min + 1
@@ -102,7 +99,7 @@ function PreviewSizePicker() {
       value: breakValues.min + i
     };
   }), [breakValues]);
-  if (!viewport) {
+  if (viewport === 'mobile') {
     return null;
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.RangeControl, {

package/build/dataviews-layouts/grid/preview-size-picker.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_i18n","_compose","_element","_dataviewsContext","_interopRequireDefault","_jsxRuntime","viewportBreaks","xhuge","min","max","default","huge","xlarge","large","mobile","useViewPortBreakpoint","isXHuge","useViewportMatch","isHuge","isXlarge","isLarge","isMobile","useUpdatedPreviewSizeOnViewportChange","viewport","view","useContext","DataViewsContext","useMemo","previewSize","layout","newPreviewSize","breakValues","PreviewSizePicker","context","previewSizeToUse","marks","Array","from","length","_","i","value","jsx","RangeControl","__nextHasNoMarginBottom","__next40pxDefaultSize","showTooltip","label","__","withInputField","onChange","onChangeView","step"],"sources":["@wordpress/dataviews/src/dataviews-layouts/grid/preview-size-picker.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { RangeControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { useMemo, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../../components/dataviews-context';\nimport type { ViewGrid } from '../../types';\n\nconst viewportBreaks = {\n\txhuge: { min: 3, max: 6, default: 5 },\n\thuge: { min: 2, max: 4, default: 4 },\n\txlarge: { min: 2, max: 3, default: 3 },\n\tlarge: { min: 1, max: 2, default: 2 },\n\tmobile: { min: 1, max: 2, default: 2 },\n};\n\nfunction useViewPortBreakpoint() {\n\tconst isXHuge = useViewportMatch( 'xhuge', '>=' );\n\tconst isHuge = useViewportMatch( 'huge', '>=' );\n\tconst isXlarge = useViewportMatch( 'xlarge', '>=' );\n\tconst isLarge = useViewportMatch( 'large', '>=' );\n\tconst isMobile = useViewportMatch( 'mobile', '>=' );\n\n\tif ( isXHuge ) {\n\t\treturn 'xhuge';\n\t}\n\tif ( isHuge ) {\n\t\treturn 'huge';\n\t}\n\tif ( isXlarge ) {\n\t\treturn 'xlarge';\n\t}\n\tif ( isLarge ) {\n\t\treturn 'large';\n\t}\n\tif ( isMobile ) {\n\t\treturn 'mobile';\n\t}\n\treturn null;\n}\n\nexport function useUpdatedPreviewSizeOnViewportChange() {\n\tconst viewport = useViewPortBreakpoint();\n\tconst view = useContext( DataViewsContext ).view as ViewGrid;\n\treturn useMemo( () => {\n\t\tconst previewSize = view.layout?.previewSize;\n\t\tlet newPreviewSize;\n\t\tif ( ! viewport || ! previewSize ) {\n\t\t\treturn;\n\t\t}\n\t\tconst breakValues = viewportBreaks[ viewport ];\n\t\tif ( previewSize < breakValues.min ) {\n\t\t\tnewPreviewSize = breakValues.min;\n\t\t}\n\t\tif ( previewSize > breakValues.max ) {\n\t\t\tnewPreviewSize = breakValues.max;\n\t\t}\n\t\treturn newPreviewSize;\n\t}, [ viewport, view ] );\n}\n\nexport default function PreviewSizePicker() {\n\tconst viewport = useViewPortBreakpoint();\n\tconst context = useContext( DataViewsContext );\n\tconst view = context.view as ViewGrid;\n\tconst breakValues = viewportBreaks[ viewport || 'mobile' ];\n\tconst previewSizeToUse = view.layout?.previewSize || breakValues.default;\n\n\tconst marks = useMemo(\n\t\t() =>\n\t\t\tArray.from(\n\t\t\t\t{ length: breakValues.max - breakValues.min + 1 },\n\t\t\t\t( _, i ) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tvalue: breakValues.min + i,\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t),\n\t\t[ breakValues ]\n\t);\n\n\tif ( ! viewport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<RangeControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\t__next40pxDefaultSize\n\t\t\tshowTooltip={ false }\n\t\t\tlabel={ __( 'Preview size' ) }\n\t\t\tvalue={ breakValues.max + breakValues.min - previewSizeToUse }\n\t\t\tmarks={ marks }\n\t\t\tmin={ breakValues.min }\n\t\t\tmax={ breakValues.max }\n\t\t\twithInputField={ false }\n\t\t\tonChange={ ( value = 0 ) => {\n\t\t\t\tcontext.onChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tlayout: {\n\t\t\t\t\t\t...view.layout,\n\t\t\t\t\t\tpreviewSize: breakValues.max + breakValues.min - value,\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tstep={ 1 }\n\t\t/>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_components","require","_i18n","_element","_dataviewsContext","_interopRequireDefault","_jsxRuntime","viewportBreaks","xhuge","min","max","default","huge","xlarge","large","mobile","BREAKPOINTS","useViewPortBreakpoint","containerWidth","useContext","DataViewsContext","key","value","Object","entries","useUpdatedPreviewSizeOnViewportChange","view","viewport","useMemo","previewSize","layout","newPreviewSize","breakValues","PreviewSizePicker","context","previewSizeToUse","marks","Array","from","length","_","i","jsx","RangeControl","__nextHasNoMarginBottom","__next40pxDefaultSize","showTooltip","label","__","withInputField","onChange","onChangeView","step"],"sources":["@wordpress/dataviews/src/dataviews-layouts/grid/preview-size-picker.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { RangeControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../../components/dataviews-context';\nimport type { ViewGrid } from '../../types';\n\nconst viewportBreaks: {\n\t[ key: string ]: { min: number; max: number; default: number };\n} = {\n\txhuge: { min: 3, max: 6, default: 5 },\n\thuge: { min: 2, max: 4, default: 4 },\n\txlarge: { min: 2, max: 3, default: 3 },\n\tlarge: { min: 1, max: 2, default: 2 },\n\tmobile: { min: 1, max: 2, default: 2 },\n};\n\n/**\n * Breakpoints were adjusted from media queries breakpoints to account for\n * the sidebar width. This was done to match the existing styles we had.\n */\nconst BREAKPOINTS = {\n\txhuge: 1520,\n\thuge: 1140,\n\txlarge: 780,\n\tlarge: 480,\n\tmobile: 0,\n};\n\nfunction useViewPortBreakpoint() {\n\tconst containerWidth = useContext( DataViewsContext ).containerWidth;\n\tfor ( const [ key, value ] of Object.entries( BREAKPOINTS ) ) {\n\t\tif ( containerWidth >= value ) {\n\t\t\treturn key;\n\t\t}\n\t}\n\treturn 'mobile';\n}\n\nexport function useUpdatedPreviewSizeOnViewportChange() {\n\tconst view = useContext( DataViewsContext ).view as ViewGrid;\n\tconst viewport = useViewPortBreakpoint();\n\treturn useMemo( () => {\n\t\tconst previewSize = view.layout?.previewSize;\n\t\tlet newPreviewSize;\n\t\tif ( ! previewSize ) {\n\t\t\treturn;\n\t\t}\n\t\tconst breakValues = viewportBreaks[ viewport ];\n\t\tif ( previewSize < breakValues.min ) {\n\t\t\tnewPreviewSize = breakValues.min;\n\t\t}\n\t\tif ( previewSize > breakValues.max ) {\n\t\t\tnewPreviewSize = breakValues.max;\n\t\t}\n\t\treturn newPreviewSize;\n\t}, [ viewport, view ] );\n}\n\nexport default function PreviewSizePicker() {\n\tconst viewport = useViewPortBreakpoint();\n\tconst context = useContext( DataViewsContext );\n\tconst view = context.view as ViewGrid;\n\tconst breakValues = viewportBreaks[ viewport ];\n\tconst previewSizeToUse = view.layout?.previewSize || breakValues.default;\n\tconst marks = useMemo(\n\t\t() =>\n\t\t\tArray.from(\n\t\t\t\t{ length: breakValues.max - breakValues.min + 1 },\n\t\t\t\t( _, i ) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tvalue: breakValues.min + i,\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t),\n\t\t[ breakValues ]\n\t);\n\tif ( viewport === 'mobile' ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<RangeControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\t__next40pxDefaultSize\n\t\t\tshowTooltip={ false }\n\t\t\tlabel={ __( 'Preview size' ) }\n\t\t\tvalue={ breakValues.max + breakValues.min - previewSizeToUse }\n\t\t\tmarks={ marks }\n\t\t\tmin={ breakValues.min }\n\t\t\tmax={ breakValues.max }\n\t\t\twithInputField={ false }\n\t\t\tonChange={ ( value = 0 ) => {\n\t\t\t\tcontext.onChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tlayout: {\n\t\t\t\t\t\t...view.layout,\n\t\t\t\t\t\tpreviewSize: breakValues.max + breakValues.min - value,\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tstep={ 1 }\n\t\t/>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/dataviews-layouts/index.js

@@ -5,9 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.VIEW_LAYOUTS = void 0;
-exports.getHiddenFieldIds = getHiddenFieldIds;
-exports.getNotHidableFieldIds = getNotHidableFieldIds;
-exports.getVisibleFieldIds = getVisibleFieldIds;
 var _i18n = require("@wordpress/i18n");
 var _icons = require("@wordpress/icons");
 var _table = _interopRequireDefault(require("./table"));
@@ -42,61 +39,4 @@ const VIEW_LAYOUTS = exports.VIEW_LAYOUTS = [{
   component: _list.default,
   icon: (0, _i18n.isRTL)() ? _icons.formatListBulletsRTL : _icons.formatListBullets
 }];
-function getNotHidableFieldIds(view) {
-  if (view.type === 'table') {
-    var _view$layout$combined;
-    return [view.layout?.primaryField].concat((_view$layout$combined = view.layout?.combinedFields?.flatMap(field => field.children)) !== null && _view$layout$combined !== void 0 ? _view$layout$combined : []).filter(item => !!item);
-  }
-  if (view.type === 'grid') {
-    return [view.layout?.primaryField, view.layout?.mediaField].filter(item => !!item);
-  }
-  if (view.type === 'list') {
-    return [view.layout?.primaryField, view.layout?.mediaField].filter(item => !!item);
-  }
-  return [];
-}
-function getCombinedFieldIds(view) {
-  const combinedFields = [];
-  if (view.type === _constants.LAYOUT_TABLE && view.layout?.combinedFields) {
-    view.layout.combinedFields.forEach(combination => {
-      combinedFields.push(...combination.children);
-    });
-  }
-  return combinedFields;
-}
-function getVisibleFieldIds(view, fields) {
-  const fieldsToExclude = getCombinedFieldIds(view);
-  if (view.fields) {
-    return view.fields.filter(id => !fieldsToExclude.includes(id));
-  }
-  const visibleFields = [];
-  if (view.type === _constants.LAYOUT_TABLE && view.layout?.combinedFields) {
-    visibleFields.push(...view.layout.combinedFields.map(({
-      id
-    }) => id));
-  }
-  visibleFields.push(...fields.filter(({
-    id
-  }) => !fieldsToExclude.includes(id)).map(({
-    id
-  }) => id));
-  return visibleFields;
-}
-function getHiddenFieldIds(view, fields) {
-  const fieldsToExclude = [...getCombinedFieldIds(view), ...getVisibleFieldIds(view, fields)];
-
-  // The media field does not need to be in the view.fields to be displayed.
-  if (view.type === _constants.LAYOUT_GRID && view.layout?.mediaField) {
-    fieldsToExclude.push(view.layout?.mediaField);
-  }
-  if (view.type === _constants.LAYOUT_LIST && view.layout?.mediaField) {
-    fieldsToExclude.push(view.layout?.mediaField);
-  }
-  return fields.filter(({
-    id,
-    enableHiding
-  }) => !fieldsToExclude.includes(id) && enableHiding).map(({
-    id
-  }) => id);
-}
 //# sourceMappingURL=index.js.map

package/build/dataviews-layouts/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_icons","_table","_interopRequireDefault","_grid","_list","_constants","_previewSizePicker","_densityPicker","VIEW_LAYOUTS","exports","type","LAYOUT_TABLE","label","__","component","ViewTable","icon","blockTable","viewConfigOptions","DensityPicker","LAYOUT_GRID","ViewGrid","category","PreviewSizePicker","LAYOUT_LIST","ViewList","isRTL","formatListBulletsRTL","formatListBullets","getNotHidableFieldIds","view","_view$layout$combined","layout","primaryField","concat","combinedFields","flatMap","field","children","filter","item","mediaField","getCombinedFieldIds","forEach","combination","push","getVisibleFieldIds","fields","fieldsToExclude","id","includes","visibleFields","map","getHiddenFieldIds","enableHiding"],"sources":["@wordpress/dataviews/src/dataviews-layouts/index.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tblockTable,\n\tcategory,\n\tformatListBullets,\n\tformatListBulletsRTL,\n} from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport ViewTable from './table';\nimport ViewGrid from './grid';\nimport ViewList from './list';\nimport { LAYOUT_GRID, LAYOUT_LIST, LAYOUT_TABLE } from '../constants';\nimport type { View, Field } from '../types';\nimport PreviewSizePicker from './grid/preview-size-picker';\nimport DensityPicker from './table/density-picker';\n\nexport const VIEW_LAYOUTS = [\n\t{\n\t\ttype: LAYOUT_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: PreviewSizePicker,\n\t},\n\t{\n\t\ttype: LAYOUT_LIST,\n\t\tlabel: __( 'List' ),\n\t\tcomponent: ViewList,\n\t\ticon: isRTL() ? formatListBulletsRTL : formatListBullets,\n\t},\n];\n\nexport function getNotHidableFieldIds( view: View ): string[] {\n\tif ( view.type === 'table' ) {\n\t\treturn [ view.layout?.primaryField ]\n\t\t\t.concat(\n\t\t\t\tview.layout?.combinedFields?.flatMap(\n\t\t\t\t\t( field ) => field.children\n\t\t\t\t) ?? []\n\t\t\t)\n\t\t\t.filter( ( item ): item is string => !! item );\n\t}\n\n\tif ( view.type === 'grid' ) {\n\t\treturn [ view.layout?.primaryField, view.layout?.mediaField ].filter(\n\t\t\t( item ): item is string => !! item\n\t\t);\n\t}\n\n\tif ( view.type === 'list' ) {\n\t\treturn [ view.layout?.primaryField, view.layout?.mediaField ].filter(\n\t\t\t( item ): item is string => !! item\n\t\t);\n\t}\n\n\treturn [];\n}\n\nfunction getCombinedFieldIds( view: View ): string[] {\n\tconst combinedFields: string[] = [];\n\tif ( view.type === LAYOUT_TABLE && view.layout?.combinedFields ) {\n\t\tview.layout.combinedFields.forEach( ( combination ) => {\n\t\t\tcombinedFields.push( ...combination.children );\n\t\t} );\n\t}\n\treturn combinedFields;\n}\n\nexport function getVisibleFieldIds(\n\tview: View,\n\tfields: Field< any >[]\n): string[] {\n\tconst fieldsToExclude = getCombinedFieldIds( view );\n\n\tif ( view.fields ) {\n\t\treturn view.fields.filter( ( id ) => ! fieldsToExclude.includes( id ) );\n\t}\n\n\tconst visibleFields = [];\n\tif ( view.type === LAYOUT_TABLE && view.layout?.combinedFields ) {\n\t\tvisibleFields.push(\n\t\t\t...view.layout.combinedFields.map( ( { id } ) => id )\n\t\t);\n\t}\n\tvisibleFields.push(\n\t\t...fields\n\t\t\t.filter( ( { id } ) => ! fieldsToExclude.includes( id ) )\n\t\t\t.map( ( { id } ) => id )\n\t);\n\n\treturn visibleFields;\n}\n\nexport function getHiddenFieldIds(\n\tview: View,\n\tfields: Field< any >[]\n): string[] {\n\tconst fieldsToExclude = [\n\t\t...getCombinedFieldIds( view ),\n\t\t...getVisibleFieldIds( view, fields ),\n\t];\n\n\t// The media field does not need to be in the view.fields to be displayed.\n\tif ( view.type === LAYOUT_GRID && view.layout?.mediaField ) {\n\t\tfieldsToExclude.push( view.layout?.mediaField );\n\t}\n\n\tif ( view.type === LAYOUT_LIST && view.layout?.mediaField ) {\n\t\tfieldsToExclude.push( view.layout?.mediaField );\n\t}\n\n\treturn fields\n\t\t.filter(\n\t\t\t( { id, enableHiding } ) =>\n\t\t\t\t! fieldsToExclude.includes( id ) && enableHiding\n\t\t)\n\t\t.map( ( { id } ) => id );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_i18n","require","_icons","_table","_interopRequireDefault","_grid","_list","_constants","_previewSizePicker","_densityPicker","VIEW_LAYOUTS","exports","type","LAYOUT_TABLE","label","__","component","ViewTable","icon","blockTable","viewConfigOptions","DensityPicker","LAYOUT_GRID","ViewGrid","category","PreviewSizePicker","LAYOUT_LIST","ViewList","isRTL","formatListBulletsRTL","formatListBullets"],"sources":["@wordpress/dataviews/src/dataviews-layouts/index.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tblockTable,\n\tcategory,\n\tformatListBullets,\n\tformatListBulletsRTL,\n} from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport ViewTable from './table';\nimport ViewGrid from './grid';\nimport ViewList from './list';\nimport { LAYOUT_GRID, LAYOUT_LIST, LAYOUT_TABLE } from '../constants';\nimport PreviewSizePicker from './grid/preview-size-picker';\nimport DensityPicker from './table/density-picker';\n\nexport const VIEW_LAYOUTS = [\n\t{\n\t\ttype: LAYOUT_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: PreviewSizePicker,\n\t},\n\t{\n\t\ttype: LAYOUT_LIST,\n\t\tlabel: __( 'List' ),\n\t\tcomponent: ViewList,\n\t\ticon: isRTL() ? formatListBulletsRTL : formatListBullets,\n\t},\n];\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAUA,IAAAE,MAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,KAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,KAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,UAAA,GAAAN,OAAA;AACA,IAAAO,kBAAA,GAAAJ,sBAAA,CAAAH,OAAA;AACA,IAAAQ,cAAA,GAAAL,sBAAA,CAAAH,OAAA;AAnBA;AACA;AACA;;AASA;AACA;AACA;;AAQO,MAAMS,YAAY,GAAAC,OAAA,CAAAD,YAAA,GAAG,CAC3B;EACCE,IAAI,EAAEC,uBAAY;EAClBC,KAAK,EAAE,IAAAC,QAAE,EAAE,OAAQ,CAAC;EACpBC,SAAS,EAAEC,cAAS;EACpBC,IAAI,EAAEC,iBAAU;EAChBC,iBAAiB,EAAEC;AACpB,CAAC,EACD;EACCT,IAAI,EAAEU,sBAAW;EACjBR,KAAK,EAAE,IAAAC,QAAE,EAAE,MAAO,CAAC;EACnBC,SAAS,EAAEO,aAAQ;EACnBL,IAAI,EAAEM,eAAQ;EACdJ,iBAAiB,EAAEK;AACpB,CAAC,EACD;EACCb,IAAI,EAAEc,sBAAW;EACjBZ,KAAK,EAAE,IAAAC,QAAE,EAAE,MAAO,CAAC;EACnBC,SAAS,EAAEW,aAAQ;EACnBT,IAAI,EAAE,IAAAU,WAAK,EAAC,CAAC,GAAGC,2BAAoB,GAAGC;AACxC,CAAC,CACD","ignoreList":[]}