@wordpress/dataviews 8.0.1-next.e256d081a.0 → 9.0.0

package/CHANGELOG.md

@@ -2,15 +2,54 @@
 
 ## Unreleased
 
-## 8.0.0-next.0 (2025-08-28)
+## 9.0.0 (2025-09-17)
+
+### Breaking changes
+
+- Remove `boolean` form control. Fields using `Edit: 'boolean'` must now use `Edit: 'checkbox'` or `Edit: 'toggle'` instead. Boolean field types now use checkboxes by default. [#71505](https://github.com/WordPress/gutenberg/pull/71505)
+- DataViews: Custom `empty` elements are no longer wrapped in `<p>` tags to improve accessibility. [#71561](https://github.com/WordPress/gutenberg/pull/71561)
+
+### Features
+
+- Field API: introduce `setValue` to fix DataViews filters and DataForm panel layout (modal) when working with nested data. [#71604](https://github.com/WordPress/gutenberg/pull/71604)
+- Introduce a new `DataViewsPicker` component. [#70971](https://github.com/WordPress/gutenberg/pull/70971)
+- Dataform: Add new `telephone` field type and field control. [#71498](https://github.com/WordPress/gutenberg/pull/71498)
+- DataForm: introduce a new `row` layout, check the README for details. [#71124](https://github.com/WordPress/gutenberg/pull/71124)
+- Dataform: Add new `url` field type and field control. [#71518](https://github.com/WordPress/gutenberg/pull/71518)
+- Dataform: Add new `password` field type and field control. [#71545](https://github.com/WordPress/gutenberg/pull/71545)
+- DataForm: Add a textarea control for use with the `text` field type ([#71495](https://github.com/WordPress/gutenberg/pull/71495))
+- DataViews: support groupBy in the list layout. [#71548](https://github.com/WordPress/gutenberg/pull/71548)
+- DataForm: support validation in select control [#71665](https://github.com/WordPress/gutenberg/pull/71665)
+- DataForm: support validation in toggleGroup control. ([#71666](https://github.com/WordPress/gutenberg/pull/71666))
+-  DataForm: Add object configuration support for Edit property with some options. ([#71582](https://github.com/WordPress/gutenberg/pull/71582))
+- DataForm: Add summary field support for composed fields. ([#71614](https://github.com/WordPress/gutenberg/pull/71614))
+- DataForm: update radio control to support `required` and `custom` validation. [#71664](https://github.com/WordPress/gutenberg/pull/71664)
+
+### Bug Fixes
+
+- DataViews grid layout: make sure media previews have rounded corners. [#71543](https://github.com/WordPress/gutenberg/pull/71543)
+- DataForm regular layout: Remove label style overrides as they cause inconsistent results. ([#71574](https://github.com/WordPress/gutenberg/pull/71574))
+- DataForm regular layout: Use BaseControl visual label for readonly fields when in top labelPosition. ([#71597](https://github.com/WordPress/gutenberg/pull/71597))
+
+## 8.0.0 (2025-09-03)
 
 ### Breaking changes
 
 - Revert the ability to hide the view config via `config` prop and export a `DataViews.Footer` component to support the "Minimal UI" story. [#71276](https://github.com/WordPress/gutenberg/pull/71276)
 
+### Enhancements
+
+-   DataForm: add description support for the combined fields and show the description in the Card layout ([#71380](https://github.com/WordPress/gutenberg/pull/71380)).
+-   Add support for hiding the `title` in Grid layouts, with the actions menu rendered over the media preview. [#71369](https://github.com/WordPress/gutenberg/pull/71369)
+
+### Internal
+
+- Display names for Context providers [#71208](https://github.com/WordPress/gutenberg/pull/71208)
+
 ### Bug Fixes
 
 -   DataViews: Fix incorrect documentation for `defaultLayouts` prop. [#71334](https://github.com/WordPress/gutenberg/pull/71334)
+-   DataViews: Fix mismatched padding on mobile viewports for grid layout [#71455](https://github.com/WordPress/gutenberg/pull/71455)
 
 ## 7.0.0 (2025-08-20)
 

package/README.md

@@ -381,12 +381,16 @@ The list of selected items' ids.
 
 If `selection` and `onChangeSelection` are provided, the `DataViews` component behaves like a controlled component. Otherwise, it behaves like an uncontrolled component.
 
+Note: `DataViews` still requires at least one bulk action to make items selectable.
+
 #### `onChangeSelection`: `function`
 
 Callback that signals the user selected one of more items. It receives the list of selected items' IDs as a parameter.
 
 If `selection` and `onChangeSelection` are provided, the `DataViews` component behaves like a controlled component. Otherwise, it behaves like an uncontrolled component.
 
+Note: `DataViews` still requires at least one bulk action to make items selectable.
+
 #### `isItemClickable`: `function`
 
 A function that determines if a media field or a primary field is clickable. It receives an item as an argument and returns a boolean value indicating whether the item can be clicked.
@@ -422,7 +426,7 @@ Optional. Pass an object with a list of `perPageSizes` to control the available
 
 #### `empty`: React node
 
-A message or element to be displayed instead of the dataview's default empty message.
+An element to display when the `data` prop is empty. Defaults to `<p>No results</p>`.
 
 ### Composition modes
 
@@ -496,6 +500,78 @@ Developers don't need to worry about the internal accessibility logic for indivi
 
 `FiltersToggle` controls the visibility of the filters panel, and `Filters` renders the actual filters inside it. They work together and should always be used as a pair. While their internal behavior is accessible by default, how they’re positioned and grouped in custom layouts may affect the overall experience — especially for assistive technologies. Extra care is recommended.
 
+## `DataViewsPicker`
+
+<div class="callout callout-info">At <a href="https://wordpress.github.io/gutenberg/">WordPress Gutenberg's Storybook</a> there's an <a href="https://wordpress.github.io/gutenberg/?path=/docs/dataviews-dataviewspicker--docs">example implementation of the DataviewsPicker component</a>.</div>
+
+### Usage
+
+The `DataViewsPicker` component is very similar to the regular `DataViews` component, but is optimized for selection or picking of items.
+
+The component behaves differently to a regular `DataViews` component in the following ways:
+
+-   The items in the view are rendered using the `listbox` and `option` aria roles.
+-   Holding the `ctrl` or `cmd` key isn't required for multi-selection of items. The entire item can be clicked to select or deselect it.
+-   Individual items do not display any actions. All actions appear in the footer as text buttons.
+-   Selection is maintained across multiple pages when the component is paginated.
+
+There are also a few differences in the implementation:
+
+-   Currently only the `pickerGrid` layout is supported for `DataViewsPicker`. This layout is very similar to the regular `grid` layout.
+-   The picker component is used as a 'controlled' component, so `selection` and `onChangeSelection` should be provided as props. This is so that implementers can access the full range of selected items across pages.
+-   An optional `itemListLabel` prop can be supplied to the `DataViewsPicker` component. This is added as an `aria-label` to the `listbox` element, and should be supplied if there's no heading element associated with the `DataViewsPicker` UI.
+-   The `isItemClickable`, `renderItemLink` and `onClickItem` prop are unsupported for `DataViewsPicker`.
+-   To implement a multi-selection picker, ensure all actions are declared with `supportsBulk: true`. For single selection use `supportsBulk: false`. When a mixture of bulk and non-bulk actions are provided, the component falls back to single selection.
+-   Only the `callback` style of action is supported. `RenderModal` is unsupported.
+-   The `isEligible` callback for actions is unsupported.
+-   The `isPrimary` option for an action is used to render a `primary` variant of `Button` that can be used as a main call to action.
+
+Example:
+
+```jsx
+const Example = () => {
+	// When using DataViewsPicker, `selection` should be managed so that the component is 'controlled'.
+	const [ selection, setSelection ] = useState( [] );
+
+	// Both actions have `supportsBulk: true`, so the `DataViewsPicker` will allow multi-selection.
+	const actions = [
+		{
+			id: 'confirm',
+			label: 'Confirm',
+			isPrimary: true,
+			supportsBulk: true,
+			callback() {
+				window.alert( selection.join( ', ' ) );
+			},
+		},
+		{
+			id: 'cancel',
+			label: 'Cancel',
+			supportsBulk: true,
+			callback() {
+				setSelection( [] );
+			},
+		},
+	];
+
+	return (
+		<DataViewsPicker
+			actions={ actions }
+			data={ data }
+			fields={ fields }
+			view={ view }
+			onChangeView={ onChangeView }
+			defaultLayouts={ defaultLayouts }
+			paginationInfo={ paginationInfo }
+			selection={ selection }
+			onChangeSelection={ setSelection }
+		/>
+	);
+};
+```
+
+### Properties
+
 ## `DataForm`
 
 <div class="callout callout-info">At <a href="https://wordpress.github.io/gutenberg/">WordPress Gutenberg's Storybook</a> there's and <a href="https://wordpress.github.io/gutenberg/?path=/docs/dataviews-dataform--docs">example implementation of the DataForm component</a>.</div>
@@ -913,24 +989,119 @@ Example:
 }
 ```
 
-### `getValue`
+### `getValue` and `setValue`
 
-React component that returns the value of a field. This value is used to sort or filter the fields.
+These functions control how field values are read from and written to your data structure.
 
--   Type: React component.
+Both functions are optional and automatically generated from the field's `id` when not provided. The `id` is treated as a dot-notation path (e.g., `"user.profile.name"` accesses `item.user.profile.name`).
+
+#### `getValue`
+
+Function that extracts the field value from an item. This value is used to sort, filter, and display the field.
+
+-   Type: `function`.
 -   Optional.
--   Defaults to `item[ id ]`.
--   Props:
-    -   `item` value to be processed.
--   Returns a value that represents the field.
+-   Args:
+    -   `item`: the data item to be processed.
+-   Returns the field's value.
 
-Example:
+#### `setValue`
+
+Function that creates a partial item object with updated field values. This is used by DataForm for editing operations and determines the structure of data passed to the `onChange` callback.
+
+-   Type: `function`.
+-   Optional.
+-   Args:
+    -   `item`: the current item being edited.
+    -   `value`: the new value to be set for the field.
+-   Returns a partial item object with the changes to be applied.
+
+#### Simple field access
+
+For basic field access, you only need to specify the field `id`. Both `getValue` and `setValue` are automatically generated:
 
 ```js
+// Data structure
+const item = {
+	title: 'Hello World',
+	author: 'John Doe'
+};
+
+// Field definition
 {
-	getValue: ( { item } ) => {
-		/* The field's value.  */
-	};
+	id: 'title',
+	label: 'Title'
+	// getValue: automatically becomes ( { item } ) => item.title
+	// setValue: automatically becomes ( { value } ) => ( { title: value } )
+}
+```
+
+#### Nested data access
+
+Use dot notation in the field `id` to access nested properties:
+
+```js
+// Data structure
+const item = {
+	user: {
+		profile: {
+			name: 'John Doe',
+			email: 'john@example.com'
+		}
+	}
+};
+
+// Field definition - using dot notation (automatic)
+{
+	id: 'user.profile.name',
+	label: 'User Name'
+	// getValue: automatically becomes ( { item } ) => item.user.profile.name
+	// setValue: automatically becomes ( { value } ) => ( { user: { profile: { name: value } } } )
+}
+
+// Alternative - using simple ID with custom functions
+{
+	id: 'userName',
+	label: 'User Name',
+	getValue: ( { item } ) => item.user.profile.name,
+	setValue: ( { value } ) => ( {
+		user: {
+			profile: { name: value }
+		}
+	} )
+}
+```
+
+#### Custom data transformation
+
+Provide custom `getValue` and `setValue` functions when you need to transform data between the storage format and display format:
+
+```js
+// Data structure
+const item = {
+	user: {
+		preferences: {
+			notifications: true
+		}
+	}
+};
+
+// Field definition - transform boolean to string options
+{
+	id: 'notifications',
+	label: 'Notifications',
+	Edit: 'radio',
+	elements: [
+		{ label: 'Enabled', value: 'enabled' },
+		{ label: 'Disabled', value: 'disabled' }
+	],
+	getValue: ( { item } ) =>
+		item.user.preferences.notifications === true ? 'enabled' : 'disabled',
+	setValue: ( { value } ) => ( {
+		user: {
+			preferences: { notifications: value === 'enabled' }
+		}
+	} )
 }
 ```
 
@@ -1303,7 +1474,7 @@ Example:
 
 ### `layout`
 
-Represents the type of layout used to render the field. It'll be one of Regular, Panel, or Card. This prop is the same as the `form.layout` prop.
+Represents the type of layout used to render the field. It'll be one of Regular, Panel, Card, or Row. This prop is the same as the `form.layout` prop.
 
 #### Regular
 
@@ -1357,6 +1528,25 @@ For example:
 }
 ```
 
+#### Row
+
+- `type`: `row`. Required.
+- `alignment`: one of `start`, `center`, or `end`. Optional. `center` by default.
+
+The Row layout displays fields horizontally in a single row. It's particularly useful for grouping related fields that should be displayed side by side. This layout can be used both as a top-level form layout and for individual field groups.
+
+For example:
+
+```js
+{
+	id: 'field_id',
+	layout: {
+		type: 'row',
+		alignment: 'start'
+	},
+}
+```
+
 ### `label`
 
 The label used when displaying a combined field, this requires the use of `children` as well.

package/build/components/dataform-context/index.js

@@ -18,6 +18,7 @@ var _jsxRuntime = require("react/jsx-runtime");
 const DataFormContext = (0, _element.createContext)({
   fields: []
 });
+DataFormContext.displayName = 'DataFormContext';
 function DataFormProvider({
   fields,
   children

package/build/components/dataform-context/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_jsxRuntime","DataFormContext","createContext","fields","DataFormProvider","children","jsx","Provider","value","_default","exports","default"],"sources":["@wordpress/dataviews/src/components/dataform-context/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { NormalizedField } from '../../types';\n\ntype DataFormContextType< Item > = {\n\tfields: NormalizedField< Item >[];\n};\n\nconst DataFormContext = createContext< DataFormContextType< any > >( {\n\tfields: [],\n} );\n\nexport function DataFormProvider< Item >( {\n\tfields,\n\tchildren,\n}: React.PropsWithChildren< { fields: NormalizedField< Item >[] } > ) {\n\treturn (\n\t\t<DataFormContext.Provider value={ { fields } }>\n\t\t\t{ children }\n\t\t</DataFormContext.Provider>\n\t);\n}\n\nexport default DataFormContext;\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAAmD,IAAAC,WAAA,GAAAD,OAAA;AAHnD;AACA;AACA;;AAGA;AACA;AACA;;AAOA,MAAME,eAAe,GAAG,IAAAC,sBAAa,EAAgC;EACpEC,MAAM,EAAE;AACT,CAAE,CAAC;AAEI,SAASC,gBAAgBA,CAAU;EACzCD,MAAM;EACNE;AACiE,CAAC,EAAG;EACrE,oBACC,IAAAL,WAAA,CAAAM,GAAA,EAACL,eAAe,CAACM,QAAQ;IAACC,KAAK,EAAG;MAAEL;IAAO,CAAG;IAAAE,QAAA,EAC3CA;EAAQ,CACe,CAAC;AAE7B;AAAC,IAAAI,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEcV,eAAe","ignoreList":[]}
+{"version":3,"names":["_element","require","_jsxRuntime","DataFormContext","createContext","fields","displayName","DataFormProvider","children","jsx","Provider","value","_default","exports","default"],"sources":["@wordpress/dataviews/src/components/dataform-context/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { NormalizedField } from '../../types';\n\ntype DataFormContextType< Item > = {\n\tfields: NormalizedField< Item >[];\n};\n\nconst DataFormContext = createContext< DataFormContextType< any > >( {\n\tfields: [],\n} );\nDataFormContext.displayName = 'DataFormContext';\n\nexport function DataFormProvider< Item >( {\n\tfields,\n\tchildren,\n}: React.PropsWithChildren< { fields: NormalizedField< Item >[] } > ) {\n\treturn (\n\t\t<DataFormContext.Provider value={ { fields } }>\n\t\t\t{ children }\n\t\t</DataFormContext.Provider>\n\t);\n}\n\nexport default DataFormContext;\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAAmD,IAAAC,WAAA,GAAAD,OAAA;AAHnD;AACA;AACA;;AAGA;AACA;AACA;;AAOA,MAAME,eAAe,GAAG,IAAAC,sBAAa,EAAgC;EACpEC,MAAM,EAAE;AACT,CAAE,CAAC;AACHF,eAAe,CAACG,WAAW,GAAG,iBAAiB;AAExC,SAASC,gBAAgBA,CAAU;EACzCF,MAAM;EACNG;AACiE,CAAC,EAAG;EACrE,oBACC,IAAAN,WAAA,CAAAO,GAAA,EAACN,eAAe,CAACO,QAAQ;IAACC,KAAK,EAAG;MAAEN;IAAO,CAAG;IAAAG,QAAA,EAC3CA;EAAQ,CACe,CAAC;AAE7B;AAAC,IAAAI,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEcX,eAAe","ignoreList":[]}

package/build/components/dataviews/index.js

@@ -9,6 +9,7 @@ var _components = require("@wordpress/components");
 var _element = require("@wordpress/element");
 var _compose = require("@wordpress/compose");
 var _dataviewsContext = _interopRequireDefault(require("../dataviews-context"));
+var _dataviewsLayouts = require("../../dataviews-layouts");
 var _dataviewsFilters = _interopRequireWildcard(require("../dataviews-filters"));
 var _dataviewsLayout = _interopRequireDefault(require("../dataviews-layout"));
 var _dataviewsFooter = _interopRequireDefault(require("../dataviews-footer"));
@@ -35,6 +36,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 const defaultGetItemId = item => item.id;
 const defaultIsItemClickable = () => true;
 const EMPTY_ARRAY = [];
+const dataViewsLayouts = _dataviewsLayouts.VIEW_LAYOUTS.filter(viewLayout => !viewLayout.isPicker);
 function DefaultUI({
   header,
   search = true,
@@ -81,7 +83,7 @@ function DataViews({
   getItemLevel,
   isLoading = false,
   paginationInfo,
-  defaultLayouts,
+  defaultLayouts: defaultLayoutsProperty,
   selection: selectionProperty,
   onChangeSelection,
   onClickItem,
@@ -154,6 +156,14 @@ function DataViews({
       handleScroll.cancel(); // Cancel any pending throttled calls
     };
   }, [infiniteScrollHandler, view.infiniteScrollEnabled]);
+
+  // Filter out DataViewsPicker layouts.
+  const defaultLayouts = (0, _element.useMemo)(() => Object.fromEntries(Object.entries(defaultLayoutsProperty).filter(([layoutType]) => {
+    return dataViewsLayouts.some(viewLayout => viewLayout.type === layoutType);
+  })), [defaultLayoutsProperty]);
+  if (!defaultLayouts[view.type]) {
+    return null;
+  }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsContext.default.Provider, {
     value: {
       view,

package/build/components/dataviews/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_element","_compose","_dataviewsContext","_interopRequireDefault","_dataviewsFilters","_interopRequireWildcard","_dataviewsLayout","_dataviewsFooter","_dataviewsSearch","_dataviewsBulkActions","_dataviewsPagination","_dataviewsViewConfig","_normalizeFields","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","defaultGetItemId","item","id","defaultIsItemClickable","EMPTY_ARRAY","DefaultUI","header","search","searchLabel","undefined","isShowingFilter","useContext","DataViewsContext","jsxs","Fragment","children","__experimentalHStack","alignment","justify","className","spacing","expanded","jsx","label","FiltersToggle","style","flexShrink","DataViews","view","onChangeView","fields","actions","data","getItemId","getItemLevel","isLoading","paginationInfo","defaultLayouts","selection","selectionProperty","onChangeSelection","onClickItem","renderItemLink","isItemClickable","config","perPageSizes","empty","infiniteScrollHandler","containerRef","useRef","containerWidth","setContainerWidth","useState","resizeObserverRef","useResizeObserver","resizeObserverEntries","borderBoxSize","inlineSize","box","selectionState","setSelectionState","isUncontrolled","openedFilter","setOpenedFilter","setSelectionWithChange","value","newValue","_fields","useMemo","normalizeFields","_selection","filter","some","filters","useFilters","hasPrimaryOrLockedFilters","isPrimary","isLocked","setIsShowingFilter","useEffect","infiniteScrollEnabled","current","handleScroll","throttle","event","target","scrollTop","scrollHeight","clientHeight","container","addEventListener","removeEventListener","cancel","Provider","hasInfiniteScrollHandler","ref","DataViewsSubComponents","BulkActionToolbar","BulkActionsFooter","Filters","DataViewsFilters","Layout","DataViewsLayout","LayoutSwitcher","ViewTypeMenu","Pagination","DataViewsPagination","Search","DataViewsSearch","ViewConfig","DataviewsViewConfigDropdown","Footer","DataViewsFooter","_default","exports"],"sources":["@wordpress/dataviews/src/components/dataviews/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, ComponentProps, ReactElement } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __experimentalHStack as HStack } from '@wordpress/components';\nimport {\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { useResizeObserver, throttle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../dataviews-context';\nimport {\n\tdefault as DataViewsFilters,\n\tuseFilters,\n\tFiltersToggle,\n} from '../dataviews-filters';\nimport DataViewsLayout from '../dataviews-layout';\nimport DataViewsFooter from '../dataviews-footer';\nimport DataViewsSearch from '../dataviews-search';\nimport { BulkActionsFooter } from '../dataviews-bulk-actions';\nimport { DataViewsPagination } from '../dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../dataviews-view-config';\nimport { normalizeFields } from '../../normalize-fields';\nimport type { Action, Field, View, SupportedLayouts } from '../../types';\nimport type { SelectionOrUpdater } from '../../private-types';\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\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\tconst { isShowingFilter } = useContext( DataViewsContext );\n\treturn (\n\t\t<>\n\t\t\t<HStack\n\t\t\t\talignment=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tspacing={ 1 }\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\texpanded={ false }\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</HStack>\n\t\t\t\t<HStack\n\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\texpanded={ false }\n\t\t\t\t\tstyle={ { flexShrink: 0 } }\n\t\t\t\t>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t\t{ header }\n\t\t\t\t</HStack>\n\t\t\t</HStack>\n\t\t\t{ isShowingFilter && (\n\t\t\t\t<DataViewsFilters className=\"dataviews-filters__container\" />\n\t\t\t) }\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,\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\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 DataViewsFilters;\n\tFiltersToggle: typeof FiltersToggle;\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 = DataViewsFilters;\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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","ignoreList":[]}
+{"version":3,"names":["_components","require","_element","_compose","_dataviewsContext","_interopRequireDefault","_dataviewsLayouts","_dataviewsFilters","_interopRequireWildcard","_dataviewsLayout","_dataviewsFooter","_dataviewsSearch","_dataviewsBulkActions","_dataviewsPagination","_dataviewsViewConfig","_normalizeFields","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","defaultGetItemId","item","id","defaultIsItemClickable","EMPTY_ARRAY","dataViewsLayouts","VIEW_LAYOUTS","filter","viewLayout","isPicker","DefaultUI","header","search","searchLabel","undefined","isShowingFilter","useContext","DataViewsContext","jsxs","Fragment","children","__experimentalHStack","alignment","justify","className","spacing","expanded","jsx","label","FiltersToggle","style","flexShrink","DataViews","view","onChangeView","fields","actions","data","getItemId","getItemLevel","isLoading","paginationInfo","defaultLayouts","defaultLayoutsProperty","selection","selectionProperty","onChangeSelection","onClickItem","renderItemLink","isItemClickable","config","perPageSizes","empty","infiniteScrollHandler","containerRef","useRef","containerWidth","setContainerWidth","useState","resizeObserverRef","useResizeObserver","resizeObserverEntries","borderBoxSize","inlineSize","box","selectionState","setSelectionState","isUncontrolled","openedFilter","setOpenedFilter","setSelectionWithChange","value","newValue","_fields","useMemo","normalizeFields","_selection","some","filters","useFilters","hasPrimaryOrLockedFilters","isPrimary","isLocked","setIsShowingFilter","useEffect","infiniteScrollEnabled","current","handleScroll","throttle","event","target","scrollTop","scrollHeight","clientHeight","container","addEventListener","removeEventListener","cancel","fromEntries","entries","layoutType","type","Provider","hasInfiniteScrollHandler","ref","DataViewsSubComponents","BulkActionToolbar","BulkActionsFooter","Filters","DataViewsFilters","Layout","DataViewsLayout","LayoutSwitcher","ViewTypeMenu","Pagination","DataViewsPagination","Search","DataViewsSearch","ViewConfig","DataviewsViewConfigDropdown","Footer","DataViewsFooter","_default","exports"],"sources":["@wordpress/dataviews/src/components/dataviews/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, ComponentProps, ReactElement } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __experimentalHStack as HStack } from '@wordpress/components';\nimport {\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { useResizeObserver, throttle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../dataviews-context';\nimport { VIEW_LAYOUTS } from '../../dataviews-layouts';\nimport {\n\tdefault as DataViewsFilters,\n\tuseFilters,\n\tFiltersToggle,\n} from '../dataviews-filters';\nimport DataViewsLayout from '../dataviews-layout';\nimport DataViewsFooter from '../dataviews-footer';\nimport DataViewsSearch from '../dataviews-search';\nimport { BulkActionsFooter } from '../dataviews-bulk-actions';\nimport { DataViewsPagination } from '../dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../dataviews-view-config';\nimport { normalizeFields } from '../../normalize-fields';\nimport type { Action, Field, View, SupportedLayouts } from '../../types';\nimport type { SelectionOrUpdater } from '../../private-types';\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\tconst { isShowingFilter } = useContext( DataViewsContext );\n\treturn (\n\t\t<>\n\t\t\t<HStack\n\t\t\t\talignment=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tspacing={ 1 }\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\texpanded={ false }\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</HStack>\n\t\t\t\t<HStack\n\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\texpanded={ false }\n\t\t\t\t\tstyle={ { flexShrink: 0 } }\n\t\t\t\t>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t\t{ header }\n\t\t\t\t</HStack>\n\t\t\t</HStack>\n\t\t\t{ isShowingFilter && (\n\t\t\t\t<DataViewsFilters className=\"dataviews-filters__container\" />\n\t\t\t) }\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 DataViewsFilters;\n\tFiltersToggle: typeof FiltersToggle;\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 = DataViewsFilters;\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,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAOA,IAAAE,QAAA,GAAAF,OAAA;AAKA,IAAAG,iBAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,iBAAA,GAAAL,OAAA;AACA,IAAAM,iBAAA,GAAAC,uBAAA,CAAAP,OAAA;AAKA,IAAAQ,gBAAA,GAAAJ,sBAAA,CAAAJ,OAAA;AACA,IAAAS,gBAAA,GAAAL,sBAAA,CAAAJ,OAAA;AACA,IAAAU,gBAAA,GAAAN,sBAAA,CAAAJ,OAAA;AACA,IAAAW,qBAAA,GAAAX,OAAA;AACA,IAAAY,oBAAA,GAAAZ,OAAA;AACA,IAAAa,oBAAA,GAAAN,uBAAA,CAAAP,OAAA;AAIA,IAAAc,gBAAA,GAAAd,OAAA;AAAyD,IAAAe,WAAA,GAAAf,OAAA;AAAA,SAAAgB,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAV,wBAAAU,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AArCzD;AACA;AACA;;AAGA;AACA;AACA;;AAWA;AACA;AACA;;AAyDA,MAAMW,gBAAgB,GAAKC,IAAgB,IAAMA,IAAI,CAACC,EAAE;AACxD,MAAMC,sBAAsB,GAAGA,CAAA,KAAM,IAAI;AACzC,MAAMC,WAAkB,GAAG,EAAE;AAE7B,MAAMC,gBAAgB,GAAGC,8BAAY,CAACC,MAAM,CACzCC,UAAU,IAAM,CAAEA,UAAU,CAACC,QAChC,CAAC;AAOD,SAASC,SAASA,CAAE;EACnBC,MAAM;EACNC,MAAM,GAAG,IAAI;EACbC,WAAW,GAAGC;AACC,CAAC,EAAG;EACnB,MAAM;IAAEC;EAAgB,CAAC,GAAG,IAAAC,mBAAU,EAAEC,yBAAiB,CAAC;EAC1D,oBACC,IAAAtC,WAAA,CAAAuC,IAAA,EAAAvC,WAAA,CAAAwC,QAAA;IAAAC,QAAA,gBACC,IAAAzC,WAAA,CAAAuC,IAAA,EAACvD,WAAA,CAAA0D,oBAAM;MACNC,SAAS,EAAC,KAAK;MACfC,OAAO,EAAC,eAAe;MACvBC,SAAS,EAAC,yBAAyB;MACnCC,OAAO,EAAG,CAAG;MAAAL,QAAA,gBAEb,IAAAzC,WAAA,CAAAuC,IAAA,EAACvD,WAAA,CAAA0D,oBAAM;QACNE,OAAO,EAAC,OAAO;QACfG,QAAQ,EAAG,KAAO;QAClBF,SAAS,EAAC,mBAAmB;QAAAJ,QAAA,GAE3BR,MAAM,iBAAI,IAAAjC,WAAA,CAAAgD,GAAA,EAACrD,gBAAA,CAAAY,OAAe;UAAC0C,KAAK,EAAGf;QAAa,CAAE,CAAC,eACrD,IAAAlC,WAAA,CAAAgD,GAAA,EAACzD,iBAAA,CAAA2D,aAAa,IAAE,CAAC;MAAA,CACV,CAAC,eACT,IAAAlD,WAAA,CAAAuC,IAAA,EAACvD,WAAA,CAAA0D,oBAAM;QACNI,OAAO,EAAG,CAAG;QACbC,QAAQ,EAAG,KAAO;QAClBI,KAAK,EAAG;UAAEC,UAAU,EAAE;QAAE,CAAG;QAAAX,QAAA,gBAE3B,IAAAzC,WAAA,CAAAgD,GAAA,EAAClD,oBAAA,CAAAS,OAAmB,IAAE,CAAC,EACrByB,MAAM;MAAA,CACD,CAAC;IAAA,CACF,CAAC,EACPI,eAAe,iBAChB,IAAApC,WAAA,CAAAgD,GAAA,EAACzD,iBAAA,CAAAgB,OAAgB;MAACsC,SAAS,EAAC;IAA8B,CAAE,CAC5D,eACD,IAAA7C,WAAA,CAAAgD,GAAA,EAACvD,gBAAA,CAAAc,OAAe,IAAE,CAAC,eACnB,IAAAP,WAAA,CAAAgD,GAAA,EAACtD,gBAAA,CAAAa,OAAe,IAAE,CAAC;EAAA,CAClB,CAAC;AAEL;AAEA,SAAS8C,SAASA,CAAU;EAC3BC,IAAI;EACJC,YAAY;EACZC,MAAM;EACNvB,MAAM,GAAG,IAAI;EACbC,WAAW,GAAGC,SAAS;EACvBsB,OAAO,GAAGhC,WAAW;EACrBiC,IAAI;EACJC,SAAS,GAAGtC,gBAAgB;EAC5BuC,YAAY;EACZC,SAAS,GAAG,KAAK;EACjBC,cAAc;EACdC,cAAc,EAAEC,sBAAsB;EACtCC,SAAS,EAAEC,iBAAiB;EAC5BC,iBAAiB;EACjBC,WAAW;EACXC,cAAc;EACdC,eAAe,GAAG9C,sBAAsB;EACxCQ,MAAM;EACNS,QAAQ;EACR8B,MAAM,GAAG;IAAEC,YAAY,EAAE,CAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG;EAAG,CAAC;EAC9CC;AACuB,CAAC,EAAG;EAC3B,MAAM;IAAEC;EAAsB,CAAC,GAAGZ,cAAc;EAChD,MAAMa,YAAY,GAAG,IAAAC,eAAM,EAA2B,IAAK,CAAC;EAC5D,MAAM,CAAEC,cAAc,EAAEC,iBAAiB,CAAE,GAAG,IAAAC,iBAAQ,EAAE,CAAE,CAAC;EAC3D,MAAMC,iBAAiB,GAAG,IAAAC,0BAAiB,EACxCC,qBAA0B,IAAM;IACjCJ,iBAAiB,CAChBI,qBAAqB,CAAE,CAAC,CAAE,CAACC,aAAa,CAAE,CAAC,CAAE,CAACC,UAC/C,CAAC;EACF,CAAC,EACD;IAAEC,GAAG,EAAE;EAAa,CACrB,CAAC;EACD,MAAM,CAAEC,cAAc,EAAEC,iBAAiB,CAAE,GAAG,IAAAR,iBAAQ,EAAc,EAAG,CAAC;EACxE,MAAMS,cAAc,GACnBtB,iBAAiB,KAAK/B,SAAS,IAAIgC,iBAAiB,KAAKhC,SAAS;EACnE,MAAM8B,SAAS,GAAGuB,cAAc,GAAGF,cAAc,GAAGpB,iBAAiB;EACrE,MAAM,CAAEuB,YAAY,EAAEC,eAAe,CAAE,GAAG,IAAAX,iBAAQ,EAAmB,IAAK,CAAC;EAC3E,SAASY,sBAAsBA,CAAEC,KAAyB,EAAG;IAC5D,MAAMC,QAAQ,GACb,OAAOD,KAAK,KAAK,UAAU,GAAGA,KAAK,CAAE3B,SAAU,CAAC,GAAG2B,KAAK;IACzD,IAAKJ,cAAc,EAAG;MACrBD,iBAAiB,CAAEM,QAAS,CAAC;IAC9B;IACA,IAAK1B,iBAAiB,EAAG;MACxBA,iBAAiB,CAAE0B,QAAS,CAAC;IAC9B;EACD;EACA,MAAMC,OAAO,GAAG,IAAAC,gBAAO,EAAE,MAAM,IAAAC,gCAAe,EAAExC,MAAO,CAAC,EAAE,CAAEA,MAAM,CAAG,CAAC;EACtE,MAAMyC,UAAU,GAAG,IAAAF,gBAAO,EAAE,MAAM;IACjC,OAAO9B,SAAS,CAACrC,MAAM,CAAIL,EAAE,IAC5BmC,IAAI,CAACwC,IAAI,CAAI5E,IAAI,IAAMqC,SAAS,CAAErC,IAAK,CAAC,KAAKC,EAAG,CACjD,CAAC;EACF,CAAC,EAAE,CAAE0C,SAAS,EAAEP,IAAI,EAAEC,SAAS,CAAG,CAAC;EAEnC,MAAMwC,OAAO,GAAG,IAAAC,4BAAU,EAAEN,OAAO,EAAExC,IAAK,CAAC;EAC3C,MAAM+C,yBAAyB,GAAG,IAAAN,gBAAO,EACxC,MACC,CAAEI,OAAO,IAAI,EAAE,EAAGD,IAAI,CACnBtE,MAAM,IAAMA,MAAM,CAAC0E,SAAS,IAAI1E,MAAM,CAAC2E,QAC1C,CAAC,EACF,CAAEJ,OAAO,CACV,CAAC;EACD,MAAM,CAAE/D,eAAe,EAAEoE,kBAAkB,CAAE,GAAG,IAAAzB,iBAAQ,EACvDsB,yBACD,CAAC;EAED,IAAAI,kBAAS,EAAE,MAAM;IAChB,IAAKJ,yBAAyB,IAAI,CAAEjE,eAAe,EAAG;MACrDoE,kBAAkB,CAAE,IAAK,CAAC;IAC3B;EACD,CAAC,EAAE,CAAEH,yBAAyB,EAAEjE,eAAe,CAAG,CAAC;;EAEnD;EACA,IAAAqE,kBAAS,EAAE,MAAM;IAChB,IAAK,CAAEnD,IAAI,CAACoD,qBAAqB,IAAI,CAAE/B,YAAY,CAACgC,OAAO,EAAG;MAC7D;IACD;IAEA,MAAMC,YAAY,GAAG,IAAAC,iBAAQ,EAAIC,KAAc,IAAM;MACpD,MAAMC,MAAM,GAAKD,KAAK,CAAYC,MAAqB;MACvD,MAAMC,SAAS,GAAGD,MAAM,CAACC,SAAS;MAClC,MAAMC,YAAY,GAAGF,MAAM,CAACE,YAAY;MACxC,MAAMC,YAAY,GAAGH,MAAM,CAACG,YAAY;;MAExC;MACA,IAAKF,SAAS,GAAGE,YAAY,IAAID,YAAY,GAAG,GAAG,EAAG;QACrDvC,qBAAqB,GAAG,CAAC;MAC1B;IACD,CAAC,EAAE,GAAI,CAAC,CAAC,CAAC;;IAEV,MAAMyC,SAAS,GAAGxC,YAAY,CAACgC,OAAO;IACtCQ,SAAS,CAACC,gBAAgB,CAAE,QAAQ,EAAER,YAAa,CAAC;IAEpD,OAAO,MAAM;MACZO,SAAS,CAACE,mBAAmB,CAAE,QAAQ,EAAET,YAAa,CAAC;MACvDA,YAAY,CAACU,MAAM,CAAC,CAAC,CAAC,CAAC;IACxB,CAAC;EACF,CAAC,EAAE,CAAE5C,qBAAqB,EAAEpB,IAAI,CAACoD,qBAAqB,CAAG,CAAC;;EAE1D;EACA,MAAM3C,cAAc,GAAG,IAAAgC,gBAAO,EAC7B,MACClF,MAAM,CAAC0G,WAAW,CACjB1G,MAAM,CAAC2G,OAAO,CAAExD,sBAAuB,CAAC,CAACpC,MAAM,CAC9C,CAAE,CAAE6F,UAAU,CAAE,KAAM;IACrB,OAAO/F,gBAAgB,CAACwE,IAAI,CACzBrE,UAAU,IAAMA,UAAU,CAAC6F,IAAI,KAAKD,UACvC,CAAC;EACF,CACD,CACD,CAAC,EACF,CAAEzD,sBAAsB,CACzB,CAAC;EAED,IAAK,CAAED,cAAc,CAAET,IAAI,CAACoE,IAAI,CAAE,EAAG;IACpC,OAAO,IAAI;EACZ;EAEA,oBACC,IAAA1H,WAAA,CAAAgD,GAAA,EAAC5D,iBAAA,CAAAmB,OAAgB,CAACoH,QAAQ;IACzB/B,KAAK,EAAG;MACPtC,IAAI;MACJC,YAAY;MACZC,MAAM,EAAEsC,OAAO;MACfrC,OAAO;MACPC,IAAI;MACJG,SAAS;MACTC,cAAc;MACdG,SAAS,EAAEgC,UAAU;MACrB9B,iBAAiB,EAAEwB,sBAAsB;MACzCF,YAAY;MACZC,eAAe;MACf/B,SAAS;MACTC,YAAY;MACZU,eAAe;MACfF,WAAW;MACXC,cAAc;MACdQ,cAAc;MACdF,YAAY;MACZK,iBAAiB;MACjBjB,cAAc;MACdoC,OAAO;MACP/D,eAAe;MACfoE,kBAAkB;MAClBjC,MAAM;MACNE,KAAK;MACLmD,wBAAwB,EAAE,CAAC,CAAElD;IAC9B,CAAG;IAAAjC,QAAA,eAEH,IAAAzC,WAAA,CAAAgD,GAAA;MAAKH,SAAS,EAAC,mBAAmB;MAACgF,GAAG,EAAGlD,YAAc;MAAAlC,QAAA,EACpDA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,gBACT,IAAAzC,WAAA,CAAAgD,GAAA,EAACjB,SAAS;QACTC,MAAM,EAAGA,MAAQ;QACjBC,MAAM,EAAGA,MAAQ;QACjBC,WAAW,EAAGA;MAAa,CAC3B;IAAC,CAEC;EAAC,CACoB,CAAC;AAE9B;;AAEA;AACA,MAAM4F,sBAAsB,GAAGzE,SAU9B;AAEDyE,sBAAsB,CAACC,iBAAiB,GAAGC,uCAAiB;AAC5DF,sBAAsB,CAACG,OAAO,GAAGC,yBAAgB;AACjDJ,sBAAsB,CAAC5E,aAAa,GAAGA,+BAAa;AACpD4E,sBAAsB,CAACK,MAAM,GAAGC,wBAAe;AAC/CN,sBAAsB,CAACO,cAAc,GAAGC,iCAAY;AACpDR,sBAAsB,CAACS,UAAU,GAAGC,wCAAmB;AACvDV,sBAAsB,CAACW,MAAM,GAAGC,wBAAe;AAC/CZ,sBAAsB,CAACa,UAAU,GAAGC,gDAA2B;AAC/Dd,sBAAsB,CAACe,MAAM,GAAGC,wBAAe;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAzI,OAAA,GAEjCuH,sBAAsB","ignoreList":[]}

package/build/components/dataviews-context/index.js

@@ -52,5 +52,6 @@ const DataViewsContext = (0, _element.createContext)({
     perPageSizes: []
   }
 });
+DataViewsContext.displayName = 'DataViewsContext';
 var _default = exports.default = DataViewsContext;
 //# sourceMappingURL=index.js.map

package/build/components/dataviews-context/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_constants","DataViewsContext","createContext","view","type","LAYOUT_TABLE","onChangeView","fields","data","paginationInfo","totalItems","totalPages","selection","onChangeSelection","setOpenedFilter","openedFilter","getItemId","item","id","isItemClickable","renderItemLink","undefined","containerWidth","containerRef","createRef","resizeObserverRef","defaultLayouts","list","grid","table","filters","isShowingFilter","setIsShowingFilter","hasInfiniteScrollHandler","config","perPageSizes","_default","exports","default"],"sources":["@wordpress/dataviews/src/components/dataviews-context/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ComponentProps, ReactElement, ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { createContext, createRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tView,\n\tAction,\n\tNormalizedField,\n\tSupportedLayouts,\n\tNormalizedFilter,\n} from '../../types';\nimport type { SetSelection } from '../../private-types';\nimport { LAYOUT_TABLE } from '../../constants';\n\ntype DataViewsContextType< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: NormalizedField< Item >[];\n\tactions?: Action< Item >[];\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t};\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\topenedFilter: string | null;\n\tsetOpenedFilter: ( openedFilter: string | null ) => void;\n\tgetItemId: ( item: Item ) => string;\n\tgetItemLevel?: ( item: Item ) => number;\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\tcontainerWidth: number;\n\tcontainerRef: React.MutableRefObject< HTMLDivElement | null >;\n\tresizeObserverRef:\n\t\t| ( ( element?: HTMLDivElement | null ) => void )\n\t\t| React.RefObject< HTMLDivElement >;\n\tdefaultLayouts: SupportedLayouts;\n\tfilters: NormalizedFilter[];\n\tisShowingFilter: boolean;\n\tsetIsShowingFilter: ( value: boolean ) => void;\n\tconfig: { perPageSizes: number[] };\n\tempty?: ReactNode;\n\thasInfiniteScrollHandler: boolean;\n};\n\nconst DataViewsContext = createContext< DataViewsContextType< any > >( {\n\tview: { type: LAYOUT_TABLE },\n\tonChangeView: () => {},\n\tfields: [],\n\tdata: [],\n\tpaginationInfo: {\n\t\ttotalItems: 0,\n\t\ttotalPages: 0,\n\t},\n\tselection: [],\n\tonChangeSelection: () => {},\n\tsetOpenedFilter: () => {},\n\topenedFilter: null,\n\tgetItemId: ( item ) => item.id,\n\tisItemClickable: () => true,\n\trenderItemLink: undefined,\n\tcontainerWidth: 0,\n\tcontainerRef: createRef(),\n\tresizeObserverRef: () => {},\n\tdefaultLayouts: { list: {}, grid: {}, table: {} },\n\tfilters: [],\n\tisShowingFilter: false,\n\tsetIsShowingFilter: () => {},\n\thasInfiniteScrollHandler: false,\n\tconfig: {\n\t\tperPageSizes: [],\n\t},\n} );\n\nexport default DataViewsContext;\n"],"mappings":";;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAaA,IAAAC,UAAA,GAAAD,OAAA;AArBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAiDA,MAAME,gBAAgB,GAAG,IAAAC,sBAAa,EAAiC;EACtEC,IAAI,EAAE;IAAEC,IAAI,EAAEC;EAAa,CAAC;EAC5BC,YAAY,EAAEA,CAAA,KAAM,CAAC,CAAC;EACtBC,MAAM,EAAE,EAAE;EACVC,IAAI,EAAE,EAAE;EACRC,cAAc,EAAE;IACfC,UAAU,EAAE,CAAC;IACbC,UAAU,EAAE;EACb,CAAC;EACDC,SAAS,EAAE,EAAE;EACbC,iBAAiB,EAAEA,CAAA,KAAM,CAAC,CAAC;EAC3BC,eAAe,EAAEA,CAAA,KAAM,CAAC,CAAC;EACzBC,YAAY,EAAE,IAAI;EAClBC,SAAS,EAAIC,IAAI,IAAMA,IAAI,CAACC,EAAE;EAC9BC,eAAe,EAAEA,CAAA,KAAM,IAAI;EAC3BC,cAAc,EAAEC,SAAS;EACzBC,cAAc,EAAE,CAAC;EACjBC,YAAY,EAAE,IAAAC,kBAAS,EAAC,CAAC;EACzBC,iBAAiB,EAAEA,CAAA,KAAM,CAAC,CAAC;EAC3BC,cAAc,EAAE;IAAEC,IAAI,EAAE,CAAC,CAAC;IAAEC,IAAI,EAAE,CAAC,CAAC;IAAEC,KAAK,EAAE,CAAC;EAAE,CAAC;EACjDC,OAAO,EAAE,EAAE;EACXC,eAAe,EAAE,KAAK;EACtBC,kBAAkB,EAAEA,CAAA,KAAM,CAAC,CAAC;EAC5BC,wBAAwB,EAAE,KAAK;EAC/BC,MAAM,EAAE;IACPC,YAAY,EAAE;EACf;AACD,CAAE,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEWrC,gBAAgB","ignoreList":[]}
+{"version":3,"names":["_element","require","_constants","DataViewsContext","createContext","view","type","LAYOUT_TABLE","onChangeView","fields","data","paginationInfo","totalItems","totalPages","selection","onChangeSelection","setOpenedFilter","openedFilter","getItemId","item","id","isItemClickable","renderItemLink","undefined","containerWidth","containerRef","createRef","resizeObserverRef","defaultLayouts","list","grid","table","filters","isShowingFilter","setIsShowingFilter","hasInfiniteScrollHandler","config","perPageSizes","displayName","_default","exports","default"],"sources":["@wordpress/dataviews/src/components/dataviews-context/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ComponentProps, ReactElement, ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { createContext, createRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tView,\n\tAction,\n\tNormalizedField,\n\tSupportedLayouts,\n\tNormalizedFilter,\n} from '../../types';\nimport type { SetSelection } from '../../private-types';\nimport { LAYOUT_TABLE } from '../../constants';\n\ntype DataViewsContextType< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: NormalizedField< Item >[];\n\tactions?: Action< Item >[];\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t};\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\topenedFilter: string | null;\n\tsetOpenedFilter: ( openedFilter: string | null ) => void;\n\tgetItemId: ( item: Item ) => string;\n\tgetItemLevel?: ( item: Item ) => number;\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\tcontainerWidth: number;\n\tcontainerRef: React.MutableRefObject< HTMLDivElement | null >;\n\tresizeObserverRef:\n\t\t| ( ( element?: HTMLDivElement | null ) => void )\n\t\t| React.RefObject< HTMLDivElement >;\n\tdefaultLayouts: SupportedLayouts;\n\tfilters: NormalizedFilter[];\n\tisShowingFilter: boolean;\n\tsetIsShowingFilter: ( value: boolean ) => void;\n\tconfig: { perPageSizes: number[] };\n\tempty?: ReactNode;\n\thasInfiniteScrollHandler: boolean;\n\titemListLabel?: string;\n};\n\nconst DataViewsContext = createContext< DataViewsContextType< any > >( {\n\tview: { type: LAYOUT_TABLE },\n\tonChangeView: () => {},\n\tfields: [],\n\tdata: [],\n\tpaginationInfo: {\n\t\ttotalItems: 0,\n\t\ttotalPages: 0,\n\t},\n\tselection: [],\n\tonChangeSelection: () => {},\n\tsetOpenedFilter: () => {},\n\topenedFilter: null,\n\tgetItemId: ( item ) => item.id,\n\tisItemClickable: () => true,\n\trenderItemLink: undefined,\n\tcontainerWidth: 0,\n\tcontainerRef: createRef(),\n\tresizeObserverRef: () => {},\n\tdefaultLayouts: { list: {}, grid: {}, table: {} },\n\tfilters: [],\n\tisShowingFilter: false,\n\tsetIsShowingFilter: () => {},\n\thasInfiniteScrollHandler: false,\n\tconfig: {\n\t\tperPageSizes: [],\n\t},\n} );\n\nDataViewsContext.displayName = 'DataViewsContext';\n\nexport default DataViewsContext;\n"],"mappings":";;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAaA,IAAAC,UAAA,GAAAD,OAAA;AArBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAkDA,MAAME,gBAAgB,GAAG,IAAAC,sBAAa,EAAiC;EACtEC,IAAI,EAAE;IAAEC,IAAI,EAAEC;EAAa,CAAC;EAC5BC,YAAY,EAAEA,CAAA,KAAM,CAAC,CAAC;EACtBC,MAAM,EAAE,EAAE;EACVC,IAAI,EAAE,EAAE;EACRC,cAAc,EAAE;IACfC,UAAU,EAAE,CAAC;IACbC,UAAU,EAAE;EACb,CAAC;EACDC,SAAS,EAAE,EAAE;EACbC,iBAAiB,EAAEA,CAAA,KAAM,CAAC,CAAC;EAC3BC,eAAe,EAAEA,CAAA,KAAM,CAAC,CAAC;EACzBC,YAAY,EAAE,IAAI;EAClBC,SAAS,EAAIC,IAAI,IAAMA,IAAI,CAACC,EAAE;EAC9BC,eAAe,EAAEA,CAAA,KAAM,IAAI;EAC3BC,cAAc,EAAEC,SAAS;EACzBC,cAAc,EAAE,CAAC;EACjBC,YAAY,EAAE,IAAAC,kBAAS,EAAC,CAAC;EACzBC,iBAAiB,EAAEA,CAAA,KAAM,CAAC,CAAC;EAC3BC,cAAc,EAAE;IAAEC,IAAI,EAAE,CAAC,CAAC;IAAEC,IAAI,EAAE,CAAC,CAAC;IAAEC,KAAK,EAAE,CAAC;EAAE,CAAC;EACjDC,OAAO,EAAE,EAAE;EACXC,eAAe,EAAE,KAAK;EACtBC,kBAAkB,EAAEA,CAAA,KAAM,CAAC,CAAC;EAC5BC,wBAAwB,EAAE,KAAK;EAC/BC,MAAM,EAAE;IACPC,YAAY,EAAE;EACf;AACD,CAAE,CAAC;AAEHlC,gBAAgB,CAACmC,WAAW,GAAG,kBAAkB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEnCtC,gBAAgB","ignoreList":[]}

package/build/components/dataviews-filters/input-widget.js

@@ -30,12 +30,54 @@ function InputWidget({
   fields
 }) {
   const currentFilter = view.filters?.find(f => f.field === filter.field);
-  const field = fields.find(f => f.id === filter.field);
   const currentValue = (0, _utils.getCurrentValue)(filter, currentFilter);
+
+  /*
+   * We are reusing the field.Edit component for filters. By doing so,
+   * we get for free a filter control specific to the field type
+   * and other aspects of the field API (Edit control configuration, etc.).
+   *
+   * This approach comes with an issue: the field.Edit controls work with getValue
+   * and setValue methods, which take an item (Item) as parameter. But, at this point,
+   * we don't have an item and we don't know how to create one, either.
+   *
+   * So, what we do is to prepare the data and the relevant field configuration
+   * as if Item was a plain object whose keys are the field ids:
+   *
+   * {
+   *   [ fieldOne.id ]: value,
+   *   [ fieldTwo.id ]: value,
+   * }
+   *
+   */
+  const field = (0, _element.useMemo)(() => {
+    const currentField = fields.find(f => f.id === filter.field);
+    if (currentField) {
+      return {
+        ...currentField,
+        // Deactivate validation for filters.
+        isValid: {
+          required: false,
+          custom: () => null
+        },
+        // Configure getValue/setValue as if Item was a plain object.
+        getValue: ({
+          item
+        }) => item[currentField.id],
+        setValue: ({
+          value
+        }) => ({
+          [currentField.id]: value
+        })
+      };
+    }
+    return currentField;
+  }, [fields, filter.field]);
   const data = (0, _element.useMemo)(() => {
     var _view$filters;
-    return ((_view$filters = view.filters) !== null && _view$filters !== void 0 ? _view$filters : []).reduce((acc, f) => {
-      acc[f.field] = f.value;
+    return ((_view$filters = view.filters) !== null && _view$filters !== void 0 ? _view$filters : []).reduce((acc, activeFilter) => {
+      // We can now assume the field is stored as a Item prop.
+      acc[activeFilter.field] = activeFilter.value;
       return acc;
     }, {});
   }, [view.filters]);
@@ -44,7 +86,9 @@ function InputWidget({
     if (!field || !currentFilter) {
       return;
     }
-    const nextValue = updatedData[field.id];
+    const nextValue = field.getValue({
+      item: updatedData
+    });
     if ((0, _es.default)(nextValue, currentValue)) {
       return;
     }

package/build/components/dataviews-filters/input-widget.js.map

@@ -1 +1 @@
-{"version":3,"names":["_es","_interopRequireDefault","require","_compose","_element","_components","_utils","_jsxRuntime","InputWidget","filter","view","onChangeView","fields","currentFilter","filters","find","f","field","id","currentValue","getCurrentValue","data","useMemo","_view$filters","reduce","acc","value","handleChange","useEvent","updatedData","_view$filters2","nextValue","fastDeepEqual","map","_filter","operator","operators","undefined","Edit","jsx","Flex","className","gap","direction","children","hideLabelFromVision","onChange"],"sources":["@wordpress/dataviews/src/components/dataviews-filters/input-widget.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6';\n\n/**\n * WordPress dependencies\n */\nimport { useEvent } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\nimport { Flex } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { View, NormalizedFilter, NormalizedField } from '../../types';\nimport { getCurrentValue } from './utils';\n\ninterface UserInputWidgetProps {\n\tview: View;\n\tfilter: NormalizedFilter;\n\tonChangeView: ( view: View ) => void;\n\tfields: NormalizedField< any >[];\n}\n\nexport default function InputWidget( {\n\tfilter,\n\tview,\n\tonChangeView,\n\tfields,\n}: UserInputWidgetProps ) {\n\tconst currentFilter = view.filters?.find(\n\t\t( f ) => f.field === filter.field\n\t);\n\n\tconst field = fields.find( ( f ) => f.id === filter.field );\n\tconst currentValue = getCurrentValue( filter, currentFilter );\n\tconst data = useMemo( () => {\n\t\treturn ( view.filters ?? [] ).reduce(\n\t\t\t( acc, f ) => {\n\t\t\t\tacc[ f.field ] = f.value;\n\t\t\t\treturn acc;\n\t\t\t},\n\t\t\t{} as Record< string, any >\n\t\t);\n\t}, [ view.filters ] );\n\n\tconst handleChange = useEvent( ( updatedData: Record< string, any > ) => {\n\t\tif ( ! field || ! currentFilter ) {\n\t\t\treturn;\n\t\t}\n\t\tconst nextValue = updatedData[ field.id ];\n\t\tif ( fastDeepEqual( nextValue, currentValue ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tonChangeView( {\n\t\t\t...view,\n\t\t\tfilters: ( view.filters ?? [] ).map( ( _filter ) =>\n\t\t\t\t_filter.field === filter.field\n\t\t\t\t\t? {\n\t\t\t\t\t\t\t..._filter,\n\t\t\t\t\t\t\toperator:\n\t\t\t\t\t\t\t\tcurrentFilter.operator || filter.operators[ 0 ],\n\t\t\t\t\t\t\t// Consider empty strings as undefined:\n\t\t\t\t\t\t\t//\n\t\t\t\t\t\t\t// - undefined as value means the filter is unset: the filter widget displays no value and the search returns all records\n\t\t\t\t\t\t\t// - empty string as value means \"search empty string\": returns only the records that have an empty string as value\n\t\t\t\t\t\t\t//\n\t\t\t\t\t\t\t// In practice, this means the filter will not be able to find an empty string as the value.\n\t\t\t\t\t\t\tvalue: nextValue === '' ? undefined : nextValue,\n\t\t\t\t\t  }\n\t\t\t\t\t: _filter\n\t\t\t),\n\t\t} );\n\t} );\n\n\tif ( ! field || ! field.Edit || ! currentFilter ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Flex\n\t\t\tclassName=\"dataviews-filters__user-input-widget\"\n\t\t\tgap={ 2.5 }\n\t\t\tdirection=\"column\"\n\t\t>\n\t\t\t<field.Edit\n\t\t\t\thideLabelFromVision\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\toperator={ currentFilter.operator }\n\t\t\t\tonChange={ handleChange }\n\t\t\t/>\n\t\t</Flex>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,GAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAMA,IAAAI,MAAA,GAAAJ,OAAA;AAA0C,IAAAK,WAAA,GAAAL,OAAA;AAhB1C;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;;AAWe,SAASM,WAAWA,CAAE;EACpCC,MAAM;EACNC,IAAI;EACJC,YAAY;EACZC;AACqB,CAAC,EAAG;EACzB,MAAMC,aAAa,GAAGH,IAAI,CAACI,OAAO,EAAEC,IAAI,CACrCC,CAAC,IAAMA,CAAC,CAACC,KAAK,KAAKR,MAAM,CAACQ,KAC7B,CAAC;EAED,MAAMA,KAAK,GAAGL,MAAM,CAACG,IAAI,CAAIC,CAAC,IAAMA,CAAC,CAACE,EAAE,KAAKT,MAAM,CAACQ,KAAM,CAAC;EAC3D,MAAME,YAAY,GAAG,IAAAC,sBAAe,EAAEX,MAAM,EAAEI,aAAc,CAAC;EAC7D,MAAMQ,IAAI,GAAG,IAAAC,gBAAO,EAAE,MAAM;IAAA,IAAAC,aAAA;IAC3B,OAAO,EAAAA,aAAA,GAAEb,IAAI,CAACI,OAAO,cAAAS,aAAA,cAAAA,aAAA,GAAI,EAAE,EAAGC,MAAM,CACnC,CAAEC,GAAG,EAAET,CAAC,KAAM;MACbS,GAAG,CAAET,CAAC,CAACC,KAAK,CAAE,GAAGD,CAAC,CAACU,KAAK;MACxB,OAAOD,GAAG;IACX,CAAC,EACD,CAAC,CACF,CAAC;EACF,CAAC,EAAE,CAAEf,IAAI,CAACI,OAAO,CAAG,CAAC;EAErB,MAAMa,YAAY,GAAG,IAAAC,iBAAQ,EAAIC,WAAkC,IAAM;IAAA,IAAAC,cAAA;IACxE,IAAK,CAAEb,KAAK,IAAI,CAAEJ,aAAa,EAAG;MACjC;IACD;IACA,MAAMkB,SAAS,GAAGF,WAAW,CAAEZ,KAAK,CAACC,EAAE,CAAE;IACzC,IAAK,IAAAc,WAAa,EAAED,SAAS,EAAEZ,YAAa,CAAC,EAAG;MAC/C;IACD;IAEAR,YAAY,CAAE;MACb,GAAGD,IAAI;MACPI,OAAO,EAAE,EAAAgB,cAAA,GAAEpB,IAAI,CAACI,OAAO,cAAAgB,cAAA,cAAAA,cAAA,GAAI,EAAE,EAAGG,GAAG,CAAIC,OAAO,IAC7CA,OAAO,CAACjB,KAAK,KAAKR,MAAM,CAACQ,KAAK,GAC3B;QACA,GAAGiB,OAAO;QACVC,QAAQ,EACPtB,aAAa,CAACsB,QAAQ,IAAI1B,MAAM,CAAC2B,SAAS,CAAE,CAAC,CAAE;QAChD;QACA;QACA;QACA;QACA;QACA;QACAV,KAAK,EAAEK,SAAS,KAAK,EAAE,GAAGM,SAAS,GAAGN;MACtC,CAAC,GACDG,OACJ;IACD,CAAE,CAAC;EACJ,CAAE,CAAC;EAEH,IAAK,CAAEjB,KAAK,IAAI,CAAEA,KAAK,CAACqB,IAAI,IAAI,CAAEzB,aAAa,EAAG;IACjD,OAAO,IAAI;EACZ;EAEA,oBACC,IAAAN,WAAA,CAAAgC,GAAA,EAAClC,WAAA,CAAAmC,IAAI;IACJC,SAAS,EAAC,sCAAsC;IAChDC,GAAG,EAAG,GAAK;IACXC,SAAS,EAAC,QAAQ;IAAAC,QAAA,eAElB,IAAArC,WAAA,CAAAgC,GAAA,EAACtB,KAAK,CAACqB,IAAI;MACVO,mBAAmB;MACnBxB,IAAI,EAAGA,IAAM;MACbJ,KAAK,EAAGA,KAAO;MACfkB,QAAQ,EAAGtB,aAAa,CAACsB,QAAU;MACnCW,QAAQ,EAAGnB;IAAc,CACzB;EAAC,CACG,CAAC;AAET","ignoreList":[]}
+{"version":3,"names":["_es","_interopRequireDefault","require","_compose","_element","_components","_utils","_jsxRuntime","InputWidget","filter","view","onChangeView","fields","currentFilter","filters","find","f","field","currentValue","getCurrentValue","useMemo","currentField","id","isValid","required","custom","getValue","item","setValue","value","data","_view$filters","reduce","acc","activeFilter","handleChange","useEvent","updatedData","_view$filters2","nextValue","fastDeepEqual","map","_filter","operator","operators","undefined","Edit","jsx","Flex","className","gap","direction","children","hideLabelFromVision","onChange"],"sources":["@wordpress/dataviews/src/components/dataviews-filters/input-widget.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6';\n\n/**\n * WordPress dependencies\n */\nimport { useEvent } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\nimport { Flex } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { View, NormalizedFilter, NormalizedField } from '../../types';\nimport { getCurrentValue } from './utils';\n\ninterface UserInputWidgetProps {\n\tview: View;\n\tfilter: NormalizedFilter;\n\tonChangeView: ( view: View ) => void;\n\tfields: NormalizedField< any >[];\n}\n\nexport default function InputWidget( {\n\tfilter,\n\tview,\n\tonChangeView,\n\tfields,\n}: UserInputWidgetProps ) {\n\tconst currentFilter = view.filters?.find(\n\t\t( f ) => f.field === filter.field\n\t);\n\tconst currentValue = getCurrentValue( filter, currentFilter );\n\n\t/*\n\t * We are reusing the field.Edit component for filters. By doing so,\n\t * we get for free a filter control specific to the field type\n\t * and other aspects of the field API (Edit control configuration, etc.).\n\t *\n\t * This approach comes with an issue: the field.Edit controls work with getValue\n\t * and setValue methods, which take an item (Item) as parameter. But, at this point,\n\t * we don't have an item and we don't know how to create one, either.\n\t *\n\t * So, what we do is to prepare the data and the relevant field configuration\n\t * as if Item was a plain object whose keys are the field ids:\n\t *\n\t * {\n\t *   [ fieldOne.id ]: value,\n\t *   [ fieldTwo.id ]: value,\n\t * }\n\t *\n\t */\n\tconst field = useMemo( () => {\n\t\tconst currentField = fields.find( ( f ) => f.id === filter.field );\n\t\tif ( currentField ) {\n\t\t\treturn {\n\t\t\t\t...currentField,\n\t\t\t\t// Deactivate validation for filters.\n\t\t\t\tisValid: {\n\t\t\t\t\trequired: false,\n\t\t\t\t\tcustom: () => null,\n\t\t\t\t},\n\t\t\t\t// Configure getValue/setValue as if Item was a plain object.\n\t\t\t\tgetValue: ( { item }: { item: any } ) =>\n\t\t\t\t\titem[ currentField.id ],\n\t\t\t\tsetValue: ( { value }: { value: any } ) => ( {\n\t\t\t\t\t[ currentField.id ]: value,\n\t\t\t\t} ),\n\t\t\t};\n\t\t}\n\t\treturn currentField;\n\t}, [ fields, filter.field ] );\n\n\tconst data = useMemo( () => {\n\t\treturn ( view.filters ?? [] ).reduce(\n\t\t\t( acc, activeFilter ) => {\n\t\t\t\t// We can now assume the field is stored as a Item prop.\n\t\t\t\tacc[ activeFilter.field ] = activeFilter.value;\n\t\t\t\treturn acc;\n\t\t\t},\n\t\t\t{} as Record< string, any >\n\t\t);\n\t}, [ view.filters ] );\n\n\tconst handleChange = useEvent( ( updatedData: Record< string, any > ) => {\n\t\tif ( ! field || ! currentFilter ) {\n\t\t\treturn;\n\t\t}\n\t\tconst nextValue = field.getValue( { item: updatedData } );\n\t\tif ( fastDeepEqual( nextValue, currentValue ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tonChangeView( {\n\t\t\t...view,\n\t\t\tfilters: ( view.filters ?? [] ).map( ( _filter ) =>\n\t\t\t\t_filter.field === filter.field\n\t\t\t\t\t? {\n\t\t\t\t\t\t\t..._filter,\n\t\t\t\t\t\t\toperator:\n\t\t\t\t\t\t\t\tcurrentFilter.operator || filter.operators[ 0 ],\n\t\t\t\t\t\t\t// Consider empty strings as undefined:\n\t\t\t\t\t\t\t//\n\t\t\t\t\t\t\t// - undefined as value means the filter is unset: the filter widget displays no value and the search returns all records\n\t\t\t\t\t\t\t// - empty string as value means \"search empty string\": returns only the records that have an empty string as value\n\t\t\t\t\t\t\t//\n\t\t\t\t\t\t\t// In practice, this means the filter will not be able to find an empty string as the value.\n\t\t\t\t\t\t\tvalue: nextValue === '' ? undefined : nextValue,\n\t\t\t\t\t  }\n\t\t\t\t\t: _filter\n\t\t\t),\n\t\t} );\n\t} );\n\n\tif ( ! field || ! field.Edit || ! currentFilter ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Flex\n\t\t\tclassName=\"dataviews-filters__user-input-widget\"\n\t\t\tgap={ 2.5 }\n\t\t\tdirection=\"column\"\n\t\t>\n\t\t\t<field.Edit\n\t\t\t\thideLabelFromVision\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\toperator={ currentFilter.operator }\n\t\t\t\tonChange={ handleChange }\n\t\t\t/>\n\t\t</Flex>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/components/dataviews-layout/index.js

@@ -40,9 +40,12 @@ function DataViewsLayout({
     onClickItem,
     isItemClickable,
     renderItemLink,
-    empty = (0, _i18n.__)('No results')
+    defaultLayouts,
+    empty = /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+      children: (0, _i18n.__)('No results')
+    })
   } = (0, _element.useContext)(_dataviewsContext.default);
-  const ViewComponent = _dataviewsLayouts.VIEW_LAYOUTS.find(v => v.type === view.type)?.component;
+  const ViewComponent = _dataviewsLayouts.VIEW_LAYOUTS.find(v => v.type === view.type && defaultLayouts[v.type])?.component;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(ViewComponent, {
     className: className,
     actions: actions,