@wordpress/dataviews 6.0.0 → 7.0.0

package/build-module/normalize-form-fields.js

@@ -2,28 +2,65 @@
  * Internal dependencies
  */
 
-export default function normalizeFormFields(form) {
-  var _form$type, _form$labelPosition, _form$fields;
-  let layout = 'regular';
-  if (['regular', 'panel'].includes((_form$type = form.type) !== null && _form$type !== void 0 ? _form$type : '')) {
-    layout = form.type;
+export const DEFAULT_LAYOUT = {
+  type: 'regular',
+  labelPosition: 'top'
+};
+
+/**
+ * Normalizes a layout configuration based on its type.
+ *
+ * @param layout The layout object to normalize.
+ * @return The normalized layout object.
+ */
+export function normalizeLayout(layout) {
+  let normalizedLayout = DEFAULT_LAYOUT;
+  if (layout?.type === 'regular') {
+    var _layout$labelPosition;
+    normalizedLayout = {
+      type: 'regular',
+      labelPosition: (_layout$labelPosition = layout?.labelPosition) !== null && _layout$labelPosition !== void 0 ? _layout$labelPosition : 'top'
+    };
+  } else if (layout?.type === 'panel') {
+    var _layout$labelPosition2, _layout$openAs;
+    normalizedLayout = {
+      type: 'panel',
+      labelPosition: (_layout$labelPosition2 = layout?.labelPosition) !== null && _layout$labelPosition2 !== void 0 ? _layout$labelPosition2 : 'side',
+      openAs: (_layout$openAs = layout?.openAs) !== null && _layout$openAs !== void 0 ? _layout$openAs : 'dropdown'
+    };
+  } else if (layout?.type === 'card') {
+    if (layout.withHeader === false) {
+      // Don't let isOpened be false if withHeader is false.
+      // Otherwise, the card will not be visible.
+      normalizedLayout = {
+        type: 'card',
+        withHeader: false,
+        isOpened: true
+      };
+    } else {
+      normalizedLayout = {
+        type: 'card',
+        withHeader: true,
+        isOpened: typeof layout.isOpened === 'boolean' ? layout.isOpened : true
+      };
+    }
   }
-  const labelPosition = (_form$labelPosition = form.labelPosition) !== null && _form$labelPosition !== void 0 ? _form$labelPosition : layout === 'regular' ? 'top' : 'side';
+  return normalizedLayout;
+}
+export default function normalizeFormFields(form) {
+  var _form$fields;
+  const formLayout = normalizeLayout(form?.layout);
   return ((_form$fields = form.fields) !== null && _form$fields !== void 0 ? _form$fields : []).map(field => {
-    var _field$layout, _field$labelPosition;
     if (typeof field === 'string') {
       return {
         id: field,
-        layout,
-        labelPosition
+        layout: formLayout
       };
     }
-    const fieldLayout = (_field$layout = field.layout) !== null && _field$layout !== void 0 ? _field$layout : layout;
-    const fieldLabelPosition = (_field$labelPosition = field.labelPosition) !== null && _field$labelPosition !== void 0 ? _field$labelPosition : fieldLayout === 'regular' ? 'top' : 'side';
+    const fieldLayout = field.layout ? normalizeLayout(field.layout) : formLayout;
     return {
       ...field,
-      layout: fieldLayout,
-      labelPosition: fieldLabelPosition
+      layout: fieldLayout
     };
   });
 }

package/build-module/normalize-form-fields.js.map

@@ -1 +1 @@
-{"version":3,"names":["normalizeFormFields","form","_form$type","_form$labelPosition","_form$fields","layout","includes","type","labelPosition","fields","map","field","_field$layout","_field$labelPosition","id","fieldLayout","fieldLabelPosition"],"sources":["@wordpress/dataviews/src/normalize-form-fields.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { Form } from './types';\n\ninterface NormalizedFormField {\n\tid: string;\n\tlayout: 'regular' | 'panel';\n\tlabelPosition: 'side' | 'top' | 'none';\n}\n\nexport default function normalizeFormFields(\n\tform: Form\n): NormalizedFormField[] {\n\tlet layout: 'regular' | 'panel' = 'regular';\n\tif ( [ 'regular', 'panel' ].includes( form.type ?? '' ) ) {\n\t\tlayout = form.type as 'regular' | 'panel';\n\t}\n\n\tconst labelPosition =\n\t\tform.labelPosition ?? ( layout === 'regular' ? 'top' : 'side' );\n\n\treturn ( form.fields ?? [] ).map( ( field ) => {\n\t\tif ( typeof field === 'string' ) {\n\t\t\treturn {\n\t\t\t\tid: field,\n\t\t\t\tlayout,\n\t\t\t\tlabelPosition,\n\t\t\t};\n\t\t}\n\n\t\tconst fieldLayout = field.layout ?? layout;\n\t\tconst fieldLabelPosition =\n\t\t\tfield.labelPosition ??\n\t\t\t( fieldLayout === 'regular' ? 'top' : 'side' );\n\t\treturn {\n\t\t\t...field,\n\t\t\tlayout: fieldLayout,\n\t\t\tlabelPosition: fieldLabelPosition,\n\t\t};\n\t} );\n}\n"],"mappings":"AAAA;AACA;AACA;;AASA,eAAe,SAASA,mBAAmBA,CAC1CC,IAAU,EACc;EAAA,IAAAC,UAAA,EAAAC,mBAAA,EAAAC,YAAA;EACxB,IAAIC,MAA2B,GAAG,SAAS;EAC3C,IAAK,CAAE,SAAS,EAAE,OAAO,CAAE,CAACC,QAAQ,EAAAJ,UAAA,GAAED,IAAI,CAACM,IAAI,cAAAL,UAAA,cAAAA,UAAA,GAAI,EAAG,CAAC,EAAG;IACzDG,MAAM,GAAGJ,IAAI,CAACM,IAA2B;EAC1C;EAEA,MAAMC,aAAa,IAAAL,mBAAA,GAClBF,IAAI,CAACO,aAAa,cAAAL,mBAAA,cAAAA,mBAAA,GAAME,MAAM,KAAK,SAAS,GAAG,KAAK,GAAG,MAAQ;EAEhE,OAAO,EAAAD,YAAA,GAAEH,IAAI,CAACQ,MAAM,cAAAL,YAAA,cAAAA,YAAA,GAAI,EAAE,EAAGM,GAAG,CAAIC,KAAK,IAAM;IAAA,IAAAC,aAAA,EAAAC,oBAAA;IAC9C,IAAK,OAAOF,KAAK,KAAK,QAAQ,EAAG;MAChC,OAAO;QACNG,EAAE,EAAEH,KAAK;QACTN,MAAM;QACNG;MACD,CAAC;IACF;IAEA,MAAMO,WAAW,IAAAH,aAAA,GAAGD,KAAK,CAACN,MAAM,cAAAO,aAAA,cAAAA,aAAA,GAAIP,MAAM;IAC1C,MAAMW,kBAAkB,IAAAH,oBAAA,GACvBF,KAAK,CAACH,aAAa,cAAAK,oBAAA,cAAAA,oBAAA,GACjBE,WAAW,KAAK,SAAS,GAAG,KAAK,GAAG,MAAQ;IAC/C,OAAO;MACN,GAAGJ,KAAK;MACRN,MAAM,EAAEU,WAAW;MACnBP,aAAa,EAAEQ;IAChB,CAAC;EACF,CAAE,CAAC;AACJ","ignoreList":[]}
+{"version":3,"names":["DEFAULT_LAYOUT","type","labelPosition","normalizeLayout","layout","normalizedLayout","_layout$labelPosition","_layout$labelPosition2","_layout$openAs","openAs","withHeader","isOpened","normalizeFormFields","form","_form$fields","formLayout","fields","map","field","id","fieldLayout"],"sources":["@wordpress/dataviews/src/normalize-form-fields.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type {\n\tForm,\n\tLayout,\n\tNormalizedLayout,\n\tNormalizedRegularLayout,\n\tNormalizedPanelLayout,\n\tNormalizedCardLayout,\n} from './types';\n\ninterface NormalizedFormField {\n\tid: string;\n\tlayout: Layout;\n}\n\nexport const DEFAULT_LAYOUT: NormalizedLayout = {\n\ttype: 'regular',\n\tlabelPosition: 'top',\n};\n\n/**\n * Normalizes a layout configuration based on its type.\n *\n * @param layout The layout object to normalize.\n * @return The normalized layout object.\n */\nexport function normalizeLayout( layout?: Layout ): NormalizedLayout {\n\tlet normalizedLayout = DEFAULT_LAYOUT;\n\n\tif ( layout?.type === 'regular' ) {\n\t\tnormalizedLayout = {\n\t\t\ttype: 'regular',\n\t\t\tlabelPosition: layout?.labelPosition ?? 'top',\n\t\t} satisfies NormalizedRegularLayout;\n\t} else if ( layout?.type === 'panel' ) {\n\t\tnormalizedLayout = {\n\t\t\ttype: 'panel',\n\t\t\tlabelPosition: layout?.labelPosition ?? 'side',\n\t\t\topenAs: layout?.openAs ?? 'dropdown',\n\t\t} satisfies NormalizedPanelLayout;\n\t} else if ( layout?.type === 'card' ) {\n\t\tif ( layout.withHeader === false ) {\n\t\t\t// Don't let isOpened be false if withHeader is false.\n\t\t\t// Otherwise, the card will not be visible.\n\t\t\tnormalizedLayout = {\n\t\t\t\ttype: 'card',\n\t\t\t\twithHeader: false,\n\t\t\t\tisOpened: true,\n\t\t\t} satisfies NormalizedCardLayout;\n\t\t} else {\n\t\t\tnormalizedLayout = {\n\t\t\t\ttype: 'card',\n\t\t\t\twithHeader: true,\n\t\t\t\tisOpened:\n\t\t\t\t\ttypeof layout.isOpened === 'boolean'\n\t\t\t\t\t\t? layout.isOpened\n\t\t\t\t\t\t: true,\n\t\t\t} satisfies NormalizedCardLayout;\n\t\t}\n\t}\n\n\treturn normalizedLayout;\n}\n\nexport default function normalizeFormFields(\n\tform: Form\n): NormalizedFormField[] {\n\tconst formLayout = normalizeLayout( form?.layout );\n\n\treturn ( form.fields ?? [] ).map( ( field ) => {\n\t\tif ( typeof field === 'string' ) {\n\t\t\treturn {\n\t\t\t\tid: field,\n\t\t\t\tlayout: formLayout,\n\t\t\t};\n\t\t}\n\n\t\tconst fieldLayout = field.layout\n\t\t\t? normalizeLayout( field.layout )\n\t\t\t: formLayout;\n\t\treturn {\n\t\t\t...field,\n\t\t\tlayout: fieldLayout,\n\t\t};\n\t} );\n}\n"],"mappings":"AAAA;AACA;AACA;;AAeA,OAAO,MAAMA,cAAgC,GAAG;EAC/CC,IAAI,EAAE,SAAS;EACfC,aAAa,EAAE;AAChB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,eAAeA,CAAEC,MAAe,EAAqB;EACpE,IAAIC,gBAAgB,GAAGL,cAAc;EAErC,IAAKI,MAAM,EAAEH,IAAI,KAAK,SAAS,EAAG;IAAA,IAAAK,qBAAA;IACjCD,gBAAgB,GAAG;MAClBJ,IAAI,EAAE,SAAS;MACfC,aAAa,GAAAI,qBAAA,GAAEF,MAAM,EAAEF,aAAa,cAAAI,qBAAA,cAAAA,qBAAA,GAAI;IACzC,CAAmC;EACpC,CAAC,MAAM,IAAKF,MAAM,EAAEH,IAAI,KAAK,OAAO,EAAG;IAAA,IAAAM,sBAAA,EAAAC,cAAA;IACtCH,gBAAgB,GAAG;MAClBJ,IAAI,EAAE,OAAO;MACbC,aAAa,GAAAK,sBAAA,GAAEH,MAAM,EAAEF,aAAa,cAAAK,sBAAA,cAAAA,sBAAA,GAAI,MAAM;MAC9CE,MAAM,GAAAD,cAAA,GAAEJ,MAAM,EAAEK,MAAM,cAAAD,cAAA,cAAAA,cAAA,GAAI;IAC3B,CAAiC;EAClC,CAAC,MAAM,IAAKJ,MAAM,EAAEH,IAAI,KAAK,MAAM,EAAG;IACrC,IAAKG,MAAM,CAACM,UAAU,KAAK,KAAK,EAAG;MAClC;MACA;MACAL,gBAAgB,GAAG;QAClBJ,IAAI,EAAE,MAAM;QACZS,UAAU,EAAE,KAAK;QACjBC,QAAQ,EAAE;MACX,CAAgC;IACjC,CAAC,MAAM;MACNN,gBAAgB,GAAG;QAClBJ,IAAI,EAAE,MAAM;QACZS,UAAU,EAAE,IAAI;QAChBC,QAAQ,EACP,OAAOP,MAAM,CAACO,QAAQ,KAAK,SAAS,GACjCP,MAAM,CAACO,QAAQ,GACf;MACL,CAAgC;IACjC;EACD;EAEA,OAAON,gBAAgB;AACxB;AAEA,eAAe,SAASO,mBAAmBA,CAC1CC,IAAU,EACc;EAAA,IAAAC,YAAA;EACxB,MAAMC,UAAU,GAAGZ,eAAe,CAAEU,IAAI,EAAET,MAAO,CAAC;EAElD,OAAO,EAAAU,YAAA,GAAED,IAAI,CAACG,MAAM,cAAAF,YAAA,cAAAA,YAAA,GAAI,EAAE,EAAGG,GAAG,CAAIC,KAAK,IAAM;IAC9C,IAAK,OAAOA,KAAK,KAAK,QAAQ,EAAG;MAChC,OAAO;QACNC,EAAE,EAAED,KAAK;QACTd,MAAM,EAAEW;MACT,CAAC;IACF;IAEA,MAAMK,WAAW,GAAGF,KAAK,CAACd,MAAM,GAC7BD,eAAe,CAAEe,KAAK,CAACd,MAAO,CAAC,GAC/BW,UAAU;IACb,OAAO;MACN,GAAGG,KAAK;MACRd,MAAM,EAAEgB;IACT,CAAC;EACF,CAAE,CAAC;AACJ","ignoreList":[]}

package/build-module/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/dataviews/src/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tReactElement,\n\tReactNode,\n\tComponentType,\n\tComponentProps,\n} from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { SetSelection } from './private-types';\n\n/**\n * WordPress dependencies\n */\nimport type { useFocusOnMount } from '@wordpress/compose';\n\nexport type SortDirection = 'asc' | 'desc';\n\n/**\n * Generic option type.\n */\nexport interface Option< Value extends any = any > {\n\tvalue: Value;\n\tlabel: string;\n\tdescription?: string;\n}\n\nexport interface FilterByConfig {\n\t/**\n\t * The list of operators supported by the field.\n\t */\n\toperators?: Operator[];\n\n\t/**\n\t * Whether it is a primary filter.\n\t *\n\t * A primary filter is always visible and is not listed in the \"Add filter\" component,\n\t * except for the list layout where it behaves like a secondary filter.\n\t */\n\tisPrimary?: boolean;\n}\n\nexport interface NormalizedFilterByConfig {\n\t/**\n\t * The list of operators supported by the field.\n\t */\n\toperators: Operator[];\n\n\t/**\n\t * Whether it is a primary filter.\n\t *\n\t * A primary filter is always visible and is not listed in the \"Add filter\" component,\n\t * except for the list layout where it behaves like a secondary filter.\n\t */\n\tisPrimary?: boolean;\n}\n\ninterface FilterConfigForType {\n\t/**\n\t * What operators are used by default.\n\t */\n\tdefaultOperators: Operator[];\n\n\t/**\n\t * What operators are supported by the field.\n\t */\n\tvalidOperators: Operator[];\n}\n\nexport type Operator =\n\t| 'is'\n\t| 'isNot'\n\t| 'isAny'\n\t| 'isNone'\n\t| 'isAll'\n\t| 'isNotAll'\n\t| 'lessThan'\n\t| 'greaterThan'\n\t| 'lessThanOrEqual'\n\t| 'greaterThanOrEqual'\n\t| 'before'\n\t| 'after'\n\t| 'beforeInc'\n\t| 'afterInc'\n\t| 'contains'\n\t| 'notContains'\n\t| 'startsWith'\n\t| 'between'\n\t| 'on'\n\t| 'notOn'\n\t| 'inThePast'\n\t| 'over';\n\nexport type FieldType =\n\t| 'text'\n\t| 'integer'\n\t| 'datetime'\n\t| 'date'\n\t| 'media'\n\t| 'boolean'\n\t| 'email'\n\t| 'array';\n\n/**\n * An abstract interface for Field based on the field type.\n */\nexport type FieldTypeDefinition< Item > = {\n\t/**\n\t * Callback used to sort the field.\n\t */\n\tsort: ( a: Item, b: Item, direction: SortDirection ) => number;\n\n\t/**\n\t * Callback used to validate the field.\n\t */\n\tisValid: Rules< Item >;\n\n\t/**\n\t * Callback used to render an edit control for the field or control name.\n\t */\n\tEdit: ComponentType< DataFormControlProps< Item > > | string | null;\n\n\t/**\n\t * Callback used to render the field.\n\t */\n\trender: ComponentType< DataViewRenderFieldProps< Item > >;\n\n\t/**\n\t * The filter config for the field.\n\t */\n\tfilterBy: FilterConfigForType | false;\n\n\t/**\n\t * Whether the field is readOnly.\n\t * If `true`, the value will be rendered using the `render` callback.\n\t */\n\treadOnly?: boolean;\n\n\t/**\n\t * Whether the field is sortable.\n\t */\n\tenableSorting: boolean;\n};\n\nexport type Rules< Item > = {\n\trequired?: boolean;\n\tcustom?: ( item: Item, field: NormalizedField< Item > ) => null | string;\n};\n\n/**\n * A dataview field for a specific property of a data type.\n */\nexport type Field< Item > = {\n\t/**\n\t * Type of the fields.\n\t */\n\ttype?: FieldType;\n\n\t/**\n\t * The unique identifier of the field.\n\t */\n\tid: string;\n\n\t/**\n\t * The label of the field. Defaults to the id.\n\t */\n\tlabel?: string;\n\n\t/**\n\t * The header of the field. Defaults to the label.\n\t * It allows the usage of a React Element to render the field labels.\n\t */\n\theader?: string | ReactElement;\n\n\t/**\n\t * A description of the field.\n\t */\n\tdescription?: string;\n\n\t/**\n\t * Placeholder for the field.\n\t */\n\tplaceholder?: string;\n\n\t/**\n\t * Callback used to render the field. Defaults to `field.getValue`.\n\t */\n\trender?: ComponentType< DataViewRenderFieldProps< Item > >;\n\n\t/**\n\t * Callback used to render an edit control for the field.\n\t */\n\tEdit?: ComponentType< DataFormControlProps< Item > > | string;\n\n\t/**\n\t * Callback used to sort the field.\n\t */\n\tsort?: ( a: Item, b: Item, direction: SortDirection ) => number;\n\n\t/**\n\t * Callback used to validate the field.\n\t */\n\tisValid?: Rules< Item >;\n\n\t/**\n\t * Callback used to decide if a field should be displayed.\n\t */\n\tisVisible?: ( item: Item ) => boolean;\n\n\t/**\n\t * Whether the field is sortable.\n\t */\n\tenableSorting?: boolean;\n\n\t/**\n\t * Whether the field is searchable.\n\t */\n\tenableGlobalSearch?: boolean;\n\n\t/**\n\t * Whether the field is filterable.\n\t */\n\tenableHiding?: boolean;\n\n\t/**\n\t * The list of options to pick from when using the field as a filter.\n\t */\n\telements?: Option[];\n\n\t/**\n\t * Filter config for the field.\n\t */\n\tfilterBy?: FilterByConfig | false;\n\n\t/**\n\t * Whether the field is readOnly.\n\t * If `true`, the value will be rendered using the `render` callback.\n\t */\n\treadOnly?: boolean;\n\n\t/**\n\t * Callback used to retrieve the value of the field from the item.\n\t * Defaults to `item[ field.id ]`.\n\t */\n\tgetValue?: ( args: { item: Item } ) => any;\n};\n\nexport type NormalizedField< Item > = Omit< Field< Item >, 'Edit' > & {\n\tlabel: string;\n\theader: string | ReactElement;\n\tgetValue: ( args: { item: Item } ) => any;\n\trender: ComponentType< DataViewRenderFieldProps< Item > >;\n\tEdit: ComponentType< DataFormControlProps< Item > > | null;\n\tsort: ( a: Item, b: Item, direction: SortDirection ) => number;\n\tisValid: Rules< Item >;\n\tenableHiding: boolean;\n\tenableSorting: boolean;\n\tfilterBy: NormalizedFilterByConfig | false;\n\treadOnly: boolean;\n};\n\n/**\n * A collection of dataview fields for a data type.\n */\nexport type Fields< Item > = Field< Item >[];\n\nexport type Data< Item > = Item[];\n\nexport type DataFormControlProps< Item > = {\n\tdata: Item;\n\tfield: NormalizedField< Item >;\n\tonChange: ( value: Record< string, any > ) => void;\n\thideLabelFromVision?: boolean;\n\t/**\n\t * The currently selected filter operator for this field.\n\t *\n\t * Used by DataViews filters to determine which control to render based on the operator type.\n\t */\n\toperator?: Operator;\n};\n\nexport type DataViewRenderFieldProps< Item > = {\n\titem: Item;\n\tfield: NormalizedField< Item >;\n\tconfig?: {\n\t\tsizes: string;\n\t};\n};\n\n/**\n * The filters applied to the dataset.\n */\nexport interface Filter {\n\t/**\n\t * The field to filter by.\n\t */\n\tfield: string;\n\n\t/**\n\t * The operator to use.\n\t */\n\toperator: Operator;\n\n\t/**\n\t * The value to filter by.\n\t */\n\tvalue: any;\n\n\t/**\n\t * Whether the filter can be edited by the user.\n\t */\n\tisLocked?: boolean;\n}\n\nexport interface NormalizedFilter {\n\t/**\n\t * The field to filter by.\n\t */\n\tfield: string;\n\n\t/**\n\t * The field name.\n\t */\n\tname: string;\n\n\t/**\n\t * The list of options to pick from when using the field as a filter.\n\t */\n\telements: Option[];\n\n\t/**\n\t * Is a single selection filter.\n\t */\n\tsingleSelection: boolean;\n\n\t/**\n\t * The list of operators supported by the field.\n\t */\n\toperators: Operator[];\n\n\t/**\n\t * Whether the filter is visible.\n\t */\n\tisVisible: boolean;\n\n\t/**\n\t * Whether it is a primary filter.\n\t */\n\tisPrimary: boolean;\n\n\t/**\n\t * Whether the filter can be edited by the user.\n\t */\n\tisLocked: boolean;\n}\n\ninterface ViewBase {\n\t/**\n\t * The layout of the view.\n\t */\n\ttype: string;\n\n\t/**\n\t * The global search term.\n\t */\n\tsearch?: string;\n\n\t/**\n\t * The filters to apply.\n\t */\n\tfilters?: Filter[];\n\n\t/**\n\t * The sorting configuration.\n\t */\n\tsort?: {\n\t\t/**\n\t\t * The field to sort by.\n\t\t */\n\t\tfield: string;\n\n\t\t/**\n\t\t * The direction to sort by.\n\t\t */\n\t\tdirection: SortDirection;\n\t};\n\n\t/**\n\t * The active page\n\t */\n\tpage?: number;\n\n\t/**\n\t * The number of items per page\n\t */\n\tperPage?: number;\n\n\t/**\n\t * The fields to render\n\t */\n\tfields?: string[];\n\n\t/**\n\t * Title field\n\t */\n\ttitleField?: string;\n\n\t/**\n\t * Media field\n\t */\n\tmediaField?: string;\n\n\t/**\n\t * Description field\n\t */\n\tdescriptionField?: string;\n\n\t/**\n\t * Whether to show the title\n\t */\n\tshowTitle?: boolean;\n\n\t/**\n\t * Whether to show the media\n\t */\n\tshowMedia?: boolean;\n\n\t/**\n\t * Whether to show the description\n\t */\n\tshowDescription?: boolean;\n\n\t/**\n\t * Whether to show the hierarchical levels.\n\t */\n\tshowLevels?: boolean;\n\n\t/**\n\t * The field to group by.\n\t */\n\tgroupByField?: string;\n}\n\nexport interface ColumnStyle {\n\t/**\n\t * The width of the field column.\n\t */\n\twidth?: string | number;\n\n\t/**\n\t * The minimum width of the field column.\n\t */\n\tmaxWidth?: string | number;\n\n\t/**\n\t * The maximum width of the field column.\n\t */\n\tminWidth?: string | number;\n\n\t/**\n\t * The alignment of the field column, defaults to left.\n\t */\n\talign?: 'start' | 'center' | 'end';\n}\n\nexport type Density = 'compact' | 'balanced' | 'comfortable';\n\nexport interface ViewTable extends ViewBase {\n\ttype: 'table';\n\n\tlayout?: {\n\t\t/**\n\t\t * The styles for the columns.\n\t\t */\n\t\tstyles?: Record< string, ColumnStyle >;\n\n\t\t/**\n\t\t * The density of the view.\n\t\t */\n\t\tdensity?: Density;\n\t};\n}\n\nexport interface ViewList extends ViewBase {\n\ttype: 'list';\n}\n\nexport interface ViewGrid extends ViewBase {\n\ttype: 'grid';\n\n\tlayout?: {\n\t\t/**\n\t\t * The fields to use as badge fields.\n\t\t */\n\t\tbadgeFields?: string[];\n\n\t\t/**\n\t\t * The preview size of the grid.\n\t\t */\n\t\tpreviewSize?: number;\n\t};\n}\n\nexport type View = ViewList | ViewGrid | ViewTable;\n\ninterface ActionBase< Item > {\n\t/**\n\t * The unique identifier of the action.\n\t */\n\tid: string;\n\n\t/**\n\t * The label of the action.\n\t * In case we want to adjust the label based on the selected items,\n\t * a function can be provided.\n\t */\n\tlabel: string | ( ( items: Item[] ) => string );\n\n\t/**\n\t * The icon of the action. (Either a string or an SVG element)\n\t * This should be IconType from the components package\n\t * but that import is breaking typescript build for the moment.\n\t */\n\ticon?: any;\n\n\t/**\n\t * Whether the action is disabled.\n\t */\n\tdisabled?: boolean;\n\n\t/**\n\t * Whether the action is destructive.\n\t */\n\tisDestructive?: boolean;\n\n\t/**\n\t * Whether the action is a primary action.\n\t */\n\tisPrimary?: boolean;\n\n\t/**\n\t * Whether the item passed as an argument supports the current action.\n\t */\n\tisEligible?: ( item: Item ) => boolean;\n\n\t/**\n\t * Whether the action can be used as a bulk action.\n\t */\n\tsupportsBulk?: boolean;\n\n\t/**\n\t * The context in which the action is visible.\n\t * This is only a \"meta\" information for now.\n\t */\n\tcontext?: 'list' | 'single';\n}\n\nexport interface RenderModalProps< Item > {\n\titems: Item[];\n\tcloseModal?: () => void;\n\tonActionPerformed?: ( items: Item[] ) => void;\n}\n\nexport interface ActionModal< Item > extends ActionBase< Item > {\n\t/**\n\t * Modal to render when the action is triggered.\n\t */\n\tRenderModal: ( {\n\t\titems,\n\t\tcloseModal,\n\t\tonActionPerformed,\n\t}: RenderModalProps< Item > ) => ReactElement;\n\n\t/**\n\t * Whether to hide the modal header.\n\t */\n\thideModalHeader?: boolean;\n\n\t/**\n\t * The header of the modal.\n\t */\n\tmodalHeader?: string;\n\n\t/**\n\t * The size of the modal.\n\t *\n\t * @default 'medium'\n\t */\n\tmodalSize?: 'small' | 'medium' | 'large' | 'fill';\n\n\t/**\n\t * The focus on mount property of the modal.\n\t */\n\tmodalFocusOnMount?:\n\t\t| Parameters< typeof useFocusOnMount >[ 0 ]\n\t\t| 'firstContentElement';\n}\n\nexport interface ActionButton< Item > extends ActionBase< Item > {\n\t/**\n\t * The callback to execute when the action is triggered.\n\t */\n\tcallback: (\n\t\titems: Item[],\n\t\tcontext: {\n\t\t\tregistry: any;\n\t\t\tonActionPerformed?: ( items: Item[] ) => void;\n\t\t}\n\t) => void;\n}\n\nexport type Action< Item > = ActionModal< Item > | ActionButton< Item >;\n\nexport interface ViewBaseProps< Item > {\n\tclassName?: string;\n\tactions: Action< Item >[];\n\tdata: Item[];\n\tfields: NormalizedField< Item >[];\n\tgetItemId: ( item: Item ) => string;\n\tgetItemLevel?: ( item: Item ) => number;\n\tisLoading?: boolean;\n\tonChangeView: ( view: View ) => void;\n\tonChangeSelection: SetSelection;\n\tselection: string[];\n\tsetOpenedFilter: ( fieldId: 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\tview: View;\n\tempty: ReactNode;\n}\n\nexport interface ViewTableProps< Item > extends ViewBaseProps< Item > {\n\tview: ViewTable;\n}\n\nexport interface ViewListProps< Item > extends ViewBaseProps< Item > {\n\tview: ViewList;\n}\n\nexport interface ViewGridProps< Item > extends ViewBaseProps< Item > {\n\tview: ViewGrid;\n}\n\nexport type ViewProps< Item > =\n\t| ViewTableProps< Item >\n\t| ViewGridProps< Item >\n\t| ViewListProps< Item >;\n\nexport interface SupportedLayouts {\n\tlist?: Omit< ViewList, 'type' >;\n\tgrid?: Omit< ViewGrid, 'type' >;\n\ttable?: Omit< ViewTable, 'type' >;\n}\n\nexport type SimpleFormField = {\n\tid: string;\n\tlayout?: 'regular' | 'panel';\n\tlabelPosition?: 'side' | 'top' | 'none';\n};\n\nexport type CombinedFormField = {\n\tid: string;\n\tlabel?: string;\n\tlayout?: 'regular' | 'panel';\n\tlabelPosition?: 'side' | 'top' | 'none';\n\tchildren: Array< FormField | string >;\n};\n\nexport type FormField = SimpleFormField | CombinedFormField;\n\n/**\n * The form configuration.\n */\nexport type Form = {\n\ttype?: 'regular' | 'panel';\n\tfields?: Array< FormField | string >;\n\tlabelPosition?: 'side' | 'top' | 'none';\n};\n\nexport interface DataFormProps< Item > {\n\tdata: Item;\n\tfields: Field< Item >[];\n\tform: Form;\n\tonChange: ( value: Record< string, any > ) => void;\n}\n\nexport interface FieldLayoutProps< Item > {\n\tdata: Item;\n\tfield: FormField;\n\tonChange: ( value: any ) => void;\n\thideLabelFromVision?: boolean;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/dataviews/src/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tReactElement,\n\tReactNode,\n\tComponentType,\n\tComponentProps,\n} from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { SetSelection } from './private-types';\n\n/**\n * WordPress dependencies\n */\nimport type { useFocusOnMount } from '@wordpress/compose';\n\nexport type SortDirection = 'asc' | 'desc';\n\n/**\n * Generic option type.\n */\nexport interface Option< Value extends any = any > {\n\tvalue: Value;\n\tlabel: string;\n\tdescription?: string;\n}\n\nexport interface FilterByConfig {\n\t/**\n\t * The list of operators supported by the field.\n\t */\n\toperators?: Operator[];\n\n\t/**\n\t * Whether it is a primary filter.\n\t *\n\t * A primary filter is always visible and is not listed in the \"Add filter\" component,\n\t * except for the list layout where it behaves like a secondary filter.\n\t */\n\tisPrimary?: boolean;\n}\n\nexport interface NormalizedFilterByConfig {\n\t/**\n\t * The list of operators supported by the field.\n\t */\n\toperators: Operator[];\n\n\t/**\n\t * Whether it is a primary filter.\n\t *\n\t * A primary filter is always visible and is not listed in the \"Add filter\" component,\n\t * except for the list layout where it behaves like a secondary filter.\n\t */\n\tisPrimary?: boolean;\n}\n\ninterface FilterConfigForType {\n\t/**\n\t * What operators are used by default.\n\t */\n\tdefaultOperators: Operator[];\n\n\t/**\n\t * What operators are supported by the field.\n\t */\n\tvalidOperators: Operator[];\n}\n\nexport type Operator =\n\t| 'is'\n\t| 'isNot'\n\t| 'isAny'\n\t| 'isNone'\n\t| 'isAll'\n\t| 'isNotAll'\n\t| 'lessThan'\n\t| 'greaterThan'\n\t| 'lessThanOrEqual'\n\t| 'greaterThanOrEqual'\n\t| 'before'\n\t| 'after'\n\t| 'beforeInc'\n\t| 'afterInc'\n\t| 'contains'\n\t| 'notContains'\n\t| 'startsWith'\n\t| 'between'\n\t| 'on'\n\t| 'notOn'\n\t| 'inThePast'\n\t| 'over';\n\nexport type FieldType =\n\t| 'text'\n\t| 'integer'\n\t| 'datetime'\n\t| 'date'\n\t| 'media'\n\t| 'boolean'\n\t| 'email'\n\t| 'array';\n\n/**\n * An abstract interface for Field based on the field type.\n */\nexport type FieldTypeDefinition< Item > = {\n\t/**\n\t * Callback used to sort the field.\n\t */\n\tsort: ( a: Item, b: Item, direction: SortDirection ) => number;\n\n\t/**\n\t * Callback used to validate the field.\n\t */\n\tisValid: Rules< Item >;\n\n\t/**\n\t * Callback used to render an edit control for the field or control name.\n\t */\n\tEdit: ComponentType< DataFormControlProps< Item > > | string | null;\n\n\t/**\n\t * Callback used to render the field.\n\t */\n\trender: ComponentType< DataViewRenderFieldProps< Item > >;\n\n\t/**\n\t * The filter config for the field.\n\t */\n\tfilterBy: FilterConfigForType | false;\n\n\t/**\n\t * Whether the field is readOnly.\n\t * If `true`, the value will be rendered using the `render` callback.\n\t */\n\treadOnly?: boolean;\n\n\t/**\n\t * Whether the field is sortable.\n\t */\n\tenableSorting: boolean;\n};\n\nexport type Rules< Item > = {\n\trequired?: boolean;\n\tcustom?: ( item: Item, field: NormalizedField< Item > ) => null | string;\n};\n\n/**\n * A dataview field for a specific property of a data type.\n */\nexport type Field< Item > = {\n\t/**\n\t * Type of the fields.\n\t */\n\ttype?: FieldType;\n\n\t/**\n\t * The unique identifier of the field.\n\t */\n\tid: string;\n\n\t/**\n\t * The label of the field. Defaults to the id.\n\t */\n\tlabel?: string;\n\n\t/**\n\t * The header of the field. Defaults to the label.\n\t * It allows the usage of a React Element to render the field labels.\n\t */\n\theader?: string | ReactElement;\n\n\t/**\n\t * A description of the field.\n\t */\n\tdescription?: string;\n\n\t/**\n\t * Placeholder for the field.\n\t */\n\tplaceholder?: string;\n\n\t/**\n\t * Callback used to render the field. Defaults to `field.getValue`.\n\t */\n\trender?: ComponentType< DataViewRenderFieldProps< Item > >;\n\n\t/**\n\t * Callback used to render an edit control for the field.\n\t */\n\tEdit?: ComponentType< DataFormControlProps< Item > > | string;\n\n\t/**\n\t * Callback used to sort the field.\n\t */\n\tsort?: ( a: Item, b: Item, direction: SortDirection ) => number;\n\n\t/**\n\t * Callback used to validate the field.\n\t */\n\tisValid?: Rules< Item >;\n\n\t/**\n\t * Callback used to decide if a field should be displayed.\n\t */\n\tisVisible?: ( item: Item ) => boolean;\n\n\t/**\n\t * Whether the field is sortable.\n\t */\n\tenableSorting?: boolean;\n\n\t/**\n\t * Whether the field is searchable.\n\t */\n\tenableGlobalSearch?: boolean;\n\n\t/**\n\t * Whether the field is filterable.\n\t */\n\tenableHiding?: boolean;\n\n\t/**\n\t * The list of options to pick from when using the field as a filter.\n\t */\n\telements?: Option[];\n\n\t/**\n\t * Filter config for the field.\n\t */\n\tfilterBy?: FilterByConfig | false;\n\n\t/**\n\t * Whether the field is readOnly.\n\t * If `true`, the value will be rendered using the `render` callback.\n\t */\n\treadOnly?: boolean;\n\n\t/**\n\t * Callback used to retrieve the value of the field from the item.\n\t * Defaults to `item[ field.id ]`.\n\t */\n\tgetValue?: ( args: { item: Item } ) => any;\n};\n\nexport type NormalizedField< Item > = Omit< Field< Item >, 'Edit' > & {\n\tlabel: string;\n\theader: string | ReactElement;\n\tgetValue: ( args: { item: Item } ) => any;\n\trender: ComponentType< DataViewRenderFieldProps< Item > >;\n\tEdit: ComponentType< DataFormControlProps< Item > > | null;\n\tsort: ( a: Item, b: Item, direction: SortDirection ) => number;\n\tisValid: Rules< Item >;\n\tenableHiding: boolean;\n\tenableSorting: boolean;\n\tfilterBy: NormalizedFilterByConfig | false;\n\treadOnly: boolean;\n};\n\n/**\n * A collection of dataview fields for a data type.\n */\nexport type Fields< Item > = Field< Item >[];\n\nexport type Data< Item > = Item[];\n\nexport type DataFormControlProps< Item > = {\n\tdata: Item;\n\tfield: NormalizedField< Item >;\n\tonChange: ( value: Record< string, any > ) => void;\n\thideLabelFromVision?: boolean;\n\t/**\n\t * The currently selected filter operator for this field.\n\t *\n\t * Used by DataViews filters to determine which control to render based on the operator type.\n\t */\n\toperator?: Operator;\n};\n\nexport type DataViewRenderFieldProps< Item > = {\n\titem: Item;\n\tfield: NormalizedField< Item >;\n\tconfig?: {\n\t\tsizes: string;\n\t};\n};\n\n/**\n * The filters applied to the dataset.\n */\nexport interface Filter {\n\t/**\n\t * The field to filter by.\n\t */\n\tfield: string;\n\n\t/**\n\t * The operator to use.\n\t */\n\toperator: Operator;\n\n\t/**\n\t * The value to filter by.\n\t */\n\tvalue: any;\n\n\t/**\n\t * Whether the filter can be edited by the user.\n\t */\n\tisLocked?: boolean;\n}\n\nexport interface NormalizedFilter {\n\t/**\n\t * The field to filter by.\n\t */\n\tfield: string;\n\n\t/**\n\t * The field name.\n\t */\n\tname: string;\n\n\t/**\n\t * The list of options to pick from when using the field as a filter.\n\t */\n\telements: Option[];\n\n\t/**\n\t * Is a single selection filter.\n\t */\n\tsingleSelection: boolean;\n\n\t/**\n\t * The list of operators supported by the field.\n\t */\n\toperators: Operator[];\n\n\t/**\n\t * Whether the filter is visible.\n\t */\n\tisVisible: boolean;\n\n\t/**\n\t * Whether it is a primary filter.\n\t */\n\tisPrimary: boolean;\n\n\t/**\n\t * Whether the filter can be edited by the user.\n\t */\n\tisLocked: boolean;\n}\n\ninterface ViewBase {\n\t/**\n\t * The layout of the view.\n\t */\n\ttype: string;\n\n\t/**\n\t * The global search term.\n\t */\n\tsearch?: string;\n\n\t/**\n\t * The filters to apply.\n\t */\n\tfilters?: Filter[];\n\n\t/**\n\t * The sorting configuration.\n\t */\n\tsort?: {\n\t\t/**\n\t\t * The field to sort by.\n\t\t */\n\t\tfield: string;\n\n\t\t/**\n\t\t * The direction to sort by.\n\t\t */\n\t\tdirection: SortDirection;\n\t};\n\n\t/**\n\t * The active page\n\t */\n\tpage?: number;\n\n\t/**\n\t * The number of items per page\n\t */\n\tperPage?: number;\n\n\t/**\n\t * The fields to render\n\t */\n\tfields?: string[];\n\n\t/**\n\t * Title field\n\t */\n\ttitleField?: string;\n\n\t/**\n\t * Media field\n\t */\n\tmediaField?: string;\n\n\t/**\n\t * Description field\n\t */\n\tdescriptionField?: string;\n\n\t/**\n\t * Whether to show the title\n\t */\n\tshowTitle?: boolean;\n\n\t/**\n\t * Whether to show the media\n\t */\n\tshowMedia?: boolean;\n\n\t/**\n\t * Whether to show the description\n\t */\n\tshowDescription?: boolean;\n\n\t/**\n\t * Whether to show the hierarchical levels.\n\t */\n\tshowLevels?: boolean;\n\n\t/**\n\t * The field to group by.\n\t */\n\tgroupByField?: string;\n\n\t/**\n\t * Whether infinite scroll is enabled.\n\t */\n\tinfiniteScrollEnabled?: boolean;\n}\n\nexport interface ColumnStyle {\n\t/**\n\t * The width of the field column.\n\t */\n\twidth?: string | number;\n\n\t/**\n\t * The minimum width of the field column.\n\t */\n\tmaxWidth?: string | number;\n\n\t/**\n\t * The maximum width of the field column.\n\t */\n\tminWidth?: string | number;\n\n\t/**\n\t * The alignment of the field column, defaults to left.\n\t */\n\talign?: 'start' | 'center' | 'end';\n}\n\nexport type Density = 'compact' | 'balanced' | 'comfortable';\n\nexport interface ViewTable extends ViewBase {\n\ttype: 'table';\n\n\tlayout?: {\n\t\t/**\n\t\t * The styles for the columns.\n\t\t */\n\t\tstyles?: Record< string, ColumnStyle >;\n\n\t\t/**\n\t\t * The density of the view.\n\t\t */\n\t\tdensity?: Density;\n\n\t\t/**\n\t\t * Whether the view allows column moving.\n\t\t */\n\t\tenableMoving?: boolean;\n\t};\n}\n\nexport interface ViewList extends ViewBase {\n\ttype: 'list';\n}\n\nexport interface ViewGrid extends ViewBase {\n\ttype: 'grid';\n\n\tlayout?: {\n\t\t/**\n\t\t * The fields to use as badge fields.\n\t\t */\n\t\tbadgeFields?: string[];\n\n\t\t/**\n\t\t * The preview size of the grid.\n\t\t */\n\t\tpreviewSize?: number;\n\t};\n}\n\nexport type View = ViewList | ViewGrid | ViewTable;\n\ninterface ActionBase< Item > {\n\t/**\n\t * The unique identifier of the action.\n\t */\n\tid: string;\n\n\t/**\n\t * The label of the action.\n\t * In case we want to adjust the label based on the selected items,\n\t * a function can be provided.\n\t */\n\tlabel: string | ( ( items: Item[] ) => string );\n\n\t/**\n\t * The icon of the action. (Either a string or an SVG element)\n\t * This should be IconType from the components package\n\t * but that import is breaking typescript build for the moment.\n\t */\n\ticon?: any;\n\n\t/**\n\t * Whether the action is disabled.\n\t */\n\tdisabled?: boolean;\n\n\t/**\n\t * Whether the action is destructive.\n\t */\n\tisDestructive?: boolean;\n\n\t/**\n\t * Whether the action is a primary action.\n\t */\n\tisPrimary?: boolean;\n\n\t/**\n\t * Whether the item passed as an argument supports the current action.\n\t */\n\tisEligible?: ( item: Item ) => boolean;\n\n\t/**\n\t * Whether the action can be used as a bulk action.\n\t */\n\tsupportsBulk?: boolean;\n\n\t/**\n\t * The context in which the action is visible.\n\t * This is only a \"meta\" information for now.\n\t */\n\tcontext?: 'list' | 'single';\n}\n\nexport interface RenderModalProps< Item > {\n\titems: Item[];\n\tcloseModal?: () => void;\n\tonActionPerformed?: ( items: Item[] ) => void;\n}\n\nexport interface ActionModal< Item > extends ActionBase< Item > {\n\t/**\n\t * Modal to render when the action is triggered.\n\t */\n\tRenderModal: ( {\n\t\titems,\n\t\tcloseModal,\n\t\tonActionPerformed,\n\t}: RenderModalProps< Item > ) => ReactElement;\n\n\t/**\n\t * Whether to hide the modal header.\n\t */\n\thideModalHeader?: boolean;\n\n\t/**\n\t * The header of the modal.\n\t */\n\tmodalHeader?: string;\n\n\t/**\n\t * The size of the modal.\n\t *\n\t * @default 'medium'\n\t */\n\tmodalSize?: 'small' | 'medium' | 'large' | 'fill';\n\n\t/**\n\t * The focus on mount property of the modal.\n\t */\n\tmodalFocusOnMount?:\n\t\t| Parameters< typeof useFocusOnMount >[ 0 ]\n\t\t| 'firstContentElement';\n}\n\nexport interface ActionButton< Item > extends ActionBase< Item > {\n\t/**\n\t * The callback to execute when the action is triggered.\n\t */\n\tcallback: (\n\t\titems: Item[],\n\t\tcontext: {\n\t\t\tregistry: any;\n\t\t\tonActionPerformed?: ( items: Item[] ) => void;\n\t\t}\n\t) => void;\n}\n\nexport type Action< Item > = ActionModal< Item > | ActionButton< Item >;\n\nexport interface ViewBaseProps< Item > {\n\tclassName?: string;\n\tactions: Action< Item >[];\n\tdata: Item[];\n\tfields: NormalizedField< Item >[];\n\tgetItemId: ( item: Item ) => string;\n\tgetItemLevel?: ( item: Item ) => number;\n\tisLoading?: boolean;\n\tonChangeView: ( view: View ) => void;\n\tonChangeSelection: SetSelection;\n\tselection: string[];\n\tsetOpenedFilter: ( fieldId: 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\tview: View;\n\tempty: ReactNode;\n}\n\nexport interface ViewTableProps< Item > extends ViewBaseProps< Item > {\n\tview: ViewTable;\n}\n\nexport interface ViewListProps< Item > extends ViewBaseProps< Item > {\n\tview: ViewList;\n}\n\nexport interface ViewGridProps< Item > extends ViewBaseProps< Item > {\n\tview: ViewGrid;\n}\n\nexport type ViewProps< Item > =\n\t| ViewTableProps< Item >\n\t| ViewGridProps< Item >\n\t| ViewListProps< Item >;\n\nexport interface SupportedLayouts {\n\tlist?: Omit< ViewList, 'type' >;\n\tgrid?: Omit< ViewGrid, 'type' >;\n\ttable?: Omit< ViewTable, 'type' >;\n}\n\n/**\n * DataForm layouts.\n */\nexport type LayoutType = 'regular' | 'panel' | 'card';\nexport type LabelPosition = 'top' | 'side' | 'none';\n\nexport type RegularLayout = {\n\ttype: 'regular';\n\tlabelPosition?: LabelPosition;\n};\nexport type NormalizedRegularLayout = {\n\ttype: 'regular';\n\tlabelPosition: LabelPosition;\n};\n\nexport type PanelLayout = {\n\ttype: 'panel';\n\tlabelPosition?: LabelPosition;\n\topenAs?: 'dropdown' | 'modal';\n};\nexport type NormalizedPanelLayout = {\n\ttype: 'panel';\n\tlabelPosition: LabelPosition;\n\topenAs: 'dropdown' | 'modal';\n};\n\nexport type CardLayout =\n\t| {\n\t\t\ttype: 'card';\n\t\t\twithHeader: false;\n\t\t\t// isOpened cannot be false if withHeader is false as well.\n\t\t\t// Otherwise, the card would not be visible.\n\t\t\tisOpened?: true;\n\t  }\n\t| {\n\t\t\ttype: 'card';\n\t\t\twithHeader?: true | undefined;\n\t\t\tisOpened?: boolean;\n\t  };\nexport type NormalizedCardLayout =\n\t| {\n\t\t\ttype: 'card';\n\t\t\twithHeader: false;\n\t\t\t// isOpened cannot be false if withHeader is false as well.\n\t\t\t// Otherwise, the card would not be visible.\n\t\t\tisOpened: true;\n\t  }\n\t| {\n\t\t\ttype: 'card';\n\t\t\twithHeader: true;\n\t\t\tisOpened: boolean;\n\t  };\n\nexport type Layout = RegularLayout | PanelLayout | CardLayout;\nexport type NormalizedLayout =\n\t| NormalizedRegularLayout\n\t| NormalizedPanelLayout\n\t| NormalizedCardLayout;\n\nexport type SimpleFormField = {\n\tid: string;\n\tlayout?: Layout;\n};\n\nexport type CombinedFormField = {\n\tid: string;\n\tlabel?: string;\n\tlayout?: Layout;\n\tchildren: Array< FormField | string >;\n};\n\nexport type FormField = SimpleFormField | CombinedFormField;\n\n/**\n * The form configuration.\n */\nexport type Form = {\n\tlayout?: Layout;\n\tfields?: Array< FormField | string >;\n};\n\nexport interface DataFormProps< Item > {\n\tdata: Item;\n\tfields: Field< Item >[];\n\tform: Form;\n\tonChange: ( value: Record< string, any > ) => void;\n}\n\nexport interface FieldLayoutProps< Item > {\n\tdata: Item;\n\tfield: FormField;\n\tonChange: ( value: any ) => void;\n\thideLabelFromVision?: boolean;\n}\n"],"mappings":"","ignoreList":[]}

package/build-style/style-rtl.css

@@ -280,6 +280,10 @@
   }
 }
 
+.dataviews-loading-more {
+  text-align: center;
+}
+
 @container (max-width: 430px) {
   .dataviews__view-actions,
 .dataviews-filters__container {
@@ -1102,7 +1106,6 @@
 }
 .dataviews-view-grid .dataviews-view-grid__media {
   width: 100%;
-  min-height: 200px;
   aspect-ratio: 1/1;
   background-color: #fff;
   border-radius: 4px;
@@ -1144,6 +1147,9 @@
 .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name {
   width: 35%;
   color: #757575;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
   width: 65%;
@@ -1200,73 +1206,100 @@ div.dataviews-view-list {
 .dataviews-view-list {
   margin: 0 0 auto;
 }
-.dataviews-view-list div[role=row] {
+.dataviews-view-list div[role=row],
+.dataviews-view-list div[role=article] {
   margin: 0;
   border-top: 1px solid #f0f0f0;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-wrapper {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-wrapper,
+.dataviews-view-list div[role=article] .dataviews-view-list__item-wrapper {
   position: relative;
   padding: 16px 24px;
   box-sizing: border-box;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-actions {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-actions,
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions {
   display: flex;
   width: max-content;
   flex: 0 0 auto;
   gap: 4px;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-actions .components-button {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-actions .components-button,
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions .components-button {
   position: relative;
   z-index: 1;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > div {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > div,
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > div {
   height: 24px;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child) {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
   flex: 0;
   overflow: hidden;
   width: 0;
 }
-.dataviews-view-list div[role=row]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child) {
+.dataviews-view-list div[role=row]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child),
+.dataviews-view-list div[role=article]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child) {
   flex-basis: min-content;
   width: auto;
   overflow: unset;
 }
 @media (hover: none) {
-  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child) {
+  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
     flex-basis: min-content;
     width: auto;
     overflow: unset;
   }
 }
-.dataviews-view-list div[role=row].is-selected.is-selected {
+.dataviews-view-list div[role=row].is-selected.is-selected,
+.dataviews-view-list div[role=article].is-selected.is-selected {
   border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
 }
-.dataviews-view-list div[role=row].is-selected.is-selected + div[role=row] {
+.dataviews-view-list div[role=row].is-selected.is-selected + div[role=row], .dataviews-view-list div[role=row].is-selected.is-selected + div[role=article],
+.dataviews-view-list div[role=article].is-selected.is-selected + div[role=row],
+.dataviews-view-list div[role=article].is-selected.is-selected + div[role=article] {
   border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
 }
-.dataviews-view-list div[role=row]:not(.is-selected) .dataviews-view-list__title-field {
+.dataviews-view-list div[role=row]:not(.is-selected) .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article]:not(.is-selected) .dataviews-view-list__title-field {
   color: #1e1e1e;
 }
-.dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within {
+.dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within,
+.dataviews-view-list div[role=article]:not(.is-selected):hover,
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered,
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within {
   color: var(--wp-admin-theme-color);
   background-color: #f8f8f8;
 }
 .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__title-field,
 .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__fields, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__title-field,
 .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__fields, .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__fields {
+.dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__fields,
+.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__fields,
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__fields,
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__fields {
   color: var(--wp-admin-theme-color);
 }
 .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper,
-.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper {
+.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper,
+.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper,
+.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper {
   background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
   color: #1e1e1e;
 }
 .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
 .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
 .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields {
+.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
+.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
+.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields {
   color: var(--wp-admin-theme-color);
 }
 .dataviews-view-list .dataviews-view-list__item {
@@ -1671,6 +1704,10 @@ div.dataviews-view-list {
   margin-bottom: 16px;
 }
 
+.dataforms-layouts-panel__modal-footer {
+  margin-top: 16px;
+}
+
 .components-popover.components-dropdown__content.dataforms-layouts-panel__field-dropdown {
   z-index: 159990;
 }

package/build-style/style.css

@@ -280,6 +280,10 @@
   }
 }
 
+.dataviews-loading-more {
+  text-align: center;
+}
+
 @container (max-width: 430px) {
   .dataviews__view-actions,
 .dataviews-filters__container {
@@ -1102,7 +1106,6 @@
 }
 .dataviews-view-grid .dataviews-view-grid__media {
   width: 100%;
-  min-height: 200px;
   aspect-ratio: 1/1;
   background-color: #fff;
   border-radius: 4px;
@@ -1144,6 +1147,9 @@
 .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name {
   width: 35%;
   color: #757575;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
   width: 65%;
@@ -1200,73 +1206,100 @@ div.dataviews-view-list {
 .dataviews-view-list {
   margin: 0 0 auto;
 }
-.dataviews-view-list div[role=row] {
+.dataviews-view-list div[role=row],
+.dataviews-view-list div[role=article] {
   margin: 0;
   border-top: 1px solid #f0f0f0;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-wrapper {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-wrapper,
+.dataviews-view-list div[role=article] .dataviews-view-list__item-wrapper {
   position: relative;
   padding: 16px 24px;
   box-sizing: border-box;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-actions {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-actions,
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions {
   display: flex;
   width: max-content;
   flex: 0 0 auto;
   gap: 4px;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-actions .components-button {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-actions .components-button,
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions .components-button {
   position: relative;
   z-index: 1;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > div {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > div,
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > div {
   height: 24px;
 }
-.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child) {
+.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
   flex: 0;
   overflow: hidden;
   width: 0;
 }
-.dataviews-view-list div[role=row]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child) {
+.dataviews-view-list div[role=row]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child),
+.dataviews-view-list div[role=article]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child) {
   flex-basis: min-content;
   width: auto;
   overflow: unset;
 }
 @media (hover: none) {
-  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child) {
+  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
+.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
     flex-basis: min-content;
     width: auto;
     overflow: unset;
   }
 }
-.dataviews-view-list div[role=row].is-selected.is-selected {
+.dataviews-view-list div[role=row].is-selected.is-selected,
+.dataviews-view-list div[role=article].is-selected.is-selected {
   border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
 }
-.dataviews-view-list div[role=row].is-selected.is-selected + div[role=row] {
+.dataviews-view-list div[role=row].is-selected.is-selected + div[role=row], .dataviews-view-list div[role=row].is-selected.is-selected + div[role=article],
+.dataviews-view-list div[role=article].is-selected.is-selected + div[role=row],
+.dataviews-view-list div[role=article].is-selected.is-selected + div[role=article] {
   border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
 }
-.dataviews-view-list div[role=row]:not(.is-selected) .dataviews-view-list__title-field {
+.dataviews-view-list div[role=row]:not(.is-selected) .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article]:not(.is-selected) .dataviews-view-list__title-field {
   color: #1e1e1e;
 }
-.dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within {
+.dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within,
+.dataviews-view-list div[role=article]:not(.is-selected):hover,
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered,
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within {
   color: var(--wp-admin-theme-color);
   background-color: #f8f8f8;
 }
 .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__title-field,
 .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__fields, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__title-field,
 .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__fields, .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__fields {
+.dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__fields,
+.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__fields,
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__fields,
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__fields {
   color: var(--wp-admin-theme-color);
 }
 .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper,
-.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper {
+.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper,
+.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper,
+.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper {
   background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
   color: #1e1e1e;
 }
 .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
 .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
 .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields {
+.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
+.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
+.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
+.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields {
   color: var(--wp-admin-theme-color);
 }
 .dataviews-view-list .dataviews-view-list__item {
@@ -1671,6 +1704,10 @@ div.dataviews-view-list {
   margin-bottom: 16px;
 }
 
+.dataforms-layouts-panel__modal-footer {
+  margin-top: 16px;
+}
+
 .components-popover.components-dropdown__content.dataforms-layouts-panel__field-dropdown {
   z-index: 159990;
 }

package/build-types/components/dataform/stories/index.story.d.ts

@@ -5,6 +5,13 @@ import DataForm from '../index';
 declare const meta: {
     title: string;
     component: typeof DataForm;
+};
+export default meta;
+export declare const Default: {
+    render: ({ type, labelPosition, }: {
+        type?: "default" | "regular" | "panel" | "card";
+        labelPosition: "default" | "top" | "side" | "none";
+    }) => import("react").JSX.Element;
     argTypes: {
         type: {
             control: {
@@ -13,35 +20,39 @@ declare const meta: {
             description: string;
             options: string[];
         };
-        labelPosition: {
+    };
+};
+export declare const LayoutCard: {
+    render: ({ withHeader }: {
+        withHeader: boolean;
+    }) => import("react").JSX.Element;
+    argTypes: {
+        withHeader: {
             control: {
                 type: string;
             };
             description: string;
-            options: string[];
         };
     };
+    args: {
+        withHeader: boolean;
+    };
 };
-export default meta;
-export declare const Default: ({ type, labelPosition, }: {
-    type: "default" | "regular" | "panel";
-    labelPosition: "default" | "top" | "side" | "none";
-}) => import("react").JSX.Element;
-export declare const CombinedFields: {
-    title: string;
-    render: ({ type, labelPosition, }: {
-        type: "default" | "regular" | "panel";
+export declare const LayoutPanel: {
+    render: ({ labelPosition, openAs, }: {
+        type: "default" | "regular" | "panel" | "card";
         labelPosition: "default" | "top" | "side" | "none";
+        openAs: "default" | "dropdown" | "modal";
     }) => import("react").JSX.Element;
     argTypes: {
-        type: {
+        labelPosition: {
             control: {
                 type: string;
             };
             description: string;
             options: string[];
         };
-        labelPosition: {
+        openAs: {
             control: {
                 type: string;
             };
@@ -49,12 +60,26 @@ export declare const CombinedFields: {
             options: string[];
         };
     };
-    args: {
-        type: string;
+};
+export declare const LayoutRegular: {
+    render: ({ type, labelPosition, }: {
+        type?: "default" | "regular" | "panel" | "card";
+        labelPosition: "default" | "top" | "side" | "none";
+    }) => import("react").JSX.Element;
+    argTypes: {
+        labelPosition: {
+            control: {
+                type: string;
+            };
+            description: string;
+            options: string[];
+        };
     };
 };
+export declare const LayoutMixed: {
+    render: () => import("react").JSX.Element;
+};
 export declare const Validation: {
-    title: string;
     render: ({ required }: {
         required: boolean;
     }) => import("react").JSX.Element;
@@ -71,7 +96,6 @@ export declare const Validation: {
     };
 };
 export declare const Visibility: {
-    title: string;
     render: () => import("react").JSX.Element;
 };
 //# sourceMappingURL=index.story.d.ts.map

package/build-types/components/dataform/stories/index.story.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../../src/components/dataform/stories/index.story.tsx"],"names":[],"mappings":"AAUA;;GAEG;AACH,OAAO,QAAQ,MAAM,UAAU,CAAC;AAoBhC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;CAgBT,CAAC;AACF,eAAe,IAAI,CAAC;AAiGpB,eAAO,MAAM,OAAO,6BAGjB;IACF,IAAI,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IACtC,aAAa,EAAE,SAAS,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;CACnD,gCAoDA,CAAC;AAwDF,eAAO,MAAM,cAAc;;uCAnDxB;QACF,IAAI,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;QACtC,aAAa,EAAE,SAAS,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;KACnD;;;;;;;;;;;;;;;;;;;;CAyDA,CAAC;AA2JF,eAAO,MAAM,UAAU;;2BAzH6B;QAAE,QAAQ,EAAE,OAAO,CAAA;KAAE;;;;;;;;;;;;CAqIxE,CAAC;AA+CF,eAAO,MAAM,UAAU;;;CAGtB,CAAC"}
+{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../../src/components/dataform/stories/index.story.tsx"],"names":[],"mappings":"AAUA;;GAEG;AACH,OAAO,QAAQ,MAAM,UAAU,CAAC;AAixBhC,QAAA,MAAM,IAAI;;;CAGT,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,OAAO;uCArnBjB;QACF,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;QAChD,aAAa,EAAE,SAAS,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;KACnD;;;;;;;;;;CA2nBA,CAAC;AAEF,eAAO,MAAM,UAAU;6BA5QuB;QAAE,UAAU,EAAE,OAAO,CAAA;KAAE;;;;;;;;;;;;CAuRpE,CAAC;AAEF,eAAO,MAAM,WAAW;yCA/hBrB;QACF,IAAI,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;QAC/C,aAAa,EAAE,SAAS,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;QACnD,MAAM,EAAE,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;KACzC;;;;;;;;;;;;;;;;;CAyiBA,CAAC;AAEF,eAAO,MAAM,aAAa;uCA7pBvB;QACF,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;QAChD,aAAa,EAAE,SAAS,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;KACnD;;;;;;;;;;CAmqBA,CAAC;AAEF,eAAO,MAAM,WAAW;;CAEvB,CAAC;AAEF,eAAO,MAAM,UAAU;2BA9dqB;QAAE,QAAQ,EAAE,OAAO,CAAA;KAAE;;;;;;;;;;;;CAyehE,CAAC;AAEF,eAAO,MAAM,UAAU;;CAEtB,CAAC"}

package/build-types/components/dataviews/index.d.ts

@@ -24,6 +24,7 @@ type DataViewsProps<Item> = {
     paginationInfo: {
         totalItems: number;
         totalPages: number;
+        infiniteScrollHandler?: () => void;
     };
     defaultLayouts: SupportedLayouts;
     selection?: string[];
@@ -36,14 +37,16 @@ type DataViewsProps<Item> = {
     header?: ReactNode;
     getItemLevel?: (item: Item) => number;
     children?: ReactNode;
-    perPageSizes?: number[];
+    config?: false | {
+        perPageSizes: number[];
+    };
     empty?: ReactNode;
 } & (Item extends ItemWithId ? {
     getItemId?: (item: Item) => string;
 } : {
     getItemId: (item: Item) => string;
 });
-declare function DataViews<Item>({ view, onChangeView, fields, search, searchLabel, actions, data, getItemId, getItemLevel, isLoading, paginationInfo, defaultLayouts, selection: selectionProperty, onChangeSelection, onClickItem, renderItemLink, isItemClickable, header, children, perPageSizes, empty, }: DataViewsProps<Item>): import("react").JSX.Element;
+declare function DataViews<Item>({ view, onChangeView, fields, search, searchLabel, actions, data, getItemId, getItemLevel, isLoading, paginationInfo, defaultLayouts, selection: selectionProperty, onChangeSelection, onClickItem, renderItemLink, isItemClickable, header, children, config, empty, }: DataViewsProps<Item>): import("react").JSX.Element;
 declare const DataViewsSubComponents: typeof DataViews & {
     BulkActionToolbar: typeof BulkActionsFooter;
     Filters: typeof DataViewsFilters;