@wordpress/dataviews 2.2.0 → 3.0.0

package/build/single-selection-checkbox.js

@@ -19,44 +19,33 @@ function SingleSelectionCheckbox({
   selection,
   onSelectionChange,
   item,
-  data,
   getItemId,
   primaryField,
   disabled
 }) {
   const id = getItemId(item);
-  const isSelected = !disabled && selection.includes(id);
+  const checked = !disabled && selection.includes(id);
   let selectionLabel;
   if (primaryField?.getValue && item) {
     // eslint-disable-next-line @wordpress/valid-sprintf
     selectionLabel = (0, _i18n.sprintf)( /* translators: %s: item title. */
-    isSelected ? (0, _i18n.__)('Deselect item: %s') : (0, _i18n.__)('Select item: %s'), primaryField.getValue({
+    checked ? (0, _i18n.__)('Deselect item: %s') : (0, _i18n.__)('Select item: %s'), primaryField.getValue({
       item
     }));
   } else {
-    selectionLabel = isSelected ? (0, _i18n.__)('Select a new item') : (0, _i18n.__)('Deselect item');
+    selectionLabel = checked ? (0, _i18n.__)('Select a new item') : (0, _i18n.__)('Deselect item');
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.CheckboxControl, {
     className: "dataviews-view-table-selection-checkbox",
     __nextHasNoMarginBottom: true,
     "aria-label": selectionLabel,
     "aria-disabled": disabled,
-    checked: isSelected,
+    checked: checked,
     onChange: () => {
       if (disabled) {
         return;
       }
-      if (!isSelected) {
-        onSelectionChange(data.filter(_item => {
-          const itemId = getItemId?.(_item);
-          return itemId === id || selection.includes(itemId);
-        }));
-      } else {
-        onSelectionChange(data.filter(_item => {
-          const itemId = getItemId?.(_item);
-          return itemId !== id && selection.includes(itemId);
-        }));
-      }
+      onSelectionChange(selection.includes(id) ? selection.filter(itemId => id !== itemId) : [...selection, id]);
     }
   });
 }

package/build/single-selection-checkbox.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_components","_jsxRuntime","SingleSelectionCheckbox","selection","onSelectionChange","item","data","getItemId","primaryField","disabled","id","isSelected","includes","selectionLabel","getValue","sprintf","__","jsx","CheckboxControl","className","__nextHasNoMarginBottom","checked","onChange","filter","_item","itemId"],"sources":["@wordpress/dataviews/src/single-selection-checkbox.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { CheckboxControl } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { Field, AnyItem } from './types';\n\ninterface SingleSelectionCheckboxProps< Item extends AnyItem > {\n\tselection: string[];\n\tonSelectionChange: ( selection: Item[] ) => void;\n\titem: Item;\n\tdata: Item[];\n\tgetItemId: ( item: Item ) => string;\n\tprimaryField?: Field< Item >;\n\tdisabled: boolean;\n}\n\nexport default function SingleSelectionCheckbox< Item extends AnyItem >( {\n\tselection,\n\tonSelectionChange,\n\titem,\n\tdata,\n\tgetItemId,\n\tprimaryField,\n\tdisabled,\n}: SingleSelectionCheckboxProps< Item > ) {\n\tconst id = getItemId( item );\n\tconst isSelected = ! disabled && selection.includes( id );\n\tlet selectionLabel;\n\tif ( primaryField?.getValue && item ) {\n\t\t// eslint-disable-next-line @wordpress/valid-sprintf\n\t\tselectionLabel = sprintf(\n\t\t\t/* translators: %s: item title. */\n\t\t\tisSelected ? __( 'Deselect item: %s' ) : __( 'Select item: %s' ),\n\t\t\tprimaryField.getValue( { item } )\n\t\t);\n\t} else {\n\t\tselectionLabel = isSelected\n\t\t\t? __( 'Select a new item' )\n\t\t\t: __( 'Deselect item' );\n\t}\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-view-table-selection-checkbox\"\n\t\t\t__nextHasNoMarginBottom\n\t\t\taria-label={ selectionLabel }\n\t\t\taria-disabled={ disabled }\n\t\t\tchecked={ isSelected }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( disabled ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\titemId === id || selection.includes( itemId )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} )\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\titemId !== id && selection.includes( itemId )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} )\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAAwD,IAAAE,WAAA,GAAAF,OAAA;AAJxD;AACA;AACA;;AAIA;AACA;AACA;;AAae,SAASG,uBAAuBA,CAA0B;EACxEC,SAAS;EACTC,iBAAiB;EACjBC,IAAI;EACJC,IAAI;EACJC,SAAS;EACTC,YAAY;EACZC;AACqC,CAAC,EAAG;EACzC,MAAMC,EAAE,GAAGH,SAAS,CAAEF,IAAK,CAAC;EAC5B,MAAMM,UAAU,GAAG,CAAEF,QAAQ,IAAIN,SAAS,CAACS,QAAQ,CAAEF,EAAG,CAAC;EACzD,IAAIG,cAAc;EAClB,IAAKL,YAAY,EAAEM,QAAQ,IAAIT,IAAI,EAAG;IACrC;IACAQ,cAAc,GAAG,IAAAE,aAAO,GACvB;IACAJ,UAAU,GAAG,IAAAK,QAAE,EAAE,mBAAoB,CAAC,GAAG,IAAAA,QAAE,EAAE,iBAAkB,CAAC,EAChER,YAAY,CAACM,QAAQ,CAAE;MAAET;IAAK,CAAE,CACjC,CAAC;EACF,CAAC,MAAM;IACNQ,cAAc,GAAGF,UAAU,GACxB,IAAAK,QAAE,EAAE,mBAAoB,CAAC,GACzB,IAAAA,QAAE,EAAE,eAAgB,CAAC;EACzB;EACA,oBACC,IAAAf,WAAA,CAAAgB,GAAA,EAACjB,WAAA,CAAAkB,eAAe;IACfC,SAAS,EAAC,yCAAyC;IACnDC,uBAAuB;IACvB,cAAaP,cAAgB;IAC7B,iBAAgBJ,QAAU;IAC1BY,OAAO,EAAGV,UAAY;IACtBW,QAAQ,EAAGA,CAAA,KAAM;MAChB,IAAKb,QAAQ,EAAG;QACf;MACD;MAEA,IAAK,CAAEE,UAAU,EAAG;QACnBP,iBAAiB,CAChBE,IAAI,CAACiB,MAAM,CAAIC,KAAK,IAAM;UACzB,MAAMC,MAAM,GAAGlB,SAAS,GAAIiB,KAAM,CAAC;UACnC,OACCC,MAAM,KAAKf,EAAE,IAAIP,SAAS,CAACS,QAAQ,CAAEa,MAAO,CAAC;QAE/C,CAAE,CACH,CAAC;MACF,CAAC,MAAM;QACNrB,iBAAiB,CAChBE,IAAI,CAACiB,MAAM,CAAIC,KAAK,IAAM;UACzB,MAAMC,MAAM,GAAGlB,SAAS,GAAIiB,KAAM,CAAC;UACnC,OACCC,MAAM,KAAKf,EAAE,IAAIP,SAAS,CAACS,QAAQ,CAAEa,MAAO,CAAC;QAE/C,CAAE,CACH,CAAC;MACF;IACD;EAAG,CACH,CAAC;AAEJ","ignoreList":[]}
+{"version":3,"names":["_i18n","require","_components","_jsxRuntime","SingleSelectionCheckbox","selection","onSelectionChange","item","getItemId","primaryField","disabled","id","checked","includes","selectionLabel","getValue","sprintf","__","jsx","CheckboxControl","className","__nextHasNoMarginBottom","onChange","filter","itemId"],"sources":["@wordpress/dataviews/src/single-selection-checkbox.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { CheckboxControl } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { Field } from './types';\nimport type { SetSelection } from './private-types';\n\ninterface SingleSelectionCheckboxProps< Item > {\n\tselection: string[];\n\tonSelectionChange: SetSelection;\n\titem: Item;\n\tgetItemId: ( item: Item ) => string;\n\tprimaryField?: Field< Item >;\n\tdisabled: boolean;\n}\n\nexport default function SingleSelectionCheckbox< Item >( {\n\tselection,\n\tonSelectionChange,\n\titem,\n\tgetItemId,\n\tprimaryField,\n\tdisabled,\n}: SingleSelectionCheckboxProps< Item > ) {\n\tconst id = getItemId( item );\n\tconst checked = ! disabled && selection.includes( id );\n\tlet selectionLabel;\n\tif ( primaryField?.getValue && item ) {\n\t\t// eslint-disable-next-line @wordpress/valid-sprintf\n\t\tselectionLabel = sprintf(\n\t\t\t/* translators: %s: item title. */\n\t\t\tchecked ? __( 'Deselect item: %s' ) : __( 'Select item: %s' ),\n\t\t\tprimaryField.getValue( { item } )\n\t\t);\n\t} else {\n\t\tselectionLabel = checked\n\t\t\t? __( 'Select a new item' )\n\t\t\t: __( 'Deselect item' );\n\t}\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-view-table-selection-checkbox\"\n\t\t\t__nextHasNoMarginBottom\n\t\t\taria-label={ selectionLabel }\n\t\t\taria-disabled={ disabled }\n\t\t\tchecked={ checked }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( disabled ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonSelectionChange(\n\t\t\t\t\tselection.includes( id )\n\t\t\t\t\t\t? selection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t\t: [ ...selection, id ]\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAAwD,IAAAE,WAAA,GAAAF,OAAA;AAJxD;AACA;AACA;;AAIA;AACA;AACA;;AAae,SAASG,uBAAuBA,CAAU;EACxDC,SAAS;EACTC,iBAAiB;EACjBC,IAAI;EACJC,SAAS;EACTC,YAAY;EACZC;AACqC,CAAC,EAAG;EACzC,MAAMC,EAAE,GAAGH,SAAS,CAAED,IAAK,CAAC;EAC5B,MAAMK,OAAO,GAAG,CAAEF,QAAQ,IAAIL,SAAS,CAACQ,QAAQ,CAAEF,EAAG,CAAC;EACtD,IAAIG,cAAc;EAClB,IAAKL,YAAY,EAAEM,QAAQ,IAAIR,IAAI,EAAG;IACrC;IACAO,cAAc,GAAG,IAAAE,aAAO,GACvB;IACAJ,OAAO,GAAG,IAAAK,QAAE,EAAE,mBAAoB,CAAC,GAAG,IAAAA,QAAE,EAAE,iBAAkB,CAAC,EAC7DR,YAAY,CAACM,QAAQ,CAAE;MAAER;IAAK,CAAE,CACjC,CAAC;EACF,CAAC,MAAM;IACNO,cAAc,GAAGF,OAAO,GACrB,IAAAK,QAAE,EAAE,mBAAoB,CAAC,GACzB,IAAAA,QAAE,EAAE,eAAgB,CAAC;EACzB;EACA,oBACC,IAAAd,WAAA,CAAAe,GAAA,EAAChB,WAAA,CAAAiB,eAAe;IACfC,SAAS,EAAC,yCAAyC;IACnDC,uBAAuB;IACvB,cAAaP,cAAgB;IAC7B,iBAAgBJ,QAAU;IAC1BE,OAAO,EAAGA,OAAS;IACnBU,QAAQ,EAAGA,CAAA,KAAM;MAChB,IAAKZ,QAAQ,EAAG;QACf;MACD;MAEAJ,iBAAiB,CAChBD,SAAS,CAACQ,QAAQ,CAAEF,EAAG,CAAC,GACrBN,SAAS,CAACkB,MAAM,CAAIC,MAAM,IAAMb,EAAE,KAAKa,MAAO,CAAC,GAC/C,CAAE,GAAGnB,SAAS,EAAEM,EAAE,CACtB,CAAC;IACF;EAAG,CACH,CAAC;AAEJ","ignoreList":[]}

package/build/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/dataviews/src/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactElement, ReactNode } from 'react';\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\ninterface 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 type Operator =\n\t| 'is'\n\t| 'isNot'\n\t| 'isAny'\n\t| 'isNone'\n\t| 'isAll'\n\t| 'isNotAll';\n\nexport type AnyItem = Record< string, any >;\n\n/**\n * A dataview field for a specific property of a data type.\n */\nexport interface Field< Item extends AnyItem > {\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\theader?: string;\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\t/**\n\t * Callback used to render the field. Defaults to `field.getValue`.\n\t */\n\trender?: ( args: { item: Item } ) => ReactNode;\n\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 * 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 | undefined;\n}\n\nexport type NormalizedField< Item extends AnyItem > = Field< Item > &\n\tRequired< Pick< Field< Item >, 'header' | 'getValue' | 'render' > >;\n\n/**\n * A collection of dataview fields for a data type.\n */\nexport type Fields< Item extends AnyItem > = Field< Item >[];\n\nexport type Data< Item extends AnyItem > = Item[];\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\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\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 hidden fields.\n\t */\n\thiddenFields: string[];\n}\n\nexport interface ViewTable extends ViewBase {\n\ttype: 'table';\n\n\tlayout: {\n\t\t/**\n\t\t * The field to use as the primary field.\n\t\t */\n\t\tprimaryField?: string;\n\n\t\t/**\n\t\t * The field to use as the media field.\n\t\t */\n\t\tmediaField?: string;\n\t};\n}\n\nexport interface ViewList extends ViewBase {\n\ttype: 'list';\n\n\tlayout: {\n\t\t/**\n\t\t * The field to use as the primary field.\n\t\t */\n\t\tprimaryField?: string;\n\n\t\t/**\n\t\t * The field to use as the media field.\n\t\t */\n\t\tmediaField?: string;\n\t};\n}\n\nexport interface ViewGrid extends ViewBase {\n\ttype: 'grid';\n\n\tlayout: {\n\t\t/**\n\t\t * The field to use as the primary field.\n\t\t */\n\t\tprimaryField?: string;\n\n\t\t/**\n\t\t * The field to use as the media field.\n\t\t */\n\t\tmediaField?: string;\n\n\t\t/**\n\t\t * The fields to use as columns.\n\t\t */\n\t\tcolumnFields?: string[];\n\n\t\t/**\n\t\t * The fields to use as badge fields.\n\t\t */\n\t\tbadgeFields?: string[];\n\t};\n}\n\nexport type View = ViewList | ViewGrid | ViewTable;\n\ninterface ActionBase< Item extends AnyItem > {\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\nexport interface ActionModal< Item extends AnyItem >\n\textends 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}: {\n\t\titems: Item[];\n\t\tcloseModal?: () => void;\n\t\tonActionPerformed?: ( items: Item[] ) => void;\n\t} ) => 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\nexport interface ActionButton< Item extends AnyItem >\n\textends ActionBase< AnyItem > {\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 extends AnyItem > =\n\t| ActionModal< Item >\n\t| ActionButton< Item >;\n\nexport interface ViewBaseProps< Item extends AnyItem > {\n\tactions: Action< Item >[];\n\tdata: Item[];\n\tfields: NormalizedField< Item >[];\n\tgetItemId: ( item: Item ) => string;\n\tisLoading?: boolean;\n\tonChangeView( view: View ): void;\n\tonSelectionChange: ( items: Item[] ) => void;\n\tselection: string[];\n\tsetOpenedFilter: ( fieldId: string ) => void;\n\tview: View;\n}\n\nexport interface ViewTableProps< Item extends AnyItem >\n\textends ViewBaseProps< Item > {\n\tview: ViewTable;\n}\n\nexport interface ViewListProps< Item extends AnyItem >\n\textends ViewBaseProps< Item > {\n\tview: ViewList;\n}\n\nexport interface ViewGridProps< Item extends AnyItem >\n\textends ViewBaseProps< Item > {\n\tview: ViewGrid;\n}\n\nexport type ViewProps< Item extends AnyItem > =\n\t| ViewTableProps< Item >\n\t| ViewGridProps< Item >\n\t| ViewListProps< Item >;\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/dataviews/src/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactElement, ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { SetSelection } from './private-types';\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\ninterface 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 type Operator =\n\t| 'is'\n\t| 'isNot'\n\t| 'isAny'\n\t| 'isNone'\n\t| 'isAll'\n\t| 'isNotAll';\n\nexport type ItemRecord = Record< string, unknown >;\n\nexport type FieldType = 'text';\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\theader?: 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?: ( args: { item: Item } ) => ReactNode;\n\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 * 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 | undefined;\n} & ( Item extends ItemRecord\n\t? {\n\t\t\t/**\n\t\t\t * Callback used to retrieve the value of the field from the item.\n\t\t\t * Defaults to `item[ field.id ]`.\n\t\t\t */\n\t\t\tgetValue?: ( args: { item: Item } ) => any;\n\t  }\n\t: {\n\t\t\t/**\n\t\t\t * Callback used to retrieve the value of the field from the item.\n\t\t\t * Defaults to `item[ field.id ]`.\n\t\t\t */\n\t\t\tgetValue: ( args: { item: Item } ) => any;\n\t  } );\n\nexport type NormalizedField< Item > = Field< Item > & {\n\theader: string;\n\tgetValue: ( args: { item: Item } ) => any;\n\trender: ( args: { item: Item } ) => ReactNode;\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\n/**\n * The form configuration.\n */\nexport type Form = {\n\tvisibleFields?: string[];\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\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\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 hidden fields.\n\t */\n\tfields?: string[];\n}\n\nexport interface ViewTable extends ViewBase {\n\ttype: 'table';\n\n\tlayout?: {\n\t\t/**\n\t\t * The field to use as the primary field.\n\t\t */\n\t\tprimaryField?: string;\n\n\t\t/**\n\t\t * The field to use as the media field.\n\t\t */\n\t\tmediaField?: string;\n\t};\n}\n\nexport interface ViewList extends ViewBase {\n\ttype: 'list';\n\n\tlayout?: {\n\t\t/**\n\t\t * The field to use as the primary field.\n\t\t */\n\t\tprimaryField?: string;\n\n\t\t/**\n\t\t * The field to use as the media field.\n\t\t */\n\t\tmediaField?: string;\n\t};\n}\n\nexport interface ViewGrid extends ViewBase {\n\ttype: 'grid';\n\n\tlayout?: {\n\t\t/**\n\t\t * The field to use as the primary field.\n\t\t */\n\t\tprimaryField?: string;\n\n\t\t/**\n\t\t * The field to use as the media field.\n\t\t */\n\t\tmediaField?: string;\n\n\t\t/**\n\t\t * The fields to use as columns.\n\t\t */\n\t\tcolumnFields?: string[];\n\n\t\t/**\n\t\t * The fields to use as badge fields.\n\t\t */\n\t\tbadgeFields?: string[];\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\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}: {\n\t\titems: Item[];\n\t\tcloseModal?: () => void;\n\t\tonActionPerformed?: ( items: Item[] ) => void;\n\t} ) => 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\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\tactions: Action< Item >[];\n\tdata: Item[];\n\tfields: NormalizedField< Item >[];\n\tgetItemId: ( item: Item ) => string;\n\tisLoading?: boolean;\n\tonChangeView: ( view: View ) => void;\n\tonSelectionChange: SetSelection;\n\tselection: string[];\n\tsetOpenedFilter: ( fieldId: string ) => void;\n\tview: View;\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"],"mappings":"","ignoreList":[]}

package/build/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["_constants","require","sanitizeOperators","field","operators","filterBy","Array","isArray","OPERATOR_IS_ANY","OPERATOR_IS_NONE","filter","operator","ALL_OPERATORS","includes","OPERATOR_IS","OPERATOR_IS_NOT"],"sources":["@wordpress/dataviews/src/utils.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport {\n\tALL_OPERATORS,\n\tOPERATOR_IS,\n\tOPERATOR_IS_NOT,\n\tOPERATOR_IS_ANY,\n\tOPERATOR_IS_NONE,\n} from './constants';\nimport type { AnyItem, NormalizedField } from './types';\n\nexport function sanitizeOperators< Item extends AnyItem >(\n\tfield: NormalizedField< Item >\n) {\n\tlet operators = field.filterBy?.operators;\n\n\t// Assign default values.\n\tif ( ! operators || ! Array.isArray( operators ) ) {\n\t\toperators = [ OPERATOR_IS_ANY, OPERATOR_IS_NONE ];\n\t}\n\n\t// Make sure only valid operators are used.\n\toperators = operators.filter( ( operator ) =>\n\t\tALL_OPERATORS.includes( operator )\n\t);\n\n\t// Do not allow mixing single & multiselection operators.\n\t// Remove multiselection operators if any of the single selection ones is present.\n\tif (\n\t\toperators.includes( OPERATOR_IS ) ||\n\t\toperators.includes( OPERATOR_IS_NOT )\n\t) {\n\t\toperators = operators.filter( ( operator ) =>\n\t\t\t[ OPERATOR_IS, OPERATOR_IS_NOT ].includes( operator )\n\t\t);\n\t}\n\n\treturn operators;\n}\n"],"mappings":";;;;;;AAGA,IAAAA,UAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAUO,SAASC,iBAAiBA,CAChCC,KAA8B,EAC7B;EACD,IAAIC,SAAS,GAAGD,KAAK,CAACE,QAAQ,EAAED,SAAS;;EAEzC;EACA,IAAK,CAAEA,SAAS,IAAI,CAAEE,KAAK,CAACC,OAAO,CAAEH,SAAU,CAAC,EAAG;IAClDA,SAAS,GAAG,CAAEI,0BAAe,EAAEC,2BAAgB,CAAE;EAClD;;EAEA;EACAL,SAAS,GAAGA,SAAS,CAACM,MAAM,CAAIC,QAAQ,IACvCC,wBAAa,CAACC,QAAQ,CAAEF,QAAS,CAClC,CAAC;;EAED;EACA;EACA,IACCP,SAAS,CAACS,QAAQ,CAAEC,sBAAY,CAAC,IACjCV,SAAS,CAACS,QAAQ,CAAEE,0BAAgB,CAAC,EACpC;IACDX,SAAS,GAAGA,SAAS,CAACM,MAAM,CAAIC,QAAQ,IACvC,CAAEG,sBAAW,EAAEC,0BAAe,CAAE,CAACF,QAAQ,CAAEF,QAAS,CACrD,CAAC;EACF;EAEA,OAAOP,SAAS;AACjB","ignoreList":[]}
+{"version":3,"names":["_constants","require","sanitizeOperators","field","operators","filterBy","Array","isArray","OPERATOR_IS_ANY","OPERATOR_IS_NONE","filter","operator","ALL_OPERATORS","includes","OPERATOR_IS","OPERATOR_IS_NOT"],"sources":["@wordpress/dataviews/src/utils.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport {\n\tALL_OPERATORS,\n\tOPERATOR_IS,\n\tOPERATOR_IS_NOT,\n\tOPERATOR_IS_ANY,\n\tOPERATOR_IS_NONE,\n} from './constants';\nimport type { NormalizedField } from './types';\n\nexport function sanitizeOperators< Item >( field: NormalizedField< Item > ) {\n\tlet operators = field.filterBy?.operators;\n\n\t// Assign default values.\n\tif ( ! operators || ! Array.isArray( operators ) ) {\n\t\toperators = [ OPERATOR_IS_ANY, OPERATOR_IS_NONE ];\n\t}\n\n\t// Make sure only valid operators are used.\n\toperators = operators.filter( ( operator ) =>\n\t\tALL_OPERATORS.includes( operator )\n\t);\n\n\t// Do not allow mixing single & multiselection operators.\n\t// Remove multiselection operators if any of the single selection ones is present.\n\tif (\n\t\toperators.includes( OPERATOR_IS ) ||\n\t\toperators.includes( OPERATOR_IS_NOT )\n\t) {\n\t\toperators = operators.filter( ( operator ) =>\n\t\t\t[ OPERATOR_IS, OPERATOR_IS_NOT ].includes( operator )\n\t\t);\n\t}\n\n\treturn operators;\n}\n"],"mappings":";;;;;;AAGA,IAAAA,UAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAUO,SAASC,iBAAiBA,CAAUC,KAA8B,EAAG;EAC3E,IAAIC,SAAS,GAAGD,KAAK,CAACE,QAAQ,EAAED,SAAS;;EAEzC;EACA,IAAK,CAAEA,SAAS,IAAI,CAAEE,KAAK,CAACC,OAAO,CAAEH,SAAU,CAAC,EAAG;IAClDA,SAAS,GAAG,CAAEI,0BAAe,EAAEC,2BAAgB,CAAE;EAClD;;EAEA;EACAL,SAAS,GAAGA,SAAS,CAACM,MAAM,CAAIC,QAAQ,IACvCC,wBAAa,CAACC,QAAQ,CAAEF,QAAS,CAClC,CAAC;;EAED;EACA;EACA,IACCP,SAAS,CAACS,QAAQ,CAAEC,sBAAY,CAAC,IACjCV,SAAS,CAACS,QAAQ,CAAEE,0BAAgB,CAAC,EACpC;IACDX,SAAS,GAAGA,SAAS,CAACM,MAAM,CAAIC,QAAQ,IACvC,CAAEG,sBAAW,EAAEC,0BAAe,CAAE,CAACF,QAAQ,CAAEF,QAAS,CACrD,CAAC;EACF;EAEA,OAAOP,SAAS;AACjB","ignoreList":[]}

package/build/view-actions.js

@@ -35,50 +35,43 @@ const {
 function ViewTypeMenu({
   view,
   onChangeView,
-  supportedLayouts
-}) {
-  let _availableViews = _layouts.VIEW_LAYOUTS;
-  if (supportedLayouts) {
-    _availableViews = _availableViews.filter(_view => supportedLayouts.includes(_view.type));
+  defaultLayouts = {
+    list: {},
+    grid: {},
+    table: {}
   }
-  if (_availableViews.length === 1) {
+}) {
+  const availableLayouts = Object.keys(defaultLayouts);
+  if (availableLayouts.length <= 1) {
     return null;
   }
-  const activeView = _availableViews.find(v => view.type === v.type);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenu, {
-    trigger: /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenuItem, {
-      suffix: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        "aria-hidden": "true",
-        children: activeView?.label
-      }),
+  return availableLayouts.map(layout => {
+    const config = _layouts.VIEW_LAYOUTS.find(v => v.type === layout);
+    if (!config) {
+      return null;
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenuRadioItem, {
+      value: layout,
+      name: "view-actions-available-view",
+      checked: layout === view.type,
+      hideOnClick: true,
+      onChange: e => {
+        switch (e.target.value) {
+          case 'list':
+          case 'grid':
+          case 'table':
+            return onChangeView({
+              ...view,
+              type: e.target.value,
+              ...defaultLayouts[e.target.value]
+            });
+        }
+        throw new Error('Invalid dataview');
+      },
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenuItemLabel, {
-        children: (0, _i18n.__)('Layout')
+        children: config.label
       })
-    }),
-    children: _availableViews.map(availableView => {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenuRadioItem, {
-        value: availableView.type,
-        name: "view-actions-available-view",
-        checked: availableView.type === view.type,
-        hideOnClick: true,
-        onChange: e => {
-          switch (e.target.value) {
-            case 'list':
-            case 'grid':
-            case 'table':
-              return onChangeView({
-                ...view,
-                type: e.target.value,
-                layout: {}
-              });
-          }
-          throw new Error('Invalid dataview');
-        },
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenuItemLabel, {
-          children: availableView.label
-        })
-      }, availableView.type);
-    })
+    }, layout);
   });
 }
 const PAGE_SIZE_VALUES = [10, 20, 50, 100];
@@ -122,7 +115,8 @@ function FieldsVisibilityMenu({
   onChangeView,
   fields
 }) {
-  const hidableFields = fields.filter(field => field.enableHiding !== false && field.id !== view.layout.mediaField);
+  const hidableFields = fields.filter(field => field.enableHiding !== false && field.id !== view?.layout?.mediaField);
+  const viewFields = view.fields || fields.map(field => field.id);
   if (!hidableFields?.length) {
     return null;
   }
@@ -135,11 +129,11 @@ function FieldsVisibilityMenu({
     children: hidableFields?.map(field => {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenuCheckboxItem, {
         value: field.id,
-        checked: !view.hiddenFields?.includes(field.id),
+        checked: viewFields.includes(field.id),
         onChange: () => {
           onChangeView({
             ...view,
-            hiddenFields: view.hiddenFields?.includes(field.id) ? view.hiddenFields.filter(id => id !== field.id) : [...(view.hiddenFields || []), field.id]
+            fields: viewFields.includes(field.id) ? viewFields.filter(id => id !== field.id) : [...viewFields, field.id]
           });
         },
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenuItemLabel, {
@@ -214,30 +208,47 @@ function _ViewActions({
   fields,
   view,
   onChangeView,
-  supportedLayouts
+  defaultLayouts
 }) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenu, {
-    trigger: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
-      size: "compact",
-      icon: _icons.settings,
-      label: (0, _i18n.__)('View options')
-    }),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(DropdownMenuGroup, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ViewTypeMenu, {
-        view: view,
-        onChangeView: onChangeView,
-        supportedLayouts: supportedLayouts
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SortMenu, {
-        fields: fields,
-        view: view,
-        onChangeView: onChangeView
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(FieldsVisibilityMenu, {
-        fields: fields,
-        view: view,
-        onChangeView: onChangeView
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(PageSizeMenu, {
-        view: view,
-        onChangeView: onChangeView
+  const activeView = _layouts.VIEW_LAYOUTS.find(v => view.type === v.type);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
+      spacing: 1,
+      expanded: false,
+      style: {
+        flexShrink: 0
+      },
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenu, {
+        trigger: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+          size: "compact",
+          icon: activeView?.icon,
+          label: (0, _i18n.__)('Layout')
+        }),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ViewTypeMenu, {
+          view: view,
+          onChangeView: onChangeView,
+          defaultLayouts: defaultLayouts
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenu, {
+        trigger: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+          size: "compact",
+          icon: _icons.cog,
+          label: (0, _i18n._x)('View options', 'View is used as a noun')
+        }),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(DropdownMenuGroup, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SortMenu, {
+            fields: fields,
+            view: view,
+            onChangeView: onChangeView
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(FieldsVisibilityMenu, {
+            fields: fields,
+            view: view,
+            onChangeView: onChangeView
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(PageSizeMenu, {
+            view: view,
+            onChangeView: onChangeView
+          })]
+        })
       })]
     })
   });

package/build/view-actions.js.map

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

package/build/view-grid.js

@@ -26,7 +26,6 @@ var _jsxRuntime = require("react/jsx-runtime");
 
 function GridItem({
   selection,
-  data,
   onSelectionChange,
   getItemId,
   item,
@@ -52,17 +51,7 @@ function GridItem({
         if (!hasBulkAction) {
           return;
         }
-        if (!isSelected) {
-          onSelectionChange(data.filter(_item => {
-            const itemId = getItemId?.(_item);
-            return itemId === id || selection.includes(itemId);
-          }));
-        } else {
-          onSelectionChange(data.filter(_item => {
-            const itemId = getItemId?.(_item);
-            return itemId !== id && selection.includes(itemId);
-          }));
-        }
+        onSelectionChange(selection.includes(id) ? selection.filter(itemId => id !== itemId) : [...selection, id]);
       }
     },
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -78,7 +67,6 @@ function GridItem({
         selection: selection,
         onSelectionChange: onSelectionChange,
         getItemId: getItemId,
-        data: data,
         primaryField: primaryField,
         disabled: !hasBulkAction
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalHStack, {
@@ -155,18 +143,19 @@ function ViewGrid({
   selection,
   view
 }) {
-  const mediaField = fields.find(field => field.id === view.layout.mediaField);
-  const primaryField = fields.find(field => field.id === view.layout.primaryField);
+  const mediaField = fields.find(field => field.id === view.layout?.mediaField);
+  const primaryField = fields.find(field => field.id === view.layout?.primaryField);
+  const viewFields = view.fields || fields.map(field => field.id);
   const {
     visibleFields,
     badgeFields
   } = fields.reduce((accumulator, field) => {
-    if (view.hiddenFields.includes(field.id) || [view.layout.mediaField, view.layout.primaryField].includes(field.id)) {
+    if (!viewFields.includes(field.id) || [view.layout?.mediaField, view?.layout?.primaryField].includes(field.id)) {
       return accumulator;
     }
     // If the field is a badge field, add it to the badgeFields array
     // otherwise add it to the rest visibleFields array.
-    const key = view.layout.badgeFields?.includes(field.id) ? 'badgeFields' : 'visibleFields';
+    const key = view.layout?.badgeFields?.includes(field.id) ? 'badgeFields' : 'visibleFields';
     accumulator[key].push(field);
     return accumulator;
   }, {
@@ -184,7 +173,6 @@ function ViewGrid({
       children: data.map(item => {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridItem, {
           selection: selection,
-          data: data,
           onSelectionChange: onSelectionChange,
           getItemId: getItemId,
           item: item,
@@ -193,7 +181,7 @@ function ViewGrid({
           primaryField: primaryField,
           visibleFields: visibleFields,
           badgeFields: badgeFields,
-          columnFields: view.layout.columnFields
+          columnFields: view.layout?.columnFields
         }, getItemId(item));
       })
     }), !hasData && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/build/view-grid.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_components","_i18n","_itemActions","_singleSelectionCheckbox","_bulkActions","_jsxRuntime","GridItem","selection","data","onSelectionChange","getItemId","item","actions","mediaField","primaryField","visibleFields","badgeFields","columnFields","hasBulkAction","useHasAPossibleBulkAction","id","isSelected","includes","jsxs","__experimentalVStack","spacing","className","clsx","onClickCapture","event","ctrlKey","metaKey","stopPropagation","preventDefault","filter","_item","itemId","children","jsx","render","__experimentalHStack","justify","default","disabled","isCompact","length","wrap","alignment","map","field","renderedValue","FlexItem","Flex","gap","expanded","style","height","direction","Fragment","header","maxHeight","ViewGrid","fields","isLoading","view","find","layout","reduce","accumulator","hiddenFields","key","push","hasData","__experimentalGrid","columns","Spinner","__"],"sources":["@wordpress/dataviews/src/view-grid.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tSpinner,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\nimport SingleSelectionCheckbox from './single-selection-checkbox';\nimport { useHasAPossibleBulkAction } from './bulk-actions';\nimport type { Action, AnyItem, NormalizedField, ViewGridProps } from './types';\n\ninterface GridItemProps< Item extends AnyItem > {\n\tselection: string[];\n\tdata: Item[];\n\tonSelectionChange: ( items: Item[] ) => void;\n\tgetItemId: ( item: Item ) => string;\n\titem: Item;\n\tactions: Action< Item >[];\n\tmediaField?: NormalizedField< Item >;\n\tprimaryField?: NormalizedField< Item >;\n\tvisibleFields: NormalizedField< Item >[];\n\tbadgeFields: NormalizedField< Item >[];\n\tcolumnFields?: string[];\n}\n\nfunction GridItem< Item extends AnyItem >( {\n\tselection,\n\tdata,\n\tonSelectionChange,\n\tgetItemId,\n\titem,\n\tactions,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n\tbadgeFields,\n\tcolumnFields,\n}: GridItemProps< Item > ) {\n\tconst hasBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst id = getItemId( item );\n\tconst isSelected = selection.includes( id );\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 0 }\n\t\t\tkey={ id }\n\t\t\tclassName={ clsx( 'dataviews-view-grid__card', {\n\t\t\t\t'is-selected': hasBulkAction && isSelected,\n\t\t\t} ) }\n\t\t\tonClickCapture={ ( event ) => {\n\t\t\t\tif ( event.ctrlKey || event.metaKey ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! hasBulkAction ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId === id ||\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId !== id &&\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t{ mediaField?.render( { item } ) }\n\t\t\t</div>\n\t\t\t<HStack\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews-view-grid__title-actions\"\n\t\t\t>\n\t\t\t\t<SingleSelectionCheckbox\n\t\t\t\t\titem={ item }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\tdisabled={ ! hasBulkAction }\n\t\t\t\t/>\n\t\t\t\t<HStack className=\"dataviews-view-grid__primary-field\">\n\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t</HStack>\n\t\t\t\t<ItemActions item={ item } actions={ actions } isCompact />\n\t\t\t</HStack>\n\t\t\t{ !! badgeFields?.length && (\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"dataviews-view-grid__badge-fields\"\n\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\twrap\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t>\n\t\t\t\t\t{ badgeFields.map( ( field ) => {\n\t\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ !! visibleFields?.length && (\n\t\t\t\t<VStack className=\"dataviews-view-grid__fields\" spacing={ 3 }>\n\t\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'dataviews-view-grid__field',\n\t\t\t\t\t\t\t\t\tcolumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t\t? 'is-column'\n\t\t\t\t\t\t\t\t\t\t: 'is-row'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tgap={ 1 }\n\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\texpanded\n\t\t\t\t\t\t\t\tstyle={ { height: 'auto' } }\n\t\t\t\t\t\t\t\tdirection={\n\t\t\t\t\t\t\t\t\tcolumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t\t? 'column'\n\t\t\t\t\t\t\t\t\t\t: 'row'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<FlexItem className=\"dataviews-view-grid__field-name\">\n\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t\t\t\tstyle={ { maxHeight: 'none' } }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t</Flex>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default function ViewGrid< Item extends AnyItem >( {\n\tactions,\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading,\n\tonSelectionChange,\n\tselection,\n\tview,\n}: ViewGridProps< Item > ) {\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst { visibleFields, badgeFields } = fields.reduce(\n\t\t( accumulator: Record< string, NormalizedField< Item >[] >, field ) => {\n\t\t\tif (\n\t\t\t\tview.hiddenFields.includes( field.id ) ||\n\t\t\t\t[ view.layout.mediaField, view.layout.primaryField ].includes(\n\t\t\t\t\tfield.id\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\treturn accumulator;\n\t\t\t}\n\t\t\t// If the field is a badge field, add it to the badgeFields array\n\t\t\t// otherwise add it to the rest visibleFields array.\n\t\t\tconst key = view.layout.badgeFields?.includes( field.id )\n\t\t\t\t? 'badgeFields'\n\t\t\t\t: 'visibleFields';\n\t\t\taccumulator[ key ].push( field );\n\t\t\treturn accumulator;\n\t\t},\n\t\t{ visibleFields: [], badgeFields: [] }\n\t);\n\tconst hasData = !! data?.length;\n\treturn (\n\t\t<>\n\t\t\t{ hasData && (\n\t\t\t\t<Grid\n\t\t\t\t\tgap={ 8 }\n\t\t\t\t\tcolumns={ 2 }\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tclassName=\"dataviews-view-grid\"\n\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t>\n\t\t\t\t\t{ data.map( ( item ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\t\tvisibleFields={ visibleFields }\n\t\t\t\t\t\t\t\tbadgeFields={ badgeFields }\n\t\t\t\t\t\t\t\tcolumnFields={ view.layout.columnFields }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</Grid>\n\t\t\t) }\n\t\t\t{ ! hasData && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_components","_i18n","_itemActions","_singleSelectionCheckbox","_bulkActions","_jsxRuntime","GridItem","selection","onSelectionChange","getItemId","item","actions","mediaField","primaryField","visibleFields","badgeFields","columnFields","hasBulkAction","useHasAPossibleBulkAction","id","isSelected","includes","jsxs","__experimentalVStack","spacing","className","clsx","onClickCapture","event","ctrlKey","metaKey","stopPropagation","preventDefault","filter","itemId","children","jsx","render","__experimentalHStack","justify","default","disabled","isCompact","length","wrap","alignment","map","field","renderedValue","FlexItem","Flex","gap","expanded","style","height","direction","Fragment","header","maxHeight","ViewGrid","data","fields","isLoading","view","find","layout","viewFields","reduce","accumulator","key","push","hasData","__experimentalGrid","columns","Spinner","__"],"sources":["@wordpress/dataviews/src/view-grid.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tSpinner,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\nimport SingleSelectionCheckbox from './single-selection-checkbox';\nimport { useHasAPossibleBulkAction } from './bulk-actions';\nimport type { Action, NormalizedField, ViewGridProps } from './types';\nimport type { SetSelection } from './private-types';\n\ninterface GridItemProps< Item > {\n\tselection: string[];\n\tonSelectionChange: SetSelection;\n\tgetItemId: ( item: Item ) => string;\n\titem: Item;\n\tactions: Action< Item >[];\n\tmediaField?: NormalizedField< Item >;\n\tprimaryField?: NormalizedField< Item >;\n\tvisibleFields: NormalizedField< Item >[];\n\tbadgeFields: NormalizedField< Item >[];\n\tcolumnFields?: string[];\n}\n\nfunction GridItem< Item >( {\n\tselection,\n\tonSelectionChange,\n\tgetItemId,\n\titem,\n\tactions,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n\tbadgeFields,\n\tcolumnFields,\n}: GridItemProps< Item > ) {\n\tconst hasBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst id = getItemId( item );\n\tconst isSelected = selection.includes( id );\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 0 }\n\t\t\tkey={ id }\n\t\t\tclassName={ clsx( 'dataviews-view-grid__card', {\n\t\t\t\t'is-selected': hasBulkAction && isSelected,\n\t\t\t} ) }\n\t\t\tonClickCapture={ ( event ) => {\n\t\t\t\tif ( event.ctrlKey || event.metaKey ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! hasBulkAction ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\tselection.includes( id )\n\t\t\t\t\t\t\t? selection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t\t\t: [ ...selection, id ]\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t{ mediaField?.render( { item } ) }\n\t\t\t</div>\n\t\t\t<HStack\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews-view-grid__title-actions\"\n\t\t\t>\n\t\t\t\t<SingleSelectionCheckbox\n\t\t\t\t\titem={ item }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\tdisabled={ ! hasBulkAction }\n\t\t\t\t/>\n\t\t\t\t<HStack className=\"dataviews-view-grid__primary-field\">\n\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t</HStack>\n\t\t\t\t<ItemActions item={ item } actions={ actions } isCompact />\n\t\t\t</HStack>\n\t\t\t{ !! badgeFields?.length && (\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"dataviews-view-grid__badge-fields\"\n\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\twrap\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t>\n\t\t\t\t\t{ badgeFields.map( ( field ) => {\n\t\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ !! visibleFields?.length && (\n\t\t\t\t<VStack className=\"dataviews-view-grid__fields\" spacing={ 3 }>\n\t\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'dataviews-view-grid__field',\n\t\t\t\t\t\t\t\t\tcolumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t\t? 'is-column'\n\t\t\t\t\t\t\t\t\t\t: 'is-row'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tgap={ 1 }\n\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\texpanded\n\t\t\t\t\t\t\t\tstyle={ { height: 'auto' } }\n\t\t\t\t\t\t\t\tdirection={\n\t\t\t\t\t\t\t\t\tcolumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t\t? 'column'\n\t\t\t\t\t\t\t\t\t\t: 'row'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<FlexItem className=\"dataviews-view-grid__field-name\">\n\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t\t\t\tstyle={ { maxHeight: 'none' } }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t</Flex>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default function ViewGrid< Item >( {\n\tactions,\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading,\n\tonSelectionChange,\n\tselection,\n\tview,\n}: ViewGridProps< Item > ) {\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout?.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout?.primaryField\n\t);\n\tconst viewFields = view.fields || fields.map( ( field ) => field.id );\n\tconst { visibleFields, badgeFields } = fields.reduce(\n\t\t( accumulator: Record< string, NormalizedField< Item >[] >, field ) => {\n\t\t\tif (\n\t\t\t\t! viewFields.includes( field.id ) ||\n\t\t\t\t[\n\t\t\t\t\tview.layout?.mediaField,\n\t\t\t\t\tview?.layout?.primaryField,\n\t\t\t\t].includes( field.id )\n\t\t\t) {\n\t\t\t\treturn accumulator;\n\t\t\t}\n\t\t\t// If the field is a badge field, add it to the badgeFields array\n\t\t\t// otherwise add it to the rest visibleFields array.\n\t\t\tconst key = view.layout?.badgeFields?.includes( field.id )\n\t\t\t\t? 'badgeFields'\n\t\t\t\t: 'visibleFields';\n\t\t\taccumulator[ key ].push( field );\n\t\t\treturn accumulator;\n\t\t},\n\t\t{ visibleFields: [], badgeFields: [] }\n\t);\n\tconst hasData = !! data?.length;\n\treturn (\n\t\t<>\n\t\t\t{ hasData && (\n\t\t\t\t<Grid\n\t\t\t\t\tgap={ 8 }\n\t\t\t\t\tcolumns={ 2 }\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tclassName=\"dataviews-view-grid\"\n\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t>\n\t\t\t\t\t{ data.map( ( item ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\t\tvisibleFields={ visibleFields }\n\t\t\t\t\t\t\t\tbadgeFields={ badgeFields }\n\t\t\t\t\t\t\t\tcolumnFields={ view.layout?.columnFields }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</Grid>\n\t\t\t) }\n\t\t\t{ ! hasData && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/view-list.js

@@ -198,7 +198,7 @@ function ListItem({
                 size: "compact",
                 icon: _icons.moreVertical,
                 label: (0, _i18n.__)('Actions'),
-                __experimentalIsFocusable: true,
+                accessibleWhenDisabled: true,
                 disabled: !actions.length,
                 onKeyDown: event => {
                   if (event.key === 'ArrowDown') {
@@ -238,10 +238,11 @@ function ViewList(props) {
   } = props;
   const baseId = (0, _compose.useInstanceId)(ViewList, 'view-list');
   const selectedItem = data?.findLast(item => selection.includes(getItemId(item)));
-  const mediaField = fields.find(field => field.id === view.layout.mediaField);
-  const primaryField = fields.find(field => field.id === view.layout.primaryField);
-  const visibleFields = fields.filter(field => !view.hiddenFields.includes(field.id) && ![view.layout.primaryField, view.layout.mediaField].includes(field.id));
-  const onSelect = (0, _element.useCallback)(item => onSelectionChange([item]), [onSelectionChange]);
+  const mediaField = fields.find(field => field.id === view.layout?.mediaField);
+  const primaryField = fields.find(field => field.id === view.layout?.primaryField);
+  const viewFields = view.fields || fields.map(field => field.id);
+  const visibleFields = fields.filter(field => viewFields.includes(field.id) && ![view.layout?.primaryField, view.layout?.mediaField].includes(field.id));
+  const onSelect = item => onSelectionChange([getItemId(item)]);
   const getItemDomId = (0, _element.useCallback)(item => item ? `${baseId}-${getItemId(item)}` : undefined, [baseId, getItemId]);
   const store = useCompositeStore({
     defaultActiveId: getItemDomId(selectedItem)