@payloadcms/ui 3.0.0-alpha.45 → 3.0.0-alpha.47

package/dist/elements/DocumentDrawer/DrawerContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerContent.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/DrawerContent.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAmD,MAAM,OAAO,CAAA;AAGvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AAiKrD,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAwB/D,CAAA"}
+{"version":3,"file":"DrawerContent.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/DrawerContent.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAmD,MAAM,OAAO,CAAA;AAGvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AA2KrD,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAwB/D,CAAA"}

package/dist/elements/DocumentDrawer/DrawerContent.js

@@ -1,6 +1,5 @@
 'use client';
 import * as facelessUIImport from '@faceless-ui/modal';
-import { getTranslation } from '@payloadcms/translations';
 import queryString from 'qs';
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { toast } from 'react-toastify';
@@ -8,6 +7,7 @@ import { FieldPathProvider, useFieldPath } from '../../forms/FieldPathProvider/i
 import { useRelatedCollections } from '../../forms/fields/Relationship/AddNew/useRelatedCollections.js';
 import usePayloadAPI from '../../hooks/usePayloadAPI.js';
 import { X } from '../../icons/X/index.js';
+import { formatDocTitle, useAuth } from '../../index.js';
 import { useComponentMap } from '../../providers/ComponentMapProvider/index.js';
 import { useConfig } from '../../providers/Config/index.js';
 import { DocumentInfoProvider } from '../../providers/DocumentInfo/index.js';
@@ -18,8 +18,9 @@ import { getFormState } from '../../utilities/getFormState.js';
 import { Gutter } from '../Gutter/index.js';
 import IDLabel from '../IDLabel/index.js';
 import { LoadingOverlay } from '../Loading/index.js';
+import { RenderTitle } from '../RenderTitle/index.js';
 import { baseClass } from './index.js';
-const Content = ({ id, Header, collectionSlug, drawerSlug, onSave })=>{
+const Content = ({ id, Header, collectionSlug, drawerSlug, initialData, onSave })=>{
     const { useModal } = facelessUIImport;
     const config = useConfig();
     const { routes: { api: apiRoute }, serverURL } = config;
@@ -32,13 +33,14 @@ const Content = ({ id, Header, collectionSlug, drawerSlug, onSave })=>{
     const [collectionConfig] = useRelatedCollections(collectionSlug);
     const { formQueryParams } = useFormQueryParams();
     const formattedQueryParams = queryString.stringify(formQueryParams);
-    const { fields: fieldsFromConfig } = collectionConfig;
+    const { permissions } = useAuth();
     const { schemaPath } = useFieldPath();
     const { componentMap } = useComponentMap();
     const { Edit } = componentMap[`${collectionSlug ? 'collections' : 'globals'}`][collectionSlug];
     // no need to an additional requests when creating new documents
     const initialID = useRef(id);
     const [{ data, isError, isLoading: isLoadingDocument }] = usePayloadAPI(initialID.current ? `${serverURL}${apiRoute}/${collectionSlug}/${initialID.current}` : null, {
+        initialData,
         initialParams: {
             depth: 0,
             draft: 'true',
@@ -93,16 +95,23 @@ const Content = ({ id, Header, collectionSlug, drawerSlug, onSave })=>{
     }, [
         apiRoute,
         data,
-        id,
         isEditing,
         schemaPath,
         serverURL,
-        collectionSlug
+        collectionSlug,
+        id
     ]);
     if (isError) return null;
     if (!initialState || isLoadingDocument) {
         return /*#__PURE__*/ React.createElement(LoadingOverlay, null);
     }
+    const docPermissions = permissions?.collections[collectionSlug];
+    const title = formatDocTitle({
+        collectionConfig,
+        data,
+        dateFormat: config.admin.dateFormat,
+        i18n
+    });
     return /*#__PURE__*/ React.createElement(DocumentInfoProvider, {
         BeforeDocument: /*#__PURE__*/ React.createElement(Gutter, {
             className: `${baseClass}__header`
@@ -110,29 +119,30 @@ const Content = ({ id, Header, collectionSlug, drawerSlug, onSave })=>{
             className: `${baseClass}__header-content`
         }, /*#__PURE__*/ React.createElement("h2", {
             className: `${baseClass}__header-text`
-        }, Header || t(!id ? 'fields:addNewLabel' : 'general:editLabel', {
-            label: getTranslation(collectionConfig.labels.singular, i18n)
+        }, Header || /*#__PURE__*/ React.createElement(RenderTitle, {
+            element: "span"
         })), /*#__PURE__*/ React.createElement("button", {
             "aria-label": t('general:close'),
             className: `${baseClass}__header-close`,
             onClick: ()=>toggleModal(drawerSlug),
             type: "button"
-        }, /*#__PURE__*/ React.createElement(X, null))), id && /*#__PURE__*/ React.createElement(IDLabel, {
+        }, /*#__PURE__*/ React.createElement(X, null))), id && id !== title ? /*#__PURE__*/ React.createElement(IDLabel, {
             id: id.toString()
-        })),
+        }) : null),
         action: action,
         apiURL: apiURL,
         collectionSlug: collectionConfig.slug,
         disableActions: true,
         disableLeaveWithoutSaving: true,
+        docPermissions: docPermissions,
+        hasSavePermission: docPermissions?.update?.permission,
         // isLoading,
         id: id,
         initialData: data,
         initialState: initialState,
-        // hasSavePermission={hasSavePermission}
         isEditing: isEditing,
-        // me: true,
-        onSave: onSave
+        onSave: onSave,
+        title: title
     }, Edit);
 };
 // First provide the document context using `DocumentInfoProvider`
@@ -142,9 +152,9 @@ const Content = ({ id, Header, collectionSlug, drawerSlug, onSave })=>{
 export const DocumentDrawerContent = (props)=>{
     const { id: idFromProps, collectionSlug, onSave: onSaveFromProps } = props;
     const [collectionConfig] = useRelatedCollections(collectionSlug);
-    const [id, setId] = useState(idFromProps);
-    const onSave = useCallback(async (args)=>{
-        setId(args.doc.id);
+    const [doc, setDoc] = useState();
+    const onSave = useCallback((args)=>{
+        setDoc(args.doc);
         if (typeof onSaveFromProps === 'function') {
             void onSaveFromProps({
                 ...args,
@@ -160,7 +170,8 @@ export const DocumentDrawerContent = (props)=>{
         schemaPath: collectionSlug
     }, /*#__PURE__*/ React.createElement(Content, {
         ...props,
-        id: id,
+        id: idFromProps || doc?.id,
+        initialData: doc,
         onSave: onSave
     }));
 };

package/dist/elements/DocumentDrawer/DrawerContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DocumentDrawer/DrawerContent.tsx"],"sourcesContent":["'use client'\n\nimport type { FormState } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport queryString from 'qs'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { toast } from 'react-toastify'\n\nimport type { DocumentDrawerProps } from './types.js'\n\nimport { FieldPathProvider, useFieldPath } from '../../forms/FieldPathProvider/index.js'\nimport { useRelatedCollections } from '../../forms/fields/Relationship/AddNew/useRelatedCollections.js'\nimport usePayloadAPI from '../../hooks/usePayloadAPI.js'\nimport { X } from '../../icons/X/index.js'\nimport { useComponentMap } from '../../providers/ComponentMapProvider/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { DocumentInfoProvider } from '../../providers/DocumentInfo/index.js'\nimport { useFormQueryParams } from '../../providers/FormQueryParams/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { getFormState } from '../../utilities/getFormState.js'\nimport { Gutter } from '../Gutter/index.js'\nimport IDLabel from '../IDLabel/index.js'\nimport { LoadingOverlay } from '../Loading/index.js'\nimport { baseClass } from './index.js'\n\nconst Content: React.FC<DocumentDrawerProps> = ({\n  id,\n  Header,\n  collectionSlug,\n  drawerSlug,\n  onSave,\n}) => {\n  const { useModal } = facelessUIImport\n\n  const config = useConfig()\n\n  const {\n    routes: { api: apiRoute },\n    serverURL,\n  } = config\n\n  const { closeModal, modalState, toggleModal } = useModal()\n  const locale = useLocale()\n  const [initialState, setInitialState] = useState<FormState>()\n  const { i18n, t } = useTranslation()\n  const hasInitializedState = useRef(false)\n  const [isOpen, setIsOpen] = useState(false)\n  const [collectionConfig] = useRelatedCollections(collectionSlug)\n  const { formQueryParams } = useFormQueryParams()\n  const formattedQueryParams = queryString.stringify(formQueryParams)\n\n  const { fields: fieldsFromConfig } = collectionConfig\n\n  const { schemaPath } = useFieldPath()\n\n  const { componentMap } = useComponentMap()\n\n  const { Edit } = componentMap[`${collectionSlug ? 'collections' : 'globals'}`][collectionSlug]\n\n  // no need to an additional requests when creating new documents\n  const initialID = useRef(id)\n\n  const [{ data, isError, isLoading: isLoadingDocument }] = usePayloadAPI(\n    initialID.current ? `${serverURL}${apiRoute}/${collectionSlug}/${initialID.current}` : null,\n    { initialParams: { depth: 0, draft: 'true', 'fallback-locale': 'null' } },\n  )\n\n  useEffect(() => {\n    setIsOpen(Boolean(modalState[drawerSlug]?.isOpen))\n  }, [modalState, drawerSlug])\n\n  useEffect(() => {\n    if (isOpen && !isLoadingDocument && isError) {\n      closeModal(drawerSlug)\n      toast.error(data.errors?.[0].message || t('error:unspecific'))\n    }\n  }, [isError, t, isOpen, data, drawerSlug, closeModal, isLoadingDocument])\n\n  const isEditing = Boolean(id)\n\n  const apiURL = id ? `${serverURL}${apiRoute}/${collectionSlug}/${id}?locale=${locale.code}` : null\n\n  const action = `${serverURL}${apiRoute}/${collectionSlug}${\n    isEditing ? `/${id}` : ''\n  }?${formattedQueryParams}`\n\n  // const hasSavePermission =\n  //   (isEditing && docPermissions?.update?.permission) ||\n  //   (!isEditing && (docPermissions as CollectionPermission)?.create?.permission)\n\n  useEffect(() => {\n    if (!hasInitializedState.current && (!initialID.current || (initialID.current && data))) {\n      const getInitialState = async () => {\n        const result = await getFormState({\n          apiRoute,\n          body: {\n            id,\n            collectionSlug,\n            data: data || {},\n            operation: isEditing ? 'update' : 'create',\n            schemaPath,\n          },\n          serverURL,\n        })\n\n        setInitialState(result)\n        hasInitializedState.current = true\n      }\n\n      void getInitialState()\n    }\n  }, [apiRoute, data, id, isEditing, schemaPath, serverURL, collectionSlug])\n\n  if (isError) return null\n\n  if (!initialState || isLoadingDocument) {\n    return <LoadingOverlay />\n  }\n\n  return (\n    <DocumentInfoProvider\n      BeforeDocument={\n        <Gutter className={`${baseClass}__header`}>\n          <div className={`${baseClass}__header-content`}>\n            <h2 className={`${baseClass}__header-text`}>\n              {Header ||\n                t(!id ? 'fields:addNewLabel' : 'general:editLabel', {\n                  label: getTranslation(collectionConfig.labels.singular, i18n),\n                })}\n            </h2>\n            {/* TODO: the `button` HTML element breaks CSS transitions on the drawer for some reason...\n            i.e. changing to a `div` element will fix the animation issue but will break accessibility\n          */}\n            <button\n              aria-label={t('general:close')}\n              className={`${baseClass}__header-close`}\n              onClick={() => toggleModal(drawerSlug)}\n              type=\"button\"\n            >\n              <X />\n            </button>\n          </div>\n          {id && <IDLabel id={id.toString()} />}\n        </Gutter>\n      }\n      action={action}\n      apiURL={apiURL}\n      collectionSlug={collectionConfig.slug}\n      disableActions\n      disableLeaveWithoutSaving\n      // isLoading,\n      id={id}\n      initialData={data}\n      initialState={initialState}\n      // hasSavePermission={hasSavePermission}\n      isEditing={isEditing}\n      // me: true,\n      onSave={onSave}\n    >\n      {Edit}\n    </DocumentInfoProvider>\n  )\n}\n\n// First provide the document context using `DocumentInfoProvider`\n// this is so we can utilize the `useDocumentInfo` hook in the `Content` component\n// this drawer is used for both creating and editing documents\n// this means that the `id` may be unknown until the document is created\nexport const DocumentDrawerContent: React.FC<DocumentDrawerProps> = (props) => {\n  const { id: idFromProps, collectionSlug, onSave: onSaveFromProps } = props\n  const [collectionConfig] = useRelatedCollections(collectionSlug)\n  const [id, setId] = useState<null | number | string>(idFromProps)\n\n  const onSave = useCallback<DocumentDrawerProps['onSave']>(\n    async (args) => {\n      setId(args.doc.id)\n\n      if (typeof onSaveFromProps === 'function') {\n        void onSaveFromProps({\n          ...args,\n          collectionConfig,\n        })\n      }\n    },\n    [onSaveFromProps, collectionConfig],\n  )\n\n  return (\n    <FieldPathProvider path=\"\" schemaPath={collectionSlug}>\n      <Content {...props} id={id} onSave={onSave} />\n    </FieldPathProvider>\n  )\n}\n"],"names":["facelessUIImport","getTranslation","queryString","React","useCallback","useEffect","useRef","useState","toast","FieldPathProvider","useFieldPath","useRelatedCollections","usePayloadAPI","X","useComponentMap","useConfig","DocumentInfoProvider","useFormQueryParams","useLocale","useTranslation","getFormState","Gutter","IDLabel","LoadingOverlay","baseClass","Content","id","Header","collectionSlug","drawerSlug","onSave","useModal","config","routes","api","apiRoute","serverURL","closeModal","modalState","toggleModal","locale","initialState","setInitialState","i18n","t","hasInitializedState","isOpen","setIsOpen","collectionConfig","formQueryParams","formattedQueryParams","stringify","fields","fieldsFromConfig","schemaPath","componentMap","Edit","initialID","data","isError","isLoading","isLoadingDocument","current","initialParams","depth","draft","Boolean","error","errors","message","isEditing","apiURL","code","action","getInitialState","result","body","operation","BeforeDocument","className","div","h2","label","labels","singular","button","aria-label","onClick","type","toString","slug","disableActions","disableLeaveWithoutSaving","initialData","DocumentDrawerContent","props","idFromProps","onSaveFromProps","setId","args","doc","path"],"mappings":"AAAA;AAIA,YAAYA,sBAAsB,qBAAoB;AACtD,SAASC,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,iBAAiB,KAAI;AAC5B,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAO;AACvE,SAASC,KAAK,QAAQ,iBAAgB;AAItC,SAASC,iBAAiB,EAAEC,YAAY,QAAQ,yCAAwC;AACxF,SAASC,qBAAqB,QAAQ,kEAAiE;AACvG,OAAOC,mBAAmB,+BAA8B;AACxD,SAASC,CAAC,QAAQ,yBAAwB;AAC1C,SAASC,eAAe,QAAQ,gDAA+C;AAC/E,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,oBAAoB,QAAQ,wCAAuC;AAC5E,SAASC,kBAAkB,QAAQ,2CAA0C;AAC7E,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,YAAY,QAAQ,kCAAiC;AAC9D,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,OAAOC,aAAa,sBAAqB;AACzC,SAASC,cAAc,QAAQ,sBAAqB;AACpD,SAASC,SAAS,QAAQ,aAAY;AAEtC,MAAMC,UAAyC,CAAC,EAC9CC,EAAE,EACFC,MAAM,EACNC,cAAc,EACdC,UAAU,EACVC,MAAM,EACP;IACC,MAAM,EAAEC,QAAQ,EAAE,GAAG/B;IAErB,MAAMgC,SAASjB;IAEf,MAAM,EACJkB,QAAQ,EAAEC,KAAKC,QAAQ,EAAE,EACzBC,SAAS,EACV,GAAGJ;IAEJ,MAAM,EAAEK,UAAU,EAAEC,UAAU,EAAEC,WAAW,EAAE,GAAGR;IAChD,MAAMS,SAAStB;IACf,MAAM,CAACuB,cAAcC,gBAAgB,GAAGnC;IACxC,MAAM,EAAEoC,IAAI,EAAEC,CAAC,EAAE,GAAGzB;IACpB,MAAM0B,sBAAsBvC,OAAO;IACnC,MAAM,CAACwC,QAAQC,UAAU,GAAGxC,SAAS;IACrC,MAAM,CAACyC,iBAAiB,GAAGrC,sBAAsBiB;IACjD,MAAM,EAAEqB,eAAe,EAAE,GAAGhC;IAC5B,MAAMiC,uBAAuBhD,YAAYiD,SAAS,CAACF;IAEnD,MAAM,EAAEG,QAAQC,gBAAgB,EAAE,GAAGL;IAErC,MAAM,EAAEM,UAAU,EAAE,GAAG5C;IAEvB,MAAM,EAAE6C,YAAY,EAAE,GAAGzC;IAEzB,MAAM,EAAE0C,IAAI,EAAE,GAAGD,YAAY,CAAC,CAAC,EAAE3B,iBAAiB,gBAAgB,UAAU,CAAC,CAAC,CAACA,eAAe;IAE9F,gEAAgE;IAChE,MAAM6B,YAAYnD,OAAOoB;IAEzB,MAAM,CAAC,EAAEgC,IAAI,EAAEC,OAAO,EAAEC,WAAWC,iBAAiB,EAAE,CAAC,GAAGjD,cACxD6C,UAAUK,OAAO,GAAG,CAAC,EAAE1B,UAAU,EAAED,SAAS,CAAC,EAAEP,eAAe,CAAC,EAAE6B,UAAUK,OAAO,CAAC,CAAC,GAAG,MACvF;QAAEC,eAAe;YAAEC,OAAO;YAAGC,OAAO;YAAQ,mBAAmB;QAAO;IAAE;IAG1E5D,UAAU;QACR0C,UAAUmB,QAAQ5B,UAAU,CAACT,WAAW,EAAEiB;IAC5C,GAAG;QAACR;QAAYT;KAAW;IAE3BxB,UAAU;QACR,IAAIyC,UAAU,CAACe,qBAAqBF,SAAS;YAC3CtB,WAAWR;YACXrB,MAAM2D,KAAK,CAACT,KAAKU,MAAM,EAAE,CAAC,EAAE,CAACC,WAAWzB,EAAE;QAC5C;IACF,GAAG;QAACe;QAASf;QAAGE;QAAQY;QAAM7B;QAAYQ;QAAYwB;KAAkB;IAExE,MAAMS,YAAYJ,QAAQxC;IAE1B,MAAM6C,SAAS7C,KAAK,CAAC,EAAEU,UAAU,EAAED,SAAS,CAAC,EAAEP,eAAe,CAAC,EAAEF,GAAG,QAAQ,EAAEc,OAAOgC,IAAI,CAAC,CAAC,GAAG;IAE9F,MAAMC,SAAS,CAAC,EAAErC,UAAU,EAAED,SAAS,CAAC,EAAEP,eAAe,EACvD0C,YAAY,CAAC,CAAC,EAAE5C,GAAG,CAAC,GAAG,GACxB,CAAC,EAAEwB,qBAAqB,CAAC;IAE1B,4BAA4B;IAC5B,yDAAyD;IACzD,iFAAiF;IAEjF7C,UAAU;QACR,IAAI,CAACwC,oBAAoBiB,OAAO,IAAK,CAAA,CAACL,UAAUK,OAAO,IAAKL,UAAUK,OAAO,IAAIJ,IAAI,GAAI;YACvF,MAAMgB,kBAAkB;gBACtB,MAAMC,SAAS,MAAMvD,aAAa;oBAChCe;oBACAyC,MAAM;wBACJlD;wBACAE;wBACA8B,MAAMA,QAAQ,CAAC;wBACfmB,WAAWP,YAAY,WAAW;wBAClChB;oBACF;oBACAlB;gBACF;gBAEAM,gBAAgBiC;gBAChB9B,oBAAoBiB,OAAO,GAAG;YAChC;YAEA,KAAKY;QACP;IACF,GAAG;QAACvC;QAAUuB;QAAMhC;QAAI4C;QAAWhB;QAAYlB;QAAWR;KAAe;IAEzE,IAAI+B,SAAS,OAAO;IAEpB,IAAI,CAAClB,gBAAgBoB,mBAAmB;QACtC,qBAAO,oBAACtC;IACV;IAEA,qBACE,oBAACP;QACC8D,8BACE,oBAACzD;YAAO0D,WAAW,CAAC,EAAEvD,UAAU,QAAQ,CAAC;yBACvC,oBAACwD;YAAID,WAAW,CAAC,EAAEvD,UAAU,gBAAgB,CAAC;yBAC5C,oBAACyD;YAAGF,WAAW,CAAC,EAAEvD,UAAU,aAAa,CAAC;WACvCG,UACCiB,EAAE,CAAClB,KAAK,uBAAuB,qBAAqB;YAClDwD,OAAOjF,eAAe+C,iBAAiBmC,MAAM,CAACC,QAAQ,EAAEzC;QAC1D,mBAKJ,oBAAC0C;YACCC,cAAY1C,EAAE;YACdmC,WAAW,CAAC,EAAEvD,UAAU,cAAc,CAAC;YACvC+D,SAAS,IAAMhD,YAAYV;YAC3B2D,MAAK;yBAEL,oBAAC3E,YAGJa,oBAAM,oBAACJ;YAAQI,IAAIA,GAAG+D,QAAQ;;QAGnChB,QAAQA;QACRF,QAAQA;QACR3C,gBAAgBoB,iBAAiB0C,IAAI;QACrCC,gBAAAA;QACAC,2BAAAA;QACA,aAAa;QACblE,IAAIA;QACJmE,aAAanC;QACbjB,cAAcA;QACd,wCAAwC;QACxC6B,WAAWA;QACX,YAAY;QACZxC,QAAQA;OAEP0B;AAGP;AAEA,kEAAkE;AAClE,kFAAkF;AAClF,8DAA8D;AAC9D,wEAAwE;AACxE,OAAO,MAAMsC,wBAAuD,CAACC;IACnE,MAAM,EAAErE,IAAIsE,WAAW,EAAEpE,cAAc,EAAEE,QAAQmE,eAAe,EAAE,GAAGF;IACrE,MAAM,CAAC/C,iBAAiB,GAAGrC,sBAAsBiB;IACjD,MAAM,CAACF,IAAIwE,MAAM,GAAG3F,SAAiCyF;IAErD,MAAMlE,SAAS1B,YACb,OAAO+F;QACLD,MAAMC,KAAKC,GAAG,CAAC1E,EAAE;QAEjB,IAAI,OAAOuE,oBAAoB,YAAY;YACzC,KAAKA,gBAAgB;gBACnB,GAAGE,IAAI;gBACPnD;YACF;QACF;IACF,GACA;QAACiD;QAAiBjD;KAAiB;IAGrC,qBACE,oBAACvC;QAAkB4F,MAAK;QAAG/C,YAAY1B;qBACrC,oBAACH;QAAS,GAAGsE,KAAK;QAAErE,IAAIA;QAAII,QAAQA;;AAG1C,EAAC"}
+{"version":3,"sources":["../../../src/elements/DocumentDrawer/DrawerContent.tsx"],"sourcesContent":["'use client'\n\nimport type { FormState, TypeWithID } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport queryString from 'qs'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { toast } from 'react-toastify'\n\nimport type { DocumentDrawerProps } from './types.js'\n\nimport { FieldPathProvider, useFieldPath } from '../../forms/FieldPathProvider/index.js'\nimport { useRelatedCollections } from '../../forms/fields/Relationship/AddNew/useRelatedCollections.js'\nimport usePayloadAPI from '../../hooks/usePayloadAPI.js'\nimport { X } from '../../icons/X/index.js'\nimport { formatDocTitle, useAuth } from '../../index.js'\nimport { useComponentMap } from '../../providers/ComponentMapProvider/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { DocumentInfoProvider } from '../../providers/DocumentInfo/index.js'\nimport { useFormQueryParams } from '../../providers/FormQueryParams/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { getFormState } from '../../utilities/getFormState.js'\nimport { Gutter } from '../Gutter/index.js'\nimport IDLabel from '../IDLabel/index.js'\nimport { LoadingOverlay } from '../Loading/index.js'\nimport { RenderTitle } from '../RenderTitle/index.js'\nimport { baseClass } from './index.js'\n\nconst Content: React.FC<DocumentDrawerProps> = ({\n  id,\n  Header,\n  collectionSlug,\n  drawerSlug,\n  initialData,\n  onSave,\n}) => {\n  const { useModal } = facelessUIImport\n\n  const config = useConfig()\n\n  const {\n    routes: { api: apiRoute },\n    serverURL,\n  } = config\n\n  const { closeModal, modalState, toggleModal } = useModal()\n  const locale = useLocale()\n  const [initialState, setInitialState] = useState<FormState>()\n  const { i18n, t } = useTranslation()\n  const hasInitializedState = useRef(false)\n  const [isOpen, setIsOpen] = useState(false)\n  const [collectionConfig] = useRelatedCollections(collectionSlug)\n  const { formQueryParams } = useFormQueryParams()\n  const formattedQueryParams = queryString.stringify(formQueryParams)\n\n  const { permissions } = useAuth()\n\n  const { schemaPath } = useFieldPath()\n\n  const { componentMap } = useComponentMap()\n\n  const { Edit } = componentMap[`${collectionSlug ? 'collections' : 'globals'}`][collectionSlug]\n\n  // no need to an additional requests when creating new documents\n  const initialID = useRef(id)\n\n  const [{ data, isError, isLoading: isLoadingDocument }] = usePayloadAPI(\n    initialID.current ? `${serverURL}${apiRoute}/${collectionSlug}/${initialID.current}` : null,\n    { initialData, initialParams: { depth: 0, draft: 'true', 'fallback-locale': 'null' } },\n  )\n\n  useEffect(() => {\n    setIsOpen(Boolean(modalState[drawerSlug]?.isOpen))\n  }, [modalState, drawerSlug])\n\n  useEffect(() => {\n    if (isOpen && !isLoadingDocument && isError) {\n      closeModal(drawerSlug)\n      toast.error(data.errors?.[0].message || t('error:unspecific'))\n    }\n  }, [isError, t, isOpen, data, drawerSlug, closeModal, isLoadingDocument])\n\n  const isEditing = Boolean(id)\n\n  const apiURL = id ? `${serverURL}${apiRoute}/${collectionSlug}/${id}?locale=${locale.code}` : null\n\n  const action = `${serverURL}${apiRoute}/${collectionSlug}${\n    isEditing ? `/${id}` : ''\n  }?${formattedQueryParams}`\n\n  // const hasSavePermission =\n  //   (isEditing && docPermissions?.update?.permission) ||\n  //   (!isEditing && (docPermissions as CollectionPermission)?.create?.permission)\n\n  useEffect(() => {\n    if (!hasInitializedState.current && (!initialID.current || (initialID.current && data))) {\n      const getInitialState = async () => {\n        const result = await getFormState({\n          apiRoute,\n          body: {\n            id,\n            collectionSlug,\n            data: data || {},\n            operation: isEditing ? 'update' : 'create',\n            schemaPath,\n          },\n          serverURL,\n        })\n\n        setInitialState(result)\n        hasInitializedState.current = true\n      }\n\n      void getInitialState()\n    }\n  }, [apiRoute, data, isEditing, schemaPath, serverURL, collectionSlug, id])\n\n  if (isError) return null\n\n  if (!initialState || isLoadingDocument) {\n    return <LoadingOverlay />\n  }\n\n  const docPermissions = permissions?.collections[collectionSlug]\n\n  const title = formatDocTitle({\n    collectionConfig,\n    data,\n    dateFormat: config.admin.dateFormat,\n    i18n,\n  })\n\n  return (\n    <DocumentInfoProvider\n      BeforeDocument={\n        <Gutter className={`${baseClass}__header`}>\n          <div className={`${baseClass}__header-content`}>\n            <h2 className={`${baseClass}__header-text`}>\n              {Header || <RenderTitle element=\"span\" />}\n            </h2>\n            {/* TODO: the `button` HTML element breaks CSS transitions on the drawer for some reason...\n            i.e. changing to a `div` element will fix the animation issue but will break accessibility\n          */}\n            <button\n              aria-label={t('general:close')}\n              className={`${baseClass}__header-close`}\n              onClick={() => toggleModal(drawerSlug)}\n              type=\"button\"\n            >\n              <X />\n            </button>\n          </div>\n          {id && id !== title ? <IDLabel id={id.toString()} /> : null}\n        </Gutter>\n      }\n      action={action}\n      apiURL={apiURL}\n      collectionSlug={collectionConfig.slug}\n      disableActions\n      disableLeaveWithoutSaving\n      docPermissions={docPermissions}\n      hasSavePermission={docPermissions?.update?.permission}\n      // isLoading,\n      id={id}\n      initialData={data}\n      initialState={initialState}\n      isEditing={isEditing}\n      onSave={onSave}\n      title={title}\n    >\n      {Edit}\n    </DocumentInfoProvider>\n  )\n}\n\n// First provide the document context using `DocumentInfoProvider`\n// this is so we can utilize the `useDocumentInfo` hook in the `Content` component\n// this drawer is used for both creating and editing documents\n// this means that the `id` may be unknown until the document is created\nexport const DocumentDrawerContent: React.FC<DocumentDrawerProps> = (props) => {\n  const { id: idFromProps, collectionSlug, onSave: onSaveFromProps } = props\n  const [collectionConfig] = useRelatedCollections(collectionSlug)\n  const [doc, setDoc] = useState<TypeWithID | null>()\n\n  const onSave = useCallback<DocumentDrawerProps['onSave']>(\n    (args) => {\n      setDoc(args.doc)\n\n      if (typeof onSaveFromProps === 'function') {\n        void onSaveFromProps({\n          ...args,\n          collectionConfig,\n        })\n      }\n    },\n    [onSaveFromProps, collectionConfig],\n  )\n\n  return (\n    <FieldPathProvider path=\"\" schemaPath={collectionSlug}>\n      <Content {...props} id={idFromProps || doc?.id} initialData={doc} onSave={onSave} />\n    </FieldPathProvider>\n  )\n}\n"],"names":["facelessUIImport","queryString","React","useCallback","useEffect","useRef","useState","toast","FieldPathProvider","useFieldPath","useRelatedCollections","usePayloadAPI","X","formatDocTitle","useAuth","useComponentMap","useConfig","DocumentInfoProvider","useFormQueryParams","useLocale","useTranslation","getFormState","Gutter","IDLabel","LoadingOverlay","RenderTitle","baseClass","Content","id","Header","collectionSlug","drawerSlug","initialData","onSave","useModal","config","routes","api","apiRoute","serverURL","closeModal","modalState","toggleModal","locale","initialState","setInitialState","i18n","t","hasInitializedState","isOpen","setIsOpen","collectionConfig","formQueryParams","formattedQueryParams","stringify","permissions","schemaPath","componentMap","Edit","initialID","data","isError","isLoading","isLoadingDocument","current","initialParams","depth","draft","Boolean","error","errors","message","isEditing","apiURL","code","action","getInitialState","result","body","operation","docPermissions","collections","title","dateFormat","admin","BeforeDocument","className","div","h2","element","button","aria-label","onClick","type","toString","slug","disableActions","disableLeaveWithoutSaving","hasSavePermission","update","permission","DocumentDrawerContent","props","idFromProps","onSaveFromProps","doc","setDoc","args","path"],"mappings":"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"}

package/dist/elements/DocumentDrawer/types.d.ts

@@ -1,3 +1,4 @@
+import type { TypeWithID } from 'payload/types.js';
 import type React from 'react';
 import type { HTMLAttributes } from 'react';
 import type { DocumentInfoContext } from '../../providers/DocumentInfo/types.js';
@@ -5,7 +6,8 @@ import type { Props as DrawerProps } from '../Drawer/types.js';
 export type DocumentDrawerProps = Pick<DrawerProps, 'Header'> & {
     collectionSlug: string;
     drawerSlug?: string;
-    id?: number | string;
+    id?: null | number | string;
+    initialData?: TypeWithID;
     onSave?: DocumentInfoContext['onSave'];
 };
 export type DocumentTogglerProps = HTMLAttributes<HTMLButtonElement> & {

package/dist/elements/DocumentDrawer/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAA;AAChF,OAAO,KAAK,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,oBAAoB,CAAA;AAE9D,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,GAAG;IAC9D,cAAc,EAAE,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IACrE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE;IAAE,cAAc,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,KAAK;IAC1F,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC5D,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,oBAAoB,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC7D;QACE,WAAW,EAAE,MAAM,IAAI,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,UAAU,EAAE,MAAM,CAAA;QAClB,YAAY,EAAE,OAAO,CAAA;QACrB,UAAU,EAAE,MAAM,IAAI,CAAA;QACtB,YAAY,EAAE,MAAM,IAAI,CAAA;KACzB;CACF,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAClD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAA;AAChF,OAAO,KAAK,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,oBAAoB,CAAA;AAE9D,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,GAAG;IAC9D,cAAc,EAAE,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,EAAE,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;IAC3B,WAAW,CAAC,EAAE,UAAU,CAAA;IACxB,MAAM,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IACrE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE;IAAE,cAAc,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,KAAK;IAC1F,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC5D,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,oBAAoB,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC7D;QACE,WAAW,EAAE,MAAM,IAAI,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,UAAU,EAAE,MAAM,CAAA;QAClB,YAAY,EAAE,OAAO,CAAA;QACrB,UAAU,EAAE,MAAM,IAAI,CAAA;QACtB,YAAY,EAAE,MAAM,IAAI,CAAA;KACzB;CACF,CAAA"}

package/dist/elements/DocumentDrawer/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DocumentDrawer/types.ts"],"sourcesContent":["import type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nimport type { DocumentInfoContext } from '../../providers/DocumentInfo/types.js'\nimport type { Props as DrawerProps } from '../Drawer/types.js'\n\nexport type DocumentDrawerProps = Pick<DrawerProps, 'Header'> & {\n  collectionSlug: string\n  drawerSlug?: string\n  id?: number | string\n  onSave?: DocumentInfoContext['onSave']\n}\n\nexport type DocumentTogglerProps = HTMLAttributes<HTMLButtonElement> & {\n  children?: React.ReactNode\n  className?: string\n  collectionSlug: string\n  disabled?: boolean\n  drawerSlug?: string\n  id?: string\n}\n\nexport type UseDocumentDrawer = (args: { collectionSlug: string; id?: number | string }) => [\n  React.FC<Omit<DocumentDrawerProps, 'collectionSlug' | 'id'>>, // drawer\n  React.FC<Omit<DocumentTogglerProps, 'collectionSlug' | 'id'>>, // toggler\n  {\n    closeDrawer: () => void\n    drawerDepth: number\n    drawerSlug: string\n    isDrawerOpen: boolean\n    openDrawer: () => void\n    toggleDrawer: () => void\n  },\n]\n"],"names":[],"mappings":"AAsBA,WAWC"}
+{"version":3,"sources":["../../../src/elements/DocumentDrawer/types.ts"],"sourcesContent":["import type { TypeWithID } from 'payload/types.js'\nimport type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nimport type { DocumentInfoContext } from '../../providers/DocumentInfo/types.js'\nimport type { Props as DrawerProps } from '../Drawer/types.js'\n\nexport type DocumentDrawerProps = Pick<DrawerProps, 'Header'> & {\n  collectionSlug: string\n  drawerSlug?: string\n  id?: null | number | string\n  initialData?: TypeWithID\n  onSave?: DocumentInfoContext['onSave']\n}\n\nexport type DocumentTogglerProps = HTMLAttributes<HTMLButtonElement> & {\n  children?: React.ReactNode\n  className?: string\n  collectionSlug: string\n  disabled?: boolean\n  drawerSlug?: string\n  id?: string\n}\n\nexport type UseDocumentDrawer = (args: { collectionSlug: string; id?: number | string }) => [\n  React.FC<Omit<DocumentDrawerProps, 'collectionSlug' | 'id'>>, // drawer\n  React.FC<Omit<DocumentTogglerProps, 'collectionSlug' | 'id'>>, // toggler\n  {\n    closeDrawer: () => void\n    drawerDepth: number\n    drawerSlug: string\n    isDrawerOpen: boolean\n    openDrawer: () => void\n    toggleDrawer: () => void\n  },\n]\n"],"names":[],"mappings":"AAwBA,WAWC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AACpD,OAAO,KAAK,EACV,yBAAyB,EACzB,eAAe,EACf,qBAAqB,EACtB,MAAM,eAAe,CAAA;AAEtB,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,gBAAgB,CAAC,EAAE,yBAAyB,CAAA;IAC5C,MAAM,EAAE,eAAe,CAAA;IACvB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,YAAY,CAAC,EAAE,qBAAqB,CAAA;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,EAAE,IAAI,CAAA;CACX,CAwBA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AACpD,OAAO,KAAK,EACV,yBAAyB,EACzB,eAAe,EACf,qBAAqB,EACtB,MAAM,eAAe,CAAA;AAEtB,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,gBAAgB,CAAC,EAAE,yBAAyB,CAAA;IAC5C,MAAM,EAAE,eAAe,CAAA;IACvB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,YAAY,CAAC,EAAE,qBAAqB,CAAA;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,EAAE,IAAI,CAAA;CACX,CAqBA,CAAA"}

package/dist/elements/DocumentHeader/index.js

@@ -1,6 +1,6 @@
 import React, { Fragment } from 'react';
 import { Gutter } from '../Gutter/index.js';
-import RenderTitle from '../RenderTitle/index.js';
+import { RenderTitle } from '../RenderTitle/index.js';
 import { DocumentTabs } from './Tabs/index.js';
 const baseClass = `doc-header`;
 export const DocumentHeader = (props)=>{
@@ -8,8 +8,7 @@ export const DocumentHeader = (props)=>{
     return /*#__PURE__*/ React.createElement(Gutter, {
         className: baseClass
     }, customHeader && customHeader, !customHeader && /*#__PURE__*/ React.createElement(Fragment, null, /*#__PURE__*/ React.createElement(RenderTitle, {
-        className: `${baseClass}__title`,
-        fallback: `[${i18n.t('general:untitled')}]`
+        className: `${baseClass}__title`
     }), !hideTabs && /*#__PURE__*/ React.createElement(DocumentTabs, {
         collectionConfig: collectionConfig,
         config: config,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DocumentHeader/index.tsx"],"sourcesContent":["import type { I18n } from '@payloadcms/translations'\nimport type {\n  SanitizedCollectionConfig,\n  SanitizedConfig,\n  SanitizedGlobalConfig,\n} from 'payload/types'\n\nimport React, { Fragment } from 'react'\n\nimport { Gutter } from '../Gutter/index.js'\nimport RenderTitle from '../RenderTitle/index.js'\nimport { DocumentTabs } from './Tabs/index.js'\nimport './index.scss'\n\nconst baseClass = `doc-header`\n\nexport const DocumentHeader: React.FC<{\n  collectionConfig?: SanitizedCollectionConfig\n  config: SanitizedConfig\n  customHeader?: React.ReactNode\n  globalConfig?: SanitizedGlobalConfig\n  hideTabs?: boolean\n  i18n: I18n\n}> = (props) => {\n  const { collectionConfig, config, customHeader, globalConfig, hideTabs, i18n } = props\n\n  return (\n    <Gutter className={baseClass}>\n      {customHeader && customHeader}\n      {!customHeader && (\n        <Fragment>\n          <RenderTitle\n            className={`${baseClass}__title`}\n            fallback={`[${i18n.t('general:untitled')}]`}\n          />\n          {!hideTabs && (\n            <DocumentTabs\n              collectionConfig={collectionConfig}\n              config={config}\n              globalConfig={globalConfig}\n              i18n={i18n}\n            />\n          )}\n        </Fragment>\n      )}\n    </Gutter>\n  )\n}\n"],"names":["React","Fragment","Gutter","RenderTitle","DocumentTabs","baseClass","DocumentHeader","props","collectionConfig","config","customHeader","globalConfig","hideTabs","i18n","className","fallback","t"],"mappings":"AAOA,OAAOA,SAASC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,OAAOC,iBAAiB,0BAAyB;AACjD,SAASC,YAAY,QAAQ,kBAAiB;AAG9C,MAAMC,YAAY,CAAC,UAAU,CAAC;AAE9B,OAAO,MAAMC,iBAOR,CAACC;IACJ,MAAM,EAAEC,gBAAgB,EAAEC,MAAM,EAAEC,YAAY,EAAEC,YAAY,EAAEC,QAAQ,EAAEC,IAAI,EAAE,GAAGN;IAEjF,qBACE,oBAACL;QAAOY,WAAWT;OAChBK,gBAAgBA,cAChB,CAACA,8BACA,oBAACT,8BACC,oBAACE;QACCW,WAAW,CAAC,EAAET,UAAU,OAAO,CAAC;QAChCU,UAAU,CAAC,CAAC,EAAEF,KAAKG,CAAC,CAAC,oBAAoB,CAAC,CAAC;QAE5C,CAACJ,0BACA,oBAACR;QACCI,kBAAkBA;QAClBC,QAAQA;QACRE,cAAcA;QACdE,MAAMA;;AAOpB,EAAC"}
+{"version":3,"sources":["../../../src/elements/DocumentHeader/index.tsx"],"sourcesContent":["import type { I18n } from '@payloadcms/translations'\nimport type {\n  SanitizedCollectionConfig,\n  SanitizedConfig,\n  SanitizedGlobalConfig,\n} from 'payload/types'\n\nimport React, { Fragment } from 'react'\n\nimport { Gutter } from '../Gutter/index.js'\nimport { RenderTitle } from '../RenderTitle/index.js'\nimport { DocumentTabs } from './Tabs/index.js'\nimport './index.scss'\n\nconst baseClass = `doc-header`\n\nexport const DocumentHeader: React.FC<{\n  collectionConfig?: SanitizedCollectionConfig\n  config: SanitizedConfig\n  customHeader?: React.ReactNode\n  globalConfig?: SanitizedGlobalConfig\n  hideTabs?: boolean\n  i18n: I18n\n}> = (props) => {\n  const { collectionConfig, config, customHeader, globalConfig, hideTabs, i18n } = props\n\n  return (\n    <Gutter className={baseClass}>\n      {customHeader && customHeader}\n      {!customHeader && (\n        <Fragment>\n          <RenderTitle className={`${baseClass}__title`} />\n          {!hideTabs && (\n            <DocumentTabs\n              collectionConfig={collectionConfig}\n              config={config}\n              globalConfig={globalConfig}\n              i18n={i18n}\n            />\n          )}\n        </Fragment>\n      )}\n    </Gutter>\n  )\n}\n"],"names":["React","Fragment","Gutter","RenderTitle","DocumentTabs","baseClass","DocumentHeader","props","collectionConfig","config","customHeader","globalConfig","hideTabs","i18n","className"],"mappings":"AAOA,OAAOA,SAASC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,WAAW,QAAQ,0BAAyB;AACrD,SAASC,YAAY,QAAQ,kBAAiB;AAG9C,MAAMC,YAAY,CAAC,UAAU,CAAC;AAE9B,OAAO,MAAMC,iBAOR,CAACC;IACJ,MAAM,EAAEC,gBAAgB,EAAEC,MAAM,EAAEC,YAAY,EAAEC,YAAY,EAAEC,QAAQ,EAAEC,IAAI,EAAE,GAAGN;IAEjF,qBACE,oBAACL;QAAOY,WAAWT;OAChBK,gBAAgBA,cAChB,CAACA,8BACA,oBAACT,8BACC,oBAACE;QAAYW,WAAW,CAAC,EAAET,UAAU,OAAO,CAAC;QAC5C,CAACO,0BACA,oBAACR;QACCI,kBAAkBA;QAClBC,QAAQA;QACRE,cAAcA;QACdE,MAAMA;;AAOpB,EAAC"}

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

@@ -1,6 +1,5 @@
 import React from 'react';
 import type { Props } from './types.js';
 import './index.scss';
-declare const RenderTitle: React.FC<Props>;
-export default RenderTitle;
+export declare const RenderTitle: React.FC<Props>;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/RenderTitle/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAIvC,OAAO,cAAc,CAAA;AAIrB,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuBhC,CAAA;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/RenderTitle/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAIvC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuBvC,CAAA"}

package/dist/elements/RenderTitle/index.js

@@ -3,7 +3,7 @@ import React from 'react';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import IDLabel from '../IDLabel/index.js';
 const baseClass = 'render-title';
-const RenderTitle = (props)=>{
+export const RenderTitle = (props)=>{
     const { className, element = 'h1', fallback, title: titleFromProps } = props;
     const documentInfo = useDocumentInfo();
     const { id, title: titleFromContext } = documentInfo;
@@ -20,8 +20,7 @@ const RenderTitle = (props)=>{
     }, idAsTitle ? /*#__PURE__*/ React.createElement(IDLabel, {
         className: `${baseClass}__id`,
         id: id
-    }) : title);
+    }) : title || null);
 };
-export default RenderTitle;
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/RenderTitle/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport type { Props } from './types.js'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport IDLabel from '../IDLabel/index.js'\nimport './index.scss'\n\nconst baseClass = 'render-title'\n\nconst RenderTitle: React.FC<Props> = (props) => {\n  const { className, element = 'h1', fallback, title: titleFromProps } = props\n\n  const documentInfo = useDocumentInfo()\n\n  const { id, title: titleFromContext } = documentInfo\n\n  const title = titleFromProps || titleFromContext || fallback\n\n  const idAsTitle = title === id\n\n  const Tag = element\n\n  return (\n    <Tag\n      className={[className, baseClass, idAsTitle && `${baseClass}--has-id`]\n        .filter(Boolean)\n        .join(' ')}\n      title={title}\n    >\n      {idAsTitle ? <IDLabel className={`${baseClass}__id`} id={id} /> : title}\n    </Tag>\n  )\n}\n\nexport default RenderTitle\n"],"names":["React","useDocumentInfo","IDLabel","baseClass","RenderTitle","props","className","element","fallback","title","titleFromProps","documentInfo","id","titleFromContext","idAsTitle","Tag","filter","Boolean","join"],"mappings":"AAAA;AACA,OAAOA,WAAW,QAAO;AAIzB,SAASC,eAAe,QAAQ,wCAAuC;AACvE,OAAOC,aAAa,sBAAqB;AAGzC,MAAMC,YAAY;AAElB,MAAMC,cAA+B,CAACC;IACpC,MAAM,EAAEC,SAAS,EAAEC,UAAU,IAAI,EAAEC,QAAQ,EAAEC,OAAOC,cAAc,EAAE,GAAGL;IAEvE,MAAMM,eAAeV;IAErB,MAAM,EAAEW,EAAE,EAAEH,OAAOI,gBAAgB,EAAE,GAAGF;IAExC,MAAMF,QAAQC,kBAAkBG,oBAAoBL;IAEpD,MAAMM,YAAYL,UAAUG;IAE5B,MAAMG,MAAMR;IAEZ,qBACE,oBAACQ;QACCT,WAAW;YAACA;YAAWH;YAAWW,aAAa,CAAC,EAAEX,UAAU,QAAQ,CAAC;SAAC,CACnEa,MAAM,CAACC,SACPC,IAAI,CAAC;QACRT,OAAOA;OAENK,0BAAY,oBAACZ;QAAQI,WAAW,CAAC,EAAEH,UAAU,IAAI,CAAC;QAAES,IAAIA;SAASH;AAGxE;AAEA,eAAeL,YAAW"}
+{"version":3,"sources":["../../../src/elements/RenderTitle/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport type { Props } from './types.js'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport IDLabel from '../IDLabel/index.js'\nimport './index.scss'\n\nconst baseClass = 'render-title'\n\nexport const RenderTitle: React.FC<Props> = (props) => {\n  const { className, element = 'h1', fallback, title: titleFromProps } = props\n\n  const documentInfo = useDocumentInfo()\n\n  const { id, title: titleFromContext } = documentInfo\n\n  const title = titleFromProps || titleFromContext || fallback\n\n  const idAsTitle = title === id\n\n  const Tag = element\n\n  return (\n    <Tag\n      className={[className, baseClass, idAsTitle && `${baseClass}--has-id`]\n        .filter(Boolean)\n        .join(' ')}\n      title={title}\n    >\n      {idAsTitle ? <IDLabel className={`${baseClass}__id`} id={id} /> : title || null}\n    </Tag>\n  )\n}\n"],"names":["React","useDocumentInfo","IDLabel","baseClass","RenderTitle","props","className","element","fallback","title","titleFromProps","documentInfo","id","titleFromContext","idAsTitle","Tag","filter","Boolean","join"],"mappings":"AAAA;AACA,OAAOA,WAAW,QAAO;AAIzB,SAASC,eAAe,QAAQ,wCAAuC;AACvE,OAAOC,aAAa,sBAAqB;AAGzC,MAAMC,YAAY;AAElB,OAAO,MAAMC,cAA+B,CAACC;IAC3C,MAAM,EAAEC,SAAS,EAAEC,UAAU,IAAI,EAAEC,QAAQ,EAAEC,OAAOC,cAAc,EAAE,GAAGL;IAEvE,MAAMM,eAAeV;IAErB,MAAM,EAAEW,EAAE,EAAEH,OAAOI,gBAAgB,EAAE,GAAGF;IAExC,MAAMF,QAAQC,kBAAkBG,oBAAoBL;IAEpD,MAAMM,YAAYL,UAAUG;IAE5B,MAAMG,MAAMR;IAEZ,qBACE,oBAACQ;QACCT,WAAW;YAACA;YAAWH;YAAWW,aAAa,CAAC,EAAEX,UAAU,QAAQ,CAAC;SAAC,CACnEa,MAAM,CAACC,SACPC,IAAI,CAAC;QACRT,OAAOA;OAENK,0BAAY,oBAACZ;QAAQI,WAAW,CAAC,EAAEH,UAAU,IAAI,CAAC;QAAES,IAAIA;SAASH,SAAS;AAGjF,EAAC"}

package/dist/elements/RenderTitle/types.d.ts

@@ -3,6 +3,7 @@ export type Props = {
     className?: string;
     element?: React.ElementType;
     fallback?: string;
+    fallbackToID?: boolean;
     title?: string;
 };
 //# sourceMappingURL=types.d.ts.map

package/dist/elements/RenderTitle/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/RenderTitle/types.ts"],"names":[],"mappings":";AAAA,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/RenderTitle/types.ts"],"names":[],"mappings":";AAAA,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA"}

package/dist/elements/RenderTitle/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/RenderTitle/types.ts"],"sourcesContent":["export type Props = {\n  className?: string\n  element?: React.ElementType\n  fallback?: string\n  title?: string\n}\n"],"names":[],"mappings":"AAAA,WAKC"}
+{"version":3,"sources":["../../../src/elements/RenderTitle/types.ts"],"sourcesContent":["export type Props = {\n  className?: string\n  element?: React.ElementType\n  fallback?: string\n  fallbackToID?: boolean\n  title?: string\n}\n"],"names":[],"mappings":"AAAA,WAMC"}

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

@@ -1 +1 @@
-{"version":3,"file":"buildColumns.d.ts","sourceRoot":"","sources":["../../../src/elements/TableColumns/buildColumns.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAA;AAIzE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAA;AAC1E,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAK/C,eAAO,MAAM,YAAY,SAAU;IACjC,SAAS,EAAE,QAAQ,SAAS,CAAC,EAAE,CAAA;IAC/B,iBAAiB,EAAE,iBAAiB,CAAA;IACpC,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,mBAAmB,EAAE,OAAO,CAAA;IAC5B,QAAQ,EAAE,QAAQ,CAAA;IAClB,UAAU,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,CAAA;CAC7D,KAAG,MAAM,EAoFT,CAAA"}
+{"version":3,"file":"buildColumns.d.ts","sourceRoot":"","sources":["../../../src/elements/TableColumns/buildColumns.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAA;AAIzE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAA;AAC1E,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAK/C,eAAO,MAAM,YAAY,SAAU;IACjC,SAAS,EAAE,QAAQ,SAAS,CAAC,EAAE,CAAA;IAC/B,iBAAiB,EAAE,iBAAiB,CAAA;IACpC,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,mBAAmB,EAAE,OAAO,CAAA;IAC5B,QAAQ,EAAE,QAAQ,CAAA;IAClB,UAAU,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,CAAA;CAC7D,KAAG,MAAM,EA+ET,CAAA"}

package/dist/elements/TableColumns/buildColumns.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { SelectAll } from '../SelectAll/index.js';
 import { SelectRow } from '../SelectRow/index.js';
 export const buildColumns = (args)=>{
-    const { cellProps, columnPreferences, defaultColumns, enableRowSelections, fieldMap, useAsTitle } = args;
+    const { cellProps, columnPreferences, defaultColumns, enableRowSelections, fieldMap } = args;
     let sortedFieldMap = fieldMap;
     const sortTo = defaultColumns || columnPreferences;
     if (sortTo) {
@@ -17,7 +17,7 @@ export const buildColumns = (args)=>{
             return aIndex - bIndex;
         });
     }
-    let numberOfActiveColumns = 0;
+    const activeColumnsIndices = [];
     const sorted = sortedFieldMap.reduce((acc, field, index)=>{
         const columnPreference = columnPreferences?.find((preference)=>preference.accessor === field.name);
         let active = false;
@@ -25,12 +25,13 @@ export const buildColumns = (args)=>{
             active = columnPreference.active;
         } else if (defaultColumns && Array.isArray(defaultColumns) && defaultColumns.length > 0) {
             active = defaultColumns.includes(field.name);
-        } else if (numberOfActiveColumns < 4) {
+        } else if (activeColumnsIndices.length < 4) {
             active = true;
         }
-        if (active) {
-            numberOfActiveColumns += 1;
+        if (active && !activeColumnsIndices.includes(index)) {
+            activeColumnsIndices.push(index);
         }
+        const isFirstActiveColumn = activeColumnsIndices[0] === index;
         if (field) {
             const column = {
                 name: field.name,
@@ -38,7 +39,7 @@ export const buildColumns = (args)=>{
                 active,
                 cellProps: {
                     ...cellProps?.[index],
-                    link: numberOfActiveColumns === 1 && active && enableRowSelections || undefined
+                    link: isFirstActiveColumn
                 },
                 components: {
                     Cell: field.Cell,

package/dist/elements/TableColumns/buildColumns.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/TableColumns/buildColumns.tsx"],"sourcesContent":["import type { CellProps, SanitizedCollectionConfig } from 'payload/types'\n\nimport React from 'react'\n\nimport type { ColumnPreferences } from '../../providers/ListInfo/types.js'\nimport type { FieldMap } from '../../utilities/buildComponentMap/types.js'\nimport type { Column } from '../Table/types.js'\n\nimport { SelectAll } from '../SelectAll/index.js'\nimport { SelectRow } from '../SelectRow/index.js'\n\nexport const buildColumns = (args: {\n  cellProps: Partial<CellProps>[]\n  columnPreferences: ColumnPreferences\n  defaultColumns?: string[]\n  enableRowSelections: boolean\n  fieldMap: FieldMap\n  useAsTitle: SanitizedCollectionConfig['admin']['useAsTitle']\n}): Column[] => {\n  const {\n    cellProps,\n    columnPreferences,\n    defaultColumns,\n    enableRowSelections,\n    fieldMap,\n    useAsTitle,\n  } = args\n\n  let sortedFieldMap = fieldMap\n\n  const sortTo = defaultColumns || columnPreferences\n\n  if (sortTo) {\n    // sort the fields to the order of `defaultColumns` or `columnPreferences`\n    // TODO: flatten top level field, i.e. `flattenTopLevelField()` from `payload` but that is typed for `Field`, not `fieldMap`\n    sortedFieldMap = fieldMap.sort((a, b) => {\n      const aIndex = sortTo.findIndex((column) => column.accessor === a.name)\n      const bIndex = sortTo.findIndex((column) => column.accessor === b.name)\n      if (aIndex === -1 && bIndex === -1) return 0\n      if (aIndex === -1) return 1\n      if (bIndex === -1) return -1\n      return aIndex - bIndex\n    })\n  }\n\n  let numberOfActiveColumns = 0\n\n  const sorted = sortedFieldMap.reduce((acc, field, index) => {\n    const columnPreference = columnPreferences?.find(\n      (preference) => preference.accessor === field.name,\n    )\n\n    let active = false\n\n    if (columnPreference) {\n      active = columnPreference.active\n    } else if (defaultColumns && Array.isArray(defaultColumns) && defaultColumns.length > 0) {\n      active = defaultColumns.includes(field.name)\n    } else if (numberOfActiveColumns < 4) {\n      active = true\n    }\n\n    if (active) {\n      numberOfActiveColumns += 1\n    }\n\n    if (field) {\n      const column: Column = {\n        name: field.name,\n        accessor: field.name,\n        active,\n        cellProps: {\n          ...cellProps?.[index],\n          link: (numberOfActiveColumns === 1 && active && enableRowSelections) || undefined,\n        },\n        components: {\n          Cell: field.Cell,\n          Heading: field.Heading,\n        },\n        label: field.label,\n      }\n\n      acc.push(column)\n    }\n\n    return acc\n  }, [])\n\n  if (enableRowSelections) {\n    sorted.unshift({\n      name: '',\n      accessor: '_select',\n      active: true,\n      components: {\n        Cell: <SelectRow />,\n        Heading: <SelectAll />,\n      },\n      label: null,\n    })\n  }\n\n  return sorted\n}\n"],"names":["React","SelectAll","SelectRow","buildColumns","args","cellProps","columnPreferences","defaultColumns","enableRowSelections","fieldMap","useAsTitle","sortedFieldMap","sortTo","sort","a","b","aIndex","findIndex","column","accessor","name","bIndex","numberOfActiveColumns","sorted","reduce","acc","field","index","columnPreference","find","preference","active","Array","isArray","length","includes","link","undefined","components","Cell","Heading","label","push","unshift"],"mappings":"AAEA,OAAOA,WAAW,QAAO;AAMzB,SAASC,SAAS,QAAQ,wBAAuB;AACjD,SAASC,SAAS,QAAQ,wBAAuB;AAEjD,OAAO,MAAMC,eAAe,CAACC;IAQ3B,MAAM,EACJC,SAAS,EACTC,iBAAiB,EACjBC,cAAc,EACdC,mBAAmB,EACnBC,QAAQ,EACRC,UAAU,EACX,GAAGN;IAEJ,IAAIO,iBAAiBF;IAErB,MAAMG,SAASL,kBAAkBD;IAEjC,IAAIM,QAAQ;QACV,0EAA0E;QAC1E,4HAA4H;QAC5HD,iBAAiBF,SAASI,IAAI,CAAC,CAACC,GAAGC;YACjC,MAAMC,SAASJ,OAAOK,SAAS,CAAC,CAACC,SAAWA,OAAOC,QAAQ,KAAKL,EAAEM,IAAI;YACtE,MAAMC,SAAST,OAAOK,SAAS,CAAC,CAACC,SAAWA,OAAOC,QAAQ,KAAKJ,EAAEK,IAAI;YACtE,IAAIJ,WAAW,CAAC,KAAKK,WAAW,CAAC,GAAG,OAAO;YAC3C,IAAIL,WAAW,CAAC,GAAG,OAAO;YAC1B,IAAIK,WAAW,CAAC,GAAG,OAAO,CAAC;YAC3B,OAAOL,SAASK;QAClB;IACF;IAEA,IAAIC,wBAAwB;IAE5B,MAAMC,SAASZ,eAAea,MAAM,CAAC,CAACC,KAAKC,OAAOC;QAChD,MAAMC,mBAAmBtB,mBAAmBuB,KAC1C,CAACC,aAAeA,WAAWX,QAAQ,KAAKO,MAAMN,IAAI;QAGpD,IAAIW,SAAS;QAEb,IAAIH,kBAAkB;YACpBG,SAASH,iBAAiBG,MAAM;QAClC,OAAO,IAAIxB,kBAAkByB,MAAMC,OAAO,CAAC1B,mBAAmBA,eAAe2B,MAAM,GAAG,GAAG;YACvFH,SAASxB,eAAe4B,QAAQ,CAACT,MAAMN,IAAI;QAC7C,OAAO,IAAIE,wBAAwB,GAAG;YACpCS,SAAS;QACX;QAEA,IAAIA,QAAQ;YACVT,yBAAyB;QAC3B;QAEA,IAAII,OAAO;YACT,MAAMR,SAAiB;gBACrBE,MAAMM,MAAMN,IAAI;gBAChBD,UAAUO,MAAMN,IAAI;gBACpBW;gBACA1B,WAAW;oBACT,GAAGA,WAAW,CAACsB,MAAM;oBACrBS,MAAM,AAACd,0BAA0B,KAAKS,UAAUvB,uBAAwB6B;gBAC1E;gBACAC,YAAY;oBACVC,MAAMb,MAAMa,IAAI;oBAChBC,SAASd,MAAMc,OAAO;gBACxB;gBACAC,OAAOf,MAAMe,KAAK;YACpB;YAEAhB,IAAIiB,IAAI,CAACxB;QACX;QAEA,OAAOO;IACT,GAAG,EAAE;IAEL,IAAIjB,qBAAqB;QACvBe,OAAOoB,OAAO,CAAC;YACbvB,MAAM;YACND,UAAU;YACVY,QAAQ;YACRO,YAAY;gBACVC,oBAAM,oBAACrC;gBACPsC,uBAAS,oBAACvC;YACZ;YACAwC,OAAO;QACT;IACF;IAEA,OAAOlB;AACT,EAAC"}
+{"version":3,"sources":["../../../src/elements/TableColumns/buildColumns.tsx"],"sourcesContent":["import type { CellProps, SanitizedCollectionConfig } from 'payload/types'\n\nimport React from 'react'\n\nimport type { ColumnPreferences } from '../../providers/ListInfo/types.js'\nimport type { FieldMap } from '../../utilities/buildComponentMap/types.js'\nimport type { Column } from '../Table/types.js'\n\nimport { SelectAll } from '../SelectAll/index.js'\nimport { SelectRow } from '../SelectRow/index.js'\n\nexport const buildColumns = (args: {\n  cellProps: Partial<CellProps>[]\n  columnPreferences: ColumnPreferences\n  defaultColumns?: string[]\n  enableRowSelections: boolean\n  fieldMap: FieldMap\n  useAsTitle: SanitizedCollectionConfig['admin']['useAsTitle']\n}): Column[] => {\n  const { cellProps, columnPreferences, defaultColumns, enableRowSelections, fieldMap } = args\n\n  let sortedFieldMap = fieldMap\n\n  const sortTo = defaultColumns || columnPreferences\n\n  if (sortTo) {\n    // sort the fields to the order of `defaultColumns` or `columnPreferences`\n    // TODO: flatten top level field, i.e. `flattenTopLevelField()` from `payload` but that is typed for `Field`, not `fieldMap`\n    sortedFieldMap = fieldMap.sort((a, b) => {\n      const aIndex = sortTo.findIndex((column) => column.accessor === a.name)\n      const bIndex = sortTo.findIndex((column) => column.accessor === b.name)\n      if (aIndex === -1 && bIndex === -1) return 0\n      if (aIndex === -1) return 1\n      if (bIndex === -1) return -1\n      return aIndex - bIndex\n    })\n  }\n\n  const activeColumnsIndices = []\n\n  const sorted = sortedFieldMap.reduce((acc, field, index) => {\n    const columnPreference = columnPreferences?.find(\n      (preference) => preference.accessor === field.name,\n    )\n\n    let active = false\n\n    if (columnPreference) {\n      active = columnPreference.active\n    } else if (defaultColumns && Array.isArray(defaultColumns) && defaultColumns.length > 0) {\n      active = defaultColumns.includes(field.name)\n    } else if (activeColumnsIndices.length < 4) {\n      active = true\n    }\n\n    if (active && !activeColumnsIndices.includes(index)) {\n      activeColumnsIndices.push(index)\n    }\n\n    const isFirstActiveColumn = activeColumnsIndices[0] === index\n\n    if (field) {\n      const column: Column = {\n        name: field.name,\n        accessor: field.name,\n        active,\n        cellProps: {\n          ...cellProps?.[index],\n          link: isFirstActiveColumn,\n        },\n        components: {\n          Cell: field.Cell,\n          Heading: field.Heading,\n        },\n        label: field.label,\n      }\n\n      acc.push(column)\n    }\n\n    return acc\n  }, [])\n\n  if (enableRowSelections) {\n    sorted.unshift({\n      name: '',\n      accessor: '_select',\n      active: true,\n      components: {\n        Cell: <SelectRow />,\n        Heading: <SelectAll />,\n      },\n      label: null,\n    })\n  }\n\n  return sorted\n}\n"],"names":["React","SelectAll","SelectRow","buildColumns","args","cellProps","columnPreferences","defaultColumns","enableRowSelections","fieldMap","sortedFieldMap","sortTo","sort","a","b","aIndex","findIndex","column","accessor","name","bIndex","activeColumnsIndices","sorted","reduce","acc","field","index","columnPreference","find","preference","active","Array","isArray","length","includes","push","isFirstActiveColumn","link","components","Cell","Heading","label","unshift"],"mappings":"AAEA,OAAOA,WAAW,QAAO;AAMzB,SAASC,SAAS,QAAQ,wBAAuB;AACjD,SAASC,SAAS,QAAQ,wBAAuB;AAEjD,OAAO,MAAMC,eAAe,CAACC;IAQ3B,MAAM,EAAEC,SAAS,EAAEC,iBAAiB,EAAEC,cAAc,EAAEC,mBAAmB,EAAEC,QAAQ,EAAE,GAAGL;IAExF,IAAIM,iBAAiBD;IAErB,MAAME,SAASJ,kBAAkBD;IAEjC,IAAIK,QAAQ;QACV,0EAA0E;QAC1E,4HAA4H;QAC5HD,iBAAiBD,SAASG,IAAI,CAAC,CAACC,GAAGC;YACjC,MAAMC,SAASJ,OAAOK,SAAS,CAAC,CAACC,SAAWA,OAAOC,QAAQ,KAAKL,EAAEM,IAAI;YACtE,MAAMC,SAAST,OAAOK,SAAS,CAAC,CAACC,SAAWA,OAAOC,QAAQ,KAAKJ,EAAEK,IAAI;YACtE,IAAIJ,WAAW,CAAC,KAAKK,WAAW,CAAC,GAAG,OAAO;YAC3C,IAAIL,WAAW,CAAC,GAAG,OAAO;YAC1B,IAAIK,WAAW,CAAC,GAAG,OAAO,CAAC;YAC3B,OAAOL,SAASK;QAClB;IACF;IAEA,MAAMC,uBAAuB,EAAE;IAE/B,MAAMC,SAASZ,eAAea,MAAM,CAAC,CAACC,KAAKC,OAAOC;QAChD,MAAMC,mBAAmBrB,mBAAmBsB,KAC1C,CAACC,aAAeA,WAAWX,QAAQ,KAAKO,MAAMN,IAAI;QAGpD,IAAIW,SAAS;QAEb,IAAIH,kBAAkB;YACpBG,SAASH,iBAAiBG,MAAM;QAClC,OAAO,IAAIvB,kBAAkBwB,MAAMC,OAAO,CAACzB,mBAAmBA,eAAe0B,MAAM,GAAG,GAAG;YACvFH,SAASvB,eAAe2B,QAAQ,CAACT,MAAMN,IAAI;QAC7C,OAAO,IAAIE,qBAAqBY,MAAM,GAAG,GAAG;YAC1CH,SAAS;QACX;QAEA,IAAIA,UAAU,CAACT,qBAAqBa,QAAQ,CAACR,QAAQ;YACnDL,qBAAqBc,IAAI,CAACT;QAC5B;QAEA,MAAMU,sBAAsBf,oBAAoB,CAAC,EAAE,KAAKK;QAExD,IAAID,OAAO;YACT,MAAMR,SAAiB;gBACrBE,MAAMM,MAAMN,IAAI;gBAChBD,UAAUO,MAAMN,IAAI;gBACpBW;gBACAzB,WAAW;oBACT,GAAGA,WAAW,CAACqB,MAAM;oBACrBW,MAAMD;gBACR;gBACAE,YAAY;oBACVC,MAAMd,MAAMc,IAAI;oBAChBC,SAASf,MAAMe,OAAO;gBACxB;gBACAC,OAAOhB,MAAMgB,KAAK;YACpB;YAEAjB,IAAIW,IAAI,CAAClB;QACX;QAEA,OAAOO;IACT,GAAG,EAAE;IAEL,IAAIhB,qBAAqB;QACvBc,OAAOoB,OAAO,CAAC;YACbvB,MAAM;YACND,UAAU;YACVY,QAAQ;YACRQ,YAAY;gBACVC,oBAAM,oBAACrC;gBACPsC,uBAAS,oBAACvC;YACZ;YACAwC,OAAO;QACT;IACF;IAEA,OAAOnB;AACT,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"columnReducer.d.ts","sourceRoot":"","sources":["../../../src/elements/TableColumns/columnReducer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAE/C,KAAK,MAAM,GAAG;IACZ,OAAO,EAAE;QACP,MAAM,EAAE,MAAM,CAAA;KACf,CAAA;IACD,IAAI,EAAE,QAAQ,CAAA;CACf,CAAA;AAED,KAAK,GAAG,GAAG;IACT,OAAO,EAAE;QACP,OAAO,EAAE,MAAM,EAAE,CAAA;KAClB,CAAA;IACD,IAAI,EAAE,KAAK,CAAA;CACZ,CAAA;AAED,KAAK,IAAI,GAAG;IACV,OAAO,EAAE;QACP,SAAS,EAAE,MAAM,CAAA;QACjB,OAAO,EAAE,MAAM,CAAA;KAChB,CAAA;IACD,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,MAAM,MAAM,MAAM,GAAG,IAAI,GAAG,GAAG,GAAG,MAAM,CAAA;AAExC,eAAO,MAAM,aAAa,UAAW,MAAM,EAAE,UAAU,MAAM,KAAG,MAAM,EAgCrE,CAAA"}
+{"version":3,"file":"columnReducer.d.ts","sourceRoot":"","sources":["../../../src/elements/TableColumns/columnReducer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAE/C,KAAK,MAAM,GAAG;IACZ,OAAO,EAAE;QACP,MAAM,EAAE,MAAM,CAAA;KACf,CAAA;IACD,IAAI,EAAE,QAAQ,CAAA;CACf,CAAA;AAED,KAAK,GAAG,GAAG;IACT,OAAO,EAAE;QACP,OAAO,EAAE,MAAM,EAAE,CAAA;KAClB,CAAA;IACD,IAAI,EAAE,KAAK,CAAA;CACZ,CAAA;AAED,KAAK,IAAI,GAAG;IACV,OAAO,EAAE;QACP,SAAS,EAAE,MAAM,CAAA;QACjB,OAAO,EAAE,MAAM,CAAA;KAChB,CAAA;IACD,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,MAAM,MAAM,MAAM,GAAG,IAAI,GAAG,GAAG,GAAG,MAAM,CAAA;AAExC,eAAO,MAAM,aAAa,UAAW,MAAM,EAAE,UAAU,MAAM,KAAG,MAAM,EAyDrE,CAAA"}

package/dist/elements/TableColumns/columnReducer.js

@@ -1,4 +1,7 @@
 export const columnReducer = (state, action)=>{
+    let newState = [
+        ...state
+    ];
     switch(action.type){
         case 'toggle':
             {
@@ -12,7 +15,8 @@ export const columnReducer = (state, action)=>{
                     }
                     return col;
                 });
-                return withToggledColumn;
+                newState = withToggledColumn;
+                break;
             }
         case 'move':
             {
@@ -22,16 +26,34 @@ export const columnReducer = (state, action)=>{
                 ];
                 const [columnToMove] = withMovedColumn.splice(fromIndex, 1);
                 withMovedColumn.splice(toIndex, 0, columnToMove);
-                return withMovedColumn;
+                newState = withMovedColumn;
+                break;
             }
         case 'set':
             {
                 const { columns } = action.payload;
-                return columns;
+                newState = columns;
+                break;
             }
         default:
-            return state;
+            break;
     }
+    const firstActiveColumnIndex = newState.findIndex((column, index)=>{
+        if (column.active && column.accessor !== '_select') {
+            return index;
+        }
+    });
+    const withFirstLink = newState.map((column, index)=>{
+        const isFirstActiveColumn = column.active && firstActiveColumnIndex === index;
+        return {
+            ...column,
+            cellProps: {
+                ...column.cellProps,
+                link: isFirstActiveColumn
+            }
+        };
+    }, []);
+    return withFirstLink;
 };
 
 //# sourceMappingURL=columnReducer.js.map

package/dist/elements/TableColumns/columnReducer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/TableColumns/columnReducer.ts"],"sourcesContent":["import type { Column } from '../Table/types.js'\n\ntype TOGGLE = {\n  payload: {\n    column: string\n  }\n  type: 'toggle'\n}\n\ntype SET = {\n  payload: {\n    columns: Column[]\n  }\n  type: 'set'\n}\n\ntype MOVE = {\n  payload: {\n    fromIndex: number\n    toIndex: number\n  }\n  type: 'move'\n}\n\nexport type Action = MOVE | SET | TOGGLE\n\nexport const columnReducer = (state: Column[], action: Action): Column[] => {\n  switch (action.type) {\n    case 'toggle': {\n      const { column } = action.payload\n\n      const withToggledColumn = state.map((col) => {\n        if (col?.name === column) {\n          return {\n            ...col,\n            active: !col.active,\n          }\n        }\n\n        return col\n      })\n\n      return withToggledColumn\n    }\n    case 'move': {\n      const { fromIndex, toIndex } = action.payload\n      const withMovedColumn = [...state]\n      const [columnToMove] = withMovedColumn.splice(fromIndex, 1)\n      withMovedColumn.splice(toIndex, 0, columnToMove)\n      return withMovedColumn\n    }\n    case 'set': {\n      const { columns } = action.payload\n      return columns\n    }\n    default:\n      return state\n  }\n}\n"],"names":["columnReducer","state","action","type","column","payload","withToggledColumn","map","col","name","active","fromIndex","toIndex","withMovedColumn","columnToMove","splice","columns"],"mappings":"AA0BA,OAAO,MAAMA,gBAAgB,CAACC,OAAiBC;IAC7C,OAAQA,OAAOC,IAAI;QACjB,KAAK;YAAU;gBACb,MAAM,EAAEC,MAAM,EAAE,GAAGF,OAAOG,OAAO;gBAEjC,MAAMC,oBAAoBL,MAAMM,GAAG,CAAC,CAACC;oBACnC,IAAIA,KAAKC,SAASL,QAAQ;wBACxB,OAAO;4BACL,GAAGI,GAAG;4BACNE,QAAQ,CAACF,IAAIE,MAAM;wBACrB;oBACF;oBAEA,OAAOF;gBACT;gBAEA,OAAOF;YACT;QACA,KAAK;YAAQ;gBACX,MAAM,EAAEK,SAAS,EAAEC,OAAO,EAAE,GAAGV,OAAOG,OAAO;gBAC7C,MAAMQ,kBAAkB;uBAAIZ;iBAAM;gBAClC,MAAM,CAACa,aAAa,GAAGD,gBAAgBE,MAAM,CAACJ,WAAW;gBACzDE,gBAAgBE,MAAM,CAACH,SAAS,GAAGE;gBACnC,OAAOD;YACT;QACA,KAAK;YAAO;gBACV,MAAM,EAAEG,OAAO,EAAE,GAAGd,OAAOG,OAAO;gBAClC,OAAOW;YACT;QACA;YACE,OAAOf;IACX;AACF,EAAC"}
+{"version":3,"sources":["../../../src/elements/TableColumns/columnReducer.ts"],"sourcesContent":["import type { Column } from '../Table/types.js'\n\ntype TOGGLE = {\n  payload: {\n    column: string\n  }\n  type: 'toggle'\n}\n\ntype SET = {\n  payload: {\n    columns: Column[]\n  }\n  type: 'set'\n}\n\ntype MOVE = {\n  payload: {\n    fromIndex: number\n    toIndex: number\n  }\n  type: 'move'\n}\n\nexport type Action = MOVE | SET | TOGGLE\n\nexport const columnReducer = (state: Column[], action: Action): Column[] => {\n  let newState = [...state]\n\n  switch (action.type) {\n    case 'toggle': {\n      const { column } = action.payload\n\n      const withToggledColumn = state.map((col) => {\n        if (col?.name === column) {\n          return {\n            ...col,\n            active: !col.active,\n          }\n        }\n\n        return col\n      })\n\n      newState = withToggledColumn\n      break\n    }\n    case 'move': {\n      const { fromIndex, toIndex } = action.payload\n      const withMovedColumn = [...state]\n      const [columnToMove] = withMovedColumn.splice(fromIndex, 1)\n      withMovedColumn.splice(toIndex, 0, columnToMove)\n      newState = withMovedColumn\n      break\n    }\n    case 'set': {\n      const { columns } = action.payload\n      newState = columns\n      break\n    }\n    default:\n      break\n  }\n\n  const firstActiveColumnIndex = newState.findIndex((column, index) => {\n    if (column.active && column.accessor !== '_select') {\n      return index\n    }\n  })\n\n  const withFirstLink = newState.map((column, index) => {\n    const isFirstActiveColumn = column.active && firstActiveColumnIndex === index\n\n    return {\n      ...column,\n      cellProps: {\n        ...column.cellProps,\n        link: isFirstActiveColumn,\n      },\n    }\n  }, [])\n\n  return withFirstLink\n}\n"],"names":["columnReducer","state","action","newState","type","column","payload","withToggledColumn","map","col","name","active","fromIndex","toIndex","withMovedColumn","columnToMove","splice","columns","firstActiveColumnIndex","findIndex","index","accessor","withFirstLink","isFirstActiveColumn","cellProps","link"],"mappings":"AA0BA,OAAO,MAAMA,gBAAgB,CAACC,OAAiBC;IAC7C,IAAIC,WAAW;WAAIF;KAAM;IAEzB,OAAQC,OAAOE,IAAI;QACjB,KAAK;YAAU;gBACb,MAAM,EAAEC,MAAM,EAAE,GAAGH,OAAOI,OAAO;gBAEjC,MAAMC,oBAAoBN,MAAMO,GAAG,CAAC,CAACC;oBACnC,IAAIA,KAAKC,SAASL,QAAQ;wBACxB,OAAO;4BACL,GAAGI,GAAG;4BACNE,QAAQ,CAACF,IAAIE,MAAM;wBACrB;oBACF;oBAEA,OAAOF;gBACT;gBAEAN,WAAWI;gBACX;YACF;QACA,KAAK;YAAQ;gBACX,MAAM,EAAEK,SAAS,EAAEC,OAAO,EAAE,GAAGX,OAAOI,OAAO;gBAC7C,MAAMQ,kBAAkB;uBAAIb;iBAAM;gBAClC,MAAM,CAACc,aAAa,GAAGD,gBAAgBE,MAAM,CAACJ,WAAW;gBACzDE,gBAAgBE,MAAM,CAACH,SAAS,GAAGE;gBACnCZ,WAAWW;gBACX;YACF;QACA,KAAK;YAAO;gBACV,MAAM,EAAEG,OAAO,EAAE,GAAGf,OAAOI,OAAO;gBAClCH,WAAWc;gBACX;YACF;QACA;YACE;IACJ;IAEA,MAAMC,yBAAyBf,SAASgB,SAAS,CAAC,CAACd,QAAQe;QACzD,IAAIf,OAAOM,MAAM,IAAIN,OAAOgB,QAAQ,KAAK,WAAW;YAClD,OAAOD;QACT;IACF;IAEA,MAAME,gBAAgBnB,SAASK,GAAG,CAAC,CAACH,QAAQe;QAC1C,MAAMG,sBAAsBlB,OAAOM,MAAM,IAAIO,2BAA2BE;QAExE,OAAO;YACL,GAAGf,MAAM;YACTmB,WAAW;gBACT,GAAGnB,OAAOmB,SAAS;gBACnBC,MAAMF;YACR;QACF;IACF,GAAG,EAAE;IAEL,OAAOD;AACT,EAAC"}

package/dist/elements/TableColumns/index.js

@@ -53,7 +53,7 @@ export const TableColumnsProvider = ({ cellProps, children, collectionSlug, enab
                 }
             }
         };
-        sync();
+        void sync();
     }, [
         preferenceKey,
         getPreference,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/TableColumns/index.tsx"],"sourcesContent":["'use client'\nimport type { SanitizedCollectionConfig } from 'payload/types'\nimport type { CellProps } from 'payload/types'\n\nimport React, { createContext, useCallback, useContext, useEffect, useReducer, useRef } from 'react'\n\nimport type { ColumnPreferences } from '../../providers/ListInfo/types.js'\nimport type { Column } from '../Table/types.js'\nimport type { Action } from './columnReducer.js'\n\nimport { useComponentMap } from '../../providers/ComponentMapProvider/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { buildColumns } from './buildColumns.js'\nimport { columnReducer } from './columnReducer.js'\n\nexport interface ITableColumns {\n  columns: Column[]\n  dispatchTableColumns: React.Dispatch<Action>\n  moveColumn: (args: { fromIndex: number; toIndex: number }) => void\n  setActiveColumns: (columns: string[]) => void\n  toggleColumn: (column: string) => void\n}\n\nexport const TableColumnContext = createContext<ITableColumns>({} as ITableColumns)\n\nexport const useTableColumns = (): ITableColumns => useContext(TableColumnContext)\n\nexport type ListPreferences = {\n  columns: ColumnPreferences\n}\n\nexport const TableColumnsProvider: React.FC<{\n  cellProps?: Partial<CellProps>[]\n  children: React.ReactNode\n  collectionSlug: string\n  enableRowSelections?: boolean\n  listPreferences: ListPreferences\n}> = ({ cellProps, children, collectionSlug, enableRowSelections = false, listPreferences }) => {\n  const config = useConfig()\n\n  const { componentMap } = useComponentMap()\n\n  const { fieldMap } = componentMap.collections[collectionSlug]\n\n  const collectionConfig = config.collections.find(\n    (collectionConfig) => collectionConfig.slug === collectionSlug,\n  )\n\n  const {\n    admin: { defaultColumns, useAsTitle },\n  } = collectionConfig\n\n  const preferenceKey = `${collectionSlug}-list`\n  const prevCollection = useRef<SanitizedCollectionConfig['slug']>(collectionSlug)\n  const hasInitialized = useRef(false)\n  const { getPreference, setPreference } = usePreferences()\n\n  const [tableColumns, dispatchTableColumns] = useReducer(columnReducer, {}, () => {\n    return buildColumns({\n      cellProps,\n      columnPreferences: listPreferences?.columns,\n      defaultColumns,\n      enableRowSelections,\n      fieldMap,\n      useAsTitle,\n    })\n  })\n\n  // /////////////////////////////////////\n  // Get preferences on collection change\n  // /////////////////////////////////////\n\n  useEffect(() => {\n    const sync = async () => {\n      const collectionHasChanged = prevCollection.current !== collectionSlug\n\n      if (collectionHasChanged) {\n        const currentPreferences = await getPreference<{\n          columns: ColumnPreferences\n        }>(preferenceKey)\n        prevCollection.current = collectionSlug\n\n        if (currentPreferences.columns) {\n          dispatchTableColumns({\n            type: 'set',\n            payload: {\n              columns: buildColumns({\n                cellProps,\n                columnPreferences: currentPreferences?.columns,\n                defaultColumns,\n                enableRowSelections: true,\n                fieldMap,\n                useAsTitle,\n              }),\n            },\n          })\n        }\n      }\n    }\n\n    sync()\n  }, [\n    preferenceKey,\n    getPreference,\n    collectionSlug,\n    fieldMap,\n    cellProps,\n    defaultColumns,\n    useAsTitle,\n  ])\n\n  // /////////////////////////////////////\n  // Set preferences on column change\n  // /////////////////////////////////////\n\n  useEffect(() => {\n    if (!hasInitialized.current) {\n      hasInitialized.current = true\n      return\n    }\n\n    const columns = tableColumns.map((c) => ({\n      accessor: c?.accessor,\n      active: c?.active,\n    }))\n\n    void setPreference(preferenceKey, { columns }, true)\n  }, [tableColumns, preferenceKey, setPreference])\n\n  const setActiveColumns = useCallback(\n    (columns: string[]) => {\n      // dispatchTableColumns({\n      //   type: 'set',\n      //   payload: {\n      //     // onSelect,\n      //     cellProps,\n      //     collection: { ...collectionConfig, fields: formatFields(collectionConfig) },\n      //     columns: columns.map((column) => ({\n      //       accessor: column,\n      //       active: true,\n      //     })),\n      //     i18n,\n      //   },\n      // })\n    },\n    [collectionConfig, cellProps],\n  )\n\n  const moveColumn = useCallback(\n    (args: { fromIndex: number; toIndex: number }) => {\n      const { fromIndex, toIndex } = args\n\n      dispatchTableColumns({\n        type: 'move',\n        payload: {\n          fromIndex,\n          toIndex,\n        },\n      })\n    },\n    [dispatchTableColumns],\n  )\n\n  const toggleColumn = useCallback(\n    (column: string) => {\n      dispatchTableColumns({\n        type: 'toggle',\n        payload: {\n          column,\n        },\n      })\n    },\n    [dispatchTableColumns],\n  )\n\n  return (\n    <TableColumnContext.Provider\n      value={{\n        columns: tableColumns,\n        dispatchTableColumns,\n        moveColumn,\n        setActiveColumns,\n        toggleColumn,\n      }}\n    >\n      {children}\n    </TableColumnContext.Provider>\n  )\n}\n"],"names":["React","createContext","useCallback","useContext","useEffect","useReducer","useRef","useComponentMap","useConfig","usePreferences","buildColumns","columnReducer","TableColumnContext","useTableColumns","TableColumnsProvider","cellProps","children","collectionSlug","enableRowSelections","listPreferences","config","componentMap","fieldMap","collections","collectionConfig","find","slug","admin","defaultColumns","useAsTitle","preferenceKey","prevCollection","hasInitialized","getPreference","setPreference","tableColumns","dispatchTableColumns","columnPreferences","columns","sync","collectionHasChanged","current","currentPreferences","type","payload","map","c","accessor","active","setActiveColumns","moveColumn","args","fromIndex","toIndex","toggleColumn","column","Provider","value"],"mappings":"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"}
+{"version":3,"sources":["../../../src/elements/TableColumns/index.tsx"],"sourcesContent":["'use client'\nimport type { SanitizedCollectionConfig } from 'payload/types'\nimport type { CellProps } from 'payload/types'\n\nimport React, { createContext, useCallback, useContext, useEffect, useReducer, useRef } from 'react'\n\nimport type { ColumnPreferences } from '../../providers/ListInfo/types.js'\nimport type { Column } from '../Table/types.js'\nimport type { Action } from './columnReducer.js'\n\nimport { useComponentMap } from '../../providers/ComponentMapProvider/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { buildColumns } from './buildColumns.js'\nimport { columnReducer } from './columnReducer.js'\n\nexport interface ITableColumns {\n  columns: Column[]\n  dispatchTableColumns: React.Dispatch<Action>\n  moveColumn: (args: { fromIndex: number; toIndex: number }) => void\n  setActiveColumns: (columns: string[]) => void\n  toggleColumn: (column: string) => void\n}\n\nexport const TableColumnContext = createContext<ITableColumns>({} as ITableColumns)\n\nexport const useTableColumns = (): ITableColumns => useContext(TableColumnContext)\n\nexport type ListPreferences = {\n  columns: ColumnPreferences\n}\n\nexport const TableColumnsProvider: React.FC<{\n  cellProps?: Partial<CellProps>[]\n  children: React.ReactNode\n  collectionSlug: string\n  enableRowSelections?: boolean\n  listPreferences: ListPreferences\n}> = ({ cellProps, children, collectionSlug, enableRowSelections = false, listPreferences }) => {\n  const config = useConfig()\n\n  const { componentMap } = useComponentMap()\n\n  const { fieldMap } = componentMap.collections[collectionSlug]\n\n  const collectionConfig = config.collections.find(\n    (collectionConfig) => collectionConfig.slug === collectionSlug,\n  )\n\n  const {\n    admin: { defaultColumns, useAsTitle },\n  } = collectionConfig\n\n  const preferenceKey = `${collectionSlug}-list`\n  const prevCollection = useRef<SanitizedCollectionConfig['slug']>(collectionSlug)\n  const hasInitialized = useRef(false)\n  const { getPreference, setPreference } = usePreferences()\n\n  const [tableColumns, dispatchTableColumns] = useReducer(columnReducer, {}, () => {\n    return buildColumns({\n      cellProps,\n      columnPreferences: listPreferences?.columns,\n      defaultColumns,\n      enableRowSelections,\n      fieldMap,\n      useAsTitle,\n    })\n  })\n\n  // /////////////////////////////////////\n  // Get preferences on collection change\n  // /////////////////////////////////////\n\n  useEffect(() => {\n    const sync = async () => {\n      const collectionHasChanged = prevCollection.current !== collectionSlug\n\n      if (collectionHasChanged) {\n        const currentPreferences = await getPreference<{\n          columns: ColumnPreferences\n        }>(preferenceKey)\n        prevCollection.current = collectionSlug\n\n        if (currentPreferences.columns) {\n          dispatchTableColumns({\n            type: 'set',\n            payload: {\n              columns: buildColumns({\n                cellProps,\n                columnPreferences: currentPreferences?.columns,\n                defaultColumns,\n                enableRowSelections: true,\n                fieldMap,\n                useAsTitle,\n              }),\n            },\n          })\n        }\n      }\n    }\n\n    void sync()\n  }, [\n    preferenceKey,\n    getPreference,\n    collectionSlug,\n    fieldMap,\n    cellProps,\n    defaultColumns,\n    useAsTitle,\n  ])\n\n  // /////////////////////////////////////\n  // Set preferences on column change\n  // /////////////////////////////////////\n\n  useEffect(() => {\n    if (!hasInitialized.current) {\n      hasInitialized.current = true\n      return\n    }\n\n    const columns = tableColumns.map((c) => ({\n      accessor: c?.accessor,\n      active: c?.active,\n    }))\n\n    void setPreference(preferenceKey, { columns }, true)\n  }, [tableColumns, preferenceKey, setPreference])\n\n  const setActiveColumns = useCallback(\n    (columns: string[]) => {\n      // dispatchTableColumns({\n      //   type: 'set',\n      //   payload: {\n      //     // onSelect,\n      //     cellProps,\n      //     collection: { ...collectionConfig, fields: formatFields(collectionConfig) },\n      //     columns: columns.map((column) => ({\n      //       accessor: column,\n      //       active: true,\n      //     })),\n      //     i18n,\n      //   },\n      // })\n    },\n    [collectionConfig, cellProps],\n  )\n\n  const moveColumn = useCallback(\n    (args: { fromIndex: number; toIndex: number }) => {\n      const { fromIndex, toIndex } = args\n\n      dispatchTableColumns({\n        type: 'move',\n        payload: {\n          fromIndex,\n          toIndex,\n        },\n      })\n    },\n    [dispatchTableColumns],\n  )\n\n  const toggleColumn = useCallback(\n    (column: string) => {\n      dispatchTableColumns({\n        type: 'toggle',\n        payload: {\n          column,\n        },\n      })\n    },\n    [dispatchTableColumns],\n  )\n\n  return (\n    <TableColumnContext.Provider\n      value={{\n        columns: tableColumns,\n        dispatchTableColumns,\n        moveColumn,\n        setActiveColumns,\n        toggleColumn,\n      }}\n    >\n      {children}\n    </TableColumnContext.Provider>\n  )\n}\n"],"names":["React","createContext","useCallback","useContext","useEffect","useReducer","useRef","useComponentMap","useConfig","usePreferences","buildColumns","columnReducer","TableColumnContext","useTableColumns","TableColumnsProvider","cellProps","children","collectionSlug","enableRowSelections","listPreferences","config","componentMap","fieldMap","collections","collectionConfig","find","slug","admin","defaultColumns","useAsTitle","preferenceKey","prevCollection","hasInitialized","getPreference","setPreference","tableColumns","dispatchTableColumns","columnPreferences","columns","sync","collectionHasChanged","current","currentPreferences","type","payload","map","c","accessor","active","setActiveColumns","moveColumn","args","fromIndex","toIndex","toggleColumn","column","Provider","value"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ThumbnailCard/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAKvC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA4CzC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ThumbnailCard/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAMvC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA6CzC,CAAA"}

package/dist/elements/ThumbnailCard/index.js

@@ -1,10 +1,12 @@
 import React from 'react';
+import { useConfig } from '../../index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { formatDocTitle } from '../../utilities/formatDocTitle.js';
 import Thumbnail from '../Thumbnail/index.js';
 const baseClass = 'thumbnail-card';
 export const ThumbnailCard = (props)=>{
     const { alignLabel, className, collection, doc, label: labelFromProps, onClick, thumbnail } = props;
+    const config = useConfig();
     const { i18n, t } = useTranslation();
     const classes = [
         baseClass,
@@ -15,10 +17,12 @@ export const ThumbnailCard = (props)=>{
     let title = labelFromProps;
     if (!title) {
         title = formatDocTitle({
-            doc,
-            i18n,
-            useAsTitle: collection?.admin?.useAsTitle
-        }) || doc?.filename || `[${t('general:untitled')}]`;
+            collectionConfig: collection,
+            data: doc,
+            dateFormat: config.admin.dateFormat,
+            fallback: doc?.filename,
+            i18n
+        });
     }
     return /*#__PURE__*/ React.createElement("button", {
         className: classes,