@payloadcms/ui 3.0.0-canary.f83d96a → 3.0.0-canary.fb04843

package/dist/elements/Table/RelationshipProvider/reducer.js

@@ -1,45 +1,45 @@
 export function reducer(state, action) {
-    switch(action.type){
-        case 'REQUEST':
-            {
-                const newState = {
-                    ...state
-                };
-                action.docs.forEach(({ relationTo, value })=>{
-                    if (typeof newState[relationTo] !== 'object') {
-                        newState[relationTo] = {};
-                    }
-                    newState[relationTo][value] = null;
-                });
-                return newState;
-            }
-        case 'ADD_LOADED':
-            {
-                const newState = {
-                    ...state
-                };
-                if (typeof newState[action.relationTo] !== 'object') {
-                    newState[action.relationTo] = {};
-                }
-                const unreturnedIDs = [
-                    ...action.idsToLoad
-                ];
-                if (Array.isArray(action.docs)) {
-                    action.docs.forEach((doc)=>{
-                        unreturnedIDs.splice(unreturnedIDs.indexOf(doc.id), 1);
-                        newState[action.relationTo][doc.id] = doc;
-                    });
-                }
-                unreturnedIDs.forEach((id)=>{
-                    newState[action.relationTo][id] = false;
-                });
-                return newState;
-            }
-        default:
-            {
-                return state;
-            }
-    }
+  switch (action.type) {
+    case 'ADD_LOADED':
+      {
+        const newState = {
+          ...state
+        };
+        if (typeof newState[action.relationTo] !== 'object') {
+          newState[action.relationTo] = {};
+        }
+        const unreturnedIDs = [...action.idsToLoad];
+        if (Array.isArray(action.docs)) {
+          action.docs.forEach(doc => {
+            unreturnedIDs.splice(unreturnedIDs.indexOf(doc.id), 1);
+            newState[action.relationTo][doc.id] = doc;
+          });
+        }
+        unreturnedIDs.forEach(id => {
+          newState[action.relationTo][id] = false;
+        });
+        return newState;
+      }
+    case 'REQUEST':
+      {
+        const newState = {
+          ...state
+        };
+        action.docs.forEach(({
+          relationTo,
+          value
+        }) => {
+          if (typeof newState[relationTo] !== 'object') {
+            newState[relationTo] = {};
+          }
+          newState[relationTo][value] = null;
+        });
+        return newState;
+      }
+    default:
+      {
+        return state;
+      }
+  }
 }
-
 //# sourceMappingURL=reducer.js.map

package/dist/elements/Table/RelationshipProvider/reducer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Table/RelationshipProvider/reducer.ts"],"sourcesContent":["import type { TypeWithID } from 'payload'\n\nimport type { Documents } from './index.js'\n\ntype RequestDocuments = {\n  docs: { relationTo: string; value: number | string }[]\n  type: 'REQUEST'\n}\n\ntype AddLoadedDocuments = {\n  docs: TypeWithID[]\n  idsToLoad: (number | string)[]\n  relationTo: string\n  type: 'ADD_LOADED'\n}\n\ntype Action = AddLoadedDocuments | RequestDocuments\n\nexport function reducer(state: Documents, action: Action): Documents {\n  switch (action.type) {\n    case 'REQUEST': {\n      const newState = { ...state }\n\n      action.docs.forEach(({ relationTo, value }) => {\n        if (typeof newState[relationTo] !== 'object') {\n          newState[relationTo] = {}\n        }\n        newState[relationTo][value] = null\n      })\n\n      return newState\n    }\n\n    case 'ADD_LOADED': {\n      const newState = { ...state }\n      if (typeof newState[action.relationTo] !== 'object') {\n        newState[action.relationTo] = {}\n      }\n      const unreturnedIDs = [...action.idsToLoad]\n\n      if (Array.isArray(action.docs)) {\n        action.docs.forEach((doc) => {\n          unreturnedIDs.splice(unreturnedIDs.indexOf(doc.id), 1)\n          newState[action.relationTo][doc.id] = doc\n        })\n      }\n\n      unreturnedIDs.forEach((id) => {\n        newState[action.relationTo][id] = false\n      })\n\n      return newState\n    }\n\n    default: {\n      return state\n    }\n  }\n}\n"],"names":["reducer","state","action","type","newState","docs","forEach","relationTo","value","unreturnedIDs","idsToLoad","Array","isArray","doc","splice","indexOf","id"],"mappings":"AAkBA,OAAO,SAASA,QAAQC,KAAgB,EAAEC,MAAc;IACtD,OAAQA,OAAOC,IAAI;QACjB,KAAK;YAAW;gBACd,MAAMC,WAAW;oBAAE,GAAGH,KAAK;gBAAC;gBAE5BC,OAAOG,IAAI,CAACC,OAAO,CAAC,CAAC,EAAEC,UAAU,EAAEC,KAAK,EAAE;oBACxC,IAAI,OAAOJ,QAAQ,CAACG,WAAW,KAAK,UAAU;wBAC5CH,QAAQ,CAACG,WAAW,GAAG,CAAC;oBAC1B;oBACAH,QAAQ,CAACG,WAAW,CAACC,MAAM,GAAG;gBAChC;gBAEA,OAAOJ;YACT;QAEA,KAAK;YAAc;gBACjB,MAAMA,WAAW;oBAAE,GAAGH,KAAK;gBAAC;gBAC5B,IAAI,OAAOG,QAAQ,CAACF,OAAOK,UAAU,CAAC,KAAK,UAAU;oBACnDH,QAAQ,CAACF,OAAOK,UAAU,CAAC,GAAG,CAAC;gBACjC;gBACA,MAAME,gBAAgB;uBAAIP,OAAOQ,SAAS;iBAAC;gBAE3C,IAAIC,MAAMC,OAAO,CAACV,OAAOG,IAAI,GAAG;oBAC9BH,OAAOG,IAAI,CAACC,OAAO,CAAC,CAACO;wBACnBJ,cAAcK,MAAM,CAACL,cAAcM,OAAO,CAACF,IAAIG,EAAE,GAAG;wBACpDZ,QAAQ,CAACF,OAAOK,UAAU,CAAC,CAACM,IAAIG,EAAE,CAAC,GAAGH;oBACxC;gBACF;gBAEAJ,cAAcH,OAAO,CAAC,CAACU;oBACrBZ,QAAQ,CAACF,OAAOK,UAAU,CAAC,CAACS,GAAG,GAAG;gBACpC;gBAEA,OAAOZ;YACT;QAEA;YAAS;gBACP,OAAOH;YACT;IACF;AACF"}
+{"version":3,"file":"reducer.js","names":["reducer","state","action","type","newState","relationTo","unreturnedIDs","idsToLoad","Array","isArray","docs","forEach","doc","splice","indexOf","id","value"],"sources":["../../../../src/elements/Table/RelationshipProvider/reducer.ts"],"sourcesContent":["import type { TypeWithID } from 'payload'\n\nimport type { Documents } from './index.js'\n\ntype RequestDocuments = {\n  docs: { relationTo: string; value: number | string }[]\n  type: 'REQUEST'\n}\n\ntype AddLoadedDocuments = {\n  docs: TypeWithID[]\n  idsToLoad: (number | string)[]\n  relationTo: string\n  type: 'ADD_LOADED'\n}\n\ntype Action = AddLoadedDocuments | RequestDocuments\n\nexport function reducer(state: Documents, action: Action): Documents {\n  switch (action.type) {\n    case 'ADD_LOADED': {\n      const newState = { ...state }\n      if (typeof newState[action.relationTo] !== 'object') {\n        newState[action.relationTo] = {}\n      }\n      const unreturnedIDs = [...action.idsToLoad]\n\n      if (Array.isArray(action.docs)) {\n        action.docs.forEach((doc) => {\n          unreturnedIDs.splice(unreturnedIDs.indexOf(doc.id), 1)\n          newState[action.relationTo][doc.id] = doc\n        })\n      }\n\n      unreturnedIDs.forEach((id) => {\n        newState[action.relationTo][id] = false\n      })\n\n      return newState\n    }\n\n    case 'REQUEST': {\n      const newState = { ...state }\n\n      action.docs.forEach(({ relationTo, value }) => {\n        if (typeof newState[relationTo] !== 'object') {\n          newState[relationTo] = {}\n        }\n        newState[relationTo][value] = null\n      })\n\n      return newState\n    }\n\n    default: {\n      return state\n    }\n  }\n}\n"],"mappings":"AAkBA,OAAO,SAASA,QAAQC,KAAgB,EAAEC,MAAc;EACtD,QAAQA,MAAA,CAAOC,IAAI;IACjB,KAAK;MAAc;QACjB,MAAMC,QAAA,GAAW;UAAE,GAAGH;QAAM;QAC5B,IAAI,OAAOG,QAAQ,CAACF,MAAA,CAAOG,UAAU,CAAC,KAAK,UAAU;UACnDD,QAAQ,CAACF,MAAA,CAAOG,UAAU,CAAC,GAAG,CAAC;QACjC;QACA,MAAMC,aAAA,GAAgB,C,GAAIJ,MAAA,CAAOK,SAAS,CAAC;QAE3C,IAAIC,KAAA,CAAMC,OAAO,CAACP,MAAA,CAAOQ,IAAI,GAAG;UAC9BR,MAAA,CAAOQ,IAAI,CAACC,OAAO,CAAEC,GAAA;YACnBN,aAAA,CAAcO,MAAM,CAACP,aAAA,CAAcQ,OAAO,CAACF,GAAA,CAAIG,EAAE,GAAG;YACpDX,QAAQ,CAACF,MAAA,CAAOG,UAAU,CAAC,CAACO,GAAA,CAAIG,EAAE,CAAC,GAAGH,GAAA;UACxC;QACF;QAEAN,aAAA,CAAcK,OAAO,CAAEI,EAAA;UACrBX,QAAQ,CAACF,MAAA,CAAOG,UAAU,CAAC,CAACU,EAAA,CAAG,GAAG;QACpC;QAEA,OAAOX,QAAA;MACT;IAEA,KAAK;MAAW;QACd,MAAMA,QAAA,GAAW;UAAE,GAAGH;QAAM;QAE5BC,MAAA,CAAOQ,IAAI,CAACC,OAAO,CAAC,CAAC;UAAEN,UAAU;UAAEW;QAAK,CAAE;UACxC,IAAI,OAAOZ,QAAQ,CAACC,UAAA,CAAW,KAAK,UAAU;YAC5CD,QAAQ,CAACC,UAAA,CAAW,GAAG,CAAC;UAC1B;UACAD,QAAQ,CAACC,UAAA,CAAW,CAACW,KAAA,CAAM,GAAG;QAChC;QAEA,OAAOZ,QAAA;MACT;IAEA;MAAS;QACP,OAAOH,KAAA;MACT;EACF;AACF","ignoreList":[]}

package/dist/elements/Table/index.d.ts

@@ -1,28 +1,18 @@
-import type { CellComponentProps, FieldBase, FieldTypes } from 'payload';
+import type { ClientField } from 'payload';
 import React from 'react';
-export * from './TableCellProvider/index.js';
-import type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js';
-import { TableCellProvider } from './TableCellProvider/index.js';
 import './index.scss';
-export { TableCellProvider };
 export type Column = {
-    Label: React.ReactNode;
-    accessor: string;
-    active: boolean;
-    admin?: FieldBase['admin'];
-    cellProps?: Partial<CellComponentProps>;
-    components: {
-        Cell: React.ReactNode;
-        Heading: React.ReactNode;
-    };
-    name: FieldBase['name'];
-    type: keyof FieldTypes;
+    readonly accessor: string;
+    readonly active: boolean;
+    readonly CustomLabel?: React.ReactNode;
+    readonly field: ClientField;
+    readonly Heading: React.ReactNode;
+    readonly renderedCells: React.ReactNode[];
 };
 export type Props = {
-    columns?: Column[];
-    customCellContext?: Record<string, unknown>;
-    data: Record<string, unknown>[];
-    fieldMap: FieldMap;
+    readonly appearance?: 'condensed' | 'default';
+    readonly columns?: Column[];
+    readonly data: Record<string, unknown>[];
 };
 export declare const Table: React.FC<Props>;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/Table/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Table/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAExE,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,cAAc,8BAA8B,CAAA;AAE5C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yDAAyD,CAAA;AAGvF,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAA;AAChE,OAAO,cAAc,CAAA;AAErB,OAAO,EAAE,iBAAiB,EAAE,CAAA;AAI5B,MAAM,MAAM,MAAM,GAAG;IACnB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,OAAO,CAAA;IACf,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAA;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAA;IACvC,UAAU,EAAE;QACV,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;QACrB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;KACzB,CAAA;IACD,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAA;IACvB,IAAI,EAAE,MAAM,UAAU,CAAA;CACvB,CAAA;AAED,MAAM,MAAM,KAAK,GAAG;IAClB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAC3C,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAA;IAC/B,QAAQ,EAAE,QAAQ,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAgDjC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Table/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,MAAM,GAAG;IACnB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;IACzB,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAA;IACxB,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAA;IAC3B,QAAQ,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;IACjC,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;CAC1C,CAAA;AAED,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC7C,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAC3B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAA;CACzC,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA0CjC,CAAA"}

package/dist/elements/Table/index.js

@@ -1,56 +1,47 @@
 'use client';
+
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
-export * from './TableCellProvider/index.js';
-import { useTableColumns } from '../TableColumns/index.js';
-import { TableCellProvider } from './TableCellProvider/index.js';
 import './index.scss';
-export { TableCellProvider };
 const baseClass = 'table';
-export const Table = ({ columns: columnsFromProps, customCellContext, data })=>{
-    const { columns: columnsFromContext } = useTableColumns();
-    const columns = columnsFromProps || columnsFromContext;
-    const activeColumns = columns?.filter((col)=>col?.active);
-    if (!activeColumns || activeColumns.length === 0) {
-        return /*#__PURE__*/ _jsx("div", {
-            children: "No columns selected"
-        });
-    }
-    return /*#__PURE__*/ _jsx("div", {
-        className: baseClass,
-        children: /*#__PURE__*/ _jsxs("table", {
-            cellPadding: "0",
-            cellSpacing: "0",
-            children: [
-                /*#__PURE__*/ _jsx("thead", {
-                    children: /*#__PURE__*/ _jsx("tr", {
-                        children: activeColumns.map((col, i)=>/*#__PURE__*/ _jsx("th", {
-                                id: `heading-${col.accessor}`,
-                                children: col.components.Heading
-                            }, i))
-                    })
-                }),
-                /*#__PURE__*/ _jsx("tbody", {
-                    children: data && data.map((row, rowIndex)=>/*#__PURE__*/ _jsx("tr", {
-                            className: `row-${rowIndex + 1}`,
-                            children: activeColumns.map((col, colIndex)=>{
-                                return /*#__PURE__*/ _jsx("td", {
-                                    className: `cell-${col.accessor}`,
-                                    children: /*#__PURE__*/ _jsx(TableCellProvider, {
-                                        cellData: row[col.accessor],
-                                        cellProps: col?.cellProps,
-                                        columnIndex: colIndex,
-                                        customCellContext: customCellContext,
-                                        rowData: row,
-                                        children: col.components.Cell
-                                    })
-                                }, colIndex);
-                            })
-                        }, rowIndex))
-                })
-            ]
-        })
+export const Table = ({
+  appearance,
+  columns,
+  data
+}) => {
+  const activeColumns = columns?.filter(col => col?.active);
+  if (!activeColumns || activeColumns.length === 0) {
+    return /*#__PURE__*/_jsx("div", {
+      children: "No columns selected"
     });
+  }
+  return /*#__PURE__*/_jsx("div", {
+    className: [baseClass, appearance && `${baseClass}--appearance-${appearance}`].filter(Boolean).join(' '),
+    children: /*#__PURE__*/_jsxs("table", {
+      cellPadding: "0",
+      cellSpacing: "0",
+      children: [/*#__PURE__*/_jsx("thead", {
+        children: /*#__PURE__*/_jsx("tr", {
+          children: activeColumns.map((col, i) => /*#__PURE__*/_jsx("th", {
+            id: `heading-${col.accessor}`,
+            children: col.Heading
+          }, i))
+        })
+      }), /*#__PURE__*/_jsx("tbody", {
+        children: data && data.map((row, rowIndex) => /*#__PURE__*/_jsx("tr", {
+          className: `row-${rowIndex + 1}`,
+          children: activeColumns.map((col, colIndex) => {
+            const {
+              accessor
+            } = col;
+            return /*#__PURE__*/_jsx("td", {
+              className: `cell-${accessor}`,
+              children: col.renderedCells[rowIndex]
+            }, colIndex);
+          })
+        }, rowIndex))
+      })]
+    })
+  });
 };
-
 //# sourceMappingURL=index.js.map

package/dist/elements/Table/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Table/index.tsx"],"sourcesContent":["'use client'\nimport type { CellComponentProps, FieldBase, FieldTypes } from 'payload'\n\nimport React from 'react'\n\nexport * from './TableCellProvider/index.js'\n\nimport type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js'\n\nimport { useTableColumns } from '../TableColumns/index.js'\nimport { TableCellProvider } from './TableCellProvider/index.js'\nimport './index.scss'\n\nexport { TableCellProvider }\n\nconst baseClass = 'table'\n\nexport type Column = {\n  Label: React.ReactNode\n  accessor: string\n  active: boolean\n  admin?: FieldBase['admin']\n  cellProps?: Partial<CellComponentProps>\n  components: {\n    Cell: React.ReactNode\n    Heading: React.ReactNode\n  }\n  name: FieldBase['name']\n  type: keyof FieldTypes\n}\n\nexport type Props = {\n  columns?: Column[]\n  customCellContext?: Record<string, unknown>\n  data: Record<string, unknown>[]\n  fieldMap: FieldMap\n}\n\nexport const Table: React.FC<Props> = ({ columns: columnsFromProps, customCellContext, data }) => {\n  const { columns: columnsFromContext } = useTableColumns()\n\n  const columns = columnsFromProps || columnsFromContext\n\n  const activeColumns = columns?.filter((col) => col?.active)\n\n  if (!activeColumns || activeColumns.length === 0) {\n    return <div>No columns selected</div>\n  }\n\n  return (\n    <div className={baseClass}>\n      <table cellPadding=\"0\" cellSpacing=\"0\">\n        <thead>\n          <tr>\n            {activeColumns.map((col, i) => (\n              <th id={`heading-${col.accessor}`} key={i}>\n                {col.components.Heading}\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {data &&\n            data.map((row, rowIndex) => (\n              <tr className={`row-${rowIndex + 1}`} key={rowIndex}>\n                {activeColumns.map((col, colIndex) => {\n                  return (\n                    <td className={`cell-${col.accessor}`} key={colIndex}>\n                      <TableCellProvider\n                        cellData={row[col.accessor]}\n                        cellProps={col?.cellProps}\n                        columnIndex={colIndex}\n                        customCellContext={customCellContext}\n                        rowData={row}\n                      >\n                        {col.components.Cell}\n                      </TableCellProvider>\n                    </td>\n                  )\n                })}\n              </tr>\n            ))}\n        </tbody>\n      </table>\n    </div>\n  )\n}\n"],"names":["React","useTableColumns","TableCellProvider","baseClass","Table","columns","columnsFromProps","customCellContext","data","columnsFromContext","activeColumns","filter","col","active","length","div","className","table","cellPadding","cellSpacing","thead","tr","map","i","th","id","accessor","components","Heading","tbody","row","rowIndex","colIndex","td","cellData","cellProps","columnIndex","rowData","Cell"],"mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAEzB,cAAc,+BAA8B;AAI5C,SAASC,eAAe,QAAQ,2BAA0B;AAC1D,SAASC,iBAAiB,QAAQ,+BAA8B;AAChE,OAAO,eAAc;AAErB,SAASA,iBAAiB,GAAE;AAE5B,MAAMC,YAAY;AAuBlB,OAAO,MAAMC,QAAyB,CAAC,EAAEC,SAASC,gBAAgB,EAAEC,iBAAiB,EAAEC,IAAI,EAAE;IAC3F,MAAM,EAAEH,SAASI,kBAAkB,EAAE,GAAGR;IAExC,MAAMI,UAAUC,oBAAoBG;IAEpC,MAAMC,gBAAgBL,SAASM,OAAO,CAACC,MAAQA,KAAKC;IAEpD,IAAI,CAACH,iBAAiBA,cAAcI,MAAM,KAAK,GAAG;QAChD,qBAAO,KAACC;sBAAI;;IACd;IAEA,qBACE,KAACA;QAAIC,WAAWb;kBACd,cAAA,MAACc;YAAMC,aAAY;YAAIC,aAAY;;8BACjC,KAACC;8BACC,cAAA,KAACC;kCACEX,cAAcY,GAAG,CAAC,CAACV,KAAKW,kBACvB,KAACC;gCAAGC,IAAI,CAAC,QAAQ,EAAEb,IAAIc,QAAQ,CAAC,CAAC;0CAC9Bd,IAAIe,UAAU,CAACC,OAAO;+BADeL;;;8BAM9C,KAACM;8BACErB,QACCA,KAAKc,GAAG,CAAC,CAACQ,KAAKC,yBACb,KAACV;4BAAGL,WAAW,CAAC,IAAI,EAAEe,WAAW,EAAE,CAAC;sCACjCrB,cAAcY,GAAG,CAAC,CAACV,KAAKoB;gCACvB,qBACE,KAACC;oCAAGjB,WAAW,CAAC,KAAK,EAAEJ,IAAIc,QAAQ,CAAC,CAAC;8CACnC,cAAA,KAACxB;wCACCgC,UAAUJ,GAAG,CAAClB,IAAIc,QAAQ,CAAC;wCAC3BS,WAAWvB,KAAKuB;wCAChBC,aAAaJ;wCACbzB,mBAAmBA;wCACnB8B,SAASP;kDAERlB,IAAIe,UAAU,CAACW,IAAI;;mCARoBN;4BAYhD;2BAfyCD;;;;;AAsBzD,EAAC"}
+{"version":3,"file":"index.js","names":["React","baseClass","Table","appearance","columns","data","activeColumns","filter","col","active","length","_jsx","className","Boolean","join","_jsxs","cellPadding","cellSpacing","map","i","id","accessor","Heading","row","rowIndex","colIndex","renderedCells"],"sources":["../../../src/elements/Table/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientField } from 'payload'\n\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'table'\n\nexport type Column = {\n  readonly accessor: string\n  readonly active: boolean\n  readonly CustomLabel?: React.ReactNode\n  readonly field: ClientField\n  readonly Heading: React.ReactNode\n  readonly renderedCells: React.ReactNode[]\n}\n\nexport type Props = {\n  readonly appearance?: 'condensed' | 'default'\n  readonly columns?: Column[]\n  readonly data: Record<string, unknown>[]\n}\n\nexport const Table: React.FC<Props> = ({ appearance, columns, data }) => {\n  const activeColumns = columns?.filter((col) => col?.active)\n\n  if (!activeColumns || activeColumns.length === 0) {\n    return <div>No columns selected</div>\n  }\n\n  return (\n    <div\n      className={[baseClass, appearance && `${baseClass}--appearance-${appearance}`]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <table cellPadding=\"0\" cellSpacing=\"0\">\n        <thead>\n          <tr>\n            {activeColumns.map((col, i) => (\n              <th id={`heading-${col.accessor}`} key={i}>\n                {col.Heading}\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {data &&\n            data.map((row, rowIndex) => (\n              <tr className={`row-${rowIndex + 1}`} key={rowIndex}>\n                {activeColumns.map((col, colIndex) => {\n                  const { accessor } = col\n\n                  return (\n                    <td className={`cell-${accessor}`} key={colIndex}>\n                      {col.renderedCells[rowIndex]}\n                    </td>\n                  )\n                })}\n              </tr>\n            ))}\n        </tbody>\n      </table>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAIA,OAAOA,KAAA,MAAW;AAElB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAiBlB,OAAO,MAAMC,KAAA,GAAyBA,CAAC;EAAEC,UAAU;EAAEC,OAAO;EAAEC;AAAI,CAAE;EAClE,MAAMC,aAAA,GAAgBF,OAAA,EAASG,MAAA,CAAQC,GAAA,IAAQA,GAAA,EAAKC,MAAA;EAEpD,IAAI,CAACH,aAAA,IAAiBA,aAAA,CAAcI,MAAM,KAAK,GAAG;IAChD,oBAAOC,IAAA,CAAC;gBAAI;;EACd;EAEA,oBACEA,IAAA,CAAC;IACCC,SAAA,EAAW,CAACX,SAAA,EAAWE,UAAA,IAAc,GAAGF,SAAA,gBAAyBE,UAAA,EAAY,CAAC,CAC3EI,MAAM,CAACM,OAAA,EACPC,IAAI,CAAC;cAER,aAAAC,KAAA,CAAC;MAAMC,WAAA,EAAY;MAAIC,WAAA,EAAY;8BACjCN,IAAA,CAAC;kBACC,aAAAA,IAAA,CAAC;oBACEL,aAAA,CAAcY,GAAG,CAAC,CAACV,GAAA,EAAKW,CAAA,kBACvBR,IAAA,CAAC;YAAGS,EAAA,EAAI,WAAWZ,GAAA,CAAIa,QAAQ,EAAE;sBAC9Bb,GAAA,CAAIc;aADiCH,CAAA;;uBAM9CR,IAAA,CAAC;kBACEN,IAAA,IACCA,IAAA,CAAKa,GAAG,CAAC,CAACK,GAAA,EAAKC,QAAA,kBACbb,IAAA,CAAC;UAAGC,SAAA,EAAW,OAAOY,QAAA,GAAW,GAAG;oBACjClB,aAAA,CAAcY,GAAG,CAAC,CAACV,GAAA,EAAKiB,QAAA;YACvB,MAAM;cAAEJ;YAAQ,CAAE,GAAGb,GAAA;YAErB,oBACEG,IAAA,CAAC;cAAGC,SAAA,EAAW,QAAQS,QAAA,EAAU;wBAC9Bb,GAAA,CAAIkB,aAAa,CAACF,QAAA;eADmBC,QAAA;UAI5C;WATyCD,QAAA;;;;AAgBzD","ignoreList":[]}

package/dist/elements/Table/index.scss

@@ -1,45 +1,106 @@
 @import '../../scss/styles.scss';
 
-.table {
-  margin-bottom: $baseline;
-  overflow: auto;
-  max-width: 100%;
+@layer payload-default {
+  .table {
+    margin-bottom: $baseline;
+    overflow: auto;
+    max-width: 100%;
 
-  thead {
-    color: var(--theme-elevation-400);
+    table {
+      min-width: 100%;
+    }
+
+    thead {
+      color: var(--theme-elevation-400);
 
-    th {
-      font-weight: normal;
-      text-align: left;
-      [dir='rtl'] & {
-        text-align: right;
+      th {
+        font-weight: normal;
+        text-align: left;
+        [dir='rtl'] & {
+          text-align: right;
+        }
       }
     }
-  }
 
-  th,
-  td {
-    padding: base(0.75);
-    min-width: 150px;
-  }
+    th,
+    td {
+      vertical-align: top;
+      padding: base(0.8) base(0.6);
+      min-width: 150px;
 
-  tbody {
-    tr {
-      &:nth-child(odd) {
-        background: var(--theme-elevation-50);
+      &:first-child {
+        padding-inline-start: base(0.8);
+      }
+
+      &:last-child {
+        padding-inline-end: base(0.8);
       }
     }
-  }
 
-  a:focus-visible {
-    outline: var(--accessibility-outline);
-    outline-offset: var(--accessibility-outline-offset);
-  }
+    tbody {
+      tr {
+        &:nth-child(odd) {
+          background: var(--theme-elevation-50);
+          border-radius: $style-radius-s;
+        }
+      }
+    }
 
-  @include mid-break {
-    th,
-    td {
-      max-width: 70vw;
+    a:focus-visible {
+      outline: var(--accessibility-outline);
+      outline-offset: var(--accessibility-outline-offset);
+    }
+
+    &--appearance-condensed {
+      thead {
+        th:first-child {
+          border-top-left-radius: $style-radius-s;
+        }
+
+        th:last-child {
+          border-top-right-radius: $style-radius-s;
+        }
+
+        background: var(--theme-elevation-50);
+      }
+
+      tbody {
+        tr {
+          &:nth-child(odd) {
+            background: transparent;
+            border-radius: 0;
+          }
+        }
+      }
+
+      th,
+      td {
+        padding: base(0.3) base(0.3);
+
+        &:first-child {
+          padding-inline-start: base(0.6);
+        }
+
+        &:last-child {
+          padding-inline-end: base(0.6);
+        }
+      }
+
+      th {
+        padding: base(0.3);
+      }
+
+      tr td,
+      th {
+        border: 0.5px solid var(--theme-elevation-100);
+      }
+    }
+
+    @include mid-break {
+      th,
+      td {
+        max-width: 70vw;
+      }
     }
   }
 }

package/dist/elements/TableColumns/RenderDefaultCell/index.d.ts

@@ -0,0 +1,11 @@
+import type { DefaultCellComponentProps } from 'payload';
+import React from 'react';
+import './index.scss';
+export declare const useCellProps: () => DefaultCellComponentProps | null;
+export declare const RenderDefaultCell: React.FC<{
+    clientProps: DefaultCellComponentProps;
+    columnIndex: number;
+    enableRowSelections?: boolean;
+    isLinkedColumn?: boolean;
+}>;
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/TableColumns/RenderDefaultCell/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/TableColumns/RenderDefaultCell/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAExD,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AAMrB,eAAO,MAAM,YAAY,QAAO,yBAAyB,GAAG,IACxB,CAAA;AAEpC,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC;IACvC,WAAW,EAAE,yBAAyB,CAAA;IACtC,WAAW,EAAE,MAAM,CAAA;IACnB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAwBA,CAAA"}

package/dist/elements/TableColumns/RenderDefaultCell/index.js

@@ -0,0 +1,77 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { useListDrawerContext } from '../../../elements/ListDrawer/Provider.js';
+import { DefaultCell } from '../../Table/DefaultCell/index.js';
+import { useTableColumns } from '../index.js';
+import './index.scss';
+const baseClass = 'default-cell';
+const CellPropsContext = /*#__PURE__*/React.createContext(null);
+export const useCellProps = () => {
+  return React.useContext(CellPropsContext);
+};
+export const RenderDefaultCell = t0 => {
+  const $ = _c(9);
+  const {
+    clientProps,
+    columnIndex,
+    isLinkedColumn
+  } = t0;
+  const {
+    drawerSlug,
+    onSelect
+  } = useListDrawerContext();
+  const {
+    LinkedCellOverride
+  } = useTableColumns();
+  let t1;
+  if ($[0] !== clientProps || $[1] !== columnIndex || $[2] !== isLinkedColumn || $[3] !== drawerSlug || $[4] !== onSelect || $[5] !== LinkedCellOverride) {
+    const propsToPass = {
+      ...clientProps,
+      columnIndex
+    };
+    if (isLinkedColumn && drawerSlug) {
+      propsToPass.className = `${baseClass}__first-cell`;
+      propsToPass.link = false;
+      let t2;
+      if ($[7] !== onSelect) {
+        t2 = t3 => {
+          const {
+            collectionSlug: rowColl,
+            rowData
+          } = t3;
+          if (typeof onSelect === "function") {
+            onSelect({
+              collectionSlug: rowColl,
+              docID: rowData.id
+            });
+          }
+        };
+        $[7] = onSelect;
+        $[8] = t2;
+      } else {
+        t2 = $[8];
+      }
+      propsToPass.onClick = t2;
+    }
+    t1 = _jsx(CellPropsContext.Provider, {
+      value: propsToPass,
+      children: isLinkedColumn && LinkedCellOverride ? LinkedCellOverride : _jsx(DefaultCell, {
+        ...propsToPass
+      })
+    });
+    $[0] = clientProps;
+    $[1] = columnIndex;
+    $[2] = isLinkedColumn;
+    $[3] = drawerSlug;
+    $[4] = onSelect;
+    $[5] = LinkedCellOverride;
+    $[6] = t1;
+  } else {
+    t1 = $[6];
+  }
+  return t1;
+};
+//# sourceMappingURL=index.js.map

package/dist/elements/TableColumns/RenderDefaultCell/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["c","_c","React","useListDrawerContext","DefaultCell","useTableColumns","baseClass","CellPropsContext","createContext","useCellProps","useContext","RenderDefaultCell","t0","$","clientProps","columnIndex","isLinkedColumn","drawerSlug","onSelect","LinkedCellOverride","t1","propsToPass","className","link","t2","t3","collectionSlug","rowColl","rowData","docID","id","onClick","_jsx","Provider","value","children"],"sources":["../../../../src/elements/TableColumns/RenderDefaultCell/index.tsx"],"sourcesContent":["'use client'\nimport type { DefaultCellComponentProps } from 'payload'\n\nimport React from 'react'\n\nimport { useListDrawerContext } from '../../../elements/ListDrawer/Provider.js'\nimport { DefaultCell } from '../../Table/DefaultCell/index.js'\nimport { useTableColumns } from '../index.js'\nimport './index.scss'\n\nconst baseClass = 'default-cell'\n\nconst CellPropsContext = React.createContext<DefaultCellComponentProps | null>(null)\n\nexport const useCellProps = (): DefaultCellComponentProps | null =>\n  React.useContext(CellPropsContext)\n\nexport const RenderDefaultCell: React.FC<{\n  clientProps: DefaultCellComponentProps\n  columnIndex: number\n  enableRowSelections?: boolean\n  isLinkedColumn?: boolean\n}> = ({ clientProps, columnIndex, isLinkedColumn }) => {\n  const { drawerSlug, onSelect } = useListDrawerContext()\n  const { LinkedCellOverride } = useTableColumns()\n\n  const propsToPass = { ...clientProps, columnIndex }\n\n  if (isLinkedColumn && drawerSlug) {\n    propsToPass.className = `${baseClass}__first-cell`\n    propsToPass.link = false\n    propsToPass.onClick = ({ collectionSlug: rowColl, rowData }) => {\n      if (typeof onSelect === 'function') {\n        onSelect({\n          collectionSlug: rowColl,\n          docID: rowData.id as string,\n        })\n      }\n    }\n  }\n\n  return (\n    <CellPropsContext.Provider value={propsToPass}>\n      {isLinkedColumn && LinkedCellOverride ? LinkedCellOverride : <DefaultCell {...propsToPass} />}\n    </CellPropsContext.Provider>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,OAAOC,KAAA,MAAW;AAElB,SAASC,oBAAoB,QAAQ;AACrC,SAASC,WAAW,QAAQ;AAC5B,SAASC,eAAe,QAAQ;AAChC,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,MAAMC,gBAAA,gBAAmBL,KAAA,CAAMM,aAAa,CAAmC;AAE/E,OAAO,MAAMC,YAAA,GAAeA,CAAA;EAAA,OAC1BP,KAAA,CAAAQ,UAAA,CAAAH,gBAAiB;AAAA;AAEnB,OAAO,MAAMI,iBAAA,GAKRC,EAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EAAC;IAAAa,WAAA;IAAAC,WAAA;IAAAC;EAAA,IAAAJ,EAA4C;EAChD;IAAAK,UAAA;IAAAC;EAAA,IAAiCf,oBAAA;EACjC;IAAAgB;EAAA,IAA+Bd,eAAA;EAAA,IAAAe,EAAA;EAAA,IAAAP,CAAA,QAAAC,WAAA,IAAAD,CAAA,QAAAE,WAAA,IAAAF,CAAA,QAAAG,cAAA,IAAAH,CAAA,QAAAI,UAAA,IAAAJ,CAAA,QAAAK,QAAA,IAAAL,CAAA,QAAAM,kBAAA;IAE/B,MAAAE,WAAA;MAAA,GAAyBP,WAAW;MAAAC;IAAA;IAAc,IAE9CC,cAAA,IAAkBC,UAAA;MACpBI,WAAA,CAAAC,SAAA,GAAwB,GAAAhB,SAAA,cAA0B;MAClDe,WAAA,CAAAE,IAAA;MAAA,IAAAC,EAAA;MAAA,IAAAX,CAAA,QAAAK,QAAA;QACsBM,EAAA,GAAAC,EAAA;UAAC;YAAAC,cAAA,EAAAC,OAAA;YAAAC;UAAA,IAAAH,EAAoC;UAAA,IACrD,OAAOP,QAAA,KAAa;YACtBA,QAAA;cAAAQ,cAAA,EACkBC,OAAA;cAAAE,KAAA,EACTD,OAAA,CAAAE;YAAA,CACT;UAAA;QAAA;QAEJjB,CAAA,MAAAK,QAAA;QAAAL,CAAA,MAAAW,EAAA;MAAA;QAAAA,EAAA,GAAAX,CAAA;MAAA;MAPAQ,WAAA,CAAAU,OAAA,GAAsBP,EAOtB;IAAA;IAIAJ,EAAA,GAAAY,IAAA,CAAAzB,gBAAA,CAAA0B,QAAA;MAAAC,KAAA,EAAkCb,WAAA;MAAAc,QAAA,EAC/BnB,cAAA,IAAkBG,kBAAA,GAAqBA,kBAAA,GAAqBa,IAAA,CAAA5B,WAAA;QAAA,GAAiBiB;MAAW,C;;;;;;;;;;;;SAD3FD,E;CAIJ","ignoreList":[]}

package/dist/elements/TableColumns/RenderDefaultCell/index.scss

@@ -0,0 +1,15 @@
+@import '../../../scss/styles.scss';
+
+@layer payload-default {
+  .default-cell {
+    &__first-cell {
+      border: 0;
+      background-color: transparent;
+      padding: 0;
+      cursor: pointer;
+      text-decoration: underline;
+      text-align: left;
+      white-space: nowrap;
+    }
+  }
+}

package/dist/elements/TableColumns/buildColumnState.d.ts

@@ -1,13 +1,21 @@
-import { type CellComponentProps, type SanitizedCollectionConfig } from 'payload';
-import type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js';
-import type { ColumnPreferences } from '../../providers/ListInfo/index.js';
+import type { I18nClient } from '@payloadcms/translations';
+import type { ClientCollectionConfig, DefaultCellComponentProps, Field, PaginatedDocs, Payload, SanitizedCollectionConfig } from 'payload';
+import type { ColumnPreferences } from '../../providers/ListQuery/index.js';
+import type { SortColumnProps } from '../SortColumn/index.js';
 import type { Column } from '../Table/index.js';
 type Args = {
-    cellProps: Partial<CellComponentProps>[];
+    beforeRows?: Column[];
+    collectionConfig: ClientCollectionConfig;
     columnPreferences: ColumnPreferences;
     columns?: ColumnPreferences;
+    customCellProps: DefaultCellComponentProps['customCellProps'];
+    docs: PaginatedDocs['docs'];
     enableRowSelections: boolean;
-    fieldMap: FieldMap;
+    enableRowTypes?: boolean;
+    fields: Field[];
+    i18n: I18nClient;
+    payload: Payload;
+    sortColumnProps?: Partial<SortColumnProps>;
     useAsTitle: SanitizedCollectionConfig['admin']['useAsTitle'];
 };
 export declare const buildColumnState: (args: Args) => Column[];

package/dist/elements/TableColumns/buildColumnState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"buildColumnState.d.ts","sourceRoot":"","sources":["../../../src/elements/TableColumns/buildColumnState.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,kBAAkB,EAAE,KAAK,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAGjF,OAAO,KAAK,EAAE,QAAQ,EAAe,MAAM,yDAAyD,CAAA;AACpG,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAW/C,KAAK,IAAI,GAAG;IACV,SAAS,EAAE,OAAO,CAAC,kBAAkB,CAAC,EAAE,CAAA;IACxC,iBAAiB,EAAE,iBAAiB,CAAA;IACpC,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,mBAAmB,EAAE,OAAO,CAAA;IAC5B,QAAQ,EAAE,QAAQ,CAAA;IAClB,UAAU,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,CAAA;CAC7D,CAAA;AACD,eAAO,MAAM,gBAAgB,SAAU,IAAI,KAAG,MAAM,EAwJnD,CAAA"}
+{"version":3,"file":"buildColumnState.d.ts","sourceRoot":"","sources":["../../../src/elements/TableColumns/buildColumnState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,KAAK,EACV,sBAAsB,EACtB,yBAAyB,EAEzB,KAAK,EACL,aAAa,EACb,OAAO,EAEP,yBAAyB,EAE1B,MAAM,SAAS,CAAA;AAMhB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAA;AAC3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAC7D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAa/C,KAAK,IAAI,GAAG;IACV,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,gBAAgB,EAAE,sBAAsB,CAAA;IACxC,iBAAiB,EAAE,iBAAiB,CAAA;IACpC,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,eAAe,EAAE,yBAAyB,CAAC,iBAAiB,CAAC,CAAA;IAC7D,IAAI,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;IAC3B,mBAAmB,EAAE,OAAO,CAAA;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,MAAM,EAAE,KAAK,EAAE,CAAA;IACf,IAAI,EAAE,UAAU,CAAA;IAChB,OAAO,EAAE,OAAO,CAAA;IAChB,eAAe,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAA;IAC1C,UAAU,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,CAAA;CAC7D,CAAA;AAED,eAAO,MAAM,gBAAgB,SAAU,IAAI,KAAG,MAAM,EAyPnD,CAAA"}