@payloadcms/ui 4.0.0-internal.add4c47 → 4.0.0-internal.af6aad0

package/dist/views/HierarchyList/HierarchyTable/ChildNameCell.js

@@ -13,7 +13,7 @@ import { useConfig } from '../../../providers/Config/index.js';
 import { useTranslation } from '../../../providers/Translation/index.js';
 import { baseClass } from './types.js';
 export const ChildNameCell = t0 => {
-  const $ = _c(12);
+  const $ = _c(13);
   const {
     row
   } = t0;
@@ -45,7 +45,7 @@ export const ChildNameCell = t0 => {
   const titleField = collectionConfig?.admin?.useAsTitle || "id";
   const rawTitle = typeof row[titleField] === "string" || typeof row[titleField] === "number" ? row[titleField] : row.id;
   let t4;
-  if ($[3] !== adminRoute || $[4] !== collectionConfig || $[5] !== rawTitle || $[6] !== row._collectionSlug || $[7] !== row._hasChildren || $[8] !== row._hierarchyIcon || $[9] !== row.id || $[10] !== t) {
+  if ($[3] !== adminRoute || $[4] !== collectionConfig || $[5] !== rawTitle || $[6] !== row._browseHref || $[7] !== row._collectionSlug || $[8] !== row._hasChildren || $[9] !== row._hierarchyIcon || $[10] !== row.id || $[11] !== t) {
     const title = typeof rawTitle === "object" ? JSON.stringify(rawTitle) : String(rawTitle);
     const hierarchyConfig = collectionConfig?.hierarchy && typeof collectionConfig.hierarchy === "object" ? collectionConfig.hierarchy : undefined;
     const isFolder = Boolean(hierarchyConfig && hierarchyConfig.allowHasMany === false);
@@ -54,7 +54,7 @@ export const ChildNameCell = t0 => {
       adminRoute,
       path: `/collections/${row._collectionSlug}/${row.id}`
     });
-    const hierarchyURL = formatAdminURL({
+    const hierarchyURL = row._browseHref ?? formatAdminURL({
       adminRoute,
       path: `/collections/${row._collectionSlug}?${parentFieldName}=${row.id}`
     });
@@ -88,14 +88,15 @@ export const ChildNameCell = t0 => {
     $[3] = adminRoute;
     $[4] = collectionConfig;
     $[5] = rawTitle;
-    $[6] = row._collectionSlug;
-    $[7] = row._hasChildren;
-    $[8] = row._hierarchyIcon;
-    $[9] = row.id;
-    $[10] = t;
-    $[11] = t4;
+    $[6] = row._browseHref;
+    $[7] = row._collectionSlug;
+    $[8] = row._hasChildren;
+    $[9] = row._hierarchyIcon;
+    $[10] = row.id;
+    $[11] = t;
+    $[12] = t4;
   } else {
-    t4 = $[11];
+    t4 = $[12];
   }
   return t4;
 };

package/dist/views/HierarchyList/HierarchyTable/ChildNameCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChildNameCell.js","names":["c","_c","formatAdminURL","React","Link","ChevronIcon","EditIcon","FolderIcon","TagIcon","useConfig","useTranslation","baseClass","ChildNameCell","t0","$","row","config","t1","getEntityConfig","routes","t2","admin","adminRoute","t","t3","_collectionSlug","collectionSlug","collectionConfig","titleField","useAsTitle","rawTitle","id","t4","_hasChildren","_hierarchyIcon","title","JSON","stringify","String","hierarchyConfig","hierarchy","undefined","isFolder","Boolean","allowHasMany","parentFieldName","documentURL","path","hierarchyURL","DefaultIcon","_jsx","_jsxs","className","children","href","direction","label"],"sources":["../../../../src/views/HierarchyList/HierarchyTable/ChildNameCell.tsx"],"sourcesContent":["'use client'\n\nimport { formatAdminURL } from 'payload/shared'\nimport React from 'react'\n\nimport type { SlotColumn } from './SlotTable.js'\nimport type { TableRow } from './types.js'\n\nimport { Link } from '../../../elements/Link/index.js'\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { EditIcon } from '../../../icons/Edit/index.js'\nimport { FolderIcon } from '../../../icons/Folder/index.js'\nimport { TagIcon } from '../../../icons/Tag/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { baseClass } from './types.js'\n\nexport const ChildNameCell: SlotColumn<TableRow>['Cell'] = ({ row }) => {\n  const {\n    config: {\n      routes: { admin: adminRoute },\n    },\n    getEntityConfig,\n  } = useConfig()\n  const { t } = useTranslation()\n\n  const collectionConfig = getEntityConfig({ collectionSlug: row._collectionSlug })\n  const titleField = collectionConfig?.admin?.useAsTitle || 'id'\n  const rawTitle =\n    typeof row[titleField] === 'string' || typeof row[titleField] === 'number'\n      ? row[titleField]\n      : row.id\n  const title = typeof rawTitle === 'object' ? JSON.stringify(rawTitle) : String(rawTitle)\n  const hierarchyConfig =\n    collectionConfig?.hierarchy && typeof collectionConfig.hierarchy === 'object'\n      ? collectionConfig.hierarchy\n      : undefined\n  const isFolder = Boolean(hierarchyConfig && hierarchyConfig.allowHasMany === false)\n  const parentFieldName = hierarchyConfig?.parentFieldName || 'parent'\n\n  const documentURL = formatAdminURL({\n    adminRoute,\n    path: `/collections/${row._collectionSlug}/${row.id}`,\n  })\n\n  const hierarchyURL = formatAdminURL({\n    adminRoute,\n    path: `/collections/${row._collectionSlug}?${parentFieldName}=${row.id}`,\n  })\n\n  const DefaultIcon = isFolder ? <FolderIcon /> : <TagIcon />\n\n  return (\n    <div className={`${baseClass}__name-cell`}>\n      <Link className={`${baseClass}__name-link`} href={hierarchyURL}>\n        <span className={`${baseClass}__name-icon`}>{row._hierarchyIcon || DefaultIcon}</span>\n        <span className={`${baseClass}__name-text`}>{title}</span>\n        {row._hasChildren && (\n          <span className={`${baseClass}__chevron`}>\n            <ChevronIcon direction=\"right\" />\n          </span>\n        )}\n      </Link>\n      <Link\n        aria-label={t('general:editLabel', { label: title })}\n        className={`${baseClass}__edit-button`}\n        href={documentURL}\n      >\n        <EditIcon />\n      </Link>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ChildNameCell.js","names":["c","_c","formatAdminURL","React","Link","ChevronIcon","EditIcon","FolderIcon","TagIcon","useConfig","useTranslation","baseClass","ChildNameCell","t0","$","row","config","t1","getEntityConfig","routes","t2","admin","adminRoute","t","t3","_collectionSlug","collectionSlug","collectionConfig","titleField","useAsTitle","rawTitle","id","t4","_browseHref","_hasChildren","_hierarchyIcon","title","JSON","stringify","String","hierarchyConfig","hierarchy","undefined","isFolder","Boolean","allowHasMany","parentFieldName","documentURL","path","hierarchyURL","DefaultIcon","_jsx","_jsxs","className","children","href","direction","label"],"sources":["../../../../src/views/HierarchyList/HierarchyTable/ChildNameCell.tsx"],"sourcesContent":["'use client'\n\nimport { formatAdminURL } from 'payload/shared'\nimport React from 'react'\n\nimport type { SlotColumn } from './SlotTable.js'\nimport type { TableRow } from './types.js'\n\nimport { Link } from '../../../elements/Link/index.js'\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { EditIcon } from '../../../icons/Edit/index.js'\nimport { FolderIcon } from '../../../icons/Folder/index.js'\nimport { TagIcon } from '../../../icons/Tag/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { baseClass } from './types.js'\n\nexport const ChildNameCell: SlotColumn<TableRow>['Cell'] = ({ row }) => {\n  const {\n    config: {\n      routes: { admin: adminRoute },\n    },\n    getEntityConfig,\n  } = useConfig()\n  const { t } = useTranslation()\n\n  const collectionConfig = getEntityConfig({ collectionSlug: row._collectionSlug })\n  const titleField = collectionConfig?.admin?.useAsTitle || 'id'\n  const rawTitle =\n    typeof row[titleField] === 'string' || typeof row[titleField] === 'number'\n      ? row[titleField]\n      : row.id\n  const title = typeof rawTitle === 'object' ? JSON.stringify(rawTitle) : String(rawTitle)\n  const hierarchyConfig =\n    collectionConfig?.hierarchy && typeof collectionConfig.hierarchy === 'object'\n      ? collectionConfig.hierarchy\n      : undefined\n  const isFolder = Boolean(hierarchyConfig && hierarchyConfig.allowHasMany === false)\n  const parentFieldName = hierarchyConfig?.parentFieldName || 'parent'\n\n  const documentURL = formatAdminURL({\n    adminRoute,\n    path: `/collections/${row._collectionSlug}/${row.id}`,\n  })\n\n  // `_browseHref` keeps the click inside the collection being browsed; the fallback covers rows\n  // built outside the hierarchy view.\n  const hierarchyURL =\n    row._browseHref ??\n    formatAdminURL({\n      adminRoute,\n      path: `/collections/${row._collectionSlug}?${parentFieldName}=${row.id}`,\n    })\n\n  const DefaultIcon = isFolder ? <FolderIcon /> : <TagIcon />\n\n  return (\n    <div className={`${baseClass}__name-cell`}>\n      <Link className={`${baseClass}__name-link`} href={hierarchyURL}>\n        <span className={`${baseClass}__name-icon`}>{row._hierarchyIcon || DefaultIcon}</span>\n        <span className={`${baseClass}__name-text`}>{title}</span>\n        {row._hasChildren && (\n          <span className={`${baseClass}__chevron`}>\n            <ChevronIcon direction=\"right\" />\n          </span>\n        )}\n      </Link>\n      <Link\n        aria-label={t('general:editLabel', { label: title })}\n        className={`${baseClass}__edit-button`}\n        href={documentURL}\n      >\n        <EditIcon />\n      </Link>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/views/HierarchyList/HierarchyTable/SlotTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SlotTable.d.ts","sourceRoot":"","sources":["../../../../src/views/HierarchyList/HierarchyTable/SlotTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAEnC,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,iBAAiB,CAAA;AAIxB,MAAM,MAAM,UAAU,CAAC,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IACvD;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAA;IAChB;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;QAAC,GAAG,EAAE,IAAI,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACzE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,cAAc,CAAC,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IAC3D;;OAEG;IACH,UAAU,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IACpC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB;;OAEG;IACH,OAAO,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,CAAA;IAC3B;;OAEG;IACH,IAAI,EAAE,IAAI,EAAE,CAAA;IACZ;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAAA;IACxD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,GAAG,IAAI,CAAA;IACjE;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B;;OAEG;IACH,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvE;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/C;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;IAC9C;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAA;CACnC,CAAA;AAED,wBAAgB,SAAS,CAAC,IAAI,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,EACxF,UAAsB,EACtB,SAAS,EACT,cAAc,EACd,OAAO,EACP,IAAI,EACJ,cAAqB,EACrB,gBAAuB,EACvB,YAAmB,EACnB,eAAsB,EACtB,QAA+D,EAC/D,gBAAgB,EAChB,mBAA2B,EAC3B,gBAAgB,EAChB,UAAU,EACV,iBAAiB,EACjB,QAAQ,EACR,WAAuB,GACxB,EAAE,cAAc,CAAC,IAAI,CAAC,qBAiJtB"}
+{"version":3,"file":"SlotTable.d.ts","sourceRoot":"","sources":["../../../../src/views/HierarchyList/HierarchyTable/SlotTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAEnC,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,iBAAiB,CAAA;AAIxB,MAAM,MAAM,UAAU,CAAC,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IACvD;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAA;IAChB;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;QAAC,GAAG,EAAE,IAAI,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACzE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,cAAc,CAAC,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IAC3D;;OAEG;IACH,UAAU,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IACpC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB;;OAEG;IACH,OAAO,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,CAAA;IAC3B;;OAEG;IACH,IAAI,EAAE,IAAI,EAAE,CAAA;IACZ;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAAA;IACxD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,GAAG,IAAI,CAAA;IACjE;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B;;OAEG;IACH,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvE;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/C;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;IAC9C;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAA;CACnC,CAAA;AAED,wBAAgB,SAAS,CAAC,IAAI,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,EACxF,UAAsB,EACtB,SAAS,EACT,cAAc,EACd,OAAO,EACP,IAAI,EACJ,cAAqB,EACrB,gBAAuB,EACvB,YAAmB,EACnB,eAAsB,EACtB,QAA+D,EAC/D,gBAAgB,EAChB,mBAA2B,EAC3B,gBAAgB,EAChB,UAAU,EACV,iBAAiB,EACjB,QAAQ,EACR,WAAuB,GACxB,EAAE,cAAc,CAAC,IAAI,CAAC,qBA8ItB"}

package/dist/views/HierarchyList/HierarchyTable/SlotTable.js

@@ -56,8 +56,7 @@ export function SlotTable({
               checked: allSelected,
               className: `${baseClass}__checkbox`,
               onToggle: handleSelectAll,
-              partialChecked: someSelected && !allSelected,
-              variant: "muted"
+              partialChecked: someSelected && !allSelected
             })
           }), enableDragHandle && /*#__PURE__*/_jsx("th", {
             className: `${baseClass}__th ${baseClass}__th--drag`,
@@ -75,8 +74,7 @@ export function SlotTable({
                   checked: allSelected,
                   className: `${baseClass}__checkbox`,
                   onToggle: handleSelectAll,
-                  partialChecked: someSelected && !allSelected,
-                  variant: "muted"
+                  partialChecked: someSelected && !allSelected
                 }), col.heading]
               }) : col.heading
             }, col.accessor);
@@ -105,8 +103,7 @@ export function SlotTable({
                 return /*#__PURE__*/_jsx(CheckboxInput, {
                   checked: isSelected,
                   className: `${baseClass}__checkbox`,
-                  onToggle: () => handleRowCheckbox(row, rowIndex, isSelected),
-                  variant: "muted"
+                  onToggle: () => handleRowCheckbox(row, rowIndex, isSelected)
                 });
               })()
             }), enableDragHandle && /*#__PURE__*/_jsx("td", {

package/dist/views/HierarchyList/HierarchyTable/SlotTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"SlotTable.js","names":["React","Locked","CheckboxInput","AlignJustifiedIcon","baseClass","SlotTable","appearance","className","collectionSlug","columns","data","enableCheckbox","enableDragHandle","enableHeader","enableSelectAll","getRowId","row","index","id","getRowLockedUser","mergeCheckboxHeader","onCheckboxChange","onRowClick","onSelectAllChange","parentId","selectedIds","Set","allSelected","length","every","i","has","someSelected","some","handleSelectAll","handleRowCheckbox","isSelected","handleRowClick","handleRowKeyDown","e","key","preventDefault","_jsx","filter","Boolean","join","_jsxs","cellPadding","cellSpacing","checked","onToggle","partialChecked","variant","map","col","colIndex","isMergedCheckboxColumn","colSpan","undefined","heading","accessor","rowIndex","rowId","isClickable","onClick","onKeyDown","tabIndex","lockedUser","user","Cell","column"],"sources":["../../../../src/views/HierarchyList/HierarchyTable/SlotTable.tsx"],"sourcesContent":["'use client'\n\nimport type { User } from 'payload'\n\nimport React from 'react'\n\nimport { Locked } from '../../../elements/Locked/index.js'\nimport { CheckboxInput } from '../../../fields/Checkbox/Input.js'\nimport { AlignJustifiedIcon } from '../../../icons/AlignJustified/index.js'\nimport './SlotTable.css'\n\nconst baseClass = 'slot-table'\n\nexport type SlotColumn<TRow = Record<string, unknown>> = {\n  /**\n   * Unique identifier for the column\n   */\n  accessor: string\n  /**\n   * Cell component that receives the row data\n   */\n  Cell: React.FC<{ column: SlotColumn<TRow>; row: TRow; rowIndex: number }>\n  /**\n   * Optional class name for the column cells\n   */\n  className?: string\n  /**\n   * Column header content\n   */\n  heading: React.ReactNode\n}\n\nexport type SlotTableProps<TRow = Record<string, unknown>> = {\n  /**\n   * Table appearance\n   */\n  appearance?: 'condensed' | 'default'\n  /**\n   * Additional class name\n   */\n  className?: string\n  /**\n   * Collection slug for the table\n   */\n  collectionSlug?: string\n  /**\n   * Column definitions with Cell components\n   */\n  columns: SlotColumn<TRow>[]\n  /**\n   * Data array - table loops over this\n   */\n  data: TRow[]\n  /**\n   * Show checkbox column (default: true)\n   */\n  enableCheckbox?: boolean\n  /**\n   * Show drag handle column (default: true)\n   */\n  enableDragHandle?: boolean\n  /**\n   * Show header row with column headings (default: true)\n   */\n  enableHeader?: boolean\n  /**\n   * Show select-all checkbox in header (default: true, requires enableCheckbox and enableHeader)\n   */\n  enableSelectAll?: boolean\n  /**\n   * Get unique ID for each row\n   */\n  getRowId?: (row: TRow, index: number) => number | string\n  /**\n   * Returns the user who is editing/locking a row, or undefined if not locked.\n   * When a user is returned, a lock icon replaces the checkbox for that row.\n   */\n  getRowLockedUser?: (row: TRow, index: number) => undefined | User\n  /**\n   * Merge checkbox header with first column header using colspan (default: false)\n   * The first column header will span both checkbox and content cells\n   */\n  mergeCheckboxHeader?: boolean\n  /**\n   * Callback when checkbox is toggled\n   */\n  onCheckboxChange?: (row: TRow, checked: boolean, index: number) => void\n  /**\n   * Row click handler (for navigation)\n   */\n  onRowClick?: (row: TRow, index: number) => void\n  /**\n   * Callback when \"select all\" checkbox is toggled\n   */\n  onSelectAllChange?: (checked: boolean) => void\n  /**\n   * Parent ID for the table\n   */\n  parentId?: null | number | string\n  /**\n   * Currently selected row IDs\n   */\n  selectedIds?: Set<number | string>\n}\n\nexport function SlotTable<TRow extends Record<string, unknown> = Record<string, unknown>>({\n  appearance = 'default',\n  className,\n  collectionSlug,\n  columns,\n  data,\n  enableCheckbox = true,\n  enableDragHandle = true,\n  enableHeader = true,\n  enableSelectAll = true,\n  getRowId = (row, index) => (row.id as number | string) ?? index,\n  getRowLockedUser,\n  mergeCheckboxHeader = false,\n  onCheckboxChange,\n  onRowClick,\n  onSelectAllChange,\n  parentId,\n  selectedIds = new Set(),\n}: SlotTableProps<TRow>) {\n  const allSelected = data.length > 0 && data.every((row, i) => selectedIds.has(getRowId(row, i)))\n  const someSelected = data.some((row, i) => selectedIds.has(getRowId(row, i)))\n\n  const handleSelectAll = () => {\n    onSelectAllChange?.(!allSelected)\n  }\n\n  const handleRowCheckbox = (row: TRow, index: number, isSelected: boolean) => {\n    onCheckboxChange?.(row, !isSelected, index)\n  }\n\n  const handleRowClick = (row: TRow, index: number) => {\n    onRowClick?.(row, index)\n  }\n\n  const handleRowKeyDown = (row: TRow, index: number, e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault()\n      onRowClick?.(row, index)\n    }\n  }\n\n  return (\n    <div\n      className={[baseClass, appearance && `${baseClass}--appearance-${appearance}`, className]\n        .filter(Boolean)\n        .join(' ')}\n      key={`${collectionSlug}-${parentId}`}\n    >\n      <table cellPadding=\"0\" cellSpacing=\"0\">\n        {enableHeader && (\n          <thead>\n            <tr>\n              {enableCheckbox && !mergeCheckboxHeader && (\n                <th className={`${baseClass}__th ${baseClass}__th--checkbox`}>\n                  {enableSelectAll && (\n                    <CheckboxInput\n                      checked={allSelected}\n                      className={`${baseClass}__checkbox`}\n                      onToggle={handleSelectAll}\n                      partialChecked={someSelected && !allSelected}\n                      variant=\"muted\"\n                    />\n                  )}\n                </th>\n              )}\n              {enableDragHandle && (\n                <th className={`${baseClass}__th ${baseClass}__th--drag`}>\n                  <span className={`${baseClass}__drag-header`} />\n                </th>\n              )}\n              {columns.map((col, colIndex) => {\n                const isMergedCheckboxColumn =\n                  colIndex === 0 && enableCheckbox && mergeCheckboxHeader\n\n                return (\n                  <th\n                    className={[`${baseClass}__th`, col.className].filter(Boolean).join(' ')}\n                    colSpan={isMergedCheckboxColumn ? 2 : undefined}\n                    key={col.accessor}\n                  >\n                    {isMergedCheckboxColumn && enableSelectAll ? (\n                      <span className={`${baseClass}__th-merged`}>\n                        <CheckboxInput\n                          checked={allSelected}\n                          className={`${baseClass}__checkbox`}\n                          onToggle={handleSelectAll}\n                          partialChecked={someSelected && !allSelected}\n                          variant=\"muted\"\n                        />\n                        {col.heading}\n                      </span>\n                    ) : (\n                      col.heading\n                    )}\n                  </th>\n                )\n              })}\n            </tr>\n          </thead>\n        )}\n        <tbody>\n          {data.map((row, rowIndex) => {\n            const rowId = getRowId(row, rowIndex)\n            const isSelected = selectedIds.has(rowId)\n            const isClickable = Boolean(onRowClick)\n\n            return (\n              <tr\n                className={[\n                  `${baseClass}__tr`,\n                  isSelected && `${baseClass}__tr--selected`,\n                  isClickable && `${baseClass}__tr--clickable`,\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n                data-id={rowId}\n                key={rowId}\n                onClick={isClickable ? () => handleRowClick(row, rowIndex) : undefined}\n                onKeyDown={isClickable ? (e) => handleRowKeyDown(row, rowIndex, e) : undefined}\n                tabIndex={isClickable ? 0 : undefined}\n              >\n                {enableCheckbox && (\n                  <td className={`${baseClass}__td ${baseClass}__td--checkbox`}>\n                    {(() => {\n                      const lockedUser = getRowLockedUser?.(row, rowIndex)\n\n                      if (lockedUser) {\n                        return <Locked user={lockedUser} />\n                      }\n\n                      return (\n                        <CheckboxInput\n                          checked={isSelected}\n                          className={`${baseClass}__checkbox`}\n                          onToggle={() => handleRowCheckbox(row, rowIndex, isSelected)}\n                          variant=\"muted\"\n                        />\n                      )\n                    })()}\n                  </td>\n                )}\n                {enableDragHandle && (\n                  <td className={`${baseClass}__td ${baseClass}__td--drag`}>\n                    <span className={`${baseClass}__drag-handle`}>\n                      <AlignJustifiedIcon />\n                    </span>\n                  </td>\n                )}\n                {columns.map((col) => (\n                  <td\n                    className={[`${baseClass}__td`, col.className].filter(Boolean).join(' ')}\n                    key={col.accessor}\n                  >\n                    <col.Cell column={col} row={row} rowIndex={rowIndex} />\n                  </td>\n                ))}\n              </tr>\n            )\n          })}\n        </tbody>\n      </table>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SlotTable.js","names":["React","Locked","CheckboxInput","AlignJustifiedIcon","baseClass","SlotTable","appearance","className","collectionSlug","columns","data","enableCheckbox","enableDragHandle","enableHeader","enableSelectAll","getRowId","row","index","id","getRowLockedUser","mergeCheckboxHeader","onCheckboxChange","onRowClick","onSelectAllChange","parentId","selectedIds","Set","allSelected","length","every","i","has","someSelected","some","handleSelectAll","handleRowCheckbox","isSelected","handleRowClick","handleRowKeyDown","e","key","preventDefault","_jsx","filter","Boolean","join","_jsxs","cellPadding","cellSpacing","checked","onToggle","partialChecked","map","col","colIndex","isMergedCheckboxColumn","colSpan","undefined","heading","accessor","rowIndex","rowId","isClickable","onClick","onKeyDown","tabIndex","lockedUser","user","Cell","column"],"sources":["../../../../src/views/HierarchyList/HierarchyTable/SlotTable.tsx"],"sourcesContent":["'use client'\n\nimport type { User } from 'payload'\n\nimport React from 'react'\n\nimport { Locked } from '../../../elements/Locked/index.js'\nimport { CheckboxInput } from '../../../fields/Checkbox/Input.js'\nimport { AlignJustifiedIcon } from '../../../icons/AlignJustified/index.js'\nimport './SlotTable.css'\n\nconst baseClass = 'slot-table'\n\nexport type SlotColumn<TRow = Record<string, unknown>> = {\n  /**\n   * Unique identifier for the column\n   */\n  accessor: string\n  /**\n   * Cell component that receives the row data\n   */\n  Cell: React.FC<{ column: SlotColumn<TRow>; row: TRow; rowIndex: number }>\n  /**\n   * Optional class name for the column cells\n   */\n  className?: string\n  /**\n   * Column header content\n   */\n  heading: React.ReactNode\n}\n\nexport type SlotTableProps<TRow = Record<string, unknown>> = {\n  /**\n   * Table appearance\n   */\n  appearance?: 'condensed' | 'default'\n  /**\n   * Additional class name\n   */\n  className?: string\n  /**\n   * Collection slug for the table\n   */\n  collectionSlug?: string\n  /**\n   * Column definitions with Cell components\n   */\n  columns: SlotColumn<TRow>[]\n  /**\n   * Data array - table loops over this\n   */\n  data: TRow[]\n  /**\n   * Show checkbox column (default: true)\n   */\n  enableCheckbox?: boolean\n  /**\n   * Show drag handle column (default: true)\n   */\n  enableDragHandle?: boolean\n  /**\n   * Show header row with column headings (default: true)\n   */\n  enableHeader?: boolean\n  /**\n   * Show select-all checkbox in header (default: true, requires enableCheckbox and enableHeader)\n   */\n  enableSelectAll?: boolean\n  /**\n   * Get unique ID for each row\n   */\n  getRowId?: (row: TRow, index: number) => number | string\n  /**\n   * Returns the user who is editing/locking a row, or undefined if not locked.\n   * When a user is returned, a lock icon replaces the checkbox for that row.\n   */\n  getRowLockedUser?: (row: TRow, index: number) => undefined | User\n  /**\n   * Merge checkbox header with first column header using colspan (default: false)\n   * The first column header will span both checkbox and content cells\n   */\n  mergeCheckboxHeader?: boolean\n  /**\n   * Callback when checkbox is toggled\n   */\n  onCheckboxChange?: (row: TRow, checked: boolean, index: number) => void\n  /**\n   * Row click handler (for navigation)\n   */\n  onRowClick?: (row: TRow, index: number) => void\n  /**\n   * Callback when \"select all\" checkbox is toggled\n   */\n  onSelectAllChange?: (checked: boolean) => void\n  /**\n   * Parent ID for the table\n   */\n  parentId?: null | number | string\n  /**\n   * Currently selected row IDs\n   */\n  selectedIds?: Set<number | string>\n}\n\nexport function SlotTable<TRow extends Record<string, unknown> = Record<string, unknown>>({\n  appearance = 'default',\n  className,\n  collectionSlug,\n  columns,\n  data,\n  enableCheckbox = true,\n  enableDragHandle = true,\n  enableHeader = true,\n  enableSelectAll = true,\n  getRowId = (row, index) => (row.id as number | string) ?? index,\n  getRowLockedUser,\n  mergeCheckboxHeader = false,\n  onCheckboxChange,\n  onRowClick,\n  onSelectAllChange,\n  parentId,\n  selectedIds = new Set(),\n}: SlotTableProps<TRow>) {\n  const allSelected = data.length > 0 && data.every((row, i) => selectedIds.has(getRowId(row, i)))\n  const someSelected = data.some((row, i) => selectedIds.has(getRowId(row, i)))\n\n  const handleSelectAll = () => {\n    onSelectAllChange?.(!allSelected)\n  }\n\n  const handleRowCheckbox = (row: TRow, index: number, isSelected: boolean) => {\n    onCheckboxChange?.(row, !isSelected, index)\n  }\n\n  const handleRowClick = (row: TRow, index: number) => {\n    onRowClick?.(row, index)\n  }\n\n  const handleRowKeyDown = (row: TRow, index: number, e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault()\n      onRowClick?.(row, index)\n    }\n  }\n\n  return (\n    <div\n      className={[baseClass, appearance && `${baseClass}--appearance-${appearance}`, className]\n        .filter(Boolean)\n        .join(' ')}\n      key={`${collectionSlug}-${parentId}`}\n    >\n      <table cellPadding=\"0\" cellSpacing=\"0\">\n        {enableHeader && (\n          <thead>\n            <tr>\n              {enableCheckbox && !mergeCheckboxHeader && (\n                <th className={`${baseClass}__th ${baseClass}__th--checkbox`}>\n                  {enableSelectAll && (\n                    <CheckboxInput\n                      checked={allSelected}\n                      className={`${baseClass}__checkbox`}\n                      onToggle={handleSelectAll}\n                      partialChecked={someSelected && !allSelected}\n                    />\n                  )}\n                </th>\n              )}\n              {enableDragHandle && (\n                <th className={`${baseClass}__th ${baseClass}__th--drag`}>\n                  <span className={`${baseClass}__drag-header`} />\n                </th>\n              )}\n              {columns.map((col, colIndex) => {\n                const isMergedCheckboxColumn =\n                  colIndex === 0 && enableCheckbox && mergeCheckboxHeader\n\n                return (\n                  <th\n                    className={[`${baseClass}__th`, col.className].filter(Boolean).join(' ')}\n                    colSpan={isMergedCheckboxColumn ? 2 : undefined}\n                    key={col.accessor}\n                  >\n                    {isMergedCheckboxColumn && enableSelectAll ? (\n                      <span className={`${baseClass}__th-merged`}>\n                        <CheckboxInput\n                          checked={allSelected}\n                          className={`${baseClass}__checkbox`}\n                          onToggle={handleSelectAll}\n                          partialChecked={someSelected && !allSelected}\n                        />\n                        {col.heading}\n                      </span>\n                    ) : (\n                      col.heading\n                    )}\n                  </th>\n                )\n              })}\n            </tr>\n          </thead>\n        )}\n        <tbody>\n          {data.map((row, rowIndex) => {\n            const rowId = getRowId(row, rowIndex)\n            const isSelected = selectedIds.has(rowId)\n            const isClickable = Boolean(onRowClick)\n\n            return (\n              <tr\n                className={[\n                  `${baseClass}__tr`,\n                  isSelected && `${baseClass}__tr--selected`,\n                  isClickable && `${baseClass}__tr--clickable`,\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n                data-id={rowId}\n                key={rowId}\n                onClick={isClickable ? () => handleRowClick(row, rowIndex) : undefined}\n                onKeyDown={isClickable ? (e) => handleRowKeyDown(row, rowIndex, e) : undefined}\n                tabIndex={isClickable ? 0 : undefined}\n              >\n                {enableCheckbox && (\n                  <td className={`${baseClass}__td ${baseClass}__td--checkbox`}>\n                    {(() => {\n                      const lockedUser = getRowLockedUser?.(row, rowIndex)\n\n                      if (lockedUser) {\n                        return <Locked user={lockedUser} />\n                      }\n\n                      return (\n                        <CheckboxInput\n                          checked={isSelected}\n                          className={`${baseClass}__checkbox`}\n                          onToggle={() => handleRowCheckbox(row, rowIndex, isSelected)}\n                        />\n                      )\n                    })()}\n                  </td>\n                )}\n                {enableDragHandle && (\n                  <td className={`${baseClass}__td ${baseClass}__td--drag`}>\n                    <span className={`${baseClass}__drag-handle`}>\n                      <AlignJustifiedIcon />\n                    </span>\n                  </td>\n                )}\n                {columns.map((col) => (\n                  <td\n                    className={[`${baseClass}__td`, col.className].filter(Boolean).join(' ')}\n                    key={col.accessor}\n                  >\n                    <col.Cell column={col} row={row} rowIndex={rowIndex} />\n                  </td>\n                ))}\n              </tr>\n            )\n          })}\n        </tbody>\n      </table>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/views/HierarchyList/HierarchyTable/index.css

@@ -1,4 +1,25 @@
 @layer payload-default {
+  /*
+   * The sections stack in a column that claims the view's leftover height, and the last section
+   * absorbs it, so a full-height card grid inside it has empty space to be clicked or dragged over.
+   * Scoped to this view rather than TableSection itself, which other views lay out differently.
+   */
+  .hierarchy-tables {
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+  }
+
+  .hierarchy-tables > .table-section:last-child {
+    flex-grow: 1;
+  }
+
+  .hierarchy-tables > .table-section:last-child > .table-section__content {
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+  }
+
   .hierarchy-tables__name-cell {
     display: flex;
     align-items: center;
@@ -121,4 +142,34 @@
     font-weight: var(--text-body-large-strong-font-weight);
     line-height: var(--text-body-large-strong-line-height);
   }
+
+  /*
+   * Grid mode's per-collection pagination. Aligned to the same gutter as the cards above, and
+   * wrapping rather than compressing, since a hierarchy can surface one control per related
+   * collection.
+   */
+  .hierarchy-tables__plane-pagination {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--spacer-3);
+    padding-inline: var(--gutter-h);
+    padding-block: var(--spacer-3);
+  }
+
+  .hierarchy-tables__plane-pagination-group {
+    display: flex;
+    align-items: center;
+    gap: var(--spacer-2);
+  }
+
+  .hierarchy-tables__plane-pagination-label {
+    color: var(--color-text);
+    white-space: nowrap;
+    font-family: var(--text-body-medium-strong-font-family);
+    font-size: var(--text-body-medium-strong-font-size);
+    font-weight: var(--text-body-medium-strong-font-weight);
+    line-height: var(--text-body-medium-strong-line-height);
+    letter-spacing: var(--text-body-medium-strong-letter-spacing);
+  }
 }

package/dist/views/HierarchyList/HierarchyTable/index.d.ts

@@ -5,8 +5,18 @@ import type { HierarchyDocument } from '../../../elements/Hierarchy/Tree/types.j
 import type { RelatedGroup } from './types.js';
 import './index.css';
 export type HierarchyTableProps = {
+    /**
+     * Ids of the folders between the root and the folder currently open, so a folder can't be dropped
+     * into its own subtree.
+     */
+    ancestorIds?: (number | string)[];
     /** Base filter applied to hierarchy collection queries (e.g., tenant filter) */
     baseFilter?: Where;
+    /**
+     * Collection whose hierarchy view folder links should stay in. Differs from `collectionSlug` when
+     * browsing one related collection by folder. Defaults to `collectionSlug`.
+     */
+    browseCollectionSlug?: string;
     childrenData?: PaginatedDocs<HierarchyDocument>;
     /** Collections available for creation (for empty state) */
     collections?: CollectionOption[];
@@ -22,6 +32,8 @@ export type HierarchyTableProps = {
     relatedGroups: RelatedGroup[];
     search?: string;
     useAsTitle: string;
+    /** Renders each group as a grid of cards instead of a table. Defaults to 'table'. */
+    viewMode?: 'grid' | 'table';
 };
-export declare function HierarchyTable({ baseFilter, childrenData, collections, collectionSlug, hasCreatePermission, HierarchyIcon, hierarchyLabel, parentFieldName, parentId, relatedBaseFilters, relatedGroups, search, useAsTitle, }: HierarchyTableProps): React.JSX.Element;
+export declare function HierarchyTable({ ancestorIds, baseFilter, browseCollectionSlug, childrenData, collections, collectionSlug, hasCreatePermission, HierarchyIcon, hierarchyLabel, parentFieldName, parentId, relatedBaseFilters, relatedGroups, search, useAsTitle, viewMode, }: HierarchyTableProps): React.JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/views/HierarchyList/HierarchyTable/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/HierarchyList/HierarchyTable/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AASnD,OAAO,KAAyC,MAAM,OAAO,CAAA;AAE7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iDAAiD,CAAA;AACvF,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,2CAA2C,CAAA;AAElF,OAAO,KAAK,EAAE,YAAY,EAAY,MAAM,YAAY,CAAA;AAexD,OAAO,aAAa,CAAA;AAcpB,MAAM,MAAM,mBAAmB,GAAG;IAChC,gFAAgF;IAChF,UAAU,CAAC,EAAE,KAAK,CAAA;IAClB,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAA;IAC/C,2DAA2D;IAC3D,WAAW,CAAC,EAAE,gBAAgB,EAAE,CAAA;IAChC,cAAc,EAAE,MAAM,CAAA;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,wCAAwC;IACxC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC/B,cAAc,EAAE,MAAM,CAAA;IACtB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,QAAQ,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;IAChC,sEAAsE;IACtE,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;IAC1C,aAAa,EAAE,YAAY,EAAE,CAAA;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,wBAAgB,cAAc,CAAC,EAC7B,UAAU,EACV,YAAY,EACZ,WAAW,EACX,cAAc,EACd,mBAAmB,EACnB,aAAa,EACb,cAAc,EACd,eAAe,EACf,QAAQ,EACR,kBAAkB,EAClB,aAAa,EACb,MAAM,EACN,UAAU,GACX,EAAE,mBAAmB,qBAydrB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/HierarchyList/HierarchyTable/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AASnD,OAAO,KAAyC,MAAM,OAAO,CAAA;AAE7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iDAAiD,CAAA;AACvF,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,2CAA2C,CAAA;AAGlF,OAAO,KAAK,EAAE,YAAY,EAAY,MAAM,YAAY,CAAA;AAgBxD,OAAO,aAAa,CAAA;AAcpB,MAAM,MAAM,mBAAmB,GAAG;IAChC;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAA;IACjC,gFAAgF;IAChF,UAAU,CAAC,EAAE,KAAK,CAAA;IAClB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAA;IAC/C,2DAA2D;IAC3D,WAAW,CAAC,EAAE,gBAAgB,EAAE,CAAA;IAChC,cAAc,EAAE,MAAM,CAAA;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,wCAAwC;IACxC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC/B,cAAc,EAAE,MAAM,CAAA;IACtB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,QAAQ,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;IAChC,sEAAsE;IACtE,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;IAC1C,aAAa,EAAE,YAAY,EAAE,CAAA;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;IAClB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CAC5B,CAAA;AAED,wBAAgB,cAAc,CAAC,EAC7B,WAAW,EACX,UAAU,EACV,oBAAoB,EACpB,YAAY,EACZ,WAAW,EACX,cAAc,EACd,mBAAmB,EACnB,aAAa,EACb,cAAc,EACd,eAAe,EACf,QAAQ,EACR,kBAAkB,EAClB,aAAa,EACb,MAAM,EACN,UAAU,EACV,QAAkB,GACnB,EAAE,mBAAmB,qBAymBrB"}

package/dist/views/HierarchyList/HierarchyTable/index.js

@@ -13,6 +13,7 @@ import { useConfig } from '../../../providers/Config/index.js';
 import { useDocumentSelection } from '../../../providers/DocumentSelection/index.js';
 import { useRouteCache } from '../../../providers/RouteCache/index.js';
 import { useTranslation } from '../../../providers/Translation/index.js';
+import { getRowKey, HierarchyCardGrid } from '../HierarchyCards/index.js';
 import { ChildNameCell } from './ChildNameCell.js';
 import { DateCell } from './DateCell.js';
 import { RelatedNameCell } from './RelatedNameCell.js';
@@ -31,7 +32,9 @@ const CollectionCell = ({
   children: row._collectionLabel
 });
 export function HierarchyTable({
+  ancestorIds,
   baseFilter,
+  browseCollectionSlug,
   childrenData,
   collections,
   collectionSlug,
@@ -43,7 +46,8 @@ export function HierarchyTable({
   relatedBaseFilters,
   relatedGroups,
   search,
-  useAsTitle
+  useAsTitle,
+  viewMode = 'table'
 }) {
   const {
     i18n,
@@ -55,6 +59,7 @@ export function HierarchyTable({
   const {
     config: {
       routes: {
+        admin: adminRoute,
         api: apiRoute
       },
       serverURL
@@ -93,6 +98,7 @@ export function HierarchyTable({
   });
   // Get selection functions from context
   const {
+    clearAll,
     isLocked,
     isSelected,
     toggleAllInCollection,
@@ -290,16 +296,31 @@ export function HierarchyTable({
   const childrenLabel = useMemo(() => getTranslation(getEntityConfig({
     collectionSlug
   })?.labels?.plural, i18n) || hierarchyLabel, [collectionSlug, getEntityConfig, hierarchyLabel, i18n]);
+  // Singular form of the hierarchy's own collection label (e.g. "Folder", "Tag"), used to call out
+  // documents that aren't grouped under one.
+  const hierarchySingularLabel = useMemo(() => getTranslation(getEntityConfig({
+    collectionSlug
+  })?.labels?.singular, i18n) || hierarchyLabel, [collectionSlug, getEntityConfig, hierarchyLabel, i18n]);
   // Build children data for table
-  const childTableData = useMemo(() => childDocs.map(doc => ({
-    ...doc,
-    id: doc.id,
-    _allowedCollections: allowedCollectionsFieldName ? doc[allowedCollectionsFieldName] : undefined,
-    _collectionLabel: childrenLabel,
-    _collectionSlug: collectionSlug,
-    _hasChildren: Boolean(doc._hasChildren),
-    _hierarchyIcon: HierarchyIcon
-  })), [HierarchyIcon, allowedCollectionsFieldName, childDocs, childrenLabel, collectionSlug]);
+  const childTableData = useMemo(() => {
+    // Drilling into a folder has to stay in the collection being browsed, and the route is spelled
+    // out rather than relying on the saved `listViewType` preference to redirect.
+    const browseSlug = browseCollectionSlug ?? collectionSlug;
+    const parentQueryParam = parentFieldName || 'parent';
+    return childDocs.map(doc => ({
+      ...doc,
+      id: doc.id,
+      _allowedCollections: allowedCollectionsFieldName ? doc[allowedCollectionsFieldName] : undefined,
+      _browseHref: formatAdminURL({
+        adminRoute,
+        path: `/collections/${browseSlug}/hierarchy?${parentQueryParam}=${doc.id}`
+      }),
+      _collectionLabel: childrenLabel,
+      _collectionSlug: collectionSlug,
+      _hasChildren: Boolean(doc._hasChildren),
+      _hierarchyIcon: HierarchyIcon
+    }));
+  }, [HierarchyIcon, adminRoute, allowedCollectionsFieldName, browseCollectionSlug, childDocs, childrenLabel, collectionSlug, parentFieldName]);
   const hasChildren = (childPaginationData.totalDocs || 0) > 0;
   const hasRelated = relatedGroups.some(g_0 => relatedState[g_0.collectionSlug]?.totalDocs > 0);
   const allGroups = useMemo(() => {
@@ -382,6 +403,70 @@ export function HierarchyTable({
     }
     return groups;
   }, [childDocs, childLoading, childPaginationData, childrenLabel, childTableData, collectionSlug, getEntityConfig, handlePageChangeChildren, handlePageChangeRelated, hasChildren, i18n, relatedGroups, relatedState, toggleAllInCollection, toggleSelection]);
+  /**
+  * Grid mode puts folders and documents on one plane: a folders band, then a single documents band
+  * merging every related collection, so cross-collection selection and drag work as one gesture.
+  */
+  const planeBands = useMemo(() => {
+    const folderGroup = allGroups.find(group_2 => group_2.isChildren);
+    const documentGroups = allGroups.filter(group_3 => !group_3.isChildren);
+    const documentRows = documentGroups.flatMap(group_4 => group_4.docs);
+    const bands = [];
+    if (folderGroup) {
+      bands.push({
+        isHierarchyGroup: true,
+        key: 'folders',
+        label: folderGroup.label,
+        rows: folderGroup.docs
+      });
+    }
+    if (documentRows.length > 0) {
+      const documentsLabel = documentGroups.length === 1 ? documentGroups[0].label : t('general:documents');
+      bands.push({
+        isHierarchyGroup: false,
+        key: 'documents',
+        label: documentsLabel,
+        rows: documentRows,
+        // Only the root of a hierarchy has documents that aren't inside any folder - inside a
+        // folder, the ungrouped documents there are just that folder's contents.
+        visibleLabel: parentId === null ? `${documentsLabel} not in a ${hierarchySingularLabel}` : undefined
+      });
+    }
+    return bands;
+  }, [allGroups, hierarchySingularLabel, parentId, t]);
+  /**
+  * A merged band spans collections, so selection is driven off each row's own collection rather
+  * than a per-group closure.
+  */
+  const handlePlaneSelectionChange = useCallback(row_2 => toggleSelection({
+    id: row_2.id,
+    collectionSlug: row_2._collectionSlug,
+    metadata: {
+      allowedCollections: row_2._allowedCollections
+    }
+  }), [toggleSelection]);
+  /**
+  * The moved documents no longer belong to this folder, so the selection that referenced them is
+  * cleared and the route refetched.
+  */
+  const handleDropMoveSuccess = useCallback(() => {
+    clearAll();
+    clearRouteCache();
+  }, [clearAll, clearRouteCache]);
+  const selectedKeys = useMemo(() => {
+    const keys = new Set();
+    for (const band of planeBands) {
+      for (const row_3 of band.rows) {
+        if (isSelected({
+          id: row_3.id,
+          collectionSlug: row_3._collectionSlug
+        })) {
+          keys.add(getRowKey(row_3));
+        }
+      }
+    }
+    return keys;
+  }, [isSelected, planeBands]);
   // Column definitions
   const columns = useMemo(() => [{
     accessor: 'name',
@@ -412,36 +497,69 @@ export function HierarchyTable({
       withMargin: true
     });
   }
+  if (viewMode === 'grid') {
+    return /*#__PURE__*/_jsxs("div", {
+      className: baseClass,
+      children: [/*#__PURE__*/_jsx(HierarchyCardGrid, {
+        ancestorIds: ancestorIds,
+        bands: planeBands,
+        fillHeight: true,
+        getRowLockedUser: getRowLockedUser,
+        hierarchySlug: collectionSlug,
+        onMoveSuccess: handleDropMoveSuccess,
+        onSelectionChange: handlePlaneSelectionChange,
+        selectedKeys: selectedKeys
+      }), /*#__PURE__*/_jsx("div", {
+        className: `${baseClass}__plane-pagination`,
+        children: allGroups.filter(group_5 => group_5.paginationData.hasNextPage || group_5.paginationData.hasPrevPage).map(group_6 => /*#__PURE__*/_jsxs("div", {
+          className: `${baseClass}__plane-pagination-group`,
+          children: [/*#__PURE__*/_jsx("span", {
+            className: `${baseClass}__plane-pagination-label`,
+            children: group_6.label
+          }), /*#__PURE__*/_jsx(SimplePagination, {
+            data: group_6.paginationData,
+            onChange: group_6.onPageChange
+          })]
+        }, group_6.slug))
+      })]
+    });
+  }
   return /*#__PURE__*/_jsx("div", {
     className: baseClass,
-    children: allGroups.map(group_2 => /*#__PURE__*/_jsxs(TableSection, {
-      children: [/*#__PURE__*/_jsx(TableSection.Header, {
-        heading: group_2.label,
-        children: /*#__PURE__*/_jsx(SimplePagination, {
-          data: group_2.paginationData,
-          onChange: group_2.onPageChange
-        })
-      }), /*#__PURE__*/_jsx(TableSection.Content, {
-        children: /*#__PURE__*/_jsx(SlotTable, {
-          collectionSlug: group_2.slug,
-          columns: columns,
-          data: group_2.docs,
-          enableCheckbox: true,
-          enableDragHandle: false,
-          enableHeader: true,
-          enableSelectAll: true,
-          getRowLockedUser: getRowLockedUser,
-          mergeCheckboxHeader: false,
-          onCheckboxChange: group_2.onCheckboxChange,
-          onSelectAllChange: group_2.onSelectAllChange,
-          parentId: parentId,
-          selectedIds: new Set(group_2.docs.filter(row_2 => isSelected({
-            id: row_2.id,
-            collectionSlug: group_2.slug
-          })).map(row_3 => row_3.id))
-        })
-      })]
-    }, group_2.slug))
+    children: allGroups.map((group_7, groupIndex) => {
+      const selectedIds = new Set(group_7.docs.filter(row_4 => isSelected({
+        id: row_4.id,
+        collectionSlug: group_7.slug
+      })).map(row_5 => row_5.id));
+      // Only the final group can claim the leftover height below the sections; growing an
+      // earlier one would push the groups after it off-screen.
+      const isLastGroup = groupIndex === allGroups.length - 1;
+      return /*#__PURE__*/_jsxs(TableSection, {
+        children: [/*#__PURE__*/_jsx(TableSection.Header, {
+          heading: group_7.label,
+          children: /*#__PURE__*/_jsx(SimplePagination, {
+            data: group_7.paginationData,
+            onChange: group_7.onPageChange
+          })
+        }), /*#__PURE__*/_jsx(TableSection.Content, {
+          children: /*#__PURE__*/_jsx(SlotTable, {
+            collectionSlug: group_7.slug,
+            columns: columns,
+            data: group_7.docs,
+            enableCheckbox: true,
+            enableDragHandle: false,
+            enableHeader: true,
+            enableSelectAll: true,
+            getRowLockedUser: getRowLockedUser,
+            mergeCheckboxHeader: false,
+            onCheckboxChange: group_7.onCheckboxChange,
+            onSelectAllChange: group_7.onSelectAllChange,
+            parentId: parentId,
+            selectedIds: selectedIds
+          })
+        })]
+      }, group_7.slug);
+    })
   });
 }
 //# sourceMappingURL=index.js.map