@wordpress/dataviews 2.2.0 → 4.0.0

package/build-module/components/dataviews-selection-checkbox/index.js

@@ -0,0 +1,45 @@
+/**
+ * WordPress dependencies
+ */
+import { __, sprintf } from '@wordpress/i18n';
+import { CheckboxControl } from '@wordpress/components';
+
+/**
+ * Internal dependencies
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function DataViewsSelectionCheckbox({
+  selection,
+  onChangeSelection,
+  item,
+  getItemId,
+  primaryField,
+  disabled
+}) {
+  const id = getItemId(item);
+  const checked = !disabled && selection.includes(id);
+  let selectionLabel;
+  if (primaryField?.getValue && item) {
+    // eslint-disable-next-line @wordpress/valid-sprintf
+    selectionLabel = sprintf( /* translators: %s: item title. */
+    checked ? __('Deselect item: %s') : __('Select item: %s'), primaryField.getValue({
+      item
+    }));
+  } else {
+    selectionLabel = checked ? __('Select a new item') : __('Deselect item');
+  }
+  return /*#__PURE__*/_jsx(CheckboxControl, {
+    className: "dataviews-selection-checkbox",
+    __nextHasNoMarginBottom: true,
+    "aria-label": selectionLabel,
+    "aria-disabled": disabled,
+    checked: checked,
+    onChange: () => {
+      if (disabled) {
+        return;
+      }
+      onChangeSelection(selection.includes(id) ? selection.filter(itemId => id !== itemId) : [...selection, id]);
+    }
+  });
+}
+//# sourceMappingURL=index.js.map

package/build-module/components/dataviews-selection-checkbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__","sprintf","CheckboxControl","jsx","_jsx","DataViewsSelectionCheckbox","selection","onChangeSelection","item","getItemId","primaryField","disabled","id","checked","includes","selectionLabel","getValue","className","__nextHasNoMarginBottom","onChange","filter","itemId"],"sources":["@wordpress/dataviews/src/components/dataviews-selection-checkbox/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { CheckboxControl } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { Field } from '../../types';\nimport type { SetSelection } from '../../private-types';\n\ninterface DataViewsSelectionCheckboxProps< Item > {\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\titem: Item;\n\tgetItemId: ( item: Item ) => string;\n\tprimaryField?: Field< Item >;\n\tdisabled: boolean;\n}\n\nexport default function DataViewsSelectionCheckbox< Item >( {\n\tselection,\n\tonChangeSelection,\n\titem,\n\tgetItemId,\n\tprimaryField,\n\tdisabled,\n}: DataViewsSelectionCheckboxProps< Item > ) {\n\tconst id = getItemId( item );\n\tconst checked = ! disabled && selection.includes( id );\n\tlet selectionLabel;\n\tif ( primaryField?.getValue && item ) {\n\t\t// eslint-disable-next-line @wordpress/valid-sprintf\n\t\tselectionLabel = sprintf(\n\t\t\t/* translators: %s: item title. */\n\t\t\tchecked ? __( 'Deselect item: %s' ) : __( 'Select item: %s' ),\n\t\t\tprimaryField.getValue( { item } )\n\t\t);\n\t} else {\n\t\tselectionLabel = checked\n\t\t\t? __( 'Select a new item' )\n\t\t\t: __( 'Deselect item' );\n\t}\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-selection-checkbox\"\n\t\t\t__nextHasNoMarginBottom\n\t\t\taria-label={ selectionLabel }\n\t\t\taria-disabled={ disabled }\n\t\t\tchecked={ checked }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( disabled ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonChangeSelection(\n\t\t\t\t\tselection.includes( id )\n\t\t\t\t\t\t? selection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t\t: [ ...selection, id ]\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;AAC7C,SAASC,eAAe,QAAQ,uBAAuB;;AAEvD;AACA;AACA;AAFA,SAAAC,GAAA,IAAAC,IAAA;AAeA,eAAe,SAASC,0BAA0BA,CAAU;EAC3DC,SAAS;EACTC,iBAAiB;EACjBC,IAAI;EACJC,SAAS;EACTC,YAAY;EACZC;AACwC,CAAC,EAAG;EAC5C,MAAMC,EAAE,GAAGH,SAAS,CAAED,IAAK,CAAC;EAC5B,MAAMK,OAAO,GAAG,CAAEF,QAAQ,IAAIL,SAAS,CAACQ,QAAQ,CAAEF,EAAG,CAAC;EACtD,IAAIG,cAAc;EAClB,IAAKL,YAAY,EAAEM,QAAQ,IAAIR,IAAI,EAAG;IACrC;IACAO,cAAc,GAAGd,OAAO,EACvB;IACAY,OAAO,GAAGb,EAAE,CAAE,mBAAoB,CAAC,GAAGA,EAAE,CAAE,iBAAkB,CAAC,EAC7DU,YAAY,CAACM,QAAQ,CAAE;MAAER;IAAK,CAAE,CACjC,CAAC;EACF,CAAC,MAAM;IACNO,cAAc,GAAGF,OAAO,GACrBb,EAAE,CAAE,mBAAoB,CAAC,GACzBA,EAAE,CAAE,eAAgB,CAAC;EACzB;EACA,oBACCI,IAAA,CAACF,eAAe;IACfe,SAAS,EAAC,8BAA8B;IACxCC,uBAAuB;IACvB,cAAaH,cAAgB;IAC7B,iBAAgBJ,QAAU;IAC1BE,OAAO,EAAGA,OAAS;IACnBM,QAAQ,EAAGA,CAAA,KAAM;MAChB,IAAKR,QAAQ,EAAG;QACf;MACD;MAEAJ,iBAAiB,CAChBD,SAAS,CAACQ,QAAQ,CAAEF,EAAG,CAAC,GACrBN,SAAS,CAACc,MAAM,CAAIC,MAAM,IAAMT,EAAE,KAAKS,MAAO,CAAC,GAC/C,CAAE,GAAGf,SAAS,EAAEM,EAAE,CACtB,CAAC;IACF;EAAG,CACH,CAAC;AAEJ","ignoreList":[]}

package/build-module/{view-actions.js → components/dataviews-view-config/index.js}

@@ -5,19 +5,21 @@
 /**
  * WordPress dependencies
  */
-import { Button, privateApis as componentsPrivateApis } from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
-import { memo } from '@wordpress/element';
-import { settings } from '@wordpress/icons';
+import { Button, privateApis as componentsPrivateApis, __experimentalHStack as HStack } from '@wordpress/components';
+import { __, _x } from '@wordpress/i18n';
+import { memo, useContext } from '@wordpress/element';
+import { cog } from '@wordpress/icons';
 
 /**
  * Internal dependencies
  */
-import { unlock } from './lock-unlock';
-import { SORTING_DIRECTIONS, sortLabels } from './constants';
-import { VIEW_LAYOUTS } from './layouts';
+import { unlock } from '../../lock-unlock';
+import { SORTING_DIRECTIONS, sortLabels } from '../../constants';
+import { VIEW_LAYOUTS, getMandatoryFields } from '../../layouts';
+import DataViewsContext from '../dataviews-context';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 const {
   DropdownMenuV2: DropdownMenu,
   DropdownMenuGroupV2: DropdownMenuGroup,
@@ -29,50 +31,43 @@ const {
 function ViewTypeMenu({
   view,
   onChangeView,
-  supportedLayouts
-}) {
-  let _availableViews = VIEW_LAYOUTS;
-  if (supportedLayouts) {
-    _availableViews = _availableViews.filter(_view => supportedLayouts.includes(_view.type));
+  defaultLayouts = {
+    list: {},
+    grid: {},
+    table: {}
   }
-  if (_availableViews.length === 1) {
+}) {
+  const availableLayouts = Object.keys(defaultLayouts);
+  if (availableLayouts.length <= 1) {
     return null;
   }
-  const activeView = _availableViews.find(v => view.type === v.type);
-  return /*#__PURE__*/_jsx(DropdownMenu, {
-    trigger: /*#__PURE__*/_jsx(DropdownMenuItem, {
-      suffix: /*#__PURE__*/_jsx("span", {
-        "aria-hidden": "true",
-        children: activeView?.label
-      }),
+  return availableLayouts.map(layout => {
+    const config = VIEW_LAYOUTS.find(v => v.type === layout);
+    if (!config) {
+      return null;
+    }
+    return /*#__PURE__*/_jsx(DropdownMenuRadioItem, {
+      value: layout,
+      name: "view-actions-available-view",
+      checked: layout === view.type,
+      hideOnClick: true,
+      onChange: e => {
+        switch (e.target.value) {
+          case 'list':
+          case 'grid':
+          case 'table':
+            return onChangeView({
+              ...view,
+              type: e.target.value,
+              ...defaultLayouts[e.target.value]
+            });
+        }
+        throw new Error('Invalid dataview');
+      },
       children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
-        children: __('Layout')
+        children: config.label
       })
-    }),
-    children: _availableViews.map(availableView => {
-      return /*#__PURE__*/_jsx(DropdownMenuRadioItem, {
-        value: availableView.type,
-        name: "view-actions-available-view",
-        checked: availableView.type === view.type,
-        hideOnClick: true,
-        onChange: e => {
-          switch (e.target.value) {
-            case 'list':
-            case 'grid':
-            case 'table':
-              return onChangeView({
-                ...view,
-                type: e.target.value,
-                layout: {}
-              });
-          }
-          throw new Error('Invalid dataview');
-        },
-        children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
-          children: availableView.label
-        })
-      }, availableView.type);
-    })
+    }, layout);
   });
 }
 const PAGE_SIZE_VALUES = [10, 20, 50, 100];
@@ -116,7 +111,9 @@ function FieldsVisibilityMenu({
   onChangeView,
   fields
 }) {
-  const hidableFields = fields.filter(field => field.enableHiding !== false && field.id !== view.layout.mediaField);
+  const mandatoryFields = getMandatoryFields(view);
+  const hidableFields = fields.filter(field => field.enableHiding !== false && !mandatoryFields.includes(field.id));
+  const viewFields = view.fields || fields.map(field => field.id);
   if (!hidableFields?.length) {
     return null;
   }
@@ -129,15 +126,15 @@ function FieldsVisibilityMenu({
     children: hidableFields?.map(field => {
       return /*#__PURE__*/_jsx(DropdownMenuCheckboxItem, {
         value: field.id,
-        checked: !view.hiddenFields?.includes(field.id),
+        checked: viewFields.includes(field.id),
         onChange: () => {
           onChangeView({
             ...view,
-            hiddenFields: view.hiddenFields?.includes(field.id) ? view.hiddenFields.filter(id => id !== field.id) : [...(view.hiddenFields || []), field.id]
+            fields: viewFields.includes(field.id) ? viewFields.filter(id => id !== field.id) : [...viewFields, field.id]
           });
         },
         children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
-          children: field.header
+          children: field.label
         })
       }, field.id);
     })
@@ -157,7 +154,7 @@ function SortMenu({
     trigger: /*#__PURE__*/_jsx(DropdownMenuItem, {
       suffix: /*#__PURE__*/_jsx("span", {
         "aria-hidden": "true",
-        children: currentSortedField?.header
+        children: currentSortedField?.label
       }),
       children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
         children: __('Sort by')
@@ -168,7 +165,7 @@ function SortMenu({
       return /*#__PURE__*/_jsx(DropdownMenu, {
         trigger: /*#__PURE__*/_jsx(DropdownMenuItem, {
           children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
-            children: field.header
+            children: field.label
           })
         }),
         style: {
@@ -204,40 +201,57 @@ function SortMenu({
     })
   });
 }
-function _ViewActions({
-  fields,
-  view,
-  onChangeView,
-  supportedLayouts
+function _DataViewsViewConfig({
+  defaultLayouts
 }) {
-  return /*#__PURE__*/_jsx(DropdownMenu, {
-    trigger: /*#__PURE__*/_jsx(Button, {
-      size: "compact",
-      icon: settings,
-      label: __('View options')
-    }),
-    children: /*#__PURE__*/_jsxs(DropdownMenuGroup, {
-      children: [/*#__PURE__*/_jsx(ViewTypeMenu, {
-        view: view,
-        onChangeView: onChangeView,
-        supportedLayouts: supportedLayouts
-      }), /*#__PURE__*/_jsx(SortMenu, {
-        fields: fields,
-        view: view,
-        onChangeView: onChangeView
-      }), /*#__PURE__*/_jsx(FieldsVisibilityMenu, {
-        fields: fields,
-        view: view,
-        onChangeView: onChangeView
-      }), /*#__PURE__*/_jsx(PageSizeMenu, {
-        view: view,
-        onChangeView: onChangeView
+  const {
+    view,
+    fields,
+    onChangeView
+  } = useContext(DataViewsContext);
+  const activeView = VIEW_LAYOUTS.find(v => view.type === v.type);
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: /*#__PURE__*/_jsxs(HStack, {
+      spacing: 1,
+      expanded: false,
+      style: {
+        flexShrink: 0
+      },
+      children: [/*#__PURE__*/_jsx(DropdownMenu, {
+        trigger: /*#__PURE__*/_jsx(Button, {
+          size: "compact",
+          icon: activeView?.icon,
+          label: __('Layout')
+        }),
+        children: /*#__PURE__*/_jsx(ViewTypeMenu, {
+          view: view,
+          onChangeView: onChangeView,
+          defaultLayouts: defaultLayouts
+        })
+      }), /*#__PURE__*/_jsx(DropdownMenu, {
+        trigger: /*#__PURE__*/_jsx(Button, {
+          size: "compact",
+          icon: cog,
+          label: _x('View options', 'View is used as a noun')
+        }),
+        children: /*#__PURE__*/_jsxs(DropdownMenuGroup, {
+          children: [/*#__PURE__*/_jsx(SortMenu, {
+            fields: fields,
+            view: view,
+            onChangeView: onChangeView
+          }), /*#__PURE__*/_jsx(FieldsVisibilityMenu, {
+            fields: fields,
+            view: view,
+            onChangeView: onChangeView
+          }), /*#__PURE__*/_jsx(PageSizeMenu, {
+            view: view,
+            onChangeView: onChangeView
+          })]
+        })
       })]
     })
   });
 }
-
-// A type assertion is used here to keep the type argument.
-const ViewActions = memo(_ViewActions);
-export default ViewActions;
-//# sourceMappingURL=view-actions.js.map
+const DataViewsViewConfig = memo(_DataViewsViewConfig);
+export default DataViewsViewConfig;
+//# sourceMappingURL=index.js.map

package/build-module/components/dataviews-view-config/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Button","privateApis","componentsPrivateApis","__experimentalHStack","HStack","__","_x","memo","useContext","cog","unlock","SORTING_DIRECTIONS","sortLabels","VIEW_LAYOUTS","getMandatoryFields","DataViewsContext","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuRadioItemV2","DropdownMenuRadioItem","DropdownMenuCheckboxItemV2","DropdownMenuCheckboxItem","DropdownMenuItemLabelV2","DropdownMenuItemLabel","ViewTypeMenu","view","onChangeView","defaultLayouts","list","grid","table","availableLayouts","Object","keys","length","map","layout","config","find","v","type","value","name","checked","hideOnClick","onChange","e","target","Error","children","label","PAGE_SIZE_VALUES","PageSizeMenu","trigger","suffix","perPage","size","page","FieldsVisibilityMenu","fields","mandatoryFields","hidableFields","filter","field","enableHiding","includes","id","viewFields","SortMenu","sortableFields","enableSorting","currentSortedField","sort","sortedDirection","direction","style","minWidth","isChecked","undefined","_DataViewsViewConfig","activeView","spacing","expanded","flexShrink","icon","DataViewsViewConfig"],"sources":["@wordpress/dataviews/src/components/dataviews-view-config/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tprivateApis as componentsPrivateApis,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { memo, useContext } from '@wordpress/element';\nimport { cog } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { SORTING_DIRECTIONS, sortLabels } from '../../constants';\nimport { VIEW_LAYOUTS, getMandatoryFields } from '../../layouts';\nimport type { NormalizedField, View, SupportedLayouts } from '../../types';\nimport DataViewsContext from '../dataviews-context';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuRadioItemV2: DropdownMenuRadioItem,\n\tDropdownMenuCheckboxItemV2: DropdownMenuCheckboxItem,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n} = unlock( componentsPrivateApis );\n\ninterface ViewTypeMenuProps {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tdefaultLayouts?: SupportedLayouts;\n}\n\ninterface PageSizeMenuProps {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n}\n\ninterface FieldsVisibilityMenuProps< Item > {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: NormalizedField< Item >[];\n}\n\ninterface SortMenuProps< Item > {\n\tfields: NormalizedField< Item >[];\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n}\n\ninterface ViewActionsProps {\n\tdefaultLayouts?: SupportedLayouts;\n}\n\nfunction ViewTypeMenu( {\n\tview,\n\tonChangeView,\n\tdefaultLayouts = { list: {}, grid: {}, table: {} },\n}: ViewTypeMenuProps ) {\n\tconst availableLayouts = Object.keys( defaultLayouts );\n\tif ( availableLayouts.length <= 1 ) {\n\t\treturn null;\n\t}\n\treturn availableLayouts.map( ( layout ) => {\n\t\tconst config = VIEW_LAYOUTS.find( ( v ) => v.type === layout );\n\t\tif ( ! config ) {\n\t\t\treturn null;\n\t\t}\n\t\treturn (\n\t\t\t<DropdownMenuRadioItem\n\t\t\t\tkey={ layout }\n\t\t\t\tvalue={ layout }\n\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\tchecked={ layout === view.type }\n\t\t\t\thideOnClick\n\t\t\t\tonChange={ ( e: ChangeEvent< HTMLInputElement > ) => {\n\t\t\t\t\tswitch ( e.target.value ) {\n\t\t\t\t\t\tcase 'list':\n\t\t\t\t\t\tcase 'grid':\n\t\t\t\t\t\tcase 'table':\n\t\t\t\t\t\t\treturn onChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t\t...defaultLayouts[ e.target.value ],\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\t\t\t\t\tthrow new Error( 'Invalid dataview' );\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<DropdownMenuItemLabel>{ config.label }</DropdownMenuItemLabel>\n\t\t\t</DropdownMenuRadioItem>\n\t\t);\n\t} );\n}\n\nconst PAGE_SIZE_VALUES = [ 10, 20, 50, 100 ];\nfunction PageSizeMenu( { view, onChangeView }: PageSizeMenuProps ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={ <span aria-hidden=\"true\">{ view.perPage }</span> }\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Items per page' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ PAGE_SIZE_VALUES.map( ( size ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ size }\n\t\t\t\t\t\tvalue={ size }\n\t\t\t\t\t\tname=\"view-actions-page-size\"\n\t\t\t\t\t\tchecked={ view.perPage === size }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t// `e.target.value` holds the same value as `size` but as a string,\n\t\t\t\t\t\t\t\t// so we use `size` directly to avoid parsing to int.\n\t\t\t\t\t\t\t\tperPage: size,\n\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>{ size }</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction FieldsVisibilityMenu< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n}: FieldsVisibilityMenuProps< Item > ) {\n\tconst mandatoryFields = getMandatoryFields( view );\n\tconst hidableFields = fields.filter(\n\t\t( field ) =>\n\t\t\tfield.enableHiding !== false &&\n\t\t\t! mandatoryFields.includes( field.id )\n\t);\n\tconst viewFields = view.fields || fields.map( ( field ) => field.id );\n\tif ( ! hidableFields?.length ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Fields' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ hidableFields?.map( ( field ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuCheckboxItem\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\tvalue={ field.id }\n\t\t\t\t\t\tchecked={ viewFields.includes( field.id ) }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\tfields: viewFields.includes( field.id )\n\t\t\t\t\t\t\t\t\t? viewFields.filter(\n\t\t\t\t\t\t\t\t\t\t\t( id ) => id !== field.id\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t: [ ...viewFields, field.id ],\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuCheckboxItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction SortMenu< Item >( {\n\tfields,\n\tview,\n\tonChangeView,\n}: SortMenuProps< Item > ) {\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( ! sortableFields?.length ) {\n\t\treturn null;\n\t}\n\tconst currentSortedField = fields.find(\n\t\t( field ) => field.id === view.sort?.field\n\t);\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t{ currentSortedField?.label }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Sort by' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ sortableFields?.map( ( field ) => {\n\t\t\t\tconst sortedDirection = view.sort?.direction;\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\tminWidth: '220px',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ SORTING_DIRECTIONS.map( ( direction ) => {\n\t\t\t\t\t\t\tconst isChecked =\n\t\t\t\t\t\t\t\tcurrentSortedField !== undefined &&\n\t\t\t\t\t\t\t\tsortedDirection === direction &&\n\t\t\t\t\t\t\t\tfield.id === currentSortedField.id;\n\n\t\t\t\t\t\t\tconst value = `${ field.id }-${ direction }`;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\t\t\t\t// All sorting radio items share the same name, so that\n\t\t\t\t\t\t\t\t\t// selecting a sorting option automatically deselects the\n\t\t\t\t\t\t\t\t\t// previously selected one, even if it is displayed in\n\t\t\t\t\t\t\t\t\t// another submenu. The field and direction are passed via\n\t\t\t\t\t\t\t\t\t// the `value` prop.\n\t\t\t\t\t\t\t\t\tname=\"view-actions-sorting\"\n\t\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\t\tchecked={ isChecked }\n\t\t\t\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\t\t\t\t\t\tfield: field.id,\n\t\t\t\t\t\t\t\t\t\t\t\tdirection,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t{ sortLabels[ direction ] }\n\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</DropdownMenu>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction _DataViewsViewConfig( { defaultLayouts }: ViewActionsProps ) {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\tconst activeView = VIEW_LAYOUTS.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<>\n\t\t\t<HStack\n\t\t\t\tspacing={ 1 }\n\t\t\t\texpanded={ false }\n\t\t\t\tstyle={ { flexShrink: 0 } }\n\t\t\t>\n\t\t\t\t<DropdownMenu\n\t\t\t\t\ttrigger={\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\ticon={ activeView?.icon }\n\t\t\t\t\t\t\tlabel={ __( 'Layout' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<ViewTypeMenu\n\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\tdefaultLayouts={ defaultLayouts }\n\t\t\t\t\t/>\n\t\t\t\t</DropdownMenu>\n\t\t\t\t<DropdownMenu\n\t\t\t\t\ttrigger={\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\ticon={ cog }\n\t\t\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t\t\t'View options',\n\t\t\t\t\t\t\t\t'View is used as a noun'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t\t<SortMenu\n\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<FieldsVisibilityMenu\n\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<PageSizeMenu\n\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</DropdownMenuGroup>\n\t\t\t\t</DropdownMenu>\n\t\t\t</HStack>\n\t\t</>\n\t);\n}\n\nconst DataViewsViewConfig = memo( _DataViewsViewConfig );\n\nexport default DataViewsViewConfig;\n"],"mappings":"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","ignoreList":[]}

package/build-module/filter-and-sort-data-view.js

@@ -45,7 +45,7 @@ export function filterSortAndPaginate(data, view, fields) {
       }).some(field => field.includes(normalizedSearch));
     });
   }
-  if (view.filters.length > 0) {
+  if (view.filters && view.filters?.length > 0) {
     view.filters.forEach(filter => {
       const field = _fields.find(_field => _field.id === filter.field);
       if (field) {
@@ -121,6 +121,9 @@ export function filterSortAndPaginate(data, view, fields) {
         const valueB = (_fieldToSort$getValue2 = fieldToSort.getValue({
           item: b
         })) !== null && _fieldToSort$getValue2 !== void 0 ? _fieldToSort$getValue2 : '';
+        if (typeof valueA === 'number' && typeof valueB === 'number') {
+          return view.sort?.direction === 'asc' ? valueA - valueB : valueB - valueA;
+        }
         return view.sort?.direction === 'asc' ? valueA.localeCompare(valueB) : valueB.localeCompare(valueA);
       });
     }

package/build-module/filter-and-sort-data-view.js.map

@@ -1 +1 @@
-{"version":3,"names":["removeAccents","OPERATOR_IS","OPERATOR_IS_NOT","OPERATOR_IS_NONE","OPERATOR_IS_ANY","OPERATOR_IS_ALL","OPERATOR_IS_NOT_ALL","normalizeFields","normalizeSearchInput","input","trim","toLowerCase","EMPTY_ARRAY","filterSortAndPaginate","data","view","fields","paginationInfo","totalItems","totalPages","_fields","filteredData","search","normalizedSearch","filter","item","field","enableGlobalSearch","map","getValue","some","includes","filters","length","forEach","find","_field","id","operator","value","fieldValue","Array","isArray","filterValue","every","sort","fieldId","fieldToSort","a","b","_fieldToSort$getValue","_fieldToSort$getValue2","valueA","valueB","direction","localeCompare","page","undefined","perPage","start","Math","ceil","slice"],"sources":["@wordpress/dataviews/src/filter-and-sort-data-view.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport removeAccents from 'remove-accents';\n\n/**\n * Internal dependencies\n */\nimport {\n\tOPERATOR_IS,\n\tOPERATOR_IS_NOT,\n\tOPERATOR_IS_NONE,\n\tOPERATOR_IS_ANY,\n\tOPERATOR_IS_ALL,\n\tOPERATOR_IS_NOT_ALL,\n} from './constants';\nimport { normalizeFields } from './normalize-fields';\nimport type { Field, AnyItem, View } from './types';\n\nfunction normalizeSearchInput( input = '' ) {\n\treturn removeAccents( input.trim().toLowerCase() );\n}\n\nconst EMPTY_ARRAY: [] = [];\n\n/**\n * Applies the filtering, sorting and pagination to the raw data based on the view configuration.\n *\n * @param data   Raw data.\n * @param view   View config.\n * @param fields Fields config.\n *\n * @return Filtered, sorted and paginated data.\n */\nexport function filterSortAndPaginate< Item extends AnyItem >(\n\tdata: Item[],\n\tview: View,\n\tfields: Field< Item >[]\n): {\n\tdata: Item[];\n\tpaginationInfo: { totalItems: number; totalPages: number };\n} {\n\tif ( ! data ) {\n\t\treturn {\n\t\t\tdata: EMPTY_ARRAY,\n\t\t\tpaginationInfo: { totalItems: 0, totalPages: 0 },\n\t\t};\n\t}\n\tconst _fields = normalizeFields( fields );\n\tlet filteredData = [ ...data ];\n\t// Handle global search.\n\tif ( view.search ) {\n\t\tconst normalizedSearch = normalizeSearchInput( view.search );\n\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\treturn _fields\n\t\t\t\t.filter( ( field ) => field.enableGlobalSearch )\n\t\t\t\t.map( ( field ) => {\n\t\t\t\t\treturn normalizeSearchInput( field.getValue( { item } ) );\n\t\t\t\t} )\n\t\t\t\t.some( ( field ) => field.includes( normalizedSearch ) );\n\t\t} );\n\t}\n\n\tif ( view.filters.length > 0 ) {\n\t\tview.filters.forEach( ( filter ) => {\n\t\t\tconst field = _fields.find(\n\t\t\t\t( _field ) => _field.id === filter.field\n\t\t\t);\n\t\t\tif ( field ) {\n\t\t\t\tif (\n\t\t\t\t\tfilter.operator === OPERATOR_IS_ANY &&\n\t\t\t\t\tfilter?.value?.length > 0\n\t\t\t\t) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\tconst fieldValue = field.getValue( { item } );\n\t\t\t\t\t\tif ( Array.isArray( fieldValue ) ) {\n\t\t\t\t\t\t\treturn filter.value.some( ( filterValue: any ) =>\n\t\t\t\t\t\t\t\tfieldValue.includes( filterValue )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} else if ( typeof fieldValue === 'string' ) {\n\t\t\t\t\t\t\treturn filter.value.includes( fieldValue );\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn false;\n\t\t\t\t\t} );\n\t\t\t\t} else if (\n\t\t\t\t\tfilter.operator === OPERATOR_IS_NONE &&\n\t\t\t\t\tfilter?.value?.length > 0\n\t\t\t\t) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\tconst fieldValue = field.getValue( { item } );\n\t\t\t\t\t\tif ( Array.isArray( fieldValue ) ) {\n\t\t\t\t\t\t\treturn ! filter.value.some( ( filterValue: any ) =>\n\t\t\t\t\t\t\t\tfieldValue.includes( filterValue )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} else if ( typeof fieldValue === 'string' ) {\n\t\t\t\t\t\t\treturn ! filter.value.includes( fieldValue );\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn false;\n\t\t\t\t\t} );\n\t\t\t\t} else if (\n\t\t\t\t\tfilter.operator === OPERATOR_IS_ALL &&\n\t\t\t\t\tfilter?.value?.length > 0\n\t\t\t\t) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\treturn filter.value.every( ( value: any ) => {\n\t\t\t\t\t\t\treturn field\n\t\t\t\t\t\t\t\t.getValue( { item } )\n\t\t\t\t\t\t\t\t?.includes( value );\n\t\t\t\t\t\t} );\n\t\t\t\t\t} );\n\t\t\t\t} else if (\n\t\t\t\t\tfilter.operator === OPERATOR_IS_NOT_ALL &&\n\t\t\t\t\tfilter?.value?.length > 0\n\t\t\t\t) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\treturn filter.value.every( ( value: any ) => {\n\t\t\t\t\t\t\treturn ! field\n\t\t\t\t\t\t\t\t.getValue( { item } )\n\t\t\t\t\t\t\t\t?.includes( value );\n\t\t\t\t\t\t} );\n\t\t\t\t\t} );\n\t\t\t\t} else if ( filter.operator === OPERATOR_IS ) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\treturn filter.value === field.getValue( { item } );\n\t\t\t\t\t} );\n\t\t\t\t} else if ( filter.operator === OPERATOR_IS_NOT ) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\treturn filter.value !== field.getValue( { item } );\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\t}\n\n\t// Handle sorting.\n\tif ( view.sort ) {\n\t\tconst fieldId = view.sort.field;\n\t\tconst fieldToSort = _fields.find( ( field ) => {\n\t\t\treturn field.id === fieldId;\n\t\t} );\n\t\tif ( fieldToSort ) {\n\t\t\tfilteredData.sort( ( a, b ) => {\n\t\t\t\tconst valueA = fieldToSort.getValue( { item: a } ) ?? '';\n\t\t\t\tconst valueB = fieldToSort.getValue( { item: b } ) ?? '';\n\t\t\t\treturn view.sort?.direction === 'asc'\n\t\t\t\t\t? valueA.localeCompare( valueB )\n\t\t\t\t\t: valueB.localeCompare( valueA );\n\t\t\t} );\n\t\t}\n\t}\n\n\t// Handle pagination.\n\tlet totalItems = filteredData.length;\n\tlet totalPages = 1;\n\tif ( view.page !== undefined && view.perPage !== undefined ) {\n\t\tconst start = ( view.page - 1 ) * view.perPage;\n\t\ttotalItems = filteredData?.length || 0;\n\t\ttotalPages = Math.ceil( totalItems / view.perPage );\n\t\tfilteredData = filteredData?.slice( start, start + view.perPage );\n\t}\n\n\treturn {\n\t\tdata: filteredData,\n\t\tpaginationInfo: {\n\t\t\ttotalItems,\n\t\t\ttotalPages,\n\t\t},\n\t};\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["removeAccents","OPERATOR_IS","OPERATOR_IS_NOT","OPERATOR_IS_NONE","OPERATOR_IS_ANY","OPERATOR_IS_ALL","OPERATOR_IS_NOT_ALL","normalizeFields","normalizeSearchInput","input","trim","toLowerCase","EMPTY_ARRAY","filterSortAndPaginate","data","view","fields","paginationInfo","totalItems","totalPages","_fields","filteredData","search","normalizedSearch","filter","item","field","enableGlobalSearch","map","getValue","some","includes","filters","length","forEach","find","_field","id","operator","value","fieldValue","Array","isArray","filterValue","every","sort","fieldId","fieldToSort","a","b","_fieldToSort$getValue","_fieldToSort$getValue2","valueA","valueB","direction","localeCompare","page","undefined","perPage","start","Math","ceil","slice"],"sources":["@wordpress/dataviews/src/filter-and-sort-data-view.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport removeAccents from 'remove-accents';\n\n/**\n * Internal dependencies\n */\nimport {\n\tOPERATOR_IS,\n\tOPERATOR_IS_NOT,\n\tOPERATOR_IS_NONE,\n\tOPERATOR_IS_ANY,\n\tOPERATOR_IS_ALL,\n\tOPERATOR_IS_NOT_ALL,\n} from './constants';\nimport { normalizeFields } from './normalize-fields';\nimport type { Field, View } from './types';\n\nfunction normalizeSearchInput( input = '' ) {\n\treturn removeAccents( input.trim().toLowerCase() );\n}\n\nconst EMPTY_ARRAY: [] = [];\n\n/**\n * Applies the filtering, sorting and pagination to the raw data based on the view configuration.\n *\n * @param data   Raw data.\n * @param view   View config.\n * @param fields Fields config.\n *\n * @return Filtered, sorted and paginated data.\n */\nexport function filterSortAndPaginate< Item >(\n\tdata: Item[],\n\tview: View,\n\tfields: Field< Item >[]\n): {\n\tdata: Item[];\n\tpaginationInfo: { totalItems: number; totalPages: number };\n} {\n\tif ( ! data ) {\n\t\treturn {\n\t\t\tdata: EMPTY_ARRAY,\n\t\t\tpaginationInfo: { totalItems: 0, totalPages: 0 },\n\t\t};\n\t}\n\tconst _fields = normalizeFields( fields );\n\tlet filteredData = [ ...data ];\n\t// Handle global search.\n\tif ( view.search ) {\n\t\tconst normalizedSearch = normalizeSearchInput( view.search );\n\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\treturn _fields\n\t\t\t\t.filter( ( field ) => field.enableGlobalSearch )\n\t\t\t\t.map( ( field ) => {\n\t\t\t\t\treturn normalizeSearchInput( field.getValue( { item } ) );\n\t\t\t\t} )\n\t\t\t\t.some( ( field ) => field.includes( normalizedSearch ) );\n\t\t} );\n\t}\n\n\tif ( view.filters && view.filters?.length > 0 ) {\n\t\tview.filters.forEach( ( filter ) => {\n\t\t\tconst field = _fields.find(\n\t\t\t\t( _field ) => _field.id === filter.field\n\t\t\t);\n\t\t\tif ( field ) {\n\t\t\t\tif (\n\t\t\t\t\tfilter.operator === OPERATOR_IS_ANY &&\n\t\t\t\t\tfilter?.value?.length > 0\n\t\t\t\t) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\tconst fieldValue = field.getValue( { item } );\n\t\t\t\t\t\tif ( Array.isArray( fieldValue ) ) {\n\t\t\t\t\t\t\treturn filter.value.some( ( filterValue: any ) =>\n\t\t\t\t\t\t\t\tfieldValue.includes( filterValue )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} else if ( typeof fieldValue === 'string' ) {\n\t\t\t\t\t\t\treturn filter.value.includes( fieldValue );\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn false;\n\t\t\t\t\t} );\n\t\t\t\t} else if (\n\t\t\t\t\tfilter.operator === OPERATOR_IS_NONE &&\n\t\t\t\t\tfilter?.value?.length > 0\n\t\t\t\t) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\tconst fieldValue = field.getValue( { item } );\n\t\t\t\t\t\tif ( Array.isArray( fieldValue ) ) {\n\t\t\t\t\t\t\treturn ! filter.value.some( ( filterValue: any ) =>\n\t\t\t\t\t\t\t\tfieldValue.includes( filterValue )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} else if ( typeof fieldValue === 'string' ) {\n\t\t\t\t\t\t\treturn ! filter.value.includes( fieldValue );\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn false;\n\t\t\t\t\t} );\n\t\t\t\t} else if (\n\t\t\t\t\tfilter.operator === OPERATOR_IS_ALL &&\n\t\t\t\t\tfilter?.value?.length > 0\n\t\t\t\t) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\treturn filter.value.every( ( value: any ) => {\n\t\t\t\t\t\t\treturn field\n\t\t\t\t\t\t\t\t.getValue( { item } )\n\t\t\t\t\t\t\t\t?.includes( value );\n\t\t\t\t\t\t} );\n\t\t\t\t\t} );\n\t\t\t\t} else if (\n\t\t\t\t\tfilter.operator === OPERATOR_IS_NOT_ALL &&\n\t\t\t\t\tfilter?.value?.length > 0\n\t\t\t\t) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\treturn filter.value.every( ( value: any ) => {\n\t\t\t\t\t\t\treturn ! field\n\t\t\t\t\t\t\t\t.getValue( { item } )\n\t\t\t\t\t\t\t\t?.includes( value );\n\t\t\t\t\t\t} );\n\t\t\t\t\t} );\n\t\t\t\t} else if ( filter.operator === OPERATOR_IS ) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\treturn filter.value === field.getValue( { item } );\n\t\t\t\t\t} );\n\t\t\t\t} else if ( filter.operator === OPERATOR_IS_NOT ) {\n\t\t\t\t\tfilteredData = filteredData.filter( ( item ) => {\n\t\t\t\t\t\treturn filter.value !== field.getValue( { item } );\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\t}\n\n\t// Handle sorting.\n\tif ( view.sort ) {\n\t\tconst fieldId = view.sort.field;\n\t\tconst fieldToSort = _fields.find( ( field ) => {\n\t\t\treturn field.id === fieldId;\n\t\t} );\n\t\tif ( fieldToSort ) {\n\t\t\tfilteredData.sort( ( a, b ) => {\n\t\t\t\tconst valueA = fieldToSort.getValue( { item: a } ) ?? '';\n\t\t\t\tconst valueB = fieldToSort.getValue( { item: b } ) ?? '';\n\n\t\t\t\tif (\n\t\t\t\t\ttypeof valueA === 'number' &&\n\t\t\t\t\ttypeof valueB === 'number'\n\t\t\t\t) {\n\t\t\t\t\treturn view.sort?.direction === 'asc'\n\t\t\t\t\t\t? valueA - valueB\n\t\t\t\t\t\t: valueB - valueA;\n\t\t\t\t}\n\n\t\t\t\treturn view.sort?.direction === 'asc'\n\t\t\t\t\t? valueA.localeCompare( valueB )\n\t\t\t\t\t: valueB.localeCompare( valueA );\n\t\t\t} );\n\t\t}\n\t}\n\n\t// Handle pagination.\n\tlet totalItems = filteredData.length;\n\tlet totalPages = 1;\n\tif ( view.page !== undefined && view.perPage !== undefined ) {\n\t\tconst start = ( view.page - 1 ) * view.perPage;\n\t\ttotalItems = filteredData?.length || 0;\n\t\ttotalPages = Math.ceil( totalItems / view.perPage );\n\t\tfilteredData = filteredData?.slice( start, start + view.perPage );\n\t}\n\n\treturn {\n\t\tdata: filteredData,\n\t\tpaginationInfo: {\n\t\t\ttotalItems,\n\t\t\ttotalPages,\n\t\t},\n\t};\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,aAAa,MAAM,gBAAgB;;AAE1C;AACA;AACA;AACA,SACCC,WAAW,EACXC,eAAe,EACfC,gBAAgB,EAChBC,eAAe,EACfC,eAAe,EACfC,mBAAmB,QACb,aAAa;AACpB,SAASC,eAAe,QAAQ,oBAAoB;AAGpD,SAASC,oBAAoBA,CAAEC,KAAK,GAAG,EAAE,EAAG;EAC3C,OAAOT,aAAa,CAAES,KAAK,CAACC,IAAI,CAAC,CAAC,CAACC,WAAW,CAAC,CAAE,CAAC;AACnD;AAEA,MAAMC,WAAe,GAAG,EAAE;;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,qBAAqBA,CACpCC,IAAY,EACZC,IAAU,EACVC,MAAuB,EAItB;EACD,IAAK,CAAEF,IAAI,EAAG;IACb,OAAO;MACNA,IAAI,EAAEF,WAAW;MACjBK,cAAc,EAAE;QAAEC,UAAU,EAAE,CAAC;QAAEC,UAAU,EAAE;MAAE;IAChD,CAAC;EACF;EACA,MAAMC,OAAO,GAAGb,eAAe,CAAES,MAAO,CAAC;EACzC,IAAIK,YAAY,GAAG,CAAE,GAAGP,IAAI,CAAE;EAC9B;EACA,IAAKC,IAAI,CAACO,MAAM,EAAG;IAClB,MAAMC,gBAAgB,GAAGf,oBAAoB,CAAEO,IAAI,CAACO,MAAO,CAAC;IAC5DD,YAAY,GAAGA,YAAY,CAACG,MAAM,CAAIC,IAAI,IAAM;MAC/C,OAAOL,OAAO,CACZI,MAAM,CAAIE,KAAK,IAAMA,KAAK,CAACC,kBAAmB,CAAC,CAC/CC,GAAG,CAAIF,KAAK,IAAM;QAClB,OAAOlB,oBAAoB,CAAEkB,KAAK,CAACG,QAAQ,CAAE;UAAEJ;QAAK,CAAE,CAAE,CAAC;MAC1D,CAAE,CAAC,CACFK,IAAI,CAAIJ,KAAK,IAAMA,KAAK,CAACK,QAAQ,CAAER,gBAAiB,CAAE,CAAC;IAC1D,CAAE,CAAC;EACJ;EAEA,IAAKR,IAAI,CAACiB,OAAO,IAAIjB,IAAI,CAACiB,OAAO,EAAEC,MAAM,GAAG,CAAC,EAAG;IAC/ClB,IAAI,CAACiB,OAAO,CAACE,OAAO,CAAIV,MAAM,IAAM;MACnC,MAAME,KAAK,GAAGN,OAAO,CAACe,IAAI,CACvBC,MAAM,IAAMA,MAAM,CAACC,EAAE,KAAKb,MAAM,CAACE,KACpC,CAAC;MACD,IAAKA,KAAK,EAAG;QACZ,IACCF,MAAM,CAACc,QAAQ,KAAKlC,eAAe,IACnCoB,MAAM,EAAEe,KAAK,EAAEN,MAAM,GAAG,CAAC,EACxB;UACDZ,YAAY,GAAGA,YAAY,CAACG,MAAM,CAAIC,IAAI,IAAM;YAC/C,MAAMe,UAAU,GAAGd,KAAK,CAACG,QAAQ,CAAE;cAAEJ;YAAK,CAAE,CAAC;YAC7C,IAAKgB,KAAK,CAACC,OAAO,CAAEF,UAAW,CAAC,EAAG;cAClC,OAAOhB,MAAM,CAACe,KAAK,CAACT,IAAI,CAAIa,WAAgB,IAC3CH,UAAU,CAACT,QAAQ,CAAEY,WAAY,CAClC,CAAC;YACF,CAAC,MAAM,IAAK,OAAOH,UAAU,KAAK,QAAQ,EAAG;cAC5C,OAAOhB,MAAM,CAACe,KAAK,CAACR,QAAQ,CAAES,UAAW,CAAC;YAC3C;YACA,OAAO,KAAK;UACb,CAAE,CAAC;QACJ,CAAC,MAAM,IACNhB,MAAM,CAACc,QAAQ,KAAKnC,gBAAgB,IACpCqB,MAAM,EAAEe,KAAK,EAAEN,MAAM,GAAG,CAAC,EACxB;UACDZ,YAAY,GAAGA,YAAY,CAACG,MAAM,CAAIC,IAAI,IAAM;YAC/C,MAAMe,UAAU,GAAGd,KAAK,CAACG,QAAQ,CAAE;cAAEJ;YAAK,CAAE,CAAC;YAC7C,IAAKgB,KAAK,CAACC,OAAO,CAAEF,UAAW,CAAC,EAAG;cAClC,OAAO,CAAEhB,MAAM,CAACe,KAAK,CAACT,IAAI,CAAIa,WAAgB,IAC7CH,UAAU,CAACT,QAAQ,CAAEY,WAAY,CAClC,CAAC;YACF,CAAC,MAAM,IAAK,OAAOH,UAAU,KAAK,QAAQ,EAAG;cAC5C,OAAO,CAAEhB,MAAM,CAACe,KAAK,CAACR,QAAQ,CAAES,UAAW,CAAC;YAC7C;YACA,OAAO,KAAK;UACb,CAAE,CAAC;QACJ,CAAC,MAAM,IACNhB,MAAM,CAACc,QAAQ,KAAKjC,eAAe,IACnCmB,MAAM,EAAEe,KAAK,EAAEN,MAAM,GAAG,CAAC,EACxB;UACDZ,YAAY,GAAGA,YAAY,CAACG,MAAM,CAAIC,IAAI,IAAM;YAC/C,OAAOD,MAAM,CAACe,KAAK,CAACK,KAAK,CAAIL,KAAU,IAAM;cAC5C,OAAOb,KAAK,CACVG,QAAQ,CAAE;gBAAEJ;cAAK,CAAE,CAAC,EACnBM,QAAQ,CAAEQ,KAAM,CAAC;YACrB,CAAE,CAAC;UACJ,CAAE,CAAC;QACJ,CAAC,MAAM,IACNf,MAAM,CAACc,QAAQ,KAAKhC,mBAAmB,IACvCkB,MAAM,EAAEe,KAAK,EAAEN,MAAM,GAAG,CAAC,EACxB;UACDZ,YAAY,GAAGA,YAAY,CAACG,MAAM,CAAIC,IAAI,IAAM;YAC/C,OAAOD,MAAM,CAACe,KAAK,CAACK,KAAK,CAAIL,KAAU,IAAM;cAC5C,OAAO,CAAEb,KAAK,CACZG,QAAQ,CAAE;gBAAEJ;cAAK,CAAE,CAAC,EACnBM,QAAQ,CAAEQ,KAAM,CAAC;YACrB,CAAE,CAAC;UACJ,CAAE,CAAC;QACJ,CAAC,MAAM,IAAKf,MAAM,CAACc,QAAQ,KAAKrC,WAAW,EAAG;UAC7CoB,YAAY,GAAGA,YAAY,CAACG,MAAM,CAAIC,IAAI,IAAM;YAC/C,OAAOD,MAAM,CAACe,KAAK,KAAKb,KAAK,CAACG,QAAQ,CAAE;cAAEJ;YAAK,CAAE,CAAC;UACnD,CAAE,CAAC;QACJ,CAAC,MAAM,IAAKD,MAAM,CAACc,QAAQ,KAAKpC,eAAe,EAAG;UACjDmB,YAAY,GAAGA,YAAY,CAACG,MAAM,CAAIC,IAAI,IAAM;YAC/C,OAAOD,MAAM,CAACe,KAAK,KAAKb,KAAK,CAACG,QAAQ,CAAE;cAAEJ;YAAK,CAAE,CAAC;UACnD,CAAE,CAAC;QACJ;MACD;IACD,CAAE,CAAC;EACJ;;EAEA;EACA,IAAKV,IAAI,CAAC8B,IAAI,EAAG;IAChB,MAAMC,OAAO,GAAG/B,IAAI,CAAC8B,IAAI,CAACnB,KAAK;IAC/B,MAAMqB,WAAW,GAAG3B,OAAO,CAACe,IAAI,CAAIT,KAAK,IAAM;MAC9C,OAAOA,KAAK,CAACW,EAAE,KAAKS,OAAO;IAC5B,CAAE,CAAC;IACH,IAAKC,WAAW,EAAG;MAClB1B,YAAY,CAACwB,IAAI,CAAE,CAAEG,CAAC,EAAEC,CAAC,KAAM;QAAA,IAAAC,qBAAA,EAAAC,sBAAA;QAC9B,MAAMC,MAAM,IAAAF,qBAAA,GAAGH,WAAW,CAAClB,QAAQ,CAAE;UAAEJ,IAAI,EAAEuB;QAAE,CAAE,CAAC,cAAAE,qBAAA,cAAAA,qBAAA,GAAI,EAAE;QACxD,MAAMG,MAAM,IAAAF,sBAAA,GAAGJ,WAAW,CAAClB,QAAQ,CAAE;UAAEJ,IAAI,EAAEwB;QAAE,CAAE,CAAC,cAAAE,sBAAA,cAAAA,sBAAA,GAAI,EAAE;QAExD,IACC,OAAOC,MAAM,KAAK,QAAQ,IAC1B,OAAOC,MAAM,KAAK,QAAQ,EACzB;UACD,OAAOtC,IAAI,CAAC8B,IAAI,EAAES,SAAS,KAAK,KAAK,GAClCF,MAAM,GAAGC,MAAM,GACfA,MAAM,GAAGD,MAAM;QACnB;QAEA,OAAOrC,IAAI,CAAC8B,IAAI,EAAES,SAAS,KAAK,KAAK,GAClCF,MAAM,CAACG,aAAa,CAAEF,MAAO,CAAC,GAC9BA,MAAM,CAACE,aAAa,CAAEH,MAAO,CAAC;MAClC,CAAE,CAAC;IACJ;EACD;;EAEA;EACA,IAAIlC,UAAU,GAAGG,YAAY,CAACY,MAAM;EACpC,IAAId,UAAU,GAAG,CAAC;EAClB,IAAKJ,IAAI,CAACyC,IAAI,KAAKC,SAAS,IAAI1C,IAAI,CAAC2C,OAAO,KAAKD,SAAS,EAAG;IAC5D,MAAME,KAAK,GAAG,CAAE5C,IAAI,CAACyC,IAAI,GAAG,CAAC,IAAKzC,IAAI,CAAC2C,OAAO;IAC9CxC,UAAU,GAAGG,YAAY,EAAEY,MAAM,IAAI,CAAC;IACtCd,UAAU,GAAGyC,IAAI,CAACC,IAAI,CAAE3C,UAAU,GAAGH,IAAI,CAAC2C,OAAQ,CAAC;IACnDrC,YAAY,GAAGA,YAAY,EAAEyC,KAAK,CAAEH,KAAK,EAAEA,KAAK,GAAG5C,IAAI,CAAC2C,OAAQ,CAAC;EAClE;EAEA,OAAO;IACN5C,IAAI,EAAEO,YAAY;IAClBJ,cAAc,EAAE;MACfC,UAAU;MACVC;IACD;EACD,CAAC;AACF","ignoreList":[]}

package/build-module/index.js

@@ -1,4 +1,5 @@
-export { default as DataViews } from './dataviews';
+export { default as DataViews } from './components/dataviews';
+export { default as DataForm } from './components/dataform';
 export { VIEW_LAYOUTS } from './layouts';
 export { filterSortAndPaginate } from './filter-and-sort-data-view';
 //# sourceMappingURL=index.js.map

package/build-module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["default","DataViews","VIEW_LAYOUTS","filterSortAndPaginate"],"sources":["@wordpress/dataviews/src/index.ts"],"sourcesContent":["export { default as DataViews } from './dataviews';\nexport { VIEW_LAYOUTS } from './layouts';\nexport { filterSortAndPaginate } from './filter-and-sort-data-view';\nexport type * from './types';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,SAAS,QAAQ,aAAa;AAClD,SAASC,YAAY,QAAQ,WAAW;AACxC,SAASC,qBAAqB,QAAQ,6BAA6B","ignoreList":[]}
+{"version":3,"names":["default","DataViews","DataForm","VIEW_LAYOUTS","filterSortAndPaginate"],"sources":["@wordpress/dataviews/src/index.ts"],"sourcesContent":["export { default as DataViews } from './components/dataviews';\nexport { default as DataForm } from './components/dataform';\nexport { VIEW_LAYOUTS } from './layouts';\nexport { filterSortAndPaginate } from './filter-and-sort-data-view';\nexport type * from './types';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,SAAS,QAAQ,wBAAwB;AAC7D,SAASD,OAAO,IAAIE,QAAQ,QAAQ,uBAAuB;AAC3D,SAASC,YAAY,QAAQ,WAAW;AACxC,SAASC,qBAAqB,QAAQ,6BAA6B","ignoreList":[]}

package/build-module/layouts/grid/density-picker.js

@@ -0,0 +1,138 @@
+/**
+ * WordPress dependencies
+ */
+import { RangeControl, Button } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+import { useViewportMatch } from '@wordpress/compose';
+import { plus, lineSolid } from '@wordpress/icons';
+import { useEffect } from '@wordpress/element';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const viewportBreaks = {
+  xhuge: {
+    min: 3,
+    max: 6,
+    default: 5
+  },
+  huge: {
+    min: 2,
+    max: 4,
+    default: 4
+  },
+  xlarge: {
+    min: 2,
+    max: 3,
+    default: 3
+  },
+  large: {
+    min: 1,
+    max: 2,
+    default: 2
+  },
+  mobile: {
+    min: 1,
+    max: 2,
+    default: 2
+  }
+};
+function useViewPortBreakpoint() {
+  const isXHuge = useViewportMatch('xhuge', '>=');
+  const isHuge = useViewportMatch('huge', '>=');
+  const isXlarge = useViewportMatch('xlarge', '>=');
+  const isLarge = useViewportMatch('large', '>=');
+  const isMobile = useViewportMatch('mobile', '>=');
+  if (isXHuge) {
+    return 'xhuge';
+  }
+  if (isHuge) {
+    return 'huge';
+  }
+  if (isXlarge) {
+    return 'xlarge';
+  }
+  if (isLarge) {
+    return 'large';
+  }
+  if (isMobile) {
+    return 'mobile';
+  }
+  return null;
+}
+
+// Value is number from 0 to 100 representing how big an item is in the grid
+// 100 being the biggest and 0 being the smallest.
+// The size is relative to the viewport size, if one a given viewport the
+// number of allowed items in a grid is 3 to 6 a 0 ( the smallest ) will mean that the grid will
+// have 6 items in a row, a 100 ( the biggest ) will mean that the grid will have 3 items in a row.
+// A value of 75 will mean that the grid will have 4 items in a row.
+function getRangeValue(density, breakValues) {
+  const inverseDensity = breakValues.max - density;
+  const max = breakValues.max - breakValues.min;
+  return Math.round(inverseDensity * 100 / max);
+}
+export default function DensityPicker({
+  density,
+  setDensity
+}) {
+  const viewport = useViewPortBreakpoint();
+  useEffect(() => {
+    setDensity(_density => {
+      if (!viewport || !_density) {
+        return 0;
+      }
+      const breakValues = viewportBreaks[viewport];
+      if (_density < breakValues.min) {
+        return breakValues.min;
+      }
+      if (_density > breakValues.max) {
+        return breakValues.max;
+      }
+      return _density;
+    });
+  }, [setDensity, viewport]);
+  if (!viewport) {
+    return null;
+  }
+  const breakValues = viewportBreaks[viewport];
+  const densityToUse = density || breakValues.default;
+  const rangeValue = getRangeValue(densityToUse, breakValues);
+  const step = 100 / (breakValues.max - breakValues.min + 1);
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Button, {
+      size: "compact",
+      icon: lineSolid,
+      disabled: rangeValue <= 0,
+      accessibleWhenDisabled: true,
+      label: __('Decrease size'),
+      onClick: () => {
+        setDensity(densityToUse + 1);
+      }
+    }), /*#__PURE__*/_jsx(RangeControl, {
+      __nextHasNoMarginBottom: true,
+      showTooltip: false,
+      className: "dataviews-density-picker__range-control",
+      label: __('Item size'),
+      hideLabelFromVision: true,
+      value: rangeValue,
+      min: 0,
+      max: 100,
+      withInputField: false,
+      onChange: (value = 0) => {
+        const inverseValue = 100 - value;
+        setDensity(Math.round(inverseValue * (breakValues.max - breakValues.min) / 100 + breakValues.min));
+      },
+      step: step
+    }), /*#__PURE__*/_jsx(Button, {
+      size: "compact",
+      icon: plus,
+      disabled: rangeValue >= 100,
+      accessibleWhenDisabled: true,
+      label: __('Increase size'),
+      onClick: () => {
+        setDensity(densityToUse - 1);
+      }
+    })]
+  });
+}
+//# sourceMappingURL=density-picker.js.map

package/build-module/layouts/grid/density-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["RangeControl","Button","__","useViewportMatch","plus","lineSolid","useEffect","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","viewportBreaks","xhuge","min","max","default","huge","xlarge","large","mobile","useViewPortBreakpoint","isXHuge","isHuge","isXlarge","isLarge","isMobile","getRangeValue","density","breakValues","inverseDensity","Math","round","DensityPicker","setDensity","viewport","_density","densityToUse","rangeValue","step","children","size","icon","disabled","accessibleWhenDisabled","label","onClick","__nextHasNoMarginBottom","showTooltip","className","hideLabelFromVision","value","withInputField","onChange","inverseValue"],"sources":["@wordpress/dataviews/src/layouts/grid/density-picker.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { RangeControl, Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { plus, lineSolid } from '@wordpress/icons';\nimport { useEffect } from '@wordpress/element';\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\n// Value is number from 0 to 100 representing how big an item is in the grid\n// 100 being the biggest and 0 being the smallest.\n// The size is relative to the viewport size, if one a given viewport the\n// number of allowed items in a grid is 3 to 6 a 0 ( the smallest ) will mean that the grid will\n// have 6 items in a row, a 100 ( the biggest ) will mean that the grid will have 3 items in a row.\n// A value of 75 will mean that the grid will have 4 items in a row.\nfunction getRangeValue(\n\tdensity: number,\n\tbreakValues: { min: number; max: number; default: number }\n) {\n\tconst inverseDensity = breakValues.max - density;\n\tconst max = breakValues.max - breakValues.min;\n\treturn Math.round( ( inverseDensity * 100 ) / max );\n}\n\nexport default function DensityPicker( {\n\tdensity,\n\tsetDensity,\n}: {\n\tdensity: number;\n\tsetDensity: React.Dispatch< React.SetStateAction< number > >;\n} ) {\n\tconst viewport = useViewPortBreakpoint();\n\tuseEffect( () => {\n\t\tsetDensity( ( _density ) => {\n\t\t\tif ( ! viewport || ! _density ) {\n\t\t\t\treturn 0;\n\t\t\t}\n\t\t\tconst breakValues = viewportBreaks[ viewport ];\n\t\t\tif ( _density < breakValues.min ) {\n\t\t\t\treturn breakValues.min;\n\t\t\t}\n\t\t\tif ( _density > breakValues.max ) {\n\t\t\t\treturn breakValues.max;\n\t\t\t}\n\t\t\treturn _density;\n\t\t} );\n\t}, [ setDensity, viewport ] );\n\tif ( ! viewport ) {\n\t\treturn null;\n\t}\n\tconst breakValues = viewportBreaks[ viewport ];\n\tconst densityToUse = density || breakValues.default;\n\tconst rangeValue = getRangeValue( densityToUse, breakValues );\n\n\tconst step = 100 / ( breakValues.max - breakValues.min + 1 );\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\tsize=\"compact\"\n\t\t\t\ticon={ lineSolid }\n\t\t\t\tdisabled={ rangeValue <= 0 }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t\tlabel={ __( 'Decrease size' ) }\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tsetDensity( densityToUse + 1 );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<RangeControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tshowTooltip={ false }\n\t\t\t\tclassName=\"dataviews-density-picker__range-control\"\n\t\t\t\tlabel={ __( 'Item size' ) }\n\t\t\t\thideLabelFromVision\n\t\t\t\tvalue={ rangeValue }\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ 100 }\n\t\t\t\twithInputField={ false }\n\t\t\t\tonChange={ ( value = 0 ) => {\n\t\t\t\t\tconst inverseValue = 100 - value;\n\t\t\t\t\tsetDensity(\n\t\t\t\t\t\tMath.round(\n\t\t\t\t\t\t\t( inverseValue *\n\t\t\t\t\t\t\t\t( breakValues.max - breakValues.min ) ) /\n\t\t\t\t\t\t\t\t100 +\n\t\t\t\t\t\t\t\tbreakValues.min\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t\tstep={ step }\n\t\t\t/>\n\t\t\t<Button\n\t\t\t\tsize=\"compact\"\n\t\t\t\ticon={ plus }\n\t\t\t\tdisabled={ rangeValue >= 100 }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t\tlabel={ __( 'Increase size' ) }\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tsetDensity( densityToUse - 1 );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}