@wordpress/dataviews 11.3.1-next.v.0 → 12.0.0

package/build-module/components/dataviews-picker-footer/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataviews-picker-footer/index.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { Button, CheckboxControl } from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useContext, useMemo, useState } from '@wordpress/element';\nimport { Stack } from '@wordpress/ui';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport DataViewsPagination from '../dataviews-pagination';\nimport DataViewsContext from '../dataviews-context';\nimport type { SetSelection } from '../../types/private';\nimport type { Action } from '../../types';\nimport getFooterMessage from '../../utils/get-footer-message';\n\nconst EMPTY_ARRAY: [] = [];\n\nexport function useIsMultiselectPicker< Item >(\n\tactions: Action< Item >[] | undefined\n) {\n\treturn useMemo( () => {\n\t\treturn actions?.every( ( action ) => action.supportsBulk );\n\t}, [ actions ] );\n}\n\nfunction BulkSelectionCheckbox< Item >( {\n\tselection,\n\tselectedItems,\n\tonChangeSelection,\n\tdata,\n\tgetItemId,\n}: {\n\tselection: string[];\n\tselectedItems: Item[];\n\tonChangeSelection: SetSelection;\n\tdata: Item[];\n\tgetItemId: ( item: Item ) => string;\n} ) {\n\tconst areAllSelected = selectedItems.length === data.length;\n\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-view-table-selection-checkbox\"\n\t\t\tchecked={ areAllSelected }\n\t\t\tindeterminate={ ! areAllSelected && !! selectedItems.length }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( areAllSelected ) {\n\t\t\t\t\t// Deselect all - remove the current page from the total selection.\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.filter(\n\t\t\t\t\t\t\t( id ) =>\n\t\t\t\t\t\t\t\t! data.some(\n\t\t\t\t\t\t\t\t\t( item ) => id === getItemId( item )\n\t\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} else {\n\t\t\t\t\t// Select all - merge the current page into the total selection.\n\t\t\t\t\tconst selectionSet = new Set( [\n\t\t\t\t\t\t...selection,\n\t\t\t\t\t\t...data.map( ( item ) => getItemId( item ) ),\n\t\t\t\t\t] );\n\t\t\t\t\tonChangeSelection( Array.from( selectionSet ) );\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={\n\t\t\t\tareAllSelected ? __( 'Deselect all' ) : __( 'Select all' )\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction ActionButtons< Item >( {\n\tactions,\n\titems,\n\tselection,\n}: {\n\tactions: Action< Item >[];\n\titems: Item[];\n\tselection: string[];\n} ) {\n\tconst registry = useRegistry();\n\tconst [ actionInProgress, setActionInProgress ] = useState< string | null >(\n\t\tnull\n\t);\n\n\treturn (\n\t\t<Stack direction=\"row\" gap=\"2xs\">\n\t\t\t{ actions.map( ( action ) => {\n\t\t\t\t// Only support actions with callbacks for DataViewsPicker.\n\t\t\t\t// This is because many use cases of the picker will be already within modals.\n\t\t\t\tif ( ! ( 'callback' in action ) ) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\n\t\t\t\tconst { id, label, icon, isPrimary, callback } = action;\n\n\t\t\t\tconst _label =\n\t\t\t\t\ttypeof label === 'string' ? label : label( items );\n\t\t\t\tconst variant = isPrimary ? 'primary' : 'tertiary';\n\t\t\t\tconst isInProgress = id === actionInProgress;\n\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tdisabled={ isInProgress || ! selection?.length }\n\t\t\t\t\t\tisBusy={ isInProgress }\n\t\t\t\t\t\tonClick={ async () => {\n\t\t\t\t\t\t\tsetActionInProgress( id );\n\t\t\t\t\t\t\tawait callback( items, {\n\t\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tsetActionInProgress( null );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\tvariant={ variant }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ _label }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Stack>\n\t);\n}\n\nexport function DataViewsPickerFooter() {\n\tconst {\n\t\tdata,\n\t\tselection,\n\t\tonChangeSelection,\n\t\tgetItemId,\n\t\tactions = EMPTY_ARRAY,\n\t\tpaginationInfo,\n\t} = useContext( DataViewsContext );\n\n\tconst isMultiselect = useIsMultiselectPicker( actions );\n\n\tconst message = getFooterMessage(\n\t\tselection.length,\n\t\tdata.length,\n\t\tpaginationInfo.totalItems\n\t);\n\n\tconst selectedItems = useMemo(\n\t\t() =>\n\t\t\tdata.filter( ( item ) => selection.includes( getItemId( item ) ) ),\n\t\t[ selection, getItemId, data ]\n\t);\n\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"row\"\n\t\t\tjustify=\"space-between\"\n\t\t\talign=\"center\"\n\t\t\tclassName=\"dataviews-footer\"\n\t\t\tgap=\"xs\"\n\t\t>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\tclassName=\"dataviews-picker-footer__bulk-selection\"\n\t\t\t\tgap=\"sm\"\n\t\t\t\talign=\"center\"\n\t\t\t>\n\t\t\t\t{ isMultiselect && (\n\t\t\t\t\t<BulkSelectionCheckbox\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\tselectedItems={ selectedItems }\n\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<span className=\"dataviews-bulk-actions-footer__item-count\">\n\t\t\t\t\t{ message }\n\t\t\t\t</span>\n\t\t\t</Stack>\n\t\t\t<DataViewsPagination />\n\t\t\t{ Boolean( actions?.length ) && (\n\t\t\t\t<div className=\"dataviews-picker-footer__actions\">\n\t\t\t\t\t<ActionButtons\n\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\titems={ selectedItems }\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Stack>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,QAAQ,uBAAuB;AACxC,SAAS,mBAAmB;AAC5B,SAAS,YAAY,SAAS,gBAAgB;AAC9C,SAAS,aAAa;AACtB,SAAS,UAAU;AAKnB,OAAO,yBAAyB;AAChC,OAAO,sBAAsB;AAG7B,OAAO,sBAAsB;AA4B3B,cAsHC,YAtHD;AA1BF,IAAM,cAAkB,CAAC;AAElB,SAAS,uBACf,SACC;AACD,SAAO,QAAS,MAAM;AACrB,WAAO,SAAS,MAAO,CAAE,WAAY,OAAO,YAAa;AAAA,EAC1D,GAAG,CAAE,OAAQ,CAAE;AAChB;AAEA,SAAS,sBAA+B;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAMI;AACH,QAAM,iBAAiB,cAAc,WAAW,KAAK;AAErD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,SAAU;AAAA,MACV,eAAgB,CAAE,kBAAkB,CAAC,CAAE,cAAc;AAAA,MACrD,UAAW,MAAM;AAChB,YAAK,gBAAiB;AAErB;AAAA,YACC,UAAU;AAAA,cACT,CAAE,OACD,CAAE,KAAK;AAAA,gBACN,CAAE,SAAU,OAAO,UAAW,IAAK;AAAA,cACpC;AAAA,YACF;AAAA,UACD;AAAA,QACD,OAAO;AAEN,gBAAM,eAAe,oBAAI,IAAK;AAAA,YAC7B,GAAG;AAAA,YACH,GAAG,KAAK,IAAK,CAAE,SAAU,UAAW,IAAK,CAAE;AAAA,UAC5C,CAAE;AACF,4BAAmB,MAAM,KAAM,YAAa,CAAE;AAAA,QAC/C;AAAA,MACD;AAAA,MACA,cACC,iBAAiB,GAAI,cAAe,IAAI,GAAI,YAAa;AAAA;AAAA,EAE3D;AAEF;AAEA,SAAS,cAAuB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AACD,GAII;AACH,QAAM,WAAW,YAAY;AAC7B,QAAM,CAAE,kBAAkB,mBAAoB,IAAI;AAAA,IACjD;AAAA,EACD;AAEA,SACC,oBAAC,SAAM,WAAU,OAAM,KAAI,OACxB,kBAAQ,IAAK,CAAE,WAAY;AAG5B,QAAK,EAAI,cAAc,SAAW;AACjC,aAAO;AAAA,IACR;AAEA,UAAM,EAAE,IAAI,OAAO,MAAM,WAAW,SAAS,IAAI;AAEjD,UAAM,SACL,OAAO,UAAU,WAAW,QAAQ,MAAO,KAAM;AAClD,UAAM,UAAU,YAAY,YAAY;AACxC,UAAM,eAAe,OAAO;AAE5B,WACC;AAAA,MAAC;AAAA;AAAA,QAEA,wBAAsB;AAAA,QACtB;AAAA,QACA,UAAW,gBAAgB,CAAE,WAAW;AAAA,QACxC,QAAS;AAAA,QACT,SAAU,YAAY;AACrB,8BAAqB,EAAG;AACxB,gBAAM,SAAU,OAAO;AAAA,YACtB;AAAA,UACD,CAAE;AACF,8BAAqB,IAAK;AAAA,QAC3B;AAAA,QACA,MAAK;AAAA,QACL;AAAA,QAEE;AAAA;AAAA,MAfI;AAAA,IAgBP;AAAA,EAEF,CAAE,GACH;AAEF;AAEO,SAAS,wBAAwB;AACvC,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,EACD,IAAI,WAAY,gBAAiB;AAEjC,QAAM,gBAAgB,uBAAwB,OAAQ;AAEtD,QAAM,UAAU;AAAA,IACf,UAAU;AAAA,IACV,KAAK;AAAA,IACL,eAAe;AAAA,EAChB;AAEA,QAAM,gBAAgB;AAAA,IACrB,MACC,KAAK,OAAQ,CAAE,SAAU,UAAU,SAAU,UAAW,IAAK,CAAE,CAAE;AAAA,IAClE,CAAE,WAAW,WAAW,IAAK;AAAA,EAC9B;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,WAAU;AAAA,MACV,KAAI;AAAA,MAEJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,WAAU;AAAA,YACV,KAAI;AAAA,YACJ,OAAM;AAAA,YAEJ;AAAA,+BACD;AAAA,gBAAC;AAAA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA;AAAA,cACD;AAAA,cAED,oBAAC,UAAK,WAAU,6CACb,mBACH;AAAA;AAAA;AAAA,QACD;AAAA,QACA,oBAAC,uBAAoB;AAAA,QACnB,QAAS,SAAS,MAAO,KAC1B,oBAAC,SAAI,WAAU,oCACd;AAAA,UAAC;AAAA;AAAA,YACA;AAAA,YACA,OAAQ;AAAA,YACR;AAAA;AAAA,QACD,GACD;AAAA;AAAA;AAAA,EAEF;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { Button, CheckboxControl } from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useContext, useMemo, useState } from '@wordpress/element';\nimport { Stack } from '@wordpress/ui';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport DataViewsPagination from '../dataviews-pagination';\nimport DataViewsContext from '../dataviews-context';\nimport type { SetSelection } from '../../types/private';\nimport type { Action } from '../../types';\nimport getFooterMessage from '../../utils/get-footer-message';\n\nconst EMPTY_ARRAY: [] = [];\n\nexport function useIsMultiselectPicker< Item >(\n\tactions: Action< Item >[] | undefined\n) {\n\treturn useMemo( () => {\n\t\treturn actions?.every( ( action ) => action.supportsBulk );\n\t}, [ actions ] );\n}\n\nfunction BulkSelectionCheckbox< Item >( {\n\tselection,\n\tselectedItems,\n\tonChangeSelection,\n\tdata,\n\tgetItemId,\n}: {\n\tselection: string[];\n\tselectedItems: Item[];\n\tonChangeSelection: SetSelection;\n\tdata: Item[];\n\tgetItemId: ( item: Item ) => string;\n} ) {\n\tconst areAllSelected = selectedItems.length === data.length;\n\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-view-table-selection-checkbox\"\n\t\t\tchecked={ areAllSelected }\n\t\t\tindeterminate={ ! areAllSelected && !! selectedItems.length }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( areAllSelected ) {\n\t\t\t\t\t// Deselect all - remove the current page from the total selection.\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.filter(\n\t\t\t\t\t\t\t( id ) =>\n\t\t\t\t\t\t\t\t! data.some(\n\t\t\t\t\t\t\t\t\t( item ) => id === getItemId( item )\n\t\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} else {\n\t\t\t\t\t// Select all - merge the current page into the total selection.\n\t\t\t\t\tconst selectionSet = new Set( [\n\t\t\t\t\t\t...selection,\n\t\t\t\t\t\t...data.map( ( item ) => getItemId( item ) ),\n\t\t\t\t\t] );\n\t\t\t\t\tonChangeSelection( Array.from( selectionSet ) );\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={\n\t\t\t\tareAllSelected ? __( 'Deselect all' ) : __( 'Select all' )\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction ActionButtons< Item >( {\n\tactions,\n\titems,\n\tselection,\n}: {\n\tactions: Action< Item >[];\n\titems: Item[];\n\tselection: string[];\n} ) {\n\tconst registry = useRegistry();\n\tconst [ actionInProgress, setActionInProgress ] = useState< string | null >(\n\t\tnull\n\t);\n\n\treturn (\n\t\t<Stack direction=\"row\" gap=\"xs\">\n\t\t\t{ actions.map( ( action ) => {\n\t\t\t\t// Only support actions with callbacks for DataViewsPicker.\n\t\t\t\t// This is because many use cases of the picker will be already within modals.\n\t\t\t\tif ( ! ( 'callback' in action ) ) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\n\t\t\t\tconst { id, label, icon, isPrimary, callback } = action;\n\n\t\t\t\tconst _label =\n\t\t\t\t\ttypeof label === 'string' ? label : label( items );\n\t\t\t\tconst variant = isPrimary ? 'primary' : 'tertiary';\n\t\t\t\tconst isInProgress = id === actionInProgress;\n\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tdisabled={ isInProgress || ! selection?.length }\n\t\t\t\t\t\tisBusy={ isInProgress }\n\t\t\t\t\t\tonClick={ async () => {\n\t\t\t\t\t\t\tsetActionInProgress( id );\n\t\t\t\t\t\t\tawait callback( items, {\n\t\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tsetActionInProgress( null );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\tvariant={ variant }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ _label }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Stack>\n\t);\n}\n\nexport function DataViewsPickerFooter() {\n\tconst {\n\t\tdata,\n\t\tselection,\n\t\tonChangeSelection,\n\t\tgetItemId,\n\t\tactions = EMPTY_ARRAY,\n\t\tpaginationInfo,\n\t} = useContext( DataViewsContext );\n\n\tconst isMultiselect = useIsMultiselectPicker( actions );\n\n\tconst message = getFooterMessage(\n\t\tselection.length,\n\t\tdata.length,\n\t\tpaginationInfo.totalItems\n\t);\n\n\tconst selectedItems = useMemo(\n\t\t() =>\n\t\t\tdata.filter( ( item ) => selection.includes( getItemId( item ) ) ),\n\t\t[ selection, getItemId, data ]\n\t);\n\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"row\"\n\t\t\tjustify=\"space-between\"\n\t\t\talign=\"center\"\n\t\t\tclassName=\"dataviews-footer\"\n\t\t\tgap=\"sm\"\n\t\t>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\tclassName=\"dataviews-picker-footer__bulk-selection\"\n\t\t\t\tgap=\"md\"\n\t\t\t\talign=\"center\"\n\t\t\t>\n\t\t\t\t{ isMultiselect && (\n\t\t\t\t\t<BulkSelectionCheckbox\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\tselectedItems={ selectedItems }\n\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<span className=\"dataviews-bulk-actions-footer__item-count\">\n\t\t\t\t\t{ message }\n\t\t\t\t</span>\n\t\t\t</Stack>\n\t\t\t<DataViewsPagination />\n\t\t\t{ Boolean( actions?.length ) && (\n\t\t\t\t<div className=\"dataviews-picker-footer__actions\">\n\t\t\t\t\t<ActionButtons\n\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\titems={ selectedItems }\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Stack>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/dataviews-view-config/index.mjs

@@ -7,9 +7,7 @@ import {
   __experimentalToggleGroupControlOption as ToggleGroupControlOption,
   __experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,
   SelectControl,
-  __experimentalGrid as Grid,
   __experimentalHeading as Heading,
-  __experimentalText as Text,
   privateApis as componentsPrivateApis
 } from "@wordpress/components";
 import { __, _x } from "@wordpress/i18n";
@@ -212,43 +210,31 @@ function ItemsPerPageControl() {
     }
   );
 }
-function SettingsSection({
-  title,
-  description,
-  children
-}) {
-  return /* @__PURE__ */ jsxs(Grid, { columns: 12, className: "dataviews-settings-section", gap: 4, children: [
-    /* @__PURE__ */ jsxs("div", { className: "dataviews-settings-section__sidebar", children: [
-      /* @__PURE__ */ jsx(
-        Heading,
-        {
-          level: 2,
-          className: "dataviews-settings-section__title",
-          children: title
-        }
-      ),
-      description && /* @__PURE__ */ jsx(
-        Text,
-        {
-          variant: "muted",
-          className: "dataviews-settings-section__description",
-          children: description
+function ResetViewButton() {
+  const { onReset } = useContext(DataViewsContext);
+  if (onReset === void 0) {
+    return null;
+  }
+  const isDisabled = onReset === false;
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      variant: "tertiary",
+      size: "compact",
+      disabled: isDisabled,
+      accessibleWhenDisabled: true,
+      className: "dataviews-view-config__reset-button",
+      onClick: () => {
+        if (typeof onReset === "function") {
+          onReset();
         }
-      )
-    ] }),
-    /* @__PURE__ */ jsx(
-      Grid,
-      {
-        columns: 8,
-        gap: 4,
-        className: "dataviews-settings-section__content",
-        children
-      }
-    )
-  ] });
+      },
+      children: __("Reset view")
+    }
+  );
 }
 function DataviewsViewConfigDropdown() {
-  const { view } = useContext(DataViewsContext);
+  const { view, onReset } = useContext(DataViewsContext);
   const popoverId = useInstanceId(
     _DataViewsViewConfig,
     "dataviews-view-config-dropdown"
@@ -256,6 +242,7 @@ function DataviewsViewConfigDropdown() {
   const activeLayout = VIEW_LAYOUTS.find(
     (layout) => layout.type === view.type
   );
+  const isModified = typeof onReset === "function";
   return /* @__PURE__ */ jsx(
     Dropdown,
     {
@@ -265,47 +252,75 @@ function DataviewsViewConfigDropdown() {
         id: popoverId
       },
       renderToggle: ({ onToggle, isOpen }) => {
-        return /* @__PURE__ */ jsx(
-          Button,
-          {
-            size: "compact",
-            icon: cog,
-            label: _x("View options", "View is used as a noun"),
-            onClick: onToggle,
-            "aria-expanded": isOpen ? "true" : "false",
-            "aria-controls": popoverId
-          }
-        );
+        return /* @__PURE__ */ jsxs("div", { className: "dataviews-view-config__toggle-wrapper", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "compact",
+              icon: cog,
+              label: _x(
+                "View options",
+                "View is used as a noun"
+              ),
+              onClick: onToggle,
+              "aria-expanded": isOpen ? "true" : "false",
+              "aria-controls": popoverId
+            }
+          ),
+          isModified && /* @__PURE__ */ jsx("span", { className: "dataviews-view-config__modified-indicator" })
+        ] });
       },
       renderContent: () => /* @__PURE__ */ jsx(
         DropdownContentWrapper,
         {
           paddingSize: "medium",
           className: "dataviews-config__popover-content-wrapper",
-          children: /* @__PURE__ */ jsx(
+          children: /* @__PURE__ */ jsxs(
             Stack,
             {
               direction: "column",
               className: "dataviews-view-config",
-              gap: "lg",
-              children: /* @__PURE__ */ jsxs(SettingsSection, { title: __("Appearance"), children: [
+              gap: "xl",
+              children: [
                 /* @__PURE__ */ jsxs(
                   Stack,
                   {
                     direction: "row",
-                    gap: "xs",
-                    className: "is-divided-in-two",
+                    justify: "space-between",
+                    align: "center",
+                    className: "dataviews-view-config__header",
                     children: [
-                      /* @__PURE__ */ jsx(SortFieldControl, {}),
-                      /* @__PURE__ */ jsx(SortDirectionControl, {})
+                      /* @__PURE__ */ jsx(
+                        Heading,
+                        {
+                          level: 2,
+                          className: "dataviews-settings-section__title",
+                          children: __("Appearance")
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(ResetViewButton, {})
                     ]
                   }
                 ),
-                !!activeLayout?.viewConfigOptions && /* @__PURE__ */ jsx(activeLayout.viewConfigOptions, {}),
-                /* @__PURE__ */ jsx(InfiniteScrollToggle, {}),
-                /* @__PURE__ */ jsx(ItemsPerPageControl, {}),
-                /* @__PURE__ */ jsx(PropertiesSection, {})
-              ] })
+                /* @__PURE__ */ jsxs(Stack, { direction: "column", gap: "lg", children: [
+                  /* @__PURE__ */ jsxs(
+                    Stack,
+                    {
+                      direction: "row",
+                      gap: "sm",
+                      className: "dataviews-view-config__sort-controls",
+                      children: [
+                        /* @__PURE__ */ jsx(SortFieldControl, {}),
+                        /* @__PURE__ */ jsx(SortDirectionControl, {})
+                      ]
+                    }
+                  ),
+                  !!activeLayout?.viewConfigOptions && /* @__PURE__ */ jsx(activeLayout.viewConfigOptions, {}),
+                  /* @__PURE__ */ jsx(InfiniteScrollToggle, {}),
+                  /* @__PURE__ */ jsx(ItemsPerPageControl, {}),
+                  /* @__PURE__ */ jsx(PropertiesSection, {})
+                ] })
+              ]
             }
           )
         }

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../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\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tDropdown,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n\tSelectControl,\n\t__experimentalGrid as Grid,\n\t__experimentalHeading as Heading,\n\t__experimentalText as Text,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { memo, useContext, useMemo } from '@wordpress/element';\nimport { cog } from '@wordpress/icons';\nimport warning from '@wordpress/warning';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { SORTING_DIRECTIONS, sortIcons, sortLabels } from '../../constants';\nimport { VIEW_LAYOUTS } from '../dataviews-layouts';\nimport type { View } from '../../types';\nimport DataViewsContext from '../dataviews-context';\nimport InfiniteScrollToggle from './infinite-scroll-toggle';\nimport { PropertiesSection } from './properties-section';\nimport { unlock } from '../../lock-unlock';\n\nconst { Menu } = unlock( componentsPrivateApis );\n\nconst DATAVIEWS_CONFIG_POPOVER_PROPS = {\n\tclassName: 'dataviews-config__popover',\n\tplacement: 'bottom-end',\n\toffset: 9,\n};\n\nexport function ViewTypeMenu() {\n\tconst { view, onChangeView, defaultLayouts } =\n\t\tuseContext( DataViewsContext );\n\tconst availableLayouts = Object.keys( defaultLayouts );\n\tif ( availableLayouts.length <= 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = VIEW_LAYOUTS.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<Menu>\n\t\t\t<Menu.TriggerButton\n\t\t\t\trender={\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ticon={ activeView?.icon }\n\t\t\t\t\t\tlabel={ __( 'Layout' ) }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Menu.Popover>\n\t\t\t\t{ availableLayouts.map( ( layout ) => {\n\t\t\t\t\tconst config = VIEW_LAYOUTS.find(\n\t\t\t\t\t\t( v ) => v.type === layout\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! config ) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Menu.RadioItem\n\t\t\t\t\t\t\tkey={ layout }\n\t\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\t\tchecked={ layout === view.type }\n\t\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\te: ChangeEvent< HTMLInputElement >\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tswitch ( e.target.value ) {\n\t\t\t\t\t\t\t\t\tcase 'list':\n\t\t\t\t\t\t\t\t\tcase 'grid':\n\t\t\t\t\t\t\t\t\tcase 'table':\n\t\t\t\t\t\t\t\t\tcase 'pickerGrid':\n\t\t\t\t\t\t\t\t\tcase 'pickerTable':\n\t\t\t\t\t\t\t\t\tcase 'activity':\n\t\t\t\t\t\t\t\t\t\tconst viewWithoutLayout = { ...view };\n\t\t\t\t\t\t\t\t\t\tif ( 'layout' in viewWithoutLayout ) {\n\t\t\t\t\t\t\t\t\t\t\tdelete viewWithoutLayout.layout;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn onChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t...viewWithoutLayout,\n\t\t\t\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t\t\t\t\t...defaultLayouts[ e.target.value ],\n\t\t\t\t\t\t\t\t\t\t} as View );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\twarning( 'Invalid dataview' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Menu.ItemLabel>{ config.label }</Menu.ItemLabel>\n\t\t\t\t\t\t</Menu.RadioItem>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</Menu.Popover>\n\t\t</Menu>\n\t);\n}\n\nfunction SortFieldControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\tconst orderOptions = useMemo( () => {\n\t\tconst sortableFields = fields.filter(\n\t\t\t( field ) => field.enableSorting !== false\n\t\t);\n\t\treturn sortableFields.map( ( field ) => {\n\t\t\treturn {\n\t\t\t\tlabel: field.label,\n\t\t\t\tvalue: field.id,\n\t\t\t};\n\t\t} );\n\t}, [ fields ] );\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Sort by' ) }\n\t\t\tvalue={ view.sort?.field }\n\t\t\toptions={ orderOptions }\n\t\t\tonChange={ ( value: string ) => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tsort: {\n\t\t\t\t\t\tdirection: view?.sort?.direction || 'desc',\n\t\t\t\t\t\tfield: value,\n\t\t\t\t\t},\n\t\t\t\t\tshowLevels: false,\n\t\t\t\t} );\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction SortDirectionControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( sortableFields.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tlet value = view.sort?.direction;\n\tif ( ! value && view.sort?.field ) {\n\t\tvalue = 'desc';\n\t}\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tclassName=\"dataviews-view-config__sort-direction\"\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Order' ) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newDirection ) => {\n\t\t\t\tif ( newDirection === 'asc' || newDirection === 'desc' ) {\n\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t...view,\n\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\tdirection: newDirection,\n\t\t\t\t\t\t\tfield:\n\t\t\t\t\t\t\t\tview.sort?.field ||\n\t\t\t\t\t\t\t\t// If there is no field assigned as the sorting field assign the first sortable field.\n\t\t\t\t\t\t\t\tfields.find(\n\t\t\t\t\t\t\t\t\t( field ) => field.enableSorting !== false\n\t\t\t\t\t\t\t\t)?.id ||\n\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tshowLevels: false,\n\t\t\t\t\t} );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\twarning( 'Invalid direction' );\n\t\t\t} }\n\t\t>\n\t\t\t{ SORTING_DIRECTIONS.map( ( direction ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\tvalue={ direction }\n\t\t\t\t\t\ticon={ sortIcons[ direction ] }\n\t\t\t\t\t\tlabel={ sortLabels[ direction ] }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ItemsPerPageControl() {\n\tconst { view, config, onChangeView } = useContext( DataViewsContext );\n\tconst { infiniteScrollEnabled } = view;\n\tif (\n\t\t! config ||\n\t\t! config.perPageSizes ||\n\t\tconfig.perPageSizes.length < 2 ||\n\t\tconfig.perPageSizes.length > 6 ||\n\t\tinfiniteScrollEnabled\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Items per page' ) }\n\t\t\tvalue={ view.perPage || 10 }\n\t\t\tdisabled={ ! view?.sort?.field }\n\t\t\tonChange={ ( newItemsPerPage ) => {\n\t\t\t\tconst newItemsPerPageNumber =\n\t\t\t\t\ttypeof newItemsPerPage === 'number' ||\n\t\t\t\t\tnewItemsPerPage === undefined\n\t\t\t\t\t\t? newItemsPerPage\n\t\t\t\t\t\t: parseInt( newItemsPerPage, 10 );\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tperPage: newItemsPerPageNumber,\n\t\t\t\t\tpage: 1,\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t{ config.perPageSizes.map( ( value ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tlabel={ value.toString() }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction SettingsSection( {\n\ttitle,\n\tdescription,\n\tchildren,\n}: {\n\ttitle: string;\n\tdescription?: string;\n\tchildren: React.ReactNode;\n} ) {\n\treturn (\n\t\t<Grid columns={ 12 } className=\"dataviews-settings-section\" gap={ 4 }>\n\t\t\t<div className=\"dataviews-settings-section__sidebar\">\n\t\t\t\t<Heading\n\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\tclassName=\"dataviews-settings-section__title\"\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</Heading>\n\t\t\t\t{ description && (\n\t\t\t\t\t<Text\n\t\t\t\t\t\tvariant=\"muted\"\n\t\t\t\t\t\tclassName=\"dataviews-settings-section__description\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ description }\n\t\t\t\t\t</Text>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t<Grid\n\t\t\t\tcolumns={ 8 }\n\t\t\t\tgap={ 4 }\n\t\t\t\tclassName=\"dataviews-settings-section__content\"\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Grid>\n\t\t</Grid>\n\t);\n}\n\nexport function DataviewsViewConfigDropdown() {\n\tconst { view } = useContext( DataViewsContext );\n\tconst popoverId = useInstanceId(\n\t\t_DataViewsViewConfig,\n\t\t'dataviews-view-config-dropdown'\n\t);\n\tconst activeLayout = VIEW_LAYOUTS.find(\n\t\t( layout ) => layout.type === view.type\n\t);\n\treturn (\n\t\t<Dropdown\n\t\t\texpandOnMobile\n\t\t\tpopoverProps={ {\n\t\t\t\t...DATAVIEWS_CONFIG_POPOVER_PROPS,\n\t\t\t\tid: popoverId,\n\t\t\t} }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ticon={ cog }\n\t\t\t\t\t\tlabel={ _x( 'View options', 'View is used as a noun' ) }\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-expanded={ isOpen ? 'true' : 'false' }\n\t\t\t\t\t\taria-controls={ popoverId }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t\tclassName=\"dataviews-config__popover-content-wrapper\"\n\t\t\t\t>\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\tclassName=\"dataviews-view-config\"\n\t\t\t\t\t\tgap=\"lg\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<SettingsSection title={ __( 'Appearance' ) }>\n\t\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\t\tgap=\"xs\"\n\t\t\t\t\t\t\t\tclassName=\"is-divided-in-two\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<SortFieldControl />\n\t\t\t\t\t\t\t\t<SortDirectionControl />\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t\t{ !! activeLayout?.viewConfigOptions && (\n\t\t\t\t\t\t\t\t<activeLayout.viewConfigOptions />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<InfiniteScrollToggle />\n\t\t\t\t\t\t\t<ItemsPerPageControl />\n\t\t\t\t\t\t\t<PropertiesSection />\n\t\t\t\t\t\t</SettingsSection>\n\t\t\t\t\t</Stack>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction _DataViewsViewConfig() {\n\treturn (\n\t\t<>\n\t\t\t<ViewTypeMenu />\n\t\t\t<DataviewsViewConfigDropdown />\n\t\t</>\n\t);\n}\n\nconst DataViewsViewConfig = memo( _DataViewsViewConfig );\n\nexport default DataViewsViewConfig;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { ChangeEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tDropdown,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n\tSelectControl,\n\t__experimentalHeading as Heading,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { memo, useContext, useMemo } from '@wordpress/element';\nimport { cog } from '@wordpress/icons';\nimport warning from '@wordpress/warning';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { SORTING_DIRECTIONS, sortIcons, sortLabels } from '../../constants';\nimport { VIEW_LAYOUTS } from '../dataviews-layouts';\nimport type { View } from '../../types';\nimport DataViewsContext from '../dataviews-context';\nimport InfiniteScrollToggle from './infinite-scroll-toggle';\nimport { PropertiesSection } from './properties-section';\nimport { unlock } from '../../lock-unlock';\n\nconst { Menu } = unlock( componentsPrivateApis );\n\nconst DATAVIEWS_CONFIG_POPOVER_PROPS = {\n\tclassName: 'dataviews-config__popover',\n\tplacement: 'bottom-end',\n\toffset: 9,\n};\n\nexport function ViewTypeMenu() {\n\tconst { view, onChangeView, defaultLayouts } =\n\t\tuseContext( DataViewsContext );\n\tconst availableLayouts = Object.keys( defaultLayouts );\n\tif ( availableLayouts.length <= 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = VIEW_LAYOUTS.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<Menu>\n\t\t\t<Menu.TriggerButton\n\t\t\t\trender={\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ticon={ activeView?.icon }\n\t\t\t\t\t\tlabel={ __( 'Layout' ) }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Menu.Popover>\n\t\t\t\t{ availableLayouts.map( ( layout ) => {\n\t\t\t\t\tconst config = VIEW_LAYOUTS.find(\n\t\t\t\t\t\t( v ) => v.type === layout\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! config ) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Menu.RadioItem\n\t\t\t\t\t\t\tkey={ layout }\n\t\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\t\tchecked={ layout === view.type }\n\t\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\te: ChangeEvent< HTMLInputElement >\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tswitch ( e.target.value ) {\n\t\t\t\t\t\t\t\t\tcase 'list':\n\t\t\t\t\t\t\t\t\tcase 'grid':\n\t\t\t\t\t\t\t\t\tcase 'table':\n\t\t\t\t\t\t\t\t\tcase 'pickerGrid':\n\t\t\t\t\t\t\t\t\tcase 'pickerTable':\n\t\t\t\t\t\t\t\t\tcase 'activity':\n\t\t\t\t\t\t\t\t\t\tconst viewWithoutLayout = { ...view };\n\t\t\t\t\t\t\t\t\t\tif ( 'layout' in viewWithoutLayout ) {\n\t\t\t\t\t\t\t\t\t\t\tdelete viewWithoutLayout.layout;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn onChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t...viewWithoutLayout,\n\t\t\t\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t\t\t\t\t...defaultLayouts[ e.target.value ],\n\t\t\t\t\t\t\t\t\t\t} as View );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\twarning( 'Invalid dataview' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Menu.ItemLabel>{ config.label }</Menu.ItemLabel>\n\t\t\t\t\t\t</Menu.RadioItem>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</Menu.Popover>\n\t\t</Menu>\n\t);\n}\n\nfunction SortFieldControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\tconst orderOptions = useMemo( () => {\n\t\tconst sortableFields = fields.filter(\n\t\t\t( field ) => field.enableSorting !== false\n\t\t);\n\t\treturn sortableFields.map( ( field ) => {\n\t\t\treturn {\n\t\t\t\tlabel: field.label,\n\t\t\t\tvalue: field.id,\n\t\t\t};\n\t\t} );\n\t}, [ fields ] );\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Sort by' ) }\n\t\t\tvalue={ view.sort?.field }\n\t\t\toptions={ orderOptions }\n\t\t\tonChange={ ( value: string ) => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tsort: {\n\t\t\t\t\t\tdirection: view?.sort?.direction || 'desc',\n\t\t\t\t\t\tfield: value,\n\t\t\t\t\t},\n\t\t\t\t\tshowLevels: false,\n\t\t\t\t} );\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction SortDirectionControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( sortableFields.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tlet value = view.sort?.direction;\n\tif ( ! value && view.sort?.field ) {\n\t\tvalue = 'desc';\n\t}\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tclassName=\"dataviews-view-config__sort-direction\"\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Order' ) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newDirection ) => {\n\t\t\t\tif ( newDirection === 'asc' || newDirection === 'desc' ) {\n\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t...view,\n\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\tdirection: newDirection,\n\t\t\t\t\t\t\tfield:\n\t\t\t\t\t\t\t\tview.sort?.field ||\n\t\t\t\t\t\t\t\t// If there is no field assigned as the sorting field assign the first sortable field.\n\t\t\t\t\t\t\t\tfields.find(\n\t\t\t\t\t\t\t\t\t( field ) => field.enableSorting !== false\n\t\t\t\t\t\t\t\t)?.id ||\n\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tshowLevels: false,\n\t\t\t\t\t} );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\twarning( 'Invalid direction' );\n\t\t\t} }\n\t\t>\n\t\t\t{ SORTING_DIRECTIONS.map( ( direction ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\tvalue={ direction }\n\t\t\t\t\t\ticon={ sortIcons[ direction ] }\n\t\t\t\t\t\tlabel={ sortLabels[ direction ] }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ItemsPerPageControl() {\n\tconst { view, config, onChangeView } = useContext( DataViewsContext );\n\tconst { infiniteScrollEnabled } = view;\n\tif (\n\t\t! config ||\n\t\t! config.perPageSizes ||\n\t\tconfig.perPageSizes.length < 2 ||\n\t\tconfig.perPageSizes.length > 6 ||\n\t\tinfiniteScrollEnabled\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Items per page' ) }\n\t\t\tvalue={ view.perPage || 10 }\n\t\t\tdisabled={ ! view?.sort?.field }\n\t\t\tonChange={ ( newItemsPerPage ) => {\n\t\t\t\tconst newItemsPerPageNumber =\n\t\t\t\t\ttypeof newItemsPerPage === 'number' ||\n\t\t\t\t\tnewItemsPerPage === undefined\n\t\t\t\t\t\t? newItemsPerPage\n\t\t\t\t\t\t: parseInt( newItemsPerPage, 10 );\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tperPage: newItemsPerPageNumber,\n\t\t\t\t\tpage: 1,\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t{ config.perPageSizes.map( ( value ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tlabel={ value.toString() }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ResetViewButton() {\n\tconst { onReset } = useContext( DataViewsContext );\n\n\t// Don't render if no persistence support (onReset is undefined)\n\tif ( onReset === undefined ) {\n\t\treturn null;\n\t}\n\n\tconst isDisabled = onReset === false;\n\n\treturn (\n\t\t<Button\n\t\t\tvariant=\"tertiary\"\n\t\t\tsize=\"compact\"\n\t\t\tdisabled={ isDisabled }\n\t\t\taccessibleWhenDisabled\n\t\t\tclassName=\"dataviews-view-config__reset-button\"\n\t\t\tonClick={ () => {\n\t\t\t\tif ( typeof onReset === 'function' ) {\n\t\t\t\t\tonReset();\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t{ __( 'Reset view' ) }\n\t\t</Button>\n\t);\n}\n\nexport function DataviewsViewConfigDropdown() {\n\tconst { view, onReset } = useContext( DataViewsContext );\n\tconst popoverId = useInstanceId(\n\t\t_DataViewsViewConfig,\n\t\t'dataviews-view-config-dropdown'\n\t);\n\tconst activeLayout = VIEW_LAYOUTS.find(\n\t\t( layout ) => layout.type === view.type\n\t);\n\tconst isModified = typeof onReset === 'function';\n\treturn (\n\t\t<Dropdown\n\t\t\texpandOnMobile\n\t\t\tpopoverProps={ {\n\t\t\t\t...DATAVIEWS_CONFIG_POPOVER_PROPS,\n\t\t\t\tid: popoverId,\n\t\t\t} }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"dataviews-view-config__toggle-wrapper\">\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\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-expanded={ isOpen ? 'true' : 'false' }\n\t\t\t\t\t\t\taria-controls={ popoverId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ isModified && (\n\t\t\t\t\t\t\t<span className=\"dataviews-view-config__modified-indicator\" />\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t\tclassName=\"dataviews-config__popover-content-wrapper\"\n\t\t\t\t>\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\tclassName=\"dataviews-view-config\"\n\t\t\t\t\t\tgap=\"xl\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\t\tclassName=\"dataviews-view-config__header\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-settings-section__title\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Appearance' ) }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t\t<ResetViewButton />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t<Stack direction=\"column\" gap=\"lg\">\n\t\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-config__sort-controls\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<SortFieldControl />\n\t\t\t\t\t\t\t\t<SortDirectionControl />\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t\t{ !! activeLayout?.viewConfigOptions && (\n\t\t\t\t\t\t\t\t<activeLayout.viewConfigOptions />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<InfiniteScrollToggle />\n\t\t\t\t\t\t\t<ItemsPerPageControl />\n\t\t\t\t\t\t\t<PropertiesSection />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</Stack>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction _DataViewsViewConfig() {\n\treturn (\n\t\t<>\n\t\t\t<ViewTypeMenu />\n\t\t\t<DataviewsViewConfigDropdown />\n\t\t</>\n\t);\n}\n\nconst DataViewsViewConfig = memo( _DataViewsViewConfig );\n\nexport default DataViewsViewConfig;\n"],
+  "mappings": ";AAQA;AAAA,EACC;AAAA,EACA,wCAAwC;AAAA,EACxC;AAAA,EACA,oCAAoC;AAAA,EACpC,0CAA0C;AAAA,EAC1C,8CAA8C;AAAA,EAC9C;AAAA,EACA,yBAAyB;AAAA,EACzB,eAAe;AAAA,OACT;AACP,SAAS,IAAI,UAAU;AACvB,SAAS,MAAM,YAAY,eAAe;AAC1C,SAAS,WAAW;AACpB,OAAO,aAAa;AACpB,SAAS,qBAAqB;AAC9B,SAAS,aAAa;AAKtB,SAAS,oBAAoB,WAAW,kBAAkB;AAC1D,SAAS,oBAAoB;AAE7B,OAAO,sBAAsB;AAC7B,OAAO,0BAA0B;AACjC,SAAS,yBAAyB;AAClC,SAAS,cAAc;AAmBrB,SAmTA,UAhTG,KAHH;AAjBF,IAAM,EAAE,KAAK,IAAI,OAAQ,qBAAsB;AAE/C,IAAM,iCAAiC;AAAA,EACtC,WAAW;AAAA,EACX,WAAW;AAAA,EACX,QAAQ;AACT;AAEO,SAAS,eAAe;AAC9B,QAAM,EAAE,MAAM,cAAc,eAAe,IAC1C,WAAY,gBAAiB;AAC9B,QAAM,mBAAmB,OAAO,KAAM,cAAe;AACrD,MAAK,iBAAiB,UAAU,GAAI;AACnC,WAAO;AAAA,EACR;AACA,QAAM,aAAa,aAAa,KAAM,CAAE,MAAO,KAAK,SAAS,EAAE,IAAK;AACpE,SACC,qBAAC,QACA;AAAA;AAAA,MAAC,KAAK;AAAA,MAAL;AAAA,QACA,QACC;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,MAAO,YAAY;AAAA,YACnB,OAAQ,GAAI,QAAS;AAAA;AAAA,QACtB;AAAA;AAAA,IAEF;AAAA,IACA,oBAAC,KAAK,SAAL,EACE,2BAAiB,IAAK,CAAE,WAAY;AACrC,YAAM,SAAS,aAAa;AAAA,QAC3B,CAAE,MAAO,EAAE,SAAS;AAAA,MACrB;AACA,UAAK,CAAE,QAAS;AACf,eAAO;AAAA,MACR;AACA,aACC;AAAA,QAAC,KAAK;AAAA,QAAL;AAAA,UAEA,OAAQ;AAAA,UACR,MAAK;AAAA,UACL,SAAU,WAAW,KAAK;AAAA,UAC1B,aAAW;AAAA,UACX,UAAW,CACV,MACI;AACJ,oBAAS,EAAE,OAAO,OAAQ;AAAA,cACzB,KAAK;AAAA,cACL,KAAK;AAAA,cACL,KAAK;AAAA,cACL,KAAK;AAAA,cACL,KAAK;AAAA,cACL,KAAK;AACJ,sBAAM,oBAAoB,EAAE,GAAG,KAAK;AACpC,oBAAK,YAAY,mBAAoB;AACpC,yBAAO,kBAAkB;AAAA,gBAC1B;AACA,uBAAO,aAAc;AAAA,kBACpB,GAAG;AAAA,kBACH,MAAM,EAAE,OAAO;AAAA,kBACf,GAAG,eAAgB,EAAE,OAAO,KAAM;AAAA,gBACnC,CAAU;AAAA,YACZ;AACA,oBAAS,kBAAmB;AAAA,UAC7B;AAAA,UAEA,8BAAC,KAAK,WAAL,EAAiB,iBAAO,OAAO;AAAA;AAAA,QA5B1B;AAAA,MA6BP;AAAA,IAEF,CAAE,GACH;AAAA,KACD;AAEF;AAEA,SAAS,mBAAmB;AAC3B,QAAM,EAAE,MAAM,QAAQ,aAAa,IAAI,WAAY,gBAAiB;AACpE,QAAM,eAAe,QAAS,MAAM;AACnC,UAAM,iBAAiB,OAAO;AAAA,MAC7B,CAAE,UAAW,MAAM,kBAAkB;AAAA,IACtC;AACA,WAAO,eAAe,IAAK,CAAE,UAAW;AACvC,aAAO;AAAA,QACN,OAAO,MAAM;AAAA,QACb,OAAO,MAAM;AAAA,MACd;AAAA,IACD,CAAE;AAAA,EACH,GAAG,CAAE,MAAO,CAAE;AAEd,SACC;AAAA,IAAC;AAAA;AAAA,MACA,uBAAqB;AAAA,MACrB,OAAQ,GAAI,SAAU;AAAA,MACtB,OAAQ,KAAK,MAAM;AAAA,MACnB,SAAU;AAAA,MACV,UAAW,CAAE,UAAmB;AAC/B,qBAAc;AAAA,UACb,GAAG;AAAA,UACH,MAAM;AAAA,YACL,WAAW,MAAM,MAAM,aAAa;AAAA,YACpC,OAAO;AAAA,UACR;AAAA,UACA,YAAY;AAAA,QACb,CAAE;AAAA,MACH;AAAA;AAAA,EACD;AAEF;AAEA,SAAS,uBAAuB;AAC/B,QAAM,EAAE,MAAM,QAAQ,aAAa,IAAI,WAAY,gBAAiB;AAEpE,QAAM,iBAAiB,OAAO;AAAA,IAC7B,CAAE,UAAW,MAAM,kBAAkB;AAAA,EACtC;AACA,MAAK,eAAe,WAAW,GAAI;AAClC,WAAO;AAAA,EACR;AAEA,MAAI,QAAQ,KAAK,MAAM;AACvB,MAAK,CAAE,SAAS,KAAK,MAAM,OAAQ;AAClC,YAAQ;AAAA,EACT;AACA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,uBAAqB;AAAA,MACrB,SAAO;AAAA,MACP,OAAQ,GAAI,OAAQ;AAAA,MACpB;AAAA,MACA,UAAW,CAAE,iBAAkB;AAC9B,YAAK,iBAAiB,SAAS,iBAAiB,QAAS;AACxD,uBAAc;AAAA,YACb,GAAG;AAAA,YACH,MAAM;AAAA,cACL,WAAW;AAAA,cACX,OACC,KAAK,MAAM;AAAA,cAEX,OAAO;AAAA,gBACN,CAAE,UAAW,MAAM,kBAAkB;AAAA,cACtC,GAAG,MACH;AAAA,YACF;AAAA,YACA,YAAY;AAAA,UACb,CAAE;AACF;AAAA,QACD;AACA,gBAAS,mBAAoB;AAAA,MAC9B;AAAA,MAEE,6BAAmB,IAAK,CAAE,cAAe;AAC1C,eACC;AAAA,UAAC;AAAA;AAAA,YAEA,OAAQ;AAAA,YACR,MAAO,UAAW,SAAU;AAAA,YAC5B,OAAQ,WAAY,SAAU;AAAA;AAAA,UAHxB;AAAA,QAIP;AAAA,MAEF,CAAE;AAAA;AAAA,EACH;AAEF;AAEA,SAAS,sBAAsB;AAC9B,QAAM,EAAE,MAAM,QAAQ,aAAa,IAAI,WAAY,gBAAiB;AACpE,QAAM,EAAE,sBAAsB,IAAI;AAClC,MACC,CAAE,UACF,CAAE,OAAO,gBACT,OAAO,aAAa,SAAS,KAC7B,OAAO,aAAa,SAAS,KAC7B,uBACC;AACD,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,uBAAqB;AAAA,MACrB,SAAO;AAAA,MACP,OAAQ,GAAI,gBAAiB;AAAA,MAC7B,OAAQ,KAAK,WAAW;AAAA,MACxB,UAAW,CAAE,MAAM,MAAM;AAAA,MACzB,UAAW,CAAE,oBAAqB;AACjC,cAAM,wBACL,OAAO,oBAAoB,YAC3B,oBAAoB,SACjB,kBACA,SAAU,iBAAiB,EAAG;AAClC,qBAAc;AAAA,UACb,GAAG;AAAA,UACH,SAAS;AAAA,UACT,MAAM;AAAA,QACP,CAAE;AAAA,MACH;AAAA,MAEE,iBAAO,aAAa,IAAK,CAAE,UAAW;AACvC,eACC;AAAA,UAAC;AAAA;AAAA,YAEA;AAAA,YACA,OAAQ,MAAM,SAAS;AAAA;AAAA,UAFjB;AAAA,QAGP;AAAA,MAEF,CAAE;AAAA;AAAA,EACH;AAEF;AAEA,SAAS,kBAAkB;AAC1B,QAAM,EAAE,QAAQ,IAAI,WAAY,gBAAiB;AAGjD,MAAK,YAAY,QAAY;AAC5B,WAAO;AAAA,EACR;AAEA,QAAM,aAAa,YAAY;AAE/B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,UAAW;AAAA,MACX,wBAAsB;AAAA,MACtB,WAAU;AAAA,MACV,SAAU,MAAM;AACf,YAAK,OAAO,YAAY,YAAa;AACpC,kBAAQ;AAAA,QACT;AAAA,MACD;AAAA,MAEE,aAAI,YAAa;AAAA;AAAA,EACpB;AAEF;AAEO,SAAS,8BAA8B;AAC7C,QAAM,EAAE,MAAM,QAAQ,IAAI,WAAY,gBAAiB;AACvD,QAAM,YAAY;AAAA,IACjB;AAAA,IACA;AAAA,EACD;AACA,QAAM,eAAe,aAAa;AAAA,IACjC,CAAE,WAAY,OAAO,SAAS,KAAK;AAAA,EACpC;AACA,QAAM,aAAa,OAAO,YAAY;AACtC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,gBAAc;AAAA,MACd,cAAe;AAAA,QACd,GAAG;AAAA,QACH,IAAI;AAAA,MACL;AAAA,MACA,cAAe,CAAE,EAAE,UAAU,OAAO,MAAO;AAC1C,eACC,qBAAC,SAAI,WAAU,yCACd;AAAA;AAAA,YAAC;AAAA;AAAA,cACA,MAAK;AAAA,cACL,MAAO;AAAA,cACP,OAAQ;AAAA,gBACP;AAAA,gBACA;AAAA,cACD;AAAA,cACA,SAAU;AAAA,cACV,iBAAgB,SAAS,SAAS;AAAA,cAClC,iBAAgB;AAAA;AAAA,UACjB;AAAA,UACE,cACD,oBAAC,UAAK,WAAU,6CAA4C;AAAA,WAE9D;AAAA,MAEF;AAAA,MACA,eAAgB,MACf;AAAA,QAAC;AAAA;AAAA,UACA,aAAY;AAAA,UACZ,WAAU;AAAA,UAEV;AAAA,YAAC;AAAA;AAAA,cACA,WAAU;AAAA,cACV,WAAU;AAAA,cACV,KAAI;AAAA,cAEJ;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACA,WAAU;AAAA,oBACV,SAAQ;AAAA,oBACR,OAAM;AAAA,oBACN,WAAU;AAAA,oBAEV;AAAA;AAAA,wBAAC;AAAA;AAAA,0BACA,OAAQ;AAAA,0BACR,WAAU;AAAA,0BAER,aAAI,YAAa;AAAA;AAAA,sBACpB;AAAA,sBACA,oBAAC,mBAAgB;AAAA;AAAA;AAAA,gBAClB;AAAA,gBACA,qBAAC,SAAM,WAAU,UAAS,KAAI,MAC7B;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACA,WAAU;AAAA,sBACV,KAAI;AAAA,sBACJ,WAAU;AAAA,sBAEV;AAAA,4CAAC,oBAAiB;AAAA,wBAClB,oBAAC,wBAAqB;AAAA;AAAA;AAAA,kBACvB;AAAA,kBACE,CAAC,CAAE,cAAc,qBAClB,oBAAC,aAAa,mBAAb,EAA+B;AAAA,kBAEjC,oBAAC,wBAAqB;AAAA,kBACtB,oBAAC,uBAAoB;AAAA,kBACrB,oBAAC,qBAAkB;AAAA,mBACpB;AAAA;AAAA;AAAA,UACD;AAAA;AAAA,MACD;AAAA;AAAA,EAEF;AAEF;AAEA,SAAS,uBAAuB;AAC/B,SACC,iCACC;AAAA,wBAAC,gBAAa;AAAA,IACd,oBAAC,+BAA4B;AAAA,KAC9B;AAEF;AAEA,IAAM,sBAAsB,KAAM,oBAAqB;AAEvD,IAAO,gCAAQ;",
   "names": []
 }

package/build-module/components/dataviews-view-config/properties-section.mjs

@@ -17,7 +17,7 @@ function FieldItem({
   isVisible,
   onToggleVisibility
 }) {
-  return /* @__PURE__ */ jsx(Item, { onClick: field.enableHiding ? onToggleVisibility : void 0, children: /* @__PURE__ */ jsxs(Stack, { direction: "row", gap: "xs", justify: "flex-start", align: "center", children: [
+  return /* @__PURE__ */ jsx(Item, { onClick: field.enableHiding ? onToggleVisibility : void 0, children: /* @__PURE__ */ jsxs(Stack, { direction: "row", gap: "sm", justify: "flex-start", align: "center", children: [
     /* @__PURE__ */ jsx("div", { style: { height: 24, width: 24 }, children: isVisible && /* @__PURE__ */ jsx(Icon, { icon: check }) }),
     /* @__PURE__ */ jsx("span", { className: "dataviews-view-config__label", children: field.label })
   ] }) });

package/build-module/components/dataviews-view-config/properties-section.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataviews-view-config/properties-section.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n\tBaseControl,\n\tIcon,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useContext } from '@wordpress/element';\nimport { check } from '@wordpress/icons';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport type { NormalizedField } from '../../types';\nimport DataViewsContext from '../dataviews-context';\nimport getHideableFields from '../../utils/get-hideable-fields';\n\nfunction FieldItem( {\n\tfield,\n\tisVisible,\n\tonToggleVisibility,\n}: {\n\tfield: NormalizedField< any >;\n\tisVisible: boolean;\n\tonToggleVisibility?: () => void;\n} ) {\n\treturn (\n\t\t<Item onClick={ field.enableHiding ? onToggleVisibility : undefined }>\n\t\t\t<Stack direction=\"row\" gap=\"xs\" justify=\"flex-start\" align=\"center\">\n\t\t\t\t<div style={ { height: 24, width: 24 } }>\n\t\t\t\t\t{ isVisible && <Icon icon={ check } /> }\n\t\t\t\t</div>\n\t\t\t\t<span className=\"dataviews-view-config__label\">\n\t\t\t\t\t{ field.label }\n\t\t\t\t</span>\n\t\t\t</Stack>\n\t\t</Item>\n\t);\n}\n\nfunction isDefined< T >( item: T | undefined ): item is T {\n\treturn !! item;\n}\n\nexport function PropertiesSection( {\n\tshowLabel = true,\n}: {\n\tshowLabel?: boolean;\n} ) {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\n\t// Get all regular fields (non-locked) in their original order from fields prop\n\tconst regularFields = getHideableFields( view, fields );\n\n\tif ( ! regularFields?.length ) {\n\t\treturn null;\n\t}\n\tconst titleField = fields.find( ( f ) => f.id === view.titleField );\n\tconst previewField = fields.find( ( f ) => f.id === view.mediaField );\n\tconst descriptionField = fields.find(\n\t\t( f ) => f.id === view.descriptionField\n\t);\n\n\tconst lockedFields = [\n\t\t{\n\t\t\tfield: titleField,\n\t\t\tisVisibleFlag: 'showTitle',\n\t\t},\n\t\t{\n\t\t\tfield: previewField,\n\t\t\tisVisibleFlag: 'showMedia',\n\t\t},\n\t\t{\n\t\t\tfield: descriptionField,\n\t\t\tisVisibleFlag: 'showDescription',\n\t\t},\n\t].filter( ( { field } ) => isDefined( field ) ) as Array< {\n\t\tfield: NormalizedField< any >;\n\t\tisVisibleFlag: string;\n\t} >;\n\tconst visibleFieldIds = view.fields ?? [];\n\tconst visibleRegularFieldsCount = regularFields.filter( ( f ) =>\n\t\tvisibleFieldIds.includes( f.id )\n\t).length;\n\n\tconst visibleLockedFields = lockedFields.filter(\n\t\t( { isVisibleFlag } ) =>\n\t\t\t// @ts-expect-error\n\t\t\tview[ isVisibleFlag ] ?? true\n\t);\n\n\t// If only one field (locked or regular) is visible, prevent it from being hidden\n\tconst totalVisibleFields =\n\t\tvisibleLockedFields.length + visibleRegularFieldsCount;\n\tconst isSingleVisibleLockedField =\n\t\ttotalVisibleFields === 1 && visibleLockedFields.length === 1;\n\n\treturn (\n\t\t<Stack direction=\"column\" className=\"dataviews-field-control\">\n\t\t\t{ showLabel && (\n\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t{ __( 'Properties' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t) }\n\t\t\t<Stack\n\t\t\t\tdirection=\"column\"\n\t\t\t\tclassName=\"dataviews-view-config__properties\"\n\t\t\t>\n\t\t\t\t<ItemGroup isBordered isSeparated size=\"medium\">\n\t\t\t\t\t{ lockedFields.map( ( { field, isVisibleFlag } ) => {\n\t\t\t\t\t\t// @ts-expect-error\n\t\t\t\t\t\tconst isVisible = view[ isVisibleFlag ] ?? true;\n\t\t\t\t\t\tconst fieldToRender =\n\t\t\t\t\t\t\tisSingleVisibleLockedField && isVisible\n\t\t\t\t\t\t\t\t? { ...field, enableHiding: false }\n\t\t\t\t\t\t\t\t: field;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<FieldItem\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tfield={ fieldToRender }\n\t\t\t\t\t\t\t\tisVisible={ isVisible }\n\t\t\t\t\t\t\t\tonToggleVisibility={ () => {\n\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t[ isVisibleFlag ]: ! isVisible,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\n\t\t\t\t\t{ regularFields.map( ( field ) => {\n\t\t\t\t\t\t// Check if this is the last visible field to prevent hiding\n\t\t\t\t\t\tconst isVisible = visibleFieldIds.includes( field.id );\n\t\t\t\t\t\tconst fieldToRender =\n\t\t\t\t\t\t\ttotalVisibleFields === 1 && isVisible\n\t\t\t\t\t\t\t\t? { ...field, enableHiding: false }\n\t\t\t\t\t\t\t\t: field;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<FieldItem\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tfield={ fieldToRender }\n\t\t\t\t\t\t\t\tisVisible={ isVisible }\n\t\t\t\t\t\t\t\tonToggleVisibility={ () => {\n\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\tfields: isVisible\n\t\t\t\t\t\t\t\t\t\t\t? visibleFieldIds.filter(\n\t\t\t\t\t\t\t\t\t\t\t\t\t( fieldId ) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfieldId !== field.id\n\t\t\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t\t\t: [ ...visibleFieldIds, field.id ],\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</ItemGroup>\n\t\t\t</Stack>\n\t\t</Stack>\n\t);\n}\n"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n\tBaseControl,\n\tIcon,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useContext } from '@wordpress/element';\nimport { check } from '@wordpress/icons';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport type { NormalizedField } from '../../types';\nimport DataViewsContext from '../dataviews-context';\nimport getHideableFields from '../../utils/get-hideable-fields';\n\nfunction FieldItem( {\n\tfield,\n\tisVisible,\n\tonToggleVisibility,\n}: {\n\tfield: NormalizedField< any >;\n\tisVisible: boolean;\n\tonToggleVisibility?: () => void;\n} ) {\n\treturn (\n\t\t<Item onClick={ field.enableHiding ? onToggleVisibility : undefined }>\n\t\t\t<Stack direction=\"row\" gap=\"sm\" justify=\"flex-start\" align=\"center\">\n\t\t\t\t<div style={ { height: 24, width: 24 } }>\n\t\t\t\t\t{ isVisible && <Icon icon={ check } /> }\n\t\t\t\t</div>\n\t\t\t\t<span className=\"dataviews-view-config__label\">\n\t\t\t\t\t{ field.label }\n\t\t\t\t</span>\n\t\t\t</Stack>\n\t\t</Item>\n\t);\n}\n\nfunction isDefined< T >( item: T | undefined ): item is T {\n\treturn !! item;\n}\n\nexport function PropertiesSection( {\n\tshowLabel = true,\n}: {\n\tshowLabel?: boolean;\n} ) {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\n\t// Get all regular fields (non-locked) in their original order from fields prop\n\tconst regularFields = getHideableFields( view, fields );\n\n\tif ( ! regularFields?.length ) {\n\t\treturn null;\n\t}\n\tconst titleField = fields.find( ( f ) => f.id === view.titleField );\n\tconst previewField = fields.find( ( f ) => f.id === view.mediaField );\n\tconst descriptionField = fields.find(\n\t\t( f ) => f.id === view.descriptionField\n\t);\n\n\tconst lockedFields = [\n\t\t{\n\t\t\tfield: titleField,\n\t\t\tisVisibleFlag: 'showTitle',\n\t\t},\n\t\t{\n\t\t\tfield: previewField,\n\t\t\tisVisibleFlag: 'showMedia',\n\t\t},\n\t\t{\n\t\t\tfield: descriptionField,\n\t\t\tisVisibleFlag: 'showDescription',\n\t\t},\n\t].filter( ( { field } ) => isDefined( field ) ) as Array< {\n\t\tfield: NormalizedField< any >;\n\t\tisVisibleFlag: string;\n\t} >;\n\tconst visibleFieldIds = view.fields ?? [];\n\tconst visibleRegularFieldsCount = regularFields.filter( ( f ) =>\n\t\tvisibleFieldIds.includes( f.id )\n\t).length;\n\n\tconst visibleLockedFields = lockedFields.filter(\n\t\t( { isVisibleFlag } ) =>\n\t\t\t// @ts-expect-error\n\t\t\tview[ isVisibleFlag ] ?? true\n\t);\n\n\t// If only one field (locked or regular) is visible, prevent it from being hidden\n\tconst totalVisibleFields =\n\t\tvisibleLockedFields.length + visibleRegularFieldsCount;\n\tconst isSingleVisibleLockedField =\n\t\ttotalVisibleFields === 1 && visibleLockedFields.length === 1;\n\n\treturn (\n\t\t<Stack direction=\"column\" className=\"dataviews-field-control\">\n\t\t\t{ showLabel && (\n\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t{ __( 'Properties' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t) }\n\t\t\t<Stack\n\t\t\t\tdirection=\"column\"\n\t\t\t\tclassName=\"dataviews-view-config__properties\"\n\t\t\t>\n\t\t\t\t<ItemGroup isBordered isSeparated size=\"medium\">\n\t\t\t\t\t{ lockedFields.map( ( { field, isVisibleFlag } ) => {\n\t\t\t\t\t\t// @ts-expect-error\n\t\t\t\t\t\tconst isVisible = view[ isVisibleFlag ] ?? true;\n\t\t\t\t\t\tconst fieldToRender =\n\t\t\t\t\t\t\tisSingleVisibleLockedField && isVisible\n\t\t\t\t\t\t\t\t? { ...field, enableHiding: false }\n\t\t\t\t\t\t\t\t: field;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<FieldItem\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tfield={ fieldToRender }\n\t\t\t\t\t\t\t\tisVisible={ isVisible }\n\t\t\t\t\t\t\t\tonToggleVisibility={ () => {\n\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t[ isVisibleFlag ]: ! isVisible,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\n\t\t\t\t\t{ regularFields.map( ( field ) => {\n\t\t\t\t\t\t// Check if this is the last visible field to prevent hiding\n\t\t\t\t\t\tconst isVisible = visibleFieldIds.includes( field.id );\n\t\t\t\t\t\tconst fieldToRender =\n\t\t\t\t\t\t\ttotalVisibleFields === 1 && isVisible\n\t\t\t\t\t\t\t\t? { ...field, enableHiding: false }\n\t\t\t\t\t\t\t\t: field;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<FieldItem\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tfield={ fieldToRender }\n\t\t\t\t\t\t\t\tisVisible={ isVisible }\n\t\t\t\t\t\t\t\tonToggleVisibility={ () => {\n\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\tfields: isVisible\n\t\t\t\t\t\t\t\t\t\t\t? visibleFieldIds.filter(\n\t\t\t\t\t\t\t\t\t\t\t\t\t( fieldId ) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfieldId !== field.id\n\t\t\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t\t\t: [ ...visibleFieldIds, field.id ],\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</ItemGroup>\n\t\t\t</Stack>\n\t\t</Stack>\n\t);\n}\n"],
   "mappings": "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",
   "names": []
 }

package/build-module/dataviews/index.mjs

@@ -40,14 +40,14 @@ function DefaultUI({
         align: "top",
         justify: "space-between",
         className: "dataviews__view-actions",
-        gap: "2xs",
+        gap: "xs",
         children: [
           /* @__PURE__ */ jsxs(
             Stack,
             {
               direction: "row",
               justify: "start",
-              gap: "xs",
+              gap: "sm",
               className: "dataviews__search",
               children: [
                 search && /* @__PURE__ */ jsx(DataViewsSearch, { label: searchLabel }),
@@ -55,7 +55,7 @@ function DefaultUI({
               ]
             }
           ),
-          /* @__PURE__ */ jsxs(Stack, { direction: "row", gap: "2xs", style: { flexShrink: 0 }, children: [
+          /* @__PURE__ */ jsxs(Stack, { direction: "row", gap: "xs", style: { flexShrink: 0 }, children: [
             /* @__PURE__ */ jsx(DataViewsViewConfig, {}),
             header
           ] })
@@ -88,7 +88,8 @@ function DataViews({
   header,
   children,
   config = { perPageSizes: [10, 20, 50, 100] },
-  empty
+  empty,
+  onReset
 }) {
   const { infiniteScrollHandler } = paginationInfo;
   const containerRef = useRef(null);
@@ -199,7 +200,8 @@ function DataViews({
         setIsShowingFilter,
         config,
         empty,
-        hasInfiniteScrollHandler: !!infiniteScrollHandler
+        hasInfiniteScrollHandler: !!infiniteScrollHandler,
+        onReset
       },
       children: /* @__PURE__ */ jsx("div", { className: "dataviews-wrapper", ref: containerRef, children: children ?? /* @__PURE__ */ jsx(
         DefaultUI,

package/build-module/dataviews/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/dataviews/index.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode, ComponentProps, ReactElement } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useMemo, useRef, useState } from '@wordpress/element';\nimport { useResizeObserver, throttle } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../components/dataviews-context';\nimport { VIEW_LAYOUTS } from '../components/dataviews-layouts';\nimport {\n\tFilters,\n\tFiltersToggled,\n\tuseFilters,\n\tFiltersToggle,\n} from '../components/dataviews-filters';\nimport DataViewsLayout from '../components/dataviews-layout';\nimport DataViewsFooter from '../components/dataviews-footer';\nimport DataViewsSearch from '../components/dataviews-search';\nimport { BulkActionsFooter } from '../components/dataviews-bulk-actions';\nimport { DataViewsPagination } from '../components/dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../components/dataviews-view-config';\nimport normalizeFields from '../field-types';\nimport type { Action, Field, View, SupportedLayouts } from '../types';\nimport type { SelectionOrUpdater } from '../types/private';\ntype ItemWithId = { id: string };\n\ntype DataViewsProps< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: Field< Item >[];\n\tsearch?: boolean;\n\tsearchLabel?: string;\n\tactions?: Action< Item >[];\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t\tinfiniteScrollHandler?: () => void;\n\t};\n\tdefaultLayouts: SupportedLayouts;\n\tselection?: string[];\n\tonChangeSelection?: ( items: string[] ) => void;\n\tonClickItem?: ( item: Item ) => void;\n\trenderItemLink?: (\n\t\tprops: {\n\t\t\titem: Item;\n\t\t} & ComponentProps< 'a' >\n\t) => ReactElement;\n\tisItemClickable?: ( item: Item ) => boolean;\n\theader?: ReactNode;\n\tgetItemLevel?: ( item: Item ) => number;\n\tchildren?: ReactNode;\n\tconfig?: {\n\t\tperPageSizes: number[];\n\t};\n\tempty?: ReactNode;\n} & ( Item extends ItemWithId\n\t? { getItemId?: ( item: Item ) => string }\n\t: { getItemId: ( item: Item ) => string } );\n\nconst defaultGetItemId = ( item: ItemWithId ) => item.id;\nconst defaultIsItemClickable = () => true;\nconst EMPTY_ARRAY: any[] = [];\n\nconst dataViewsLayouts = VIEW_LAYOUTS.filter(\n\t( viewLayout ) => ! viewLayout.isPicker\n);\n\ntype DefaultUIProps = Pick<\n\tDataViewsProps< any >,\n\t'header' | 'search' | 'searchLabel'\n>;\n\nfunction DefaultUI( {\n\theader,\n\tsearch = true,\n\tsearchLabel = undefined,\n}: DefaultUIProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\talign=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tgap=\"2xs\"\n\t\t\t>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\tgap=\"xs\"\n\t\t\t\t\tclassName=\"dataviews__search\"\n\t\t\t\t>\n\t\t\t\t\t{ search && <DataViewsSearch label={ searchLabel } /> }\n\t\t\t\t\t<FiltersToggle />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap=\"2xs\" style={ { flexShrink: 0 } }>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t\t{ header }\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t\t<FiltersToggled className=\"dataviews-filters__container\" />\n\t\t\t<DataViewsLayout />\n\t\t\t<DataViewsFooter />\n\t\t</>\n\t);\n}\n\nfunction DataViews< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions = EMPTY_ARRAY,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tgetItemLevel,\n\tisLoading = false,\n\tpaginationInfo,\n\tdefaultLayouts: defaultLayoutsProperty,\n\tselection: selectionProperty,\n\tonChangeSelection,\n\tonClickItem,\n\trenderItemLink,\n\tisItemClickable = defaultIsItemClickable,\n\theader,\n\tchildren,\n\tconfig = { perPageSizes: [ 10, 20, 50, 100 ] },\n\tempty,\n}: DataViewsProps< Item > ) {\n\tconst { infiniteScrollHandler } = paginationInfo;\n\tconst containerRef = useRef< HTMLDivElement | null >( null );\n\tconst [ containerWidth, setContainerWidth ] = useState( 0 );\n\tconst resizeObserverRef = useResizeObserver(\n\t\t( resizeObserverEntries: any ) => {\n\t\t\tsetContainerWidth(\n\t\t\t\tresizeObserverEntries[ 0 ].borderBoxSize[ 0 ].inlineSize\n\t\t\t);\n\t\t},\n\t\t{ box: 'border-box' }\n\t);\n\tconst [ selectionState, setSelectionState ] = useState< string[] >( [] );\n\tconst isUncontrolled =\n\t\tselectionProperty === undefined || onChangeSelection === undefined;\n\tconst selection = isUncontrolled ? selectionState : selectionProperty;\n\tconst [ openedFilter, setOpenedFilter ] = useState< string | null >( null );\n\tfunction setSelectionWithChange( value: SelectionOrUpdater ) {\n\t\tconst newValue =\n\t\t\ttypeof value === 'function' ? value( selection ) : value;\n\t\tif ( isUncontrolled ) {\n\t\t\tsetSelectionState( newValue );\n\t\t}\n\t\tif ( onChangeSelection ) {\n\t\t\tonChangeSelection( newValue );\n\t\t}\n\t}\n\tconst _fields = useMemo( () => normalizeFields( fields ), [ fields ] );\n\tconst _selection = useMemo( () => {\n\t\treturn selection.filter( ( id ) =>\n\t\t\tdata.some( ( item ) => getItemId( item ) === id )\n\t\t);\n\t}, [ selection, data, getItemId ] );\n\n\tconst filters = useFilters( _fields, view );\n\tconst hasPrimaryOrLockedFilters = useMemo(\n\t\t() =>\n\t\t\t( filters || [] ).some(\n\t\t\t\t( filter ) => filter.isPrimary || filter.isLocked\n\t\t\t),\n\t\t[ filters ]\n\t);\n\tconst [ isShowingFilter, setIsShowingFilter ] = useState< boolean >(\n\t\thasPrimaryOrLockedFilters\n\t);\n\n\tuseEffect( () => {\n\t\tif ( hasPrimaryOrLockedFilters && ! isShowingFilter ) {\n\t\t\tsetIsShowingFilter( true );\n\t\t}\n\t}, [ hasPrimaryOrLockedFilters, isShowingFilter ] );\n\n\t// Attach scroll event listener for infinite scroll\n\tuseEffect( () => {\n\t\tif ( ! view.infiniteScrollEnabled || ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleScroll = throttle( ( event: unknown ) => {\n\t\t\tconst target = ( event as Event ).target as HTMLElement;\n\t\t\tconst scrollTop = target.scrollTop;\n\t\t\tconst scrollHeight = target.scrollHeight;\n\t\t\tconst clientHeight = target.clientHeight;\n\n\t\t\t// Check if user has scrolled near the bottom\n\t\t\tif ( scrollTop + clientHeight >= scrollHeight - 100 ) {\n\t\t\t\tinfiniteScrollHandler?.();\n\t\t\t}\n\t\t}, 100 ); // Throttle to 100ms\n\n\t\tconst container = containerRef.current;\n\t\tcontainer.addEventListener( 'scroll', handleScroll );\n\n\t\treturn () => {\n\t\t\tcontainer.removeEventListener( 'scroll', handleScroll );\n\t\t\thandleScroll.cancel(); // Cancel any pending throttled calls\n\t\t};\n\t}, [ infiniteScrollHandler, view.infiniteScrollEnabled ] );\n\n\t// Filter out DataViewsPicker layouts.\n\tconst defaultLayouts = useMemo(\n\t\t() =>\n\t\t\tObject.fromEntries(\n\t\t\t\tObject.entries( defaultLayoutsProperty ).filter(\n\t\t\t\t\t( [ layoutType ] ) => {\n\t\t\t\t\t\treturn dataViewsLayouts.some(\n\t\t\t\t\t\t\t( viewLayout ) => viewLayout.type === layoutType\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t)\n\t\t\t),\n\t\t[ defaultLayoutsProperty ]\n\t);\n\n\tif ( ! defaultLayouts[ view.type ] ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<DataViewsContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tview,\n\t\t\t\tonChangeView,\n\t\t\t\tfields: _fields,\n\t\t\t\tactions,\n\t\t\t\tdata,\n\t\t\t\tisLoading,\n\t\t\t\tpaginationInfo,\n\t\t\t\tselection: _selection,\n\t\t\t\tonChangeSelection: setSelectionWithChange,\n\t\t\t\topenedFilter,\n\t\t\t\tsetOpenedFilter,\n\t\t\t\tgetItemId,\n\t\t\t\tgetItemLevel,\n\t\t\t\tisItemClickable,\n\t\t\t\tonClickItem,\n\t\t\t\trenderItemLink,\n\t\t\t\tcontainerWidth,\n\t\t\t\tcontainerRef,\n\t\t\t\tresizeObserverRef,\n\t\t\t\tdefaultLayouts,\n\t\t\t\tfilters,\n\t\t\t\tisShowingFilter,\n\t\t\t\tsetIsShowingFilter,\n\t\t\t\tconfig,\n\t\t\t\tempty,\n\t\t\t\thasInfiniteScrollHandler: !! infiniteScrollHandler,\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-wrapper\" ref={ containerRef }>\n\t\t\t\t{ children ?? (\n\t\t\t\t\t<DefaultUI\n\t\t\t\t\t\theader={ header }\n\t\t\t\t\t\tsearch={ search }\n\t\t\t\t\t\tsearchLabel={ searchLabel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</DataViewsContext.Provider>\n\t);\n}\n\n// Populate the DataViews sub components\nconst DataViewsSubComponents = DataViews as typeof DataViews & {\n\tBulkActionToolbar: typeof BulkActionsFooter;\n\tFilters: typeof Filters;\n\tFiltersToggle: typeof FiltersToggle;\n\tFiltersToggled: typeof FiltersToggled;\n\tLayout: typeof DataViewsLayout;\n\tLayoutSwitcher: typeof ViewTypeMenu;\n\tPagination: typeof DataViewsPagination;\n\tSearch: typeof DataViewsSearch;\n\tViewConfig: typeof DataviewsViewConfigDropdown;\n\tFooter: typeof DataViewsFooter;\n};\n\nDataViewsSubComponents.BulkActionToolbar = BulkActionsFooter;\nDataViewsSubComponents.Filters = Filters;\nDataViewsSubComponents.FiltersToggled = FiltersToggled;\nDataViewsSubComponents.FiltersToggle = FiltersToggle;\nDataViewsSubComponents.Layout = DataViewsLayout;\nDataViewsSubComponents.LayoutSwitcher = ViewTypeMenu;\nDataViewsSubComponents.Pagination = DataViewsPagination;\nDataViewsSubComponents.Search = DataViewsSearch;\nDataViewsSubComponents.ViewConfig = DataviewsViewConfigDropdown;\nDataViewsSubComponents.Footer = DataViewsFooter;\n\nexport default DataViewsSubComponents;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode, ComponentProps, ReactElement } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useMemo, useRef, useState } from '@wordpress/element';\nimport { useResizeObserver, throttle } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../components/dataviews-context';\nimport { VIEW_LAYOUTS } from '../components/dataviews-layouts';\nimport {\n\tFilters,\n\tFiltersToggled,\n\tuseFilters,\n\tFiltersToggle,\n} from '../components/dataviews-filters';\nimport DataViewsLayout from '../components/dataviews-layout';\nimport DataViewsFooter from '../components/dataviews-footer';\nimport DataViewsSearch from '../components/dataviews-search';\nimport { BulkActionsFooter } from '../components/dataviews-bulk-actions';\nimport { DataViewsPagination } from '../components/dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../components/dataviews-view-config';\nimport normalizeFields from '../field-types';\nimport type { Action, Field, View, SupportedLayouts } from '../types';\nimport type { SelectionOrUpdater } from '../types/private';\ntype ItemWithId = { id: string };\n\ntype DataViewsProps< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: Field< Item >[];\n\tsearch?: boolean;\n\tsearchLabel?: string;\n\tactions?: Action< Item >[];\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t\tinfiniteScrollHandler?: () => void;\n\t};\n\tdefaultLayouts: SupportedLayouts;\n\tselection?: string[];\n\tonChangeSelection?: ( items: string[] ) => void;\n\tonClickItem?: ( item: Item ) => void;\n\trenderItemLink?: (\n\t\tprops: {\n\t\t\titem: Item;\n\t\t} & ComponentProps< 'a' >\n\t) => ReactElement;\n\tisItemClickable?: ( item: Item ) => boolean;\n\theader?: ReactNode;\n\tgetItemLevel?: ( item: Item ) => number;\n\tchildren?: ReactNode;\n\tconfig?: {\n\t\tperPageSizes: number[];\n\t};\n\tempty?: ReactNode;\n\tonReset?: ( () => void ) | false;\n} & ( Item extends ItemWithId\n\t? { getItemId?: ( item: Item ) => string }\n\t: { getItemId: ( item: Item ) => string } );\n\nconst defaultGetItemId = ( item: ItemWithId ) => item.id;\nconst defaultIsItemClickable = () => true;\nconst EMPTY_ARRAY: any[] = [];\n\nconst dataViewsLayouts = VIEW_LAYOUTS.filter(\n\t( viewLayout ) => ! viewLayout.isPicker\n);\n\ntype DefaultUIProps = Pick<\n\tDataViewsProps< any >,\n\t'header' | 'search' | 'searchLabel'\n>;\n\nfunction DefaultUI( {\n\theader,\n\tsearch = true,\n\tsearchLabel = undefined,\n}: DefaultUIProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\talign=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tgap=\"xs\"\n\t\t\t>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\tclassName=\"dataviews__search\"\n\t\t\t\t>\n\t\t\t\t\t{ search && <DataViewsSearch label={ searchLabel } /> }\n\t\t\t\t\t<FiltersToggle />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap=\"xs\" style={ { flexShrink: 0 } }>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t\t{ header }\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t\t<FiltersToggled className=\"dataviews-filters__container\" />\n\t\t\t<DataViewsLayout />\n\t\t\t<DataViewsFooter />\n\t\t</>\n\t);\n}\n\nfunction DataViews< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions = EMPTY_ARRAY,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tgetItemLevel,\n\tisLoading = false,\n\tpaginationInfo,\n\tdefaultLayouts: defaultLayoutsProperty,\n\tselection: selectionProperty,\n\tonChangeSelection,\n\tonClickItem,\n\trenderItemLink,\n\tisItemClickable = defaultIsItemClickable,\n\theader,\n\tchildren,\n\tconfig = { perPageSizes: [ 10, 20, 50, 100 ] },\n\tempty,\n\tonReset,\n}: DataViewsProps< Item > ) {\n\tconst { infiniteScrollHandler } = paginationInfo;\n\tconst containerRef = useRef< HTMLDivElement >( null );\n\tconst [ containerWidth, setContainerWidth ] = useState( 0 );\n\tconst resizeObserverRef = useResizeObserver(\n\t\t( resizeObserverEntries: any ) => {\n\t\t\tsetContainerWidth(\n\t\t\t\tresizeObserverEntries[ 0 ].borderBoxSize[ 0 ].inlineSize\n\t\t\t);\n\t\t},\n\t\t{ box: 'border-box' }\n\t);\n\tconst [ selectionState, setSelectionState ] = useState< string[] >( [] );\n\tconst isUncontrolled =\n\t\tselectionProperty === undefined || onChangeSelection === undefined;\n\tconst selection = isUncontrolled ? selectionState : selectionProperty;\n\tconst [ openedFilter, setOpenedFilter ] = useState< string | null >( null );\n\tfunction setSelectionWithChange( value: SelectionOrUpdater ) {\n\t\tconst newValue =\n\t\t\ttypeof value === 'function' ? value( selection ) : value;\n\t\tif ( isUncontrolled ) {\n\t\t\tsetSelectionState( newValue );\n\t\t}\n\t\tif ( onChangeSelection ) {\n\t\t\tonChangeSelection( newValue );\n\t\t}\n\t}\n\tconst _fields = useMemo( () => normalizeFields( fields ), [ fields ] );\n\tconst _selection = useMemo( () => {\n\t\treturn selection.filter( ( id ) =>\n\t\t\tdata.some( ( item ) => getItemId( item ) === id )\n\t\t);\n\t}, [ selection, data, getItemId ] );\n\n\tconst filters = useFilters( _fields, view );\n\tconst hasPrimaryOrLockedFilters = useMemo(\n\t\t() =>\n\t\t\t( filters || [] ).some(\n\t\t\t\t( filter ) => filter.isPrimary || filter.isLocked\n\t\t\t),\n\t\t[ filters ]\n\t);\n\tconst [ isShowingFilter, setIsShowingFilter ] = useState< boolean >(\n\t\thasPrimaryOrLockedFilters\n\t);\n\n\tuseEffect( () => {\n\t\tif ( hasPrimaryOrLockedFilters && ! isShowingFilter ) {\n\t\t\tsetIsShowingFilter( true );\n\t\t}\n\t}, [ hasPrimaryOrLockedFilters, isShowingFilter ] );\n\n\t// Attach scroll event listener for infinite scroll\n\tuseEffect( () => {\n\t\tif ( ! view.infiniteScrollEnabled || ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleScroll = throttle( ( event: unknown ) => {\n\t\t\tconst target = ( event as Event ).target as HTMLElement;\n\t\t\tconst scrollTop = target.scrollTop;\n\t\t\tconst scrollHeight = target.scrollHeight;\n\t\t\tconst clientHeight = target.clientHeight;\n\n\t\t\t// Check if user has scrolled near the bottom\n\t\t\tif ( scrollTop + clientHeight >= scrollHeight - 100 ) {\n\t\t\t\tinfiniteScrollHandler?.();\n\t\t\t}\n\t\t}, 100 ); // Throttle to 100ms\n\n\t\tconst container = containerRef.current;\n\t\tcontainer.addEventListener( 'scroll', handleScroll );\n\n\t\treturn () => {\n\t\t\tcontainer.removeEventListener( 'scroll', handleScroll );\n\t\t\thandleScroll.cancel(); // Cancel any pending throttled calls\n\t\t};\n\t}, [ infiniteScrollHandler, view.infiniteScrollEnabled ] );\n\n\t// Filter out DataViewsPicker layouts.\n\tconst defaultLayouts = useMemo(\n\t\t() =>\n\t\t\tObject.fromEntries(\n\t\t\t\tObject.entries( defaultLayoutsProperty ).filter(\n\t\t\t\t\t( [ layoutType ] ) => {\n\t\t\t\t\t\treturn dataViewsLayouts.some(\n\t\t\t\t\t\t\t( viewLayout ) => viewLayout.type === layoutType\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t)\n\t\t\t),\n\t\t[ defaultLayoutsProperty ]\n\t);\n\n\tif ( ! defaultLayouts[ view.type ] ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<DataViewsContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tview,\n\t\t\t\tonChangeView,\n\t\t\t\tfields: _fields,\n\t\t\t\tactions,\n\t\t\t\tdata,\n\t\t\t\tisLoading,\n\t\t\t\tpaginationInfo,\n\t\t\t\tselection: _selection,\n\t\t\t\tonChangeSelection: setSelectionWithChange,\n\t\t\t\topenedFilter,\n\t\t\t\tsetOpenedFilter,\n\t\t\t\tgetItemId,\n\t\t\t\tgetItemLevel,\n\t\t\t\tisItemClickable,\n\t\t\t\tonClickItem,\n\t\t\t\trenderItemLink,\n\t\t\t\tcontainerWidth,\n\t\t\t\tcontainerRef,\n\t\t\t\tresizeObserverRef,\n\t\t\t\tdefaultLayouts,\n\t\t\t\tfilters,\n\t\t\t\tisShowingFilter,\n\t\t\t\tsetIsShowingFilter,\n\t\t\t\tconfig,\n\t\t\t\tempty,\n\t\t\t\thasInfiniteScrollHandler: !! infiniteScrollHandler,\n\t\t\t\tonReset,\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-wrapper\" ref={ containerRef }>\n\t\t\t\t{ children ?? (\n\t\t\t\t\t<DefaultUI\n\t\t\t\t\t\theader={ header }\n\t\t\t\t\t\tsearch={ search }\n\t\t\t\t\t\tsearchLabel={ searchLabel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</DataViewsContext.Provider>\n\t);\n}\n\n// Populate the DataViews sub components\nconst DataViewsSubComponents = DataViews as typeof DataViews & {\n\tBulkActionToolbar: typeof BulkActionsFooter;\n\tFilters: typeof Filters;\n\tFiltersToggle: typeof FiltersToggle;\n\tFiltersToggled: typeof FiltersToggled;\n\tLayout: typeof DataViewsLayout;\n\tLayoutSwitcher: typeof ViewTypeMenu;\n\tPagination: typeof DataViewsPagination;\n\tSearch: typeof DataViewsSearch;\n\tViewConfig: typeof DataviewsViewConfigDropdown;\n\tFooter: typeof DataViewsFooter;\n};\n\nDataViewsSubComponents.BulkActionToolbar = BulkActionsFooter;\nDataViewsSubComponents.Filters = Filters;\nDataViewsSubComponents.FiltersToggled = FiltersToggled;\nDataViewsSubComponents.FiltersToggle = FiltersToggle;\nDataViewsSubComponents.Layout = DataViewsLayout;\nDataViewsSubComponents.LayoutSwitcher = ViewTypeMenu;\nDataViewsSubComponents.Pagination = DataViewsPagination;\nDataViewsSubComponents.Search = DataViewsSearch;\nDataViewsSubComponents.ViewConfig = DataviewsViewConfigDropdown;\nDataViewsSubComponents.Footer = DataViewsFooter;\n\nexport default DataViewsSubComponents;\n"],
+  "mappings": ";AAQA,SAAS,WAAW,SAAS,QAAQ,gBAAgB;AACrD,SAAS,mBAAmB,gBAAgB;AAC5C,SAAS,aAAa;AAKtB,OAAO,sBAAsB;AAC7B,SAAS,oBAAoB;AAC7B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,OAAO,qBAAqB;AAC5B,OAAO,qBAAqB;AAC5B,OAAO,qBAAqB;AAC5B,SAAS,yBAAyB;AAClC,SAAS,2BAA2B;AACpC,OAAO;AAAA,EACN;AAAA,EACA;AAAA,OACM;AACP,OAAO,qBAAqB;AA4D1B,mBAce,KANb,YARF;AAnBF,IAAM,mBAAmB,CAAE,SAAsB,KAAK;AACtD,IAAM,yBAAyB,MAAM;AACrC,IAAM,cAAqB,CAAC;AAE5B,IAAM,mBAAmB,aAAa;AAAA,EACrC,CAAE,eAAgB,CAAE,WAAW;AAChC;AAOA,SAAS,UAAW;AAAA,EACnB;AAAA,EACA,SAAS;AAAA,EACT,cAAc;AACf,GAAoB;AACnB,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,KAAI;AAAA,QAEJ;AAAA;AAAA,YAAC;AAAA;AAAA,cACA,WAAU;AAAA,cACV,SAAQ;AAAA,cACR,KAAI;AAAA,cACJ,WAAU;AAAA,cAER;AAAA,0BAAU,oBAAC,mBAAgB,OAAQ,aAAc;AAAA,gBACnD,oBAAC,iBAAc;AAAA;AAAA;AAAA,UAChB;AAAA,UACA,qBAAC,SAAM,WAAU,OAAM,KAAI,MAAK,OAAQ,EAAE,YAAY,EAAE,GACvD;AAAA,gCAAC,uBAAoB;AAAA,YACnB;AAAA,aACH;AAAA;AAAA;AAAA,IACD;AAAA,IACA,oBAAC,kBAAe,WAAU,gCAA+B;AAAA,IACzD,oBAAC,mBAAgB;AAAA,IACjB,oBAAC,mBAAgB;AAAA,KAClB;AAEF;AAEA,SAAS,UAAmB;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,cAAc;AAAA,EACd,UAAU;AAAA,EACV;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA,gBAAgB;AAAA,EAChB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,SAAS,EAAE,cAAc,CAAE,IAAI,IAAI,IAAI,GAAI,EAAE;AAAA,EAC7C;AAAA,EACA;AACD,GAA4B;AAC3B,QAAM,EAAE,sBAAsB,IAAI;AAClC,QAAM,eAAe,OAA0B,IAAK;AACpD,QAAM,CAAE,gBAAgB,iBAAkB,IAAI,SAAU,CAAE;AAC1D,QAAM,oBAAoB;AAAA,IACzB,CAAE,0BAAgC;AACjC;AAAA,QACC,sBAAuB,CAAE,EAAE,cAAe,CAAE,EAAE;AAAA,MAC/C;AAAA,IACD;AAAA,IACA,EAAE,KAAK,aAAa;AAAA,EACrB;AACA,QAAM,CAAE,gBAAgB,iBAAkB,IAAI,SAAsB,CAAC,CAAE;AACvE,QAAM,iBACL,sBAAsB,UAAa,sBAAsB;AAC1D,QAAM,YAAY,iBAAiB,iBAAiB;AACpD,QAAM,CAAE,cAAc,eAAgB,IAAI,SAA2B,IAAK;AAC1E,WAAS,uBAAwB,OAA4B;AAC5D,UAAM,WACL,OAAO,UAAU,aAAa,MAAO,SAAU,IAAI;AACpD,QAAK,gBAAiB;AACrB,wBAAmB,QAAS;AAAA,IAC7B;AACA,QAAK,mBAAoB;AACxB,wBAAmB,QAAS;AAAA,IAC7B;AAAA,EACD;AACA,QAAM,UAAU,QAAS,MAAM,gBAAiB,MAAO,GAAG,CAAE,MAAO,CAAE;AACrE,QAAM,aAAa,QAAS,MAAM;AACjC,WAAO,UAAU;AAAA,MAAQ,CAAE,OAC1B,KAAK,KAAM,CAAE,SAAU,UAAW,IAAK,MAAM,EAAG;AAAA,IACjD;AAAA,EACD,GAAG,CAAE,WAAW,MAAM,SAAU,CAAE;AAElC,QAAM,UAAU,WAAY,SAAS,IAAK;AAC1C,QAAM,4BAA4B;AAAA,IACjC,OACG,WAAW,CAAC,GAAI;AAAA,MACjB,CAAE,WAAY,OAAO,aAAa,OAAO;AAAA,IAC1C;AAAA,IACD,CAAE,OAAQ;AAAA,EACX;AACA,QAAM,CAAE,iBAAiB,kBAAmB,IAAI;AAAA,IAC/C;AAAA,EACD;AAEA,YAAW,MAAM;AAChB,QAAK,6BAA6B,CAAE,iBAAkB;AACrD,yBAAoB,IAAK;AAAA,IAC1B;AAAA,EACD,GAAG,CAAE,2BAA2B,eAAgB,CAAE;AAGlD,YAAW,MAAM;AAChB,QAAK,CAAE,KAAK,yBAAyB,CAAE,aAAa,SAAU;AAC7D;AAAA,IACD;AAEA,UAAM,eAAe,SAAU,CAAE,UAAoB;AACpD,YAAM,SAAW,MAAiB;AAClC,YAAM,YAAY,OAAO;AACzB,YAAM,eAAe,OAAO;AAC5B,YAAM,eAAe,OAAO;AAG5B,UAAK,YAAY,gBAAgB,eAAe,KAAM;AACrD,gCAAwB;AAAA,MACzB;AAAA,IACD,GAAG,GAAI;AAEP,UAAM,YAAY,aAAa;AAC/B,cAAU,iBAAkB,UAAU,YAAa;AAEnD,WAAO,MAAM;AACZ,gBAAU,oBAAqB,UAAU,YAAa;AACtD,mBAAa,OAAO;AAAA,IACrB;AAAA,EACD,GAAG,CAAE,uBAAuB,KAAK,qBAAsB,CAAE;AAGzD,QAAM,iBAAiB;AAAA,IACtB,MACC,OAAO;AAAA,MACN,OAAO,QAAS,sBAAuB,EAAE;AAAA,QACxC,CAAE,CAAE,UAAW,MAAO;AACrB,iBAAO,iBAAiB;AAAA,YACvB,CAAE,eAAgB,WAAW,SAAS;AAAA,UACvC;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAAA,IACD,CAAE,sBAAuB;AAAA,EAC1B;AAEA,MAAK,CAAE,eAAgB,KAAK,IAAK,GAAI;AACpC,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACA,OAAQ;AAAA,QACP;AAAA,QACA;AAAA,QACA,QAAQ;AAAA,QACR;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX,mBAAmB;AAAA,QACnB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,0BAA0B,CAAC,CAAE;AAAA,QAC7B;AAAA,MACD;AAAA,MAEA,8BAAC,SAAI,WAAU,qBAAoB,KAAM,cACtC,sBACD;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACD,GAEF;AAAA;AAAA,EACD;AAEF;AAGA,IAAM,yBAAyB;AAa/B,uBAAuB,oBAAoB;AAC3C,uBAAuB,UAAU;AACjC,uBAAuB,iBAAiB;AACxC,uBAAuB,gBAAgB;AACvC,uBAAuB,SAAS;AAChC,uBAAuB,iBAAiB;AACxC,uBAAuB,aAAa;AACpC,uBAAuB,SAAS;AAChC,uBAAuB,aAAa;AACpC,uBAAuB,SAAS;AAEhC,IAAO,oBAAQ;",
   "names": []
 }

package/build-module/dataviews-picker/index.mjs

@@ -38,13 +38,13 @@ function DefaultUI({
         align: "top",
         justify: "space-between",
         className: "dataviews__view-actions",
-        gap: "2xs",
+        gap: "xs",
         children: [
           /* @__PURE__ */ jsxs(
             Stack,
             {
               direction: "row",
-              gap: "xs",
+              gap: "sm",
               justify: "start",
               className: "dataviews__search",
               children: [
@@ -53,7 +53,7 @@ function DefaultUI({
               ]
             }
           ),
-          /* @__PURE__ */ jsx(Stack, { direction: "row", gap: "2xs", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx(DataViewsViewConfig, {}) })
+          /* @__PURE__ */ jsx(Stack, { direction: "row", gap: "xs", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx(DataViewsViewConfig, {}) })
         ]
       }
     ),

package/build-module/dataviews-picker/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/dataviews-picker/index.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useMemo, useRef, useState } from '@wordpress/element';\nimport { useResizeObserver, throttle } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../components/dataviews-context';\nimport { VIEW_LAYOUTS } from '../components/dataviews-layouts';\nimport {\n\tFilters,\n\tFiltersToggled,\n\tuseFilters,\n\tFiltersToggle,\n} from '../components/dataviews-filters';\nimport DataViewsLayout from '../components/dataviews-layout';\nimport { DataViewsPickerFooter } from '../components/dataviews-picker-footer';\nimport DataViewsSearch from '../components/dataviews-search';\nimport { DataViewsPagination } from '../components/dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../components/dataviews-view-config';\nimport normalizeFields from '../field-types';\nimport type { ActionButton, Field, View, SupportedLayouts } from '../types';\nimport type { SelectionOrUpdater } from '../types/private';\ntype ItemWithId = { id: string };\n\nconst isItemClickable = () => false;\n\nconst dataViewsPickerLayouts = VIEW_LAYOUTS.filter(\n\t( viewLayout ) => viewLayout.isPicker\n);\n\ntype DataViewsPickerProps< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: Field< Item >[];\n\tactions?: ActionButton< Item >[];\n\tsearch?: boolean;\n\tsearchLabel?: string;\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t\tinfiniteScrollHandler?: () => void;\n\t};\n\tdefaultLayouts: SupportedLayouts;\n\tselection: string[];\n\tonChangeSelection: ( items: string[] ) => void;\n\tchildren?: ReactNode;\n\tconfig?: {\n\t\tperPageSizes: number[];\n\t};\n\titemListLabel?: string;\n\tempty?: ReactNode;\n} & ( Item extends ItemWithId\n\t? { getItemId?: ( item: Item ) => string }\n\t: { getItemId: ( item: Item ) => string } );\n\nconst defaultGetItemId = ( item: ItemWithId ) => item.id;\nconst EMPTY_ARRAY: any[] = [];\n\ntype DefaultUIProps = Pick<\n\tDataViewsPickerProps< any >,\n\t'search' | 'searchLabel'\n>;\n\nfunction DefaultUI( {\n\tsearch = true,\n\tsearchLabel = undefined,\n}: DefaultUIProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\talign=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tgap=\"2xs\"\n\t\t\t>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\tgap=\"xs\"\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\tclassName=\"dataviews__search\"\n\t\t\t\t>\n\t\t\t\t\t{ search && <DataViewsSearch label={ searchLabel } /> }\n\t\t\t\t\t<FiltersToggle />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap=\"2xs\" style={ { flexShrink: 0 } }>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t\t<FiltersToggled className=\"dataviews-filters__container\" />\n\t\t\t<DataViewsLayout />\n\t\t\t<DataViewsPickerFooter />\n\t\t</>\n\t);\n}\n\nfunction DataViewsPicker< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions = EMPTY_ARRAY,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tisLoading = false,\n\tpaginationInfo,\n\tdefaultLayouts: defaultLayoutsProperty,\n\tselection,\n\tonChangeSelection,\n\tchildren,\n\tconfig = { perPageSizes: [ 10, 20, 50, 100 ] },\n\titemListLabel,\n\tempty,\n}: DataViewsPickerProps< Item > ) {\n\tconst { infiniteScrollHandler } = paginationInfo;\n\tconst containerRef = useRef< HTMLDivElement | null >( null );\n\tconst [ containerWidth, setContainerWidth ] = useState( 0 );\n\tconst resizeObserverRef = useResizeObserver(\n\t\t( resizeObserverEntries: any ) => {\n\t\t\tsetContainerWidth(\n\t\t\t\tresizeObserverEntries[ 0 ].borderBoxSize[ 0 ].inlineSize\n\t\t\t);\n\t\t},\n\t\t{ box: 'border-box' }\n\t);\n\tconst [ openedFilter, setOpenedFilter ] = useState< string | null >( null );\n\tfunction setSelectionWithChange( value: SelectionOrUpdater ) {\n\t\tconst newValue =\n\t\t\ttypeof value === 'function' ? value( selection ) : value;\n\t\tif ( onChangeSelection ) {\n\t\t\tonChangeSelection( newValue );\n\t\t}\n\t}\n\tconst _fields = useMemo( () => normalizeFields( fields ), [ fields ] );\n\tconst filters = useFilters( _fields, view );\n\tconst hasPrimaryOrLockedFilters = useMemo(\n\t\t() =>\n\t\t\t( filters || [] ).some(\n\t\t\t\t( filter ) => filter.isPrimary || filter.isLocked\n\t\t\t),\n\t\t[ filters ]\n\t);\n\tconst [ isShowingFilter, setIsShowingFilter ] = useState< boolean >(\n\t\thasPrimaryOrLockedFilters\n\t);\n\n\tuseEffect( () => {\n\t\tif ( hasPrimaryOrLockedFilters && ! isShowingFilter ) {\n\t\t\tsetIsShowingFilter( true );\n\t\t}\n\t}, [ hasPrimaryOrLockedFilters, isShowingFilter ] );\n\n\t// Attach scroll event listener for infinite scroll\n\tuseEffect( () => {\n\t\tif ( ! view.infiniteScrollEnabled || ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleScroll = throttle( ( event: unknown ) => {\n\t\t\tconst target = ( event as Event ).target as HTMLElement;\n\t\t\tconst scrollTop = target.scrollTop;\n\t\t\tconst scrollHeight = target.scrollHeight;\n\t\t\tconst clientHeight = target.clientHeight;\n\n\t\t\t// Check if user has scrolled near the bottom\n\t\t\tif ( scrollTop + clientHeight >= scrollHeight - 100 ) {\n\t\t\t\tinfiniteScrollHandler?.();\n\t\t\t}\n\t\t}, 100 ); // Throttle to 100ms\n\n\t\tconst container = containerRef.current;\n\t\tcontainer.addEventListener( 'scroll', handleScroll );\n\n\t\treturn () => {\n\t\t\tcontainer.removeEventListener( 'scroll', handleScroll );\n\t\t\thandleScroll.cancel(); // Cancel any pending throttled calls\n\t\t};\n\t}, [ infiniteScrollHandler, view.infiniteScrollEnabled ] );\n\n\t// Filter out DataViewsPicker layouts.\n\tconst defaultLayouts = useMemo(\n\t\t() =>\n\t\t\tObject.fromEntries(\n\t\t\t\tObject.entries( defaultLayoutsProperty ).filter(\n\t\t\t\t\t( [ layoutType ] ) => {\n\t\t\t\t\t\treturn dataViewsPickerLayouts.some(\n\t\t\t\t\t\t\t( viewLayout ) => viewLayout.type === layoutType\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t)\n\t\t\t),\n\t\t[ defaultLayoutsProperty ]\n\t);\n\n\tif ( ! defaultLayouts[ view.type ] ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<DataViewsContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tview,\n\t\t\t\tonChangeView,\n\t\t\t\tfields: _fields,\n\t\t\t\tactions,\n\t\t\t\tdata,\n\t\t\t\tisLoading,\n\t\t\t\tpaginationInfo,\n\t\t\t\tisItemClickable,\n\t\t\t\tselection,\n\t\t\t\tonChangeSelection: setSelectionWithChange,\n\t\t\t\topenedFilter,\n\t\t\t\tsetOpenedFilter,\n\t\t\t\tgetItemId,\n\t\t\t\tcontainerWidth,\n\t\t\t\tcontainerRef,\n\t\t\t\tresizeObserverRef,\n\t\t\t\tdefaultLayouts,\n\t\t\t\tfilters,\n\t\t\t\tisShowingFilter,\n\t\t\t\tsetIsShowingFilter,\n\t\t\t\tconfig,\n\t\t\t\titemListLabel,\n\t\t\t\tempty,\n\t\t\t\thasInfiniteScrollHandler: !! infiniteScrollHandler,\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-picker-wrapper\" ref={ containerRef }>\n\t\t\t\t{ children ?? (\n\t\t\t\t\t<DefaultUI search={ search } searchLabel={ searchLabel } />\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</DataViewsContext.Provider>\n\t);\n}\n\n// Populate the DataViews sub components\nconst DataViewsPickerSubComponents =\n\tDataViewsPicker as typeof DataViewsPicker & {\n\t\tBulkActionToolbar: typeof DataViewsPickerFooter;\n\t\tFilters: typeof Filters;\n\t\tFiltersToggled: typeof FiltersToggled;\n\t\tFiltersToggle: typeof FiltersToggle;\n\t\tLayout: typeof DataViewsLayout;\n\t\tLayoutSwitcher: typeof ViewTypeMenu;\n\t\tPagination: typeof DataViewsPagination;\n\t\tSearch: typeof DataViewsSearch;\n\t\tViewConfig: typeof DataviewsViewConfigDropdown;\n\t};\n\nDataViewsPickerSubComponents.BulkActionToolbar = DataViewsPickerFooter;\nDataViewsPickerSubComponents.Filters = Filters;\nDataViewsPickerSubComponents.FiltersToggled = FiltersToggled;\nDataViewsPickerSubComponents.FiltersToggle = FiltersToggle;\nDataViewsPickerSubComponents.Layout = DataViewsLayout;\nDataViewsPickerSubComponents.LayoutSwitcher = ViewTypeMenu;\nDataViewsPickerSubComponents.Pagination = DataViewsPagination;\nDataViewsPickerSubComponents.Search = DataViewsSearch;\nDataViewsPickerSubComponents.ViewConfig = DataviewsViewConfigDropdown;\n\nexport default DataViewsPickerSubComponents;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useMemo, useRef, useState } from '@wordpress/element';\nimport { useResizeObserver, throttle } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../components/dataviews-context';\nimport { VIEW_LAYOUTS } from '../components/dataviews-layouts';\nimport {\n\tFilters,\n\tFiltersToggled,\n\tuseFilters,\n\tFiltersToggle,\n} from '../components/dataviews-filters';\nimport DataViewsLayout from '../components/dataviews-layout';\nimport { DataViewsPickerFooter } from '../components/dataviews-picker-footer';\nimport DataViewsSearch from '../components/dataviews-search';\nimport { DataViewsPagination } from '../components/dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../components/dataviews-view-config';\nimport normalizeFields from '../field-types';\nimport type { ActionButton, Field, View, SupportedLayouts } from '../types';\nimport type { SelectionOrUpdater } from '../types/private';\ntype ItemWithId = { id: string };\n\nconst isItemClickable = () => false;\n\nconst dataViewsPickerLayouts = VIEW_LAYOUTS.filter(\n\t( viewLayout ) => viewLayout.isPicker\n);\n\ntype DataViewsPickerProps< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: Field< Item >[];\n\tactions?: ActionButton< Item >[];\n\tsearch?: boolean;\n\tsearchLabel?: string;\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t\tinfiniteScrollHandler?: () => void;\n\t};\n\tdefaultLayouts: SupportedLayouts;\n\tselection: string[];\n\tonChangeSelection: ( items: string[] ) => void;\n\tchildren?: ReactNode;\n\tconfig?: {\n\t\tperPageSizes: number[];\n\t};\n\titemListLabel?: string;\n\tempty?: ReactNode;\n} & ( Item extends ItemWithId\n\t? { getItemId?: ( item: Item ) => string }\n\t: { getItemId: ( item: Item ) => string } );\n\nconst defaultGetItemId = ( item: ItemWithId ) => item.id;\nconst EMPTY_ARRAY: any[] = [];\n\ntype DefaultUIProps = Pick<\n\tDataViewsPickerProps< any >,\n\t'search' | 'searchLabel'\n>;\n\nfunction DefaultUI( {\n\tsearch = true,\n\tsearchLabel = undefined,\n}: DefaultUIProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\talign=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tgap=\"xs\"\n\t\t\t>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\tclassName=\"dataviews__search\"\n\t\t\t\t>\n\t\t\t\t\t{ search && <DataViewsSearch label={ searchLabel } /> }\n\t\t\t\t\t<FiltersToggle />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap=\"xs\" style={ { flexShrink: 0 } }>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t\t<FiltersToggled className=\"dataviews-filters__container\" />\n\t\t\t<DataViewsLayout />\n\t\t\t<DataViewsPickerFooter />\n\t\t</>\n\t);\n}\n\nfunction DataViewsPicker< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions = EMPTY_ARRAY,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tisLoading = false,\n\tpaginationInfo,\n\tdefaultLayouts: defaultLayoutsProperty,\n\tselection,\n\tonChangeSelection,\n\tchildren,\n\tconfig = { perPageSizes: [ 10, 20, 50, 100 ] },\n\titemListLabel,\n\tempty,\n}: DataViewsPickerProps< Item > ) {\n\tconst { infiniteScrollHandler } = paginationInfo;\n\tconst containerRef = useRef< HTMLDivElement >( null );\n\tconst [ containerWidth, setContainerWidth ] = useState( 0 );\n\tconst resizeObserverRef = useResizeObserver(\n\t\t( resizeObserverEntries: any ) => {\n\t\t\tsetContainerWidth(\n\t\t\t\tresizeObserverEntries[ 0 ].borderBoxSize[ 0 ].inlineSize\n\t\t\t);\n\t\t},\n\t\t{ box: 'border-box' }\n\t);\n\tconst [ openedFilter, setOpenedFilter ] = useState< string | null >( null );\n\tfunction setSelectionWithChange( value: SelectionOrUpdater ) {\n\t\tconst newValue =\n\t\t\ttypeof value === 'function' ? value( selection ) : value;\n\t\tif ( onChangeSelection ) {\n\t\t\tonChangeSelection( newValue );\n\t\t}\n\t}\n\tconst _fields = useMemo( () => normalizeFields( fields ), [ fields ] );\n\tconst filters = useFilters( _fields, view );\n\tconst hasPrimaryOrLockedFilters = useMemo(\n\t\t() =>\n\t\t\t( filters || [] ).some(\n\t\t\t\t( filter ) => filter.isPrimary || filter.isLocked\n\t\t\t),\n\t\t[ filters ]\n\t);\n\tconst [ isShowingFilter, setIsShowingFilter ] = useState< boolean >(\n\t\thasPrimaryOrLockedFilters\n\t);\n\n\tuseEffect( () => {\n\t\tif ( hasPrimaryOrLockedFilters && ! isShowingFilter ) {\n\t\t\tsetIsShowingFilter( true );\n\t\t}\n\t}, [ hasPrimaryOrLockedFilters, isShowingFilter ] );\n\n\t// Attach scroll event listener for infinite scroll\n\tuseEffect( () => {\n\t\tif ( ! view.infiniteScrollEnabled || ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleScroll = throttle( ( event: unknown ) => {\n\t\t\tconst target = ( event as Event ).target as HTMLElement;\n\t\t\tconst scrollTop = target.scrollTop;\n\t\t\tconst scrollHeight = target.scrollHeight;\n\t\t\tconst clientHeight = target.clientHeight;\n\n\t\t\t// Check if user has scrolled near the bottom\n\t\t\tif ( scrollTop + clientHeight >= scrollHeight - 100 ) {\n\t\t\t\tinfiniteScrollHandler?.();\n\t\t\t}\n\t\t}, 100 ); // Throttle to 100ms\n\n\t\tconst container = containerRef.current;\n\t\tcontainer.addEventListener( 'scroll', handleScroll );\n\n\t\treturn () => {\n\t\t\tcontainer.removeEventListener( 'scroll', handleScroll );\n\t\t\thandleScroll.cancel(); // Cancel any pending throttled calls\n\t\t};\n\t}, [ infiniteScrollHandler, view.infiniteScrollEnabled ] );\n\n\t// Filter out DataViewsPicker layouts.\n\tconst defaultLayouts = useMemo(\n\t\t() =>\n\t\t\tObject.fromEntries(\n\t\t\t\tObject.entries( defaultLayoutsProperty ).filter(\n\t\t\t\t\t( [ layoutType ] ) => {\n\t\t\t\t\t\treturn dataViewsPickerLayouts.some(\n\t\t\t\t\t\t\t( viewLayout ) => viewLayout.type === layoutType\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t)\n\t\t\t),\n\t\t[ defaultLayoutsProperty ]\n\t);\n\n\tif ( ! defaultLayouts[ view.type ] ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<DataViewsContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tview,\n\t\t\t\tonChangeView,\n\t\t\t\tfields: _fields,\n\t\t\t\tactions,\n\t\t\t\tdata,\n\t\t\t\tisLoading,\n\t\t\t\tpaginationInfo,\n\t\t\t\tisItemClickable,\n\t\t\t\tselection,\n\t\t\t\tonChangeSelection: setSelectionWithChange,\n\t\t\t\topenedFilter,\n\t\t\t\tsetOpenedFilter,\n\t\t\t\tgetItemId,\n\t\t\t\tcontainerWidth,\n\t\t\t\tcontainerRef,\n\t\t\t\tresizeObserverRef,\n\t\t\t\tdefaultLayouts,\n\t\t\t\tfilters,\n\t\t\t\tisShowingFilter,\n\t\t\t\tsetIsShowingFilter,\n\t\t\t\tconfig,\n\t\t\t\titemListLabel,\n\t\t\t\tempty,\n\t\t\t\thasInfiniteScrollHandler: !! infiniteScrollHandler,\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-picker-wrapper\" ref={ containerRef }>\n\t\t\t\t{ children ?? (\n\t\t\t\t\t<DefaultUI search={ search } searchLabel={ searchLabel } />\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</DataViewsContext.Provider>\n\t);\n}\n\n// Populate the DataViews sub components\nconst DataViewsPickerSubComponents =\n\tDataViewsPicker as typeof DataViewsPicker & {\n\t\tBulkActionToolbar: typeof DataViewsPickerFooter;\n\t\tFilters: typeof Filters;\n\t\tFiltersToggled: typeof FiltersToggled;\n\t\tFiltersToggle: typeof FiltersToggle;\n\t\tLayout: typeof DataViewsLayout;\n\t\tLayoutSwitcher: typeof ViewTypeMenu;\n\t\tPagination: typeof DataViewsPagination;\n\t\tSearch: typeof DataViewsSearch;\n\t\tViewConfig: typeof DataviewsViewConfigDropdown;\n\t};\n\nDataViewsPickerSubComponents.BulkActionToolbar = DataViewsPickerFooter;\nDataViewsPickerSubComponents.Filters = Filters;\nDataViewsPickerSubComponents.FiltersToggled = FiltersToggled;\nDataViewsPickerSubComponents.FiltersToggle = FiltersToggle;\nDataViewsPickerSubComponents.Layout = DataViewsLayout;\nDataViewsPickerSubComponents.LayoutSwitcher = ViewTypeMenu;\nDataViewsPickerSubComponents.Pagination = DataViewsPagination;\nDataViewsPickerSubComponents.Search = DataViewsSearch;\nDataViewsPickerSubComponents.ViewConfig = DataviewsViewConfigDropdown;\n\nexport default DataViewsPickerSubComponents;\n"],
+  "mappings": "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",
   "names": []
 }