@wordpress/dataviews 3.0.0 → 4.0.0

package/build-module/layouts/table/column-header-menu.js

@@ -0,0 +1,190 @@
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { arrowLeft, arrowRight, unseen, funnel } from '@wordpress/icons';
+import { Button, Icon, privateApis as componentsPrivateApis } from '@wordpress/components';
+import { forwardRef, Children, Fragment } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import { unlock } from '../../lock-unlock';
+import { sanitizeOperators } from '../../utils';
+import { SORTING_DIRECTIONS, sortArrows, sortLabels } from '../../constants';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const {
+  DropdownMenuV2: DropdownMenu,
+  DropdownMenuGroupV2: DropdownMenuGroup,
+  DropdownMenuItemV2: DropdownMenuItem,
+  DropdownMenuRadioItemV2: DropdownMenuRadioItem,
+  DropdownMenuItemLabelV2: DropdownMenuItemLabel,
+  DropdownMenuSeparatorV2: DropdownMenuSeparator
+} = unlock(componentsPrivateApis);
+function WithDropDownMenuSeparators({
+  children
+}) {
+  return Children.toArray(children).filter(Boolean).map((child, i) => /*#__PURE__*/_jsxs(Fragment, {
+    children: [i > 0 && /*#__PURE__*/_jsx(DropdownMenuSeparator, {}), child]
+  }, i));
+}
+const _HeaderMenu = forwardRef(function HeaderMenu({
+  fieldId,
+  view,
+  fields,
+  onChangeView,
+  onHide,
+  setOpenedFilter
+}, ref) {
+  const combinedField = view.layout?.combinedFields?.find(f => f.id === fieldId);
+  const index = view.fields?.indexOf(fieldId);
+  if (!!combinedField) {
+    return combinedField.label;
+  }
+  const field = fields.find(f => f.id === fieldId);
+  if (!field) {
+    return null;
+  }
+  const isHidable = field.enableHiding !== false;
+  const isSortable = field.enableSorting !== false;
+  const isSorted = view.sort?.field === field.id;
+  const operators = sanitizeOperators(field);
+  // Filter can be added:
+  // 1. If the field is not already part of a view's filters.
+  // 2. If the field meets the type and operator requirements.
+  // 3. If it's not primary. If it is, it should be already visible.
+  const canAddFilter = !view.filters?.some(_filter => field.id === _filter.field) && !!field.elements?.length && !!operators.length && !field.filterBy?.isPrimary;
+  if (!isSortable && !isHidable && !canAddFilter) {
+    return field.label;
+  }
+  return /*#__PURE__*/_jsx(DropdownMenu, {
+    align: "start",
+    trigger: /*#__PURE__*/_jsxs(Button, {
+      size: "compact",
+      className: "dataviews-view-table-header-button",
+      ref: ref,
+      variant: "tertiary",
+      children: [field.label, view.sort && isSorted && /*#__PURE__*/_jsx("span", {
+        "aria-hidden": "true",
+        children: sortArrows[view.sort.direction]
+      })]
+    }),
+    style: {
+      minWidth: '240px'
+    },
+    children: /*#__PURE__*/_jsxs(WithDropDownMenuSeparators, {
+      children: [isSortable && /*#__PURE__*/_jsx(DropdownMenuGroup, {
+        children: SORTING_DIRECTIONS.map(direction => {
+          const isChecked = view.sort && isSorted && view.sort.direction === direction;
+          const value = `${field.id}-${direction}`;
+          return /*#__PURE__*/_jsx(DropdownMenuRadioItem, {
+            // All sorting radio items share the same name, so that
+            // selecting a sorting option automatically deselects the
+            // previously selected one, even if it is displayed in
+            // another submenu. The field and direction are passed via
+            // the `value` prop.
+            name: "view-table-sorting",
+            value: value,
+            checked: isChecked,
+            onChange: () => {
+              onChangeView({
+                ...view,
+                sort: {
+                  field: field.id,
+                  direction
+                }
+              });
+            },
+            children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
+              children: sortLabels[direction]
+            })
+          }, value);
+        })
+      }), canAddFilter && /*#__PURE__*/_jsx(DropdownMenuGroup, {
+        children: /*#__PURE__*/_jsx(DropdownMenuItem, {
+          prefix: /*#__PURE__*/_jsx(Icon, {
+            icon: funnel
+          }),
+          onClick: () => {
+            setOpenedFilter(field.id);
+            onChangeView({
+              ...view,
+              page: 1,
+              filters: [...(view.filters || []), {
+                field: field.id,
+                value: undefined,
+                operator: operators[0]
+              }]
+            });
+          },
+          children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
+            children: __('Add filter')
+          })
+        })
+      }), /*#__PURE__*/_jsxs(DropdownMenuGroup, {
+        children: [/*#__PURE__*/_jsx(DropdownMenuItem, {
+          prefix: /*#__PURE__*/_jsx(Icon, {
+            icon: arrowLeft
+          }),
+          disabled: index < 1,
+          onClick: () => {
+            var _view$fields$slice;
+            if (!view.fields || index < 1) {
+              return;
+            }
+            onChangeView({
+              ...view,
+              fields: [...((_view$fields$slice = view.fields.slice(0, index - 1)) !== null && _view$fields$slice !== void 0 ? _view$fields$slice : []), field.id, view.fields[index - 1], ...view.fields.slice(index + 1)]
+            });
+          },
+          children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
+            children: __('Move left')
+          })
+        }), /*#__PURE__*/_jsx(DropdownMenuItem, {
+          prefix: /*#__PURE__*/_jsx(Icon, {
+            icon: arrowRight
+          }),
+          disabled: !view.fields || index >= view.fields.length - 1,
+          onClick: () => {
+            var _view$fields$slice2;
+            if (!view.fields || index >= view.fields.length - 1) {
+              return;
+            }
+            onChangeView({
+              ...view,
+              fields: [...((_view$fields$slice2 = view.fields.slice(0, index)) !== null && _view$fields$slice2 !== void 0 ? _view$fields$slice2 : []), view.fields[index + 1], field.id, ...view.fields.slice(index + 2)]
+            });
+          },
+          children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
+            children: __('Move right')
+          })
+        }), isHidable && /*#__PURE__*/_jsx(DropdownMenuItem, {
+          prefix: /*#__PURE__*/_jsx(Icon, {
+            icon: unseen
+          }),
+          onClick: () => {
+            const viewFields = view.fields || fields.map(f => f.id);
+            onHide(field);
+            onChangeView({
+              ...view,
+              fields: viewFields.filter(id => id !== field.id)
+            });
+          },
+          children: /*#__PURE__*/_jsx(DropdownMenuItemLabel, {
+            children: __('Hide')
+          })
+        })]
+      })]
+    })
+  });
+});
+
+// @ts-expect-error Lift the `Item` type argument through the forwardRef.
+const ColumnHeaderMenu = _HeaderMenu;
+export default ColumnHeaderMenu;
+//# sourceMappingURL=column-header-menu.js.map

package/build-module/layouts/table/column-header-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__","arrowLeft","arrowRight","unseen","funnel","Button","Icon","privateApis","componentsPrivateApis","forwardRef","Children","Fragment","unlock","sanitizeOperators","SORTING_DIRECTIONS","sortArrows","sortLabels","jsx","_jsx","jsxs","_jsxs","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuRadioItemV2","DropdownMenuRadioItem","DropdownMenuItemLabelV2","DropdownMenuItemLabel","DropdownMenuSeparatorV2","DropdownMenuSeparator","WithDropDownMenuSeparators","children","toArray","filter","Boolean","map","child","i","_HeaderMenu","HeaderMenu","fieldId","view","fields","onChangeView","onHide","setOpenedFilter","ref","combinedField","layout","combinedFields","find","f","id","index","indexOf","label","field","isHidable","enableHiding","isSortable","enableSorting","isSorted","sort","operators","canAddFilter","filters","some","_filter","elements","length","filterBy","isPrimary","align","trigger","size","className","variant","direction","style","minWidth","isChecked","value","name","checked","onChange","prefix","icon","onClick","page","undefined","operator","disabled","_view$fields$slice","slice","_view$fields$slice2","viewFields","ColumnHeaderMenu"],"sources":["@wordpress/dataviews/src/layouts/table/column-header-menu.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, Ref, PropsWithoutRef, RefAttributes } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { arrowLeft, arrowRight, unseen, funnel } from '@wordpress/icons';\nimport {\n\tButton,\n\tIcon,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { forwardRef, Children, Fragment } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { sanitizeOperators } from '../../utils';\nimport { SORTING_DIRECTIONS, sortArrows, sortLabels } from '../../constants';\nimport type {\n\tNormalizedField,\n\tSortDirection,\n\tViewTable as ViewTableType,\n} from '../../types';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuRadioItemV2: DropdownMenuRadioItem,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n\tDropdownMenuSeparatorV2: DropdownMenuSeparator,\n} = unlock( componentsPrivateApis );\n\ninterface HeaderMenuProps< Item > {\n\tfieldId: string;\n\tview: ViewTableType;\n\tfields: NormalizedField< Item >[];\n\tonChangeView: ( view: ViewTableType ) => void;\n\tonHide: ( field: NormalizedField< Item > ) => void;\n\tsetOpenedFilter: ( fieldId: string ) => void;\n}\n\nfunction WithDropDownMenuSeparators( { children }: { children: ReactNode } ) {\n\treturn Children.toArray( children )\n\t\t.filter( Boolean )\n\t\t.map( ( child, i ) => (\n\t\t\t<Fragment key={ i }>\n\t\t\t\t{ i > 0 && <DropdownMenuSeparator /> }\n\t\t\t\t{ child }\n\t\t\t</Fragment>\n\t\t) );\n}\n\nconst _HeaderMenu = forwardRef( function HeaderMenu< Item >(\n\t{\n\t\tfieldId,\n\t\tview,\n\t\tfields,\n\t\tonChangeView,\n\t\tonHide,\n\t\tsetOpenedFilter,\n\t}: HeaderMenuProps< Item >,\n\tref: Ref< HTMLButtonElement >\n) {\n\tconst combinedField = view.layout?.combinedFields?.find(\n\t\t( f ) => f.id === fieldId\n\t);\n\tconst index = view.fields?.indexOf( fieldId ) as number;\n\tif ( !! combinedField ) {\n\t\treturn combinedField.label;\n\t}\n\tconst field = fields.find( ( f ) => f.id === fieldId );\n\tif ( ! field ) {\n\t\treturn null;\n\t}\n\tconst isHidable = field.enableHiding !== false;\n\tconst isSortable = field.enableSorting !== false;\n\tconst isSorted = view.sort?.field === field.id;\n\tconst operators = sanitizeOperators( field );\n\t// Filter can be added:\n\t// 1. If the field is not already part of a view's filters.\n\t// 2. If the field meets the type and operator requirements.\n\t// 3. If it's not primary. If it is, it should be already visible.\n\tconst canAddFilter =\n\t\t! view.filters?.some( ( _filter ) => field.id === _filter.field ) &&\n\t\t!! field.elements?.length &&\n\t\t!! operators.length &&\n\t\t! field.filterBy?.isPrimary;\n\tif ( ! isSortable && ! isHidable && ! canAddFilter ) {\n\t\treturn field.label;\n\t}\n\treturn (\n\t\t<DropdownMenu\n\t\t\talign=\"start\"\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\tclassName=\"dataviews-view-table-header-button\"\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t>\n\t\t\t\t\t{ field.label }\n\t\t\t\t\t{ view.sort && isSorted && (\n\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t{ sortArrows[ view.sort.direction ] }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) }\n\t\t\t\t</Button>\n\t\t\t}\n\t\t\tstyle={ { minWidth: '240px' } }\n\t\t>\n\t\t\t<WithDropDownMenuSeparators>\n\t\t\t\t{ isSortable && (\n\t\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t\t{ SORTING_DIRECTIONS.map(\n\t\t\t\t\t\t\t( direction: SortDirection ) => {\n\t\t\t\t\t\t\t\tconst isChecked =\n\t\t\t\t\t\t\t\t\tview.sort &&\n\t\t\t\t\t\t\t\t\tisSorted &&\n\t\t\t\t\t\t\t\t\tview.sort.direction === direction;\n\n\t\t\t\t\t\t\t\tconst value = `${ field.id }-${ direction }`;\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\t\t\t\t\tkey={ value }\n\t\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\t// selecting a sorting option automatically deselects the\n\t\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\t// another submenu. The field and direction are passed via\n\t\t\t\t\t\t\t\t\t\t// the `value` prop.\n\t\t\t\t\t\t\t\t\t\tname=\"view-table-sorting\"\n\t\t\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\t\t\tchecked={ isChecked }\n\t\t\t\t\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t\t\tsort: {\n\t\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\t\tdirection,\n\t\t\t\t\t\t\t\t\t\t\t\t},\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\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t{ sortLabels[ direction ] }\n\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t</DropdownMenuRadioItem>\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</DropdownMenuGroup>\n\t\t\t\t) }\n\t\t\t\t{ canAddFilter && (\n\t\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\tprefix={ <Icon icon={ funnel } /> }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetOpenedFilter( field.id );\n\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t\t\tfilters: [\n\t\t\t\t\t\t\t\t\t\t...( view.filters || [] ),\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tfield: field.id,\n\t\t\t\t\t\t\t\t\t\t\tvalue: undefined,\n\t\t\t\t\t\t\t\t\t\t\toperator: operators[ 0 ],\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} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t{ __( 'Add filter' ) }\n\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t</DropdownMenuGroup>\n\t\t\t\t) }\n\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\tprefix={ <Icon icon={ arrowLeft } /> }\n\t\t\t\t\t\tdisabled={ index < 1 }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tif ( ! view.fields || index < 1 ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\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: [\n\t\t\t\t\t\t\t\t\t...( view.fields.slice( 0, index - 1 ) ??\n\t\t\t\t\t\t\t\t\t\t[] ),\n\t\t\t\t\t\t\t\t\tfield.id,\n\t\t\t\t\t\t\t\t\tview.fields[ index - 1 ],\n\t\t\t\t\t\t\t\t\t...view.fields.slice( index + 1 ),\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\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ __( 'Move left' ) }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\tprefix={ <Icon icon={ arrowRight } /> }\n\t\t\t\t\t\tdisabled={\n\t\t\t\t\t\t\t! view.fields || index >= view.fields.length - 1\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t! view.fields ||\n\t\t\t\t\t\t\t\tindex >= view.fields.length - 1\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\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: [\n\t\t\t\t\t\t\t\t\t...( view.fields.slice( 0, index ) ?? [] ),\n\t\t\t\t\t\t\t\t\tview.fields[ index + 1 ],\n\t\t\t\t\t\t\t\t\tfield.id,\n\t\t\t\t\t\t\t\t\t...view.fields.slice( index + 2 ),\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\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ __( 'Move right' ) }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t{ isHidable && (\n\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\tprefix={ <Icon icon={ unseen } /> }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tconst viewFields =\n\t\t\t\t\t\t\t\t\tview.fields || fields.map( ( f ) => f.id );\n\t\t\t\t\t\t\t\tonHide( field );\n\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\tfields: viewFields.filter(\n\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} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t{ __( 'Hide' ) }\n\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t) }\n\t\t\t\t</DropdownMenuGroup>\n\t\t\t</WithDropDownMenuSeparators>\n\t\t</DropdownMenu>\n\t);\n} );\n\n// @ts-expect-error Lift the `Item` type argument through the forwardRef.\nconst ColumnHeaderMenu: < Item >(\n\tprops: PropsWithoutRef< HeaderMenuProps< Item > > &\n\t\tRefAttributes< HTMLButtonElement >\n) => ReturnType< typeof _HeaderMenu > = _HeaderMenu;\n\nexport default ColumnHeaderMenu;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,EAAEC,UAAU,EAAEC,MAAM,EAAEC,MAAM,QAAQ,kBAAkB;AACxE,SACCC,MAAM,EACNC,IAAI,EACJC,WAAW,IAAIC,qBAAqB,QAC9B,uBAAuB;AAC9B,SAASC,UAAU,EAAEC,QAAQ,EAAEC,QAAQ,QAAQ,oBAAoB;;AAEnE;AACA;AACA;AACA,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,iBAAiB,QAAQ,aAAa;AAC/C,SAASC,kBAAkB,EAAEC,UAAU,EAAEC,UAAU,QAAQ,iBAAiB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAO7E,MAAM;EACLC,cAAc,EAAEC,YAAY;EAC5BC,mBAAmB,EAAEC,iBAAiB;EACtCC,kBAAkB,EAAEC,gBAAgB;EACpCC,uBAAuB,EAAEC,qBAAqB;EAC9CC,uBAAuB,EAAEC,qBAAqB;EAC9CC,uBAAuB,EAAEC;AAC1B,CAAC,GAAGpB,MAAM,CAAEJ,qBAAsB,CAAC;AAWnC,SAASyB,0BAA0BA,CAAE;EAAEC;AAAkC,CAAC,EAAG;EAC5E,OAAOxB,QAAQ,CAACyB,OAAO,CAAED,QAAS,CAAC,CACjCE,MAAM,CAAEC,OAAQ,CAAC,CACjBC,GAAG,CAAE,CAAEC,KAAK,EAAEC,CAAC,kBACfpB,KAAA,CAACT,QAAQ;IAAAuB,QAAA,GACNM,CAAC,GAAG,CAAC,iBAAItB,IAAA,CAACc,qBAAqB,IAAE,CAAC,EAClCO,KAAK;EAAA,GAFQC,CAGN,CACT,CAAC;AACL;AAEA,MAAMC,WAAW,GAAGhC,UAAU,CAAE,SAASiC,UAAUA,CAClD;EACCC,OAAO;EACPC,IAAI;EACJC,MAAM;EACNC,YAAY;EACZC,MAAM;EACNC;AACwB,CAAC,EAC1BC,GAA6B,EAC5B;EACD,MAAMC,aAAa,GAAGN,IAAI,CAACO,MAAM,EAAEC,cAAc,EAAEC,IAAI,CACpDC,CAAC,IAAMA,CAAC,CAACC,EAAE,KAAKZ,OACnB,CAAC;EACD,MAAMa,KAAK,GAAGZ,IAAI,CAACC,MAAM,EAAEY,OAAO,CAAEd,OAAQ,CAAW;EACvD,IAAK,CAAC,CAAEO,aAAa,EAAG;IACvB,OAAOA,aAAa,CAACQ,KAAK;EAC3B;EACA,MAAMC,KAAK,GAAGd,MAAM,CAACQ,IAAI,CAAIC,CAAC,IAAMA,CAAC,CAACC,EAAE,KAAKZ,OAAQ,CAAC;EACtD,IAAK,CAAEgB,KAAK,EAAG;IACd,OAAO,IAAI;EACZ;EACA,MAAMC,SAAS,GAAGD,KAAK,CAACE,YAAY,KAAK,KAAK;EAC9C,MAAMC,UAAU,GAAGH,KAAK,CAACI,aAAa,KAAK,KAAK;EAChD,MAAMC,QAAQ,GAAGpB,IAAI,CAACqB,IAAI,EAAEN,KAAK,KAAKA,KAAK,CAACJ,EAAE;EAC9C,MAAMW,SAAS,GAAGrD,iBAAiB,CAAE8C,KAAM,CAAC;EAC5C;EACA;EACA;EACA;EACA,MAAMQ,YAAY,GACjB,CAAEvB,IAAI,CAACwB,OAAO,EAAEC,IAAI,CAAIC,OAAO,IAAMX,KAAK,CAACJ,EAAE,KAAKe,OAAO,CAACX,KAAM,CAAC,IACjE,CAAC,CAAEA,KAAK,CAACY,QAAQ,EAAEC,MAAM,IACzB,CAAC,CAAEN,SAAS,CAACM,MAAM,IACnB,CAAEb,KAAK,CAACc,QAAQ,EAAEC,SAAS;EAC5B,IAAK,CAAEZ,UAAU,IAAI,CAAEF,SAAS,IAAI,CAAEO,YAAY,EAAG;IACpD,OAAOR,KAAK,CAACD,KAAK;EACnB;EACA,oBACCxC,IAAA,CAACI,YAAY;IACZqD,KAAK,EAAC,OAAO;IACbC,OAAO,eACNxD,KAAA,CAACf,MAAM;MACNwE,IAAI,EAAC,SAAS;MACdC,SAAS,EAAC,oCAAoC;MAC9C7B,GAAG,EAAGA,GAAK;MACX8B,OAAO,EAAC,UAAU;MAAA7C,QAAA,GAEhByB,KAAK,CAACD,KAAK,EACXd,IAAI,CAACqB,IAAI,IAAID,QAAQ,iBACtB9C,IAAA;QAAM,eAAY,MAAM;QAAAgB,QAAA,EACrBnB,UAAU,CAAE6B,IAAI,CAACqB,IAAI,CAACe,SAAS;MAAE,CAC9B,CACN;IAAA,CACM,CACR;IACDC,KAAK,EAAG;MAAEC,QAAQ,EAAE;IAAQ,CAAG;IAAAhD,QAAA,eAE/Bd,KAAA,CAACa,0BAA0B;MAAAC,QAAA,GACxB4B,UAAU,iBACX5C,IAAA,CAACM,iBAAiB;QAAAU,QAAA,EACfpB,kBAAkB,CAACwB,GAAG,CACrB0C,SAAwB,IAAM;UAC/B,MAAMG,SAAS,GACdvC,IAAI,CAACqB,IAAI,IACTD,QAAQ,IACRpB,IAAI,CAACqB,IAAI,CAACe,SAAS,KAAKA,SAAS;UAElC,MAAMI,KAAK,GAAI,GAAGzB,KAAK,CAACJ,EAAI,IAAIyB,SAAW,EAAC;UAE5C,oBACC9D,IAAA,CAACU,qBAAqB;YAErB;YACA;YACA;YACA;YACA;YACAyD,IAAI,EAAC,oBAAoB;YACzBD,KAAK,EAAGA,KAAO;YACfE,OAAO,EAAGH,SAAW;YACrBI,QAAQ,EAAGA,CAAA,KAAM;cAChBzC,YAAY,CAAE;gBACb,GAAGF,IAAI;gBACPqB,IAAI,EAAE;kBACLN,KAAK,EAAEA,KAAK,CAACJ,EAAE;kBACfyB;gBACD;cACD,CAAE,CAAC;YACJ,CAAG;YAAA9C,QAAA,eAEHhB,IAAA,CAACY,qBAAqB;cAAAI,QAAA,EACnBlB,UAAU,CAAEgE,SAAS;YAAE,CACH;UAAC,GArBlBI,KAsBgB,CAAC;QAE1B,CACD;MAAC,CACiB,CACnB,EACCjB,YAAY,iBACbjD,IAAA,CAACM,iBAAiB;QAAAU,QAAA,eACjBhB,IAAA,CAACQ,gBAAgB;UAChB8D,MAAM,eAAGtE,IAAA,CAACZ,IAAI;YAACmF,IAAI,EAAGrF;UAAQ,CAAE,CAAG;UACnCsF,OAAO,EAAGA,CAAA,KAAM;YACf1C,eAAe,CAAEW,KAAK,CAACJ,EAAG,CAAC;YAC3BT,YAAY,CAAE;cACb,GAAGF,IAAI;cACP+C,IAAI,EAAE,CAAC;cACPvB,OAAO,EAAE,CACR,IAAKxB,IAAI,CAACwB,OAAO,IAAI,EAAE,CAAE,EACzB;gBACCT,KAAK,EAAEA,KAAK,CAACJ,EAAE;gBACf6B,KAAK,EAAEQ,SAAS;gBAChBC,QAAQ,EAAE3B,SAAS,CAAE,CAAC;cACvB,CAAC;YAEH,CAAE,CAAC;UACJ,CAAG;UAAAhC,QAAA,eAEHhB,IAAA,CAACY,qBAAqB;YAAAI,QAAA,EACnBlC,EAAE,CAAE,YAAa;UAAC,CACE;QAAC,CACP;MAAC,CACD,CACnB,eACDoB,KAAA,CAACI,iBAAiB;QAAAU,QAAA,gBACjBhB,IAAA,CAACQ,gBAAgB;UAChB8D,MAAM,eAAGtE,IAAA,CAACZ,IAAI;YAACmF,IAAI,EAAGxF;UAAW,CAAE,CAAG;UACtC6F,QAAQ,EAAGtC,KAAK,GAAG,CAAG;UACtBkC,OAAO,EAAGA,CAAA,KAAM;YAAA,IAAAK,kBAAA;YACf,IAAK,CAAEnD,IAAI,CAACC,MAAM,IAAIW,KAAK,GAAG,CAAC,EAAG;cACjC;YACD;YACAV,YAAY,CAAE;cACb,GAAGF,IAAI;cACPC,MAAM,EAAE,CACP,KAAAkD,kBAAA,GAAKnD,IAAI,CAACC,MAAM,CAACmD,KAAK,CAAE,CAAC,EAAExC,KAAK,GAAG,CAAE,CAAC,cAAAuC,kBAAA,cAAAA,kBAAA,GACrC,EAAE,CAAE,EACLpC,KAAK,CAACJ,EAAE,EACRX,IAAI,CAACC,MAAM,CAAEW,KAAK,GAAG,CAAC,CAAE,EACxB,GAAGZ,IAAI,CAACC,MAAM,CAACmD,KAAK,CAAExC,KAAK,GAAG,CAAE,CAAC;YAEnC,CAAE,CAAC;UACJ,CAAG;UAAAtB,QAAA,eAEHhB,IAAA,CAACY,qBAAqB;YAAAI,QAAA,EACnBlC,EAAE,CAAE,WAAY;UAAC,CACG;QAAC,CACP,CAAC,eACnBkB,IAAA,CAACQ,gBAAgB;UAChB8D,MAAM,eAAGtE,IAAA,CAACZ,IAAI;YAACmF,IAAI,EAAGvF;UAAY,CAAE,CAAG;UACvC4F,QAAQ,EACP,CAAElD,IAAI,CAACC,MAAM,IAAIW,KAAK,IAAIZ,IAAI,CAACC,MAAM,CAAC2B,MAAM,GAAG,CAC/C;UACDkB,OAAO,EAAGA,CAAA,KAAM;YAAA,IAAAO,mBAAA;YACf,IACC,CAAErD,IAAI,CAACC,MAAM,IACbW,KAAK,IAAIZ,IAAI,CAACC,MAAM,CAAC2B,MAAM,GAAG,CAAC,EAC9B;cACD;YACD;YACA1B,YAAY,CAAE;cACb,GAAGF,IAAI;cACPC,MAAM,EAAE,CACP,KAAAoD,mBAAA,GAAKrD,IAAI,CAACC,MAAM,CAACmD,KAAK,CAAE,CAAC,EAAExC,KAAM,CAAC,cAAAyC,mBAAA,cAAAA,mBAAA,GAAI,EAAE,CAAE,EAC1CrD,IAAI,CAACC,MAAM,CAAEW,KAAK,GAAG,CAAC,CAAE,EACxBG,KAAK,CAACJ,EAAE,EACR,GAAGX,IAAI,CAACC,MAAM,CAACmD,KAAK,CAAExC,KAAK,GAAG,CAAE,CAAC;YAEnC,CAAE,CAAC;UACJ,CAAG;UAAAtB,QAAA,eAEHhB,IAAA,CAACY,qBAAqB;YAAAI,QAAA,EACnBlC,EAAE,CAAE,YAAa;UAAC,CACE;QAAC,CACP,CAAC,EACjB4D,SAAS,iBACV1C,IAAA,CAACQ,gBAAgB;UAChB8D,MAAM,eAAGtE,IAAA,CAACZ,IAAI;YAACmF,IAAI,EAAGtF;UAAQ,CAAE,CAAG;UACnCuF,OAAO,EAAGA,CAAA,KAAM;YACf,MAAMQ,UAAU,GACftD,IAAI,CAACC,MAAM,IAAIA,MAAM,CAACP,GAAG,CAAIgB,CAAC,IAAMA,CAAC,CAACC,EAAG,CAAC;YAC3CR,MAAM,CAAEY,KAAM,CAAC;YACfb,YAAY,CAAE;cACb,GAAGF,IAAI;cACPC,MAAM,EAAEqD,UAAU,CAAC9D,MAAM,CACtBmB,EAAE,IAAMA,EAAE,KAAKI,KAAK,CAACJ,EACxB;YACD,CAAE,CAAC;UACJ,CAAG;UAAArB,QAAA,eAEHhB,IAAA,CAACY,qBAAqB;YAAAI,QAAA,EACnBlC,EAAE,CAAE,MAAO;UAAC,CACQ;QAAC,CACP,CAClB;MAAA,CACiB,CAAC;IAAA,CACO;EAAC,CAChB,CAAC;AAEjB,CAAE,CAAC;;AAEH;AACA,MAAMmG,gBAG+B,GAAG1D,WAAW;AAEnD,eAAe0D,gBAAgB","ignoreList":[]}

package/build-module/layouts/table/index.js

@@ -0,0 +1,344 @@
+/**
+ * External dependencies
+ */
+import clsx from 'clsx';
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { CheckboxControl, Spinner, __experimentalHStack as HStack, __experimentalVStack as VStack } from '@wordpress/components';
+import { useEffect, useId, useRef, useState, useMemo } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import SingleSelectionCheckbox from '../../components/dataviews-selection-checkbox';
+import ItemActions from '../../components/dataviews-item-actions';
+import { sortValues } from '../../constants';
+import { useSomeItemHasAPossibleBulkAction, useHasAPossibleBulkAction } from '../../components/dataviews-bulk-actions';
+import ColumnHeaderMenu from './column-header-menu';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+function BulkSelectionCheckbox({
+  selection,
+  onChangeSelection,
+  data,
+  actions,
+  getItemId
+}) {
+  const selectableItems = useMemo(() => {
+    return data.filter(item => {
+      return actions.some(action => action.supportsBulk && (!action.isEligible || action.isEligible(item)));
+    });
+  }, [data, actions]);
+  const selectedItems = data.filter(item => selection.includes(getItemId(item)) && selectableItems.includes(item));
+  const areAllSelected = selectedItems.length === selectableItems.length;
+  return /*#__PURE__*/_jsx(CheckboxControl, {
+    className: "dataviews-view-table-selection-checkbox",
+    __nextHasNoMarginBottom: true,
+    checked: areAllSelected,
+    indeterminate: !areAllSelected && !!selectedItems.length,
+    onChange: () => {
+      if (areAllSelected) {
+        onChangeSelection([]);
+      } else {
+        onChangeSelection(selectableItems.map(item => getItemId(item)));
+      }
+    },
+    "aria-label": areAllSelected ? __('Deselect all') : __('Select all')
+  });
+}
+function TableColumn({
+  column,
+  fields,
+  view,
+  ...props
+}) {
+  const field = fields.find(f => f.id === column);
+  if (!!field) {
+    return /*#__PURE__*/_jsx(TableColumnField, {
+      ...props,
+      field: field
+    });
+  }
+  const combinedField = view.layout?.combinedFields?.find(f => f.id === column);
+  if (!!combinedField) {
+    return /*#__PURE__*/_jsx(TableColumnCombined, {
+      ...props,
+      fields: fields,
+      view: view,
+      field: combinedField
+    });
+  }
+  return null;
+}
+function TableColumnField({
+  primaryField,
+  item,
+  field
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    className: clsx('dataviews-view-table__cell-content-wrapper', {
+      'dataviews-view-table__primary-field': primaryField?.id === field.id
+    }),
+    children: /*#__PURE__*/_jsx(field.render, {
+      item
+    })
+  });
+}
+function TableColumnCombined({
+  field,
+  ...props
+}) {
+  const children = field.children.map(child => /*#__PURE__*/_jsx(TableColumn, {
+    ...props,
+    column: child
+  }, child));
+  if (field.direction === 'horizontal') {
+    return /*#__PURE__*/_jsx(HStack, {
+      spacing: 3,
+      children: children
+    });
+  }
+  return /*#__PURE__*/_jsx(VStack, {
+    spacing: 0,
+    children: children
+  });
+}
+function TableRow({
+  hasBulkActions,
+  item,
+  actions,
+  fields,
+  id,
+  view,
+  primaryField,
+  selection,
+  getItemId,
+  onChangeSelection
+}) {
+  const hasPossibleBulkAction = useHasAPossibleBulkAction(actions, item);
+  const isSelected = hasPossibleBulkAction && selection.includes(id);
+  const [isHovered, setIsHovered] = useState(false);
+  const handleMouseEnter = () => {
+    setIsHovered(true);
+  };
+  const handleMouseLeave = () => {
+    setIsHovered(false);
+  };
+
+  // Will be set to true if `onTouchStart` fires. This happens before
+  // `onClick` and can be used to exclude touchscreen devices from certain
+  // behaviours.
+  const isTouchDevice = useRef(false);
+  const columns = view.fields || fields.map(f => f.id);
+  return /*#__PURE__*/_jsxs("tr", {
+    className: clsx('dataviews-view-table__row', {
+      'is-selected': hasPossibleBulkAction && isSelected,
+      'is-hovered': isHovered,
+      'has-bulk-actions': hasPossibleBulkAction
+    }),
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+    onTouchStart: () => {
+      isTouchDevice.current = true;
+    },
+    onClick: () => {
+      if (!hasPossibleBulkAction) {
+        return;
+      }
+      if (!isTouchDevice.current && document.getSelection()?.type !== 'Range') {
+        onChangeSelection(selection.includes(id) ? selection.filter(itemId => id !== itemId) : [id]);
+      }
+    },
+    children: [hasBulkActions && /*#__PURE__*/_jsx("td", {
+      className: "dataviews-view-table__checkbox-column",
+      style: {
+        width: '1%'
+      },
+      children: /*#__PURE__*/_jsx("div", {
+        className: "dataviews-view-table__cell-content-wrapper",
+        children: /*#__PURE__*/_jsx(SingleSelectionCheckbox, {
+          item: item,
+          selection: selection,
+          onChangeSelection: onChangeSelection,
+          getItemId: getItemId,
+          primaryField: primaryField,
+          disabled: !hasPossibleBulkAction
+        })
+      })
+    }), columns.map(column => {
+      var _view$layout$styles$c;
+      // Explicits picks the supported styles.
+      const {
+        width,
+        maxWidth,
+        minWidth
+      } = (_view$layout$styles$c = view.layout?.styles?.[column]) !== null && _view$layout$styles$c !== void 0 ? _view$layout$styles$c : {};
+      return /*#__PURE__*/_jsx("td", {
+        style: {
+          width,
+          maxWidth,
+          minWidth
+        },
+        children: /*#__PURE__*/_jsx(TableColumn, {
+          primaryField: primaryField,
+          fields: fields,
+          item: item,
+          column: column,
+          view: view
+        })
+      }, column);
+    }), !!actions?.length &&
+    /*#__PURE__*/
+    // Disable reason: we are not making the element interactive,
+    // but preventing any click events from bubbling up to the
+    // table row. This allows us to add a click handler to the row
+    // itself (to toggle row selection) without erroneously
+    // intercepting click events from ItemActions.
+    /* eslint-disable jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events */
+    _jsx("td", {
+      className: "dataviews-view-table__actions-column",
+      onClick: e => e.stopPropagation(),
+      children: /*#__PURE__*/_jsx(ItemActions, {
+        item: item,
+        actions: actions
+      })
+    })
+    /* eslint-enable jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events */]
+  });
+}
+function ViewTable({
+  actions,
+  data,
+  fields,
+  getItemId,
+  isLoading = false,
+  onChangeView,
+  onChangeSelection,
+  selection,
+  setOpenedFilter,
+  view
+}) {
+  const headerMenuRefs = useRef(new Map());
+  const headerMenuToFocusRef = useRef();
+  const [nextHeaderMenuToFocus, setNextHeaderMenuToFocus] = useState();
+  const hasBulkActions = useSomeItemHasAPossibleBulkAction(actions, data);
+  useEffect(() => {
+    if (headerMenuToFocusRef.current) {
+      headerMenuToFocusRef.current.focus();
+      headerMenuToFocusRef.current = undefined;
+    }
+  });
+  const tableNoticeId = useId();
+  if (nextHeaderMenuToFocus) {
+    // If we need to force focus, we short-circuit rendering here
+    // to prevent any additional work while we handle that.
+    // Clearing out the focus directive is necessary to make sure
+    // future renders don't cause unexpected focus jumps.
+    headerMenuToFocusRef.current = nextHeaderMenuToFocus;
+    setNextHeaderMenuToFocus(undefined);
+    return;
+  }
+  const onHide = field => {
+    const hidden = headerMenuRefs.current.get(field.id);
+    const fallback = hidden ? headerMenuRefs.current.get(hidden.fallback) : undefined;
+    setNextHeaderMenuToFocus(fallback?.node);
+  };
+  const columns = view.fields || fields.map(f => f.id);
+  const hasData = !!data?.length;
+  const primaryField = fields.find(field => field.id === view.layout?.primaryField);
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsxs("table", {
+      className: "dataviews-view-table",
+      "aria-busy": isLoading,
+      "aria-describedby": tableNoticeId,
+      children: [/*#__PURE__*/_jsx("thead", {
+        children: /*#__PURE__*/_jsxs("tr", {
+          className: "dataviews-view-table__row",
+          children: [hasBulkActions && /*#__PURE__*/_jsx("th", {
+            className: "dataviews-view-table__checkbox-column",
+            style: {
+              width: '1%'
+            },
+            scope: "col",
+            children: /*#__PURE__*/_jsx(BulkSelectionCheckbox, {
+              selection: selection,
+              onChangeSelection: onChangeSelection,
+              data: data,
+              actions: actions,
+              getItemId: getItemId
+            })
+          }), columns.map((column, index) => {
+            var _view$layout$styles$c2;
+            // Explicits picks the supported styles.
+            const {
+              width,
+              maxWidth,
+              minWidth
+            } = (_view$layout$styles$c2 = view.layout?.styles?.[column]) !== null && _view$layout$styles$c2 !== void 0 ? _view$layout$styles$c2 : {};
+            return /*#__PURE__*/_jsx("th", {
+              style: {
+                width,
+                maxWidth,
+                minWidth
+              },
+              "aria-sort": view.sort?.field === column ? sortValues[view.sort.direction] : undefined,
+              scope: "col",
+              children: /*#__PURE__*/_jsx(ColumnHeaderMenu, {
+                ref: node => {
+                  if (node) {
+                    headerMenuRefs.current.set(column, {
+                      node,
+                      fallback: columns[index > 0 ? index - 1 : 1]
+                    });
+                  } else {
+                    headerMenuRefs.current.delete(column);
+                  }
+                },
+                fieldId: column,
+                view: view,
+                fields: fields,
+                onChangeView: onChangeView,
+                onHide: onHide,
+                setOpenedFilter: setOpenedFilter
+              })
+            }, column);
+          }), !!actions?.length && /*#__PURE__*/_jsx("th", {
+            className: "dataviews-view-table__actions-column",
+            children: /*#__PURE__*/_jsx("span", {
+              className: "dataviews-view-table-header",
+              children: __('Actions')
+            })
+          })]
+        })
+      }), /*#__PURE__*/_jsx("tbody", {
+        children: hasData && data.map((item, index) => /*#__PURE__*/_jsx(TableRow, {
+          item: item,
+          hasBulkActions: hasBulkActions,
+          actions: actions,
+          fields: fields,
+          id: getItemId(item) || index.toString(),
+          view: view,
+          primaryField: primaryField,
+          selection: selection,
+          getItemId: getItemId,
+          onChangeSelection: onChangeSelection
+        }, getItemId(item)))
+      })]
+    }), /*#__PURE__*/_jsx("div", {
+      className: clsx({
+        'dataviews-loading': isLoading,
+        'dataviews-no-results': !hasData && !isLoading
+      }),
+      id: tableNoticeId,
+      children: !hasData && /*#__PURE__*/_jsx("p", {
+        children: isLoading ? /*#__PURE__*/_jsx(Spinner, {}) : __('No results')
+      })
+    })]
+  });
+}
+export default ViewTable;
+//# sourceMappingURL=index.js.map

package/build-module/layouts/table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["clsx","__","CheckboxControl","Spinner","__experimentalHStack","HStack","__experimentalVStack","VStack","useEffect","useId","useRef","useState","useMemo","SingleSelectionCheckbox","ItemActions","sortValues","useSomeItemHasAPossibleBulkAction","useHasAPossibleBulkAction","ColumnHeaderMenu","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","BulkSelectionCheckbox","selection","onChangeSelection","data","actions","getItemId","selectableItems","filter","item","some","action","supportsBulk","isEligible","selectedItems","includes","areAllSelected","length","className","__nextHasNoMarginBottom","checked","indeterminate","onChange","map","TableColumn","column","fields","view","props","field","find","f","id","TableColumnField","combinedField","layout","combinedFields","TableColumnCombined","primaryField","children","render","child","direction","spacing","TableRow","hasBulkActions","hasPossibleBulkAction","isSelected","isHovered","setIsHovered","handleMouseEnter","handleMouseLeave","isTouchDevice","columns","onMouseEnter","onMouseLeave","onTouchStart","current","onClick","document","getSelection","type","itemId","style","width","disabled","_view$layout$styles$c","maxWidth","minWidth","styles","e","stopPropagation","ViewTable","isLoading","onChangeView","setOpenedFilter","headerMenuRefs","Map","headerMenuToFocusRef","nextHeaderMenuToFocus","setNextHeaderMenuToFocus","focus","undefined","tableNoticeId","onHide","hidden","get","fallback","node","hasData","scope","index","_view$layout$styles$c2","sort","ref","set","delete","fieldId","toString"],"sources":["@wordpress/dataviews/src/layouts/table/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tCheckboxControl,\n\tSpinner,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport {\n\tuseEffect,\n\tuseId,\n\tuseRef,\n\tuseState,\n\tuseMemo,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SingleSelectionCheckbox from '../../components/dataviews-selection-checkbox';\nimport ItemActions from '../../components/dataviews-item-actions';\nimport { sortValues } from '../../constants';\nimport {\n\tuseSomeItemHasAPossibleBulkAction,\n\tuseHasAPossibleBulkAction,\n} from '../../components/dataviews-bulk-actions';\nimport type {\n\tAction,\n\tNormalizedField,\n\tViewTable as ViewTableType,\n\tViewTableProps,\n\tCombinedField,\n} from '../../types';\nimport type { SetSelection } from '../../private-types';\nimport ColumnHeaderMenu from './column-header-menu';\n\ninterface BulkSelectionCheckboxProps< Item > {\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\tdata: Item[];\n\tactions: Action< Item >[];\n\tgetItemId: ( item: Item ) => string;\n}\n\ninterface TableColumnFieldProps< Item > {\n\tprimaryField?: NormalizedField< Item >;\n\tfield: NormalizedField< Item >;\n\titem: Item;\n}\n\ninterface TableColumnCombinedProps< Item > {\n\tprimaryField?: NormalizedField< Item >;\n\tfields: NormalizedField< Item >[];\n\tfield: CombinedField;\n\titem: Item;\n\tview: ViewTableType;\n}\n\ninterface TableColumnProps< Item > {\n\tprimaryField?: NormalizedField< Item >;\n\tfields: NormalizedField< Item >[];\n\titem: Item;\n\tcolumn: string;\n\tview: ViewTableType;\n}\n\ninterface TableRowProps< Item > {\n\thasBulkActions: boolean;\n\titem: Item;\n\tactions: Action< Item >[];\n\tfields: NormalizedField< Item >[];\n\tid: string;\n\tview: ViewTableType;\n\tprimaryField?: NormalizedField< Item >;\n\tselection: string[];\n\tgetItemId: ( item: Item ) => string;\n\tonChangeSelection: SetSelection;\n}\n\nfunction BulkSelectionCheckbox< Item >( {\n\tselection,\n\tonChangeSelection,\n\tdata,\n\tactions,\n\tgetItemId,\n}: BulkSelectionCheckboxProps< Item > ) {\n\tconst selectableItems = useMemo( () => {\n\t\treturn data.filter( ( item ) => {\n\t\t\treturn actions.some(\n\t\t\t\t( action ) =>\n\t\t\t\t\taction.supportsBulk &&\n\t\t\t\t\t( ! action.isEligible || action.isEligible( item ) )\n\t\t\t);\n\t\t} );\n\t}, [ data, actions ] );\n\tconst selectedItems = data.filter(\n\t\t( item ) =>\n\t\t\tselection.includes( getItemId( item ) ) &&\n\t\t\tselectableItems.includes( item )\n\t);\n\tconst areAllSelected = selectedItems.length === selectableItems.length;\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-view-table-selection-checkbox\"\n\t\t\t__nextHasNoMarginBottom\n\t\t\tchecked={ areAllSelected }\n\t\t\tindeterminate={ ! areAllSelected && !! selectedItems.length }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( areAllSelected ) {\n\t\t\t\t\tonChangeSelection( [] );\n\t\t\t\t} else {\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselectableItems.map( ( item ) => getItemId( item ) )\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={\n\t\t\t\tareAllSelected ? __( 'Deselect all' ) : __( 'Select all' )\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction TableColumn< Item >( {\n\tcolumn,\n\tfields,\n\tview,\n\t...props\n}: TableColumnProps< Item > ) {\n\tconst field = fields.find( ( f ) => f.id === column );\n\tif ( !! field ) {\n\t\treturn <TableColumnField { ...props } field={ field } />;\n\t}\n\tconst combinedField = view.layout?.combinedFields?.find(\n\t\t( f ) => f.id === column\n\t);\n\tif ( !! combinedField ) {\n\t\treturn (\n\t\t\t<TableColumnCombined\n\t\t\t\t{ ...props }\n\t\t\t\tfields={ fields }\n\t\t\t\tview={ view }\n\t\t\t\tfield={ combinedField }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn null;\n}\n\nfunction TableColumnField< Item >( {\n\tprimaryField,\n\titem,\n\tfield,\n}: TableColumnFieldProps< Item > ) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx( 'dataviews-view-table__cell-content-wrapper', {\n\t\t\t\t'dataviews-view-table__primary-field':\n\t\t\t\t\tprimaryField?.id === field.id,\n\t\t\t} ) }\n\t\t>\n\t\t\t<field.render { ...{ item } } />\n\t\t</div>\n\t);\n}\n\nfunction TableColumnCombined< Item >( {\n\tfield,\n\t...props\n}: TableColumnCombinedProps< Item > ) {\n\tconst children = field.children.map( ( child ) => (\n\t\t<TableColumn key={ child } { ...props } column={ child } />\n\t) );\n\n\tif ( field.direction === 'horizontal' ) {\n\t\treturn <HStack spacing={ 3 }>{ children }</HStack>;\n\t}\n\treturn <VStack spacing={ 0 }>{ children }</VStack>;\n}\n\nfunction TableRow< Item >( {\n\thasBulkActions,\n\titem,\n\tactions,\n\tfields,\n\tid,\n\tview,\n\tprimaryField,\n\tselection,\n\tgetItemId,\n\tonChangeSelection,\n}: TableRowProps< Item > ) {\n\tconst hasPossibleBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst isSelected = hasPossibleBulkAction && selection.includes( id );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\n\tconst handleMouseEnter = () => {\n\t\tsetIsHovered( true );\n\t};\n\tconst handleMouseLeave = () => {\n\t\tsetIsHovered( false );\n\t};\n\n\t// Will be set to true if `onTouchStart` fires. This happens before\n\t// `onClick` and can be used to exclude touchscreen devices from certain\n\t// behaviours.\n\tconst isTouchDevice = useRef( false );\n\tconst columns = view.fields || fields.map( ( f ) => f.id );\n\n\treturn (\n\t\t<tr\n\t\t\tclassName={ clsx( 'dataviews-view-table__row', {\n\t\t\t\t'is-selected': hasPossibleBulkAction && isSelected,\n\t\t\t\t'is-hovered': isHovered,\n\t\t\t\t'has-bulk-actions': hasPossibleBulkAction,\n\t\t\t} ) }\n\t\t\tonMouseEnter={ handleMouseEnter }\n\t\t\tonMouseLeave={ handleMouseLeave }\n\t\t\tonTouchStart={ () => {\n\t\t\t\tisTouchDevice.current = true;\n\t\t\t} }\n\t\t\tonClick={ () => {\n\t\t\t\tif ( ! hasPossibleBulkAction ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tif (\n\t\t\t\t\t! isTouchDevice.current &&\n\t\t\t\t\tdocument.getSelection()?.type !== 'Range'\n\t\t\t\t) {\n\t\t\t\t\tonChangeSelection(\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: [ id ]\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t{ hasBulkActions && (\n\t\t\t\t<td\n\t\t\t\t\tclassName=\"dataviews-view-table__checkbox-column\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\twidth: '1%',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<div className=\"dataviews-view-table__cell-content-wrapper\">\n\t\t\t\t\t\t<SingleSelectionCheckbox\n\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\tdisabled={ ! hasPossibleBulkAction }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</td>\n\t\t\t) }\n\t\t\t{ columns.map( ( column: string ) => {\n\t\t\t\t// Explicits picks the supported styles.\n\t\t\t\tconst { width, maxWidth, minWidth } =\n\t\t\t\t\tview.layout?.styles?.[ column ] ?? {};\n\n\t\t\t\treturn (\n\t\t\t\t\t<td key={ column } style={ { width, maxWidth, minWidth } }>\n\t\t\t\t\t\t<TableColumn\n\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ !! actions?.length && (\n\t\t\t\t// Disable reason: we are not making the element interactive,\n\t\t\t\t// but preventing any click events from bubbling up to the\n\t\t\t\t// table row. This allows us to add a click handler to the row\n\t\t\t\t// itself (to toggle row selection) without erroneously\n\t\t\t\t// intercepting click events from ItemActions.\n\n\t\t\t\t/* eslint-disable jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events */\n\t\t\t\t<td\n\t\t\t\t\tclassName=\"dataviews-view-table__actions-column\"\n\t\t\t\t\tonClick={ ( e ) => e.stopPropagation() }\n\t\t\t\t>\n\t\t\t\t\t<ItemActions item={ item } actions={ actions } />\n\t\t\t\t</td>\n\t\t\t\t/* eslint-enable jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events */\n\t\t\t) }\n\t\t</tr>\n\t);\n}\n\nfunction ViewTable< Item >( {\n\tactions,\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading = false,\n\tonChangeView,\n\tonChangeSelection,\n\tselection,\n\tsetOpenedFilter,\n\tview,\n}: ViewTableProps< Item > ) {\n\tconst headerMenuRefs = useRef<\n\t\tMap< string, { node: HTMLButtonElement; fallback: string } >\n\t>( new Map() );\n\tconst headerMenuToFocusRef = useRef< HTMLButtonElement >();\n\tconst [ nextHeaderMenuToFocus, setNextHeaderMenuToFocus ] =\n\t\tuseState< HTMLButtonElement >();\n\tconst hasBulkActions = useSomeItemHasAPossibleBulkAction( actions, data );\n\n\tuseEffect( () => {\n\t\tif ( headerMenuToFocusRef.current ) {\n\t\t\theaderMenuToFocusRef.current.focus();\n\t\t\theaderMenuToFocusRef.current = undefined;\n\t\t}\n\t} );\n\n\tconst tableNoticeId = useId();\n\n\tif ( nextHeaderMenuToFocus ) {\n\t\t// If we need to force focus, we short-circuit rendering here\n\t\t// to prevent any additional work while we handle that.\n\t\t// Clearing out the focus directive is necessary to make sure\n\t\t// future renders don't cause unexpected focus jumps.\n\t\theaderMenuToFocusRef.current = nextHeaderMenuToFocus;\n\t\tsetNextHeaderMenuToFocus( undefined );\n\t\treturn;\n\t}\n\n\tconst onHide = ( field: NormalizedField< Item > ) => {\n\t\tconst hidden = headerMenuRefs.current.get( field.id );\n\t\tconst fallback = hidden\n\t\t\t? headerMenuRefs.current.get( hidden.fallback )\n\t\t\t: undefined;\n\t\tsetNextHeaderMenuToFocus( fallback?.node );\n\t};\n\n\tconst columns = view.fields || fields.map( ( f ) => f.id );\n\tconst hasData = !! data?.length;\n\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout?.primaryField\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<table\n\t\t\t\tclassName=\"dataviews-view-table\"\n\t\t\t\taria-busy={ isLoading }\n\t\t\t\taria-describedby={ tableNoticeId }\n\t\t\t>\n\t\t\t\t<thead>\n\t\t\t\t\t<tr className=\"dataviews-view-table__row\">\n\t\t\t\t\t\t{ hasBulkActions && (\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-table__checkbox-column\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\twidth: '1%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tscope=\"col\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<BulkSelectionCheckbox\n\t\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ columns.map( ( column, index ) => {\n\t\t\t\t\t\t\t// Explicits picks the supported styles.\n\t\t\t\t\t\t\tconst { width, maxWidth, minWidth } =\n\t\t\t\t\t\t\t\tview.layout?.styles?.[ column ] ?? {};\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t\tkey={ column }\n\t\t\t\t\t\t\t\t\tstyle={ { width, maxWidth, minWidth } }\n\t\t\t\t\t\t\t\t\taria-sort={\n\t\t\t\t\t\t\t\t\t\tview.sort?.field === column\n\t\t\t\t\t\t\t\t\t\t\t? sortValues[ view.sort.direction ]\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tscope=\"col\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ColumnHeaderMenu\n\t\t\t\t\t\t\t\t\t\tref={ ( node ) => {\n\t\t\t\t\t\t\t\t\t\t\tif ( node ) {\n\t\t\t\t\t\t\t\t\t\t\t\theaderMenuRefs.current.set(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolumn,\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnode,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfallback:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolumns[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex > 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? index - 1\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 1\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\theaderMenuRefs.current.delete(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolumn\n\t\t\t\t\t\t\t\t\t\t\t\t);\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\tfieldId={ column }\n\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t\t\t\t\tonHide={ onHide }\n\t\t\t\t\t\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t{ !! actions?.length && (\n\t\t\t\t\t\t\t<th className=\"dataviews-view-table__actions-column\">\n\t\t\t\t\t\t\t\t<span className=\"dataviews-view-table-header\">\n\t\t\t\t\t\t\t\t\t{ __( 'Actions' ) }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</tr>\n\t\t\t\t</thead>\n\t\t\t\t<tbody>\n\t\t\t\t\t{ hasData &&\n\t\t\t\t\t\tdata.map( ( item, index ) => (\n\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\thasBulkActions={ hasBulkActions }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\tid={ getItemId( item ) || index.toString() }\n\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t</tbody>\n\t\t\t</table>\n\t\t\t<div\n\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t'dataviews-no-results': ! hasData && ! isLoading,\n\t\t\t\t} ) }\n\t\t\t\tid={ tableNoticeId }\n\t\t\t>\n\t\t\t\t{ ! hasData && (\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ViewTable;\n"],"mappings":"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","ignoreList":[]}

package/build-module/normalize-fields.js

@@ -15,7 +15,7 @@ export function normalizeFields(fields) {
     }) => item[field.id]);
     return {
       ...field,
-      header: field.header || field.id,
+      label: field.label || field.id,
       getValue,
       render: field.render || getValue
     };

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

@@ -1 +1 @@
-{"version":3,"names":["normalizeFields","fields","map","field","getValue","item","id","header","render"],"sources":["@wordpress/dataviews/src/normalize-fields.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { Field, NormalizedField, ItemRecord } from './types';\n\n/**\n * Apply default values and normalize the fields config.\n *\n * @param fields Fields config.\n * @return Normalized fields config.\n */\nexport function normalizeFields< Item >(\n\tfields: Field< Item >[]\n): NormalizedField< Item >[] {\n\treturn fields.map( ( field ) => {\n\t\tconst getValue =\n\t\t\tfield.getValue ||\n\t\t\t( ( { item }: { item: ItemRecord } ) => item[ field.id ] );\n\n\t\treturn {\n\t\t\t...field,\n\t\t\theader: field.header || field.id,\n\t\t\tgetValue,\n\t\t\trender: field.render || getValue,\n\t\t};\n\t} );\n}\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,eAAeA,CAC9BC,MAAuB,EACK;EAC5B,OAAOA,MAAM,CAACC,GAAG,CAAIC,KAAK,IAAM;IAC/B,MAAMC,QAAQ,GACbD,KAAK,CAACC,QAAQ,KACZ,CAAE;MAAEC;IAA2B,CAAC,KAAMA,IAAI,CAAEF,KAAK,CAACG,EAAE,CAAE,CAAE;IAE3D,OAAO;MACN,GAAGH,KAAK;MACRI,MAAM,EAAEJ,KAAK,CAACI,MAAM,IAAIJ,KAAK,CAACG,EAAE;MAChCF,QAAQ;MACRI,MAAM,EAAEL,KAAK,CAACK,MAAM,IAAIJ;IACzB,CAAC;EACF,CAAE,CAAC;AACJ","ignoreList":[]}
+{"version":3,"names":["normalizeFields","fields","map","field","getValue","item","id","label","render"],"sources":["@wordpress/dataviews/src/normalize-fields.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { Field, NormalizedField, ItemRecord } from './types';\n\n/**\n * Apply default values and normalize the fields config.\n *\n * @param fields Fields config.\n * @return Normalized fields config.\n */\nexport function normalizeFields< Item >(\n\tfields: Field< Item >[]\n): NormalizedField< Item >[] {\n\treturn fields.map( ( field ) => {\n\t\tconst getValue =\n\t\t\tfield.getValue ||\n\t\t\t( ( { item }: { item: ItemRecord } ) => item[ field.id ] );\n\n\t\treturn {\n\t\t\t...field,\n\t\t\tlabel: field.label || field.id,\n\t\t\tgetValue,\n\t\t\trender: field.render || getValue,\n\t\t};\n\t} );\n}\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,eAAeA,CAC9BC,MAAuB,EACK;EAC5B,OAAOA,MAAM,CAACC,GAAG,CAAIC,KAAK,IAAM;IAC/B,MAAMC,QAAQ,GACbD,KAAK,CAACC,QAAQ,KACZ,CAAE;MAAEC;IAA2B,CAAC,KAAMA,IAAI,CAAEF,KAAK,CAACG,EAAE,CAAE,CAAE;IAE3D,OAAO;MACN,GAAGH,KAAK;MACRI,KAAK,EAAEJ,KAAK,CAACI,KAAK,IAAIJ,KAAK,CAACG,EAAE;MAC9BF,QAAQ;MACRI,MAAM,EAAEL,KAAK,CAACK,MAAM,IAAIJ;IACzB,CAAC;EACF,CAAE,CAAC;AACJ","ignoreList":[]}