@payloadcms/ui 3.0.0-canary.96477cf → 3.0.0-canary.98e0119

package/dist/forms/Submit/index.scss

@@ -1,5 +1,7 @@
-form > .form-submit {
-  .btn {
-    width: 100%;
+@layer payload-default {
+  form > .form-submit {
+    .btn {
+      width: 100%;
+    }
   }
 }

package/dist/forms/WatchChildErrors/buildPathSegments.d.ts

@@ -1,3 +1,3 @@
 import type { ClientField } from 'payload';
-export declare const buildPathSegments: (parentPath: string, fields: ClientField[]) => string[];
+export declare const buildPathSegments: (parentPath: (number | string)[], fields: ClientField[]) => string[];
 //# sourceMappingURL=buildPathSegments.d.ts.map

package/dist/forms/WatchChildErrors/buildPathSegments.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"buildPathSegments.d.ts","sourceRoot":"","sources":["../../../src/forms/WatchChildErrors/buildPathSegments.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAI1C,eAAO,MAAM,iBAAiB,eAAgB,MAAM,UAAU,WAAW,EAAE,KAAG,MAAM,EAkCnF,CAAA"}
+{"version":3,"file":"buildPathSegments.d.ts","sourceRoot":"","sources":["../../../src/forms/WatchChildErrors/buildPathSegments.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAI1C,eAAO,MAAM,iBAAiB,eAChB,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,UACvB,WAAW,EAAE,KACpB,MAAM,EAkCR,CAAA"}

package/dist/forms/WatchChildErrors/buildPathSegments.js

@@ -8,7 +8,7 @@ export const buildPathSegments = (parentPath, fields) => {
       if (fieldAffectsData(field)) {
         // group, block, array
         const name = 'name' in field ? field.name : 'unnamed';
-        acc.push(parentPath ? `${parentPath}.${name}.` : `${name}.`);
+        acc.push(...[...parentPath, name]);
       } else {
         // rows, collapsibles, unnamed-tab
         acc.push(...buildPathSegments(parentPath, fields));
@@ -19,7 +19,7 @@ export const buildPathSegments = (parentPath, fields) => {
         field.tabs?.forEach(tab => {
           let tabPath = parentPath;
           if ('name' in tab) {
-            tabPath = parentPath ? `${parentPath}.${tab.name}` : tab.name;
+            tabPath = [...parentPath, tab.name];
           }
           acc.push(...buildPathSegments(tabPath, tab.fields));
         });
@@ -27,7 +27,7 @@ export const buildPathSegments = (parentPath, fields) => {
     } else if (fieldAffectsData(field)) {
       // text, number, date, etc.
       const name = 'name' in field ? field.name : 'unnamed';
-      acc.push(parentPath ? `${parentPath}.${name}` : name);
+      acc.push(...[...parentPath, name]);
     }
     return acc;
   }, []);

package/dist/forms/WatchChildErrors/buildPathSegments.js.map

@@ -1 +1 @@
-{"version":3,"file":"buildPathSegments.js","names":["fieldAffectsData","buildPathSegments","parentPath","fields","pathNames","reduce","acc","field","undefined","name","push","type","tabs","forEach","tab","tabPath"],"sources":["../../../src/forms/WatchChildErrors/buildPathSegments.ts"],"sourcesContent":["'use client'\nimport type { ClientField } from 'payload'\n\nimport { fieldAffectsData } from 'payload/shared'\n\nexport const buildPathSegments = (parentPath: string, fields: ClientField[]): string[] => {\n  const pathNames = fields.reduce((acc, field) => {\n    const fields: ClientField[] = 'fields' in field ? field.fields : undefined\n\n    if (fields) {\n      if (fieldAffectsData(field)) {\n        // group, block, array\n        const name = 'name' in field ? field.name : 'unnamed'\n        acc.push(parentPath ? `${parentPath}.${name}.` : `${name}.`)\n      } else {\n        // rows, collapsibles, unnamed-tab\n        acc.push(...buildPathSegments(parentPath, fields))\n      }\n    } else if (field.type === 'tabs') {\n      // tabs\n      if ('tabs' in field) {\n        field.tabs?.forEach((tab) => {\n          let tabPath = parentPath\n          if ('name' in tab) {\n            tabPath = parentPath ? `${parentPath}.${tab.name}` : tab.name\n          }\n          acc.push(...buildPathSegments(tabPath, tab.fields))\n        })\n      }\n    } else if (fieldAffectsData(field)) {\n      // text, number, date, etc.\n      const name = 'name' in field ? field.name : 'unnamed'\n      acc.push(parentPath ? `${parentPath}.${name}` : name)\n    }\n\n    return acc\n  }, [])\n\n  return pathNames\n}\n"],"mappings":"AAAA;;AAGA,SAASA,gBAAgB,QAAQ;AAEjC,OAAO,MAAMC,iBAAA,GAAoBA,CAACC,UAAA,EAAoBC,MAAA;EACpD,MAAMC,SAAA,GAAYD,MAAA,CAAOE,MAAM,CAAC,CAACC,GAAA,EAAKC,KAAA;IACpC,MAAMJ,MAAA,GAAwB,YAAYI,KAAA,GAAQA,KAAA,CAAMJ,MAAM,GAAGK,SAAA;IAEjE,IAAIL,MAAA,EAAQ;MACV,IAAIH,gBAAA,CAAiBO,KAAA,GAAQ;QAC3B;QACA,MAAME,IAAA,GAAO,UAAUF,KAAA,GAAQA,KAAA,CAAME,IAAI,GAAG;QAC5CH,GAAA,CAAII,IAAI,CAACR,UAAA,GAAa,GAAGA,UAAA,IAAcO,IAAA,GAAO,GAAG,GAAGA,IAAA,GAAO;MAC7D,OAAO;QACL;QACAH,GAAA,CAAII,IAAI,IAAIT,iBAAA,CAAkBC,UAAA,EAAYC,MAAA;MAC5C;IACF,OAAO,IAAII,KAAA,CAAMI,IAAI,KAAK,QAAQ;MAChC;MACA,IAAI,UAAUJ,KAAA,EAAO;QACnBA,KAAA,CAAMK,IAAI,EAAEC,OAAA,CAASC,GAAA;UACnB,IAAIC,OAAA,GAAUb,UAAA;UACd,IAAI,UAAUY,GAAA,EAAK;YACjBC,OAAA,GAAUb,UAAA,GAAa,GAAGA,UAAA,IAAcY,GAAA,CAAIL,IAAI,EAAE,GAAGK,GAAA,CAAIL,IAAI;UAC/D;UACAH,GAAA,CAAII,IAAI,IAAIT,iBAAA,CAAkBc,OAAA,EAASD,GAAA,CAAIX,MAAM;QACnD;MACF;IACF,OAAO,IAAIH,gBAAA,CAAiBO,KAAA,GAAQ;MAClC;MACA,MAAME,IAAA,GAAO,UAAUF,KAAA,GAAQA,KAAA,CAAME,IAAI,GAAG;MAC5CH,GAAA,CAAII,IAAI,CAACR,UAAA,GAAa,GAAGA,UAAA,IAAcO,IAAA,EAAM,GAAGA,IAAA;IAClD;IAEA,OAAOH,GAAA;EACT,GAAG,EAAE;EAEL,OAAOF,SAAA;AACT","ignoreList":[]}
+{"version":3,"file":"buildPathSegments.js","names":["fieldAffectsData","buildPathSegments","parentPath","fields","pathNames","reduce","acc","field","undefined","name","push","type","tabs","forEach","tab","tabPath"],"sources":["../../../src/forms/WatchChildErrors/buildPathSegments.ts"],"sourcesContent":["'use client'\nimport type { ClientField } from 'payload'\n\nimport { fieldAffectsData } from 'payload/shared'\n\nexport const buildPathSegments = (\n  parentPath: (number | string)[],\n  fields: ClientField[],\n): string[] => {\n  const pathNames = fields.reduce((acc, field) => {\n    const fields: ClientField[] = 'fields' in field ? field.fields : undefined\n\n    if (fields) {\n      if (fieldAffectsData(field)) {\n        // group, block, array\n        const name = 'name' in field ? field.name : 'unnamed'\n        acc.push(...[...parentPath, name])\n      } else {\n        // rows, collapsibles, unnamed-tab\n        acc.push(...buildPathSegments(parentPath, fields))\n      }\n    } else if (field.type === 'tabs') {\n      // tabs\n      if ('tabs' in field) {\n        field.tabs?.forEach((tab) => {\n          let tabPath = parentPath\n          if ('name' in tab) {\n            tabPath = [...parentPath, tab.name]\n          }\n          acc.push(...buildPathSegments(tabPath, tab.fields))\n        })\n      }\n    } else if (fieldAffectsData(field)) {\n      // text, number, date, etc.\n      const name = 'name' in field ? field.name : 'unnamed'\n      acc.push(...[...parentPath, name])\n    }\n\n    return acc\n  }, [])\n\n  return pathNames\n}\n"],"mappings":"AAAA;;AAGA,SAASA,gBAAgB,QAAQ;AAEjC,OAAO,MAAMC,iBAAA,GAAoBA,CAC/BC,UAAA,EACAC,MAAA;EAEA,MAAMC,SAAA,GAAYD,MAAA,CAAOE,MAAM,CAAC,CAACC,GAAA,EAAKC,KAAA;IACpC,MAAMJ,MAAA,GAAwB,YAAYI,KAAA,GAAQA,KAAA,CAAMJ,MAAM,GAAGK,SAAA;IAEjE,IAAIL,MAAA,EAAQ;MACV,IAAIH,gBAAA,CAAiBO,KAAA,GAAQ;QAC3B;QACA,MAAME,IAAA,GAAO,UAAUF,KAAA,GAAQA,KAAA,CAAME,IAAI,GAAG;QAC5CH,GAAA,CAAII,IAAI,IAAI,C,GAAIR,UAAA,EAAYO,IAAA,CAAK;MACnC,OAAO;QACL;QACAH,GAAA,CAAII,IAAI,IAAIT,iBAAA,CAAkBC,UAAA,EAAYC,MAAA;MAC5C;IACF,OAAO,IAAII,KAAA,CAAMI,IAAI,KAAK,QAAQ;MAChC;MACA,IAAI,UAAUJ,KAAA,EAAO;QACnBA,KAAA,CAAMK,IAAI,EAAEC,OAAA,CAASC,GAAA;UACnB,IAAIC,OAAA,GAAUb,UAAA;UACd,IAAI,UAAUY,GAAA,EAAK;YACjBC,OAAA,GAAU,C,GAAIb,UAAA,EAAYY,GAAA,CAAIL,IAAI,CAAC;UACrC;UACAH,GAAA,CAAII,IAAI,IAAIT,iBAAA,CAAkBc,OAAA,EAASD,GAAA,CAAIX,MAAM;QACnD;MACF;IACF,OAAO,IAAIH,gBAAA,CAAiBO,KAAA,GAAQ;MAClC;MACA,MAAME,IAAA,GAAO,UAAUF,KAAA,GAAQA,KAAA,CAAME,IAAI,GAAG;MAC5CH,GAAA,CAAII,IAAI,IAAI,C,GAAIR,UAAA,EAAYO,IAAA,CAAK;IACnC;IAEA,OAAOH,GAAA;EACT,GAAG,EAAE;EAEL,OAAOF,SAAA;AACT","ignoreList":[]}

package/dist/forms/WatchChildErrors/index.d.ts

@@ -2,7 +2,7 @@ import type { ClientField } from 'payload';
 import type React from 'react';
 type TrackSubSchemaErrorCountProps = {
     fields?: ClientField[];
-    path: string;
+    path: (number | string)[];
     setErrorCount: (count: number) => void;
 };
 export declare const WatchChildErrors: React.FC<TrackSubSchemaErrorCountProps>;

package/dist/forms/WatchChildErrors/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/WatchChildErrors/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,KAAK,6BAA6B,GAAG;IACnC,MAAM,CAAC,EAAE,WAAW,EAAE,CAAA;IACtB,IAAI,EAAE,MAAM,CAAA;IACZ,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACvC,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,6BAA6B,CAsBpE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/WatchChildErrors/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,KAAK,6BAA6B,GAAG;IACnC,MAAM,CAAC,EAAE,WAAW,EAAE,CAAA;IACtB,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAA;IACzB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACvC,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,6BAA6B,CAsBpE,CAAA"}

package/dist/forms/WatchChildErrors/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useThrottledEffect","useAllFormFields","useFormSubmitted","buildPathSegments","getFieldStateFromPaths","WatchChildErrors","t0","$","fields","path","setErrorCount","formState","hasSubmitted","t1","pathSegments","t2","errorCount","t3"],"sources":["../../../src/forms/WatchChildErrors/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField } from 'payload'\nimport type React from 'react'\n\nimport { useThrottledEffect } from '../../hooks/useThrottledEffect.js'\nimport { useAllFormFields, useFormSubmitted } from '../Form/context.js'\nimport { buildPathSegments } from './buildPathSegments.js'\nimport { getFieldStateFromPaths } from './getFieldStateFromPaths.js'\n\ntype TrackSubSchemaErrorCountProps = {\n  fields?: ClientField[]\n  path: string\n  setErrorCount: (count: number) => void\n}\n\nexport const WatchChildErrors: React.FC<TrackSubSchemaErrorCountProps> = ({\n  fields,\n  path,\n  setErrorCount,\n}) => {\n  const [formState] = useAllFormFields()\n  const hasSubmitted = useFormSubmitted()\n\n  const pathSegments = buildPathSegments(path, fields)\n\n  useThrottledEffect(\n    () => {\n      if (hasSubmitted) {\n        const { errorCount } = getFieldStateFromPaths({ formState, pathSegments })\n        setErrorCount(errorCount)\n      }\n    },\n    250,\n    [formState, hasSubmitted, fields],\n  )\n\n  return null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AAIA,SAASC,kBAAkB,QAAQ;AACnC,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ;AACnD,SAASC,iBAAiB,QAAQ;AAClC,SAASC,sBAAsB,QAAQ;AAQvC,OAAO,MAAMC,gBAAA,GAA4DC,EAAA;EAAA,MAAAC,CAAA,GAAAR,EAAA;EAAC;IAAAS,MAAA;IAAAC,IAAA;IAAAC;EAAA,IAAAJ,EAIzE;EACC,OAAAK,SAAA,IAAoBV,gBAAA;EACpB,MAAAW,YAAA,GAAqBV,gBAAA;EAAA,IAAAW,EAAA;EAAA,IAAAN,CAAA,QAAAE,IAAA,IAAAF,CAAA,QAAAC,MAAA;IAEAK,EAAA,GAAAV,iBAAA,CAAkBM,IAAA,EAAMD,MAAA;IAAAD,CAAA,MAAAE,IAAA;IAAAF,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAM,EAAA;EAAA;IAAAA,EAAA,GAAAN,CAAA;EAAA;EAA7C,MAAAO,YAAA,GAAqBD,EAAwB;EAAA,IAAAE,EAAA;EAAA,IAAAR,CAAA,QAAAK,YAAA,IAAAL,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAO,YAAA,IAAAP,CAAA,QAAAG,aAAA;IAG3CK,EAAA,GAAAA,CAAA;MAAA,IACMH,YAAA;QACF;UAAAI;QAAA,IAAuBZ,sBAAA;UAAAO,SAAA;UAAAG;QAAA,CAAiD;QACxEJ,aAAA,CAAcM,UAAA;MAAA;IAAA;IAElBT,CAAA,MAAAK,YAAA;IAAAL,CAAA,MAAAI,SAAA;IAAAJ,CAAA,MAAAO,YAAA;IAAAP,CAAA,MAAAG,aAAA;IAAAH,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EAAA,IAAAU,EAAA;EAAA,IAAAV,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAK,YAAA,IAAAL,CAAA,SAAAC,MAAA;IAEAS,EAAA,IAACN,SAAA,EAAWC,YAAA,EAAcJ,MAAA;IAAOD,CAAA,MAAAI,SAAA;IAAAJ,CAAA,MAAAK,YAAA;IAAAL,CAAA,OAAAC,MAAA;IAAAD,CAAA,OAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EARnCP,kBAAA,CACEe,EAKA,OAEAE,EAAiC;EAAA;AAAA,CAIrC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useThrottledEffect","useAllFormFields","useFormSubmitted","buildPathSegments","getFieldStateFromPaths","WatchChildErrors","t0","$","fields","path","setErrorCount","formState","hasSubmitted","t1","pathSegments","t2","errorCount","t3"],"sources":["../../../src/forms/WatchChildErrors/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField } from 'payload'\nimport type React from 'react'\n\nimport { useThrottledEffect } from '../../hooks/useThrottledEffect.js'\nimport { useAllFormFields, useFormSubmitted } from '../Form/context.js'\nimport { buildPathSegments } from './buildPathSegments.js'\nimport { getFieldStateFromPaths } from './getFieldStateFromPaths.js'\n\ntype TrackSubSchemaErrorCountProps = {\n  fields?: ClientField[]\n  path: (number | string)[]\n  setErrorCount: (count: number) => void\n}\n\nexport const WatchChildErrors: React.FC<TrackSubSchemaErrorCountProps> = ({\n  fields,\n  path,\n  setErrorCount,\n}) => {\n  const [formState] = useAllFormFields()\n  const hasSubmitted = useFormSubmitted()\n\n  const pathSegments = buildPathSegments(path, fields)\n\n  useThrottledEffect(\n    () => {\n      if (hasSubmitted) {\n        const { errorCount } = getFieldStateFromPaths({ formState, pathSegments })\n        setErrorCount(errorCount)\n      }\n    },\n    250,\n    [formState, hasSubmitted, fields],\n  )\n\n  return null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AAIA,SAASC,kBAAkB,QAAQ;AACnC,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ;AACnD,SAASC,iBAAiB,QAAQ;AAClC,SAASC,sBAAsB,QAAQ;AAQvC,OAAO,MAAMC,gBAAA,GAA4DC,EAAA;EAAA,MAAAC,CAAA,GAAAR,EAAA;EAAC;IAAAS,MAAA;IAAAC,IAAA;IAAAC;EAAA,IAAAJ,EAIzE;EACC,OAAAK,SAAA,IAAoBV,gBAAA;EACpB,MAAAW,YAAA,GAAqBV,gBAAA;EAAA,IAAAW,EAAA;EAAA,IAAAN,CAAA,QAAAE,IAAA,IAAAF,CAAA,QAAAC,MAAA;IAEAK,EAAA,GAAAV,iBAAA,CAAkBM,IAAA,EAAMD,MAAA;IAAAD,CAAA,MAAAE,IAAA;IAAAF,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAM,EAAA;EAAA;IAAAA,EAAA,GAAAN,CAAA;EAAA;EAA7C,MAAAO,YAAA,GAAqBD,EAAwB;EAAA,IAAAE,EAAA;EAAA,IAAAR,CAAA,QAAAK,YAAA,IAAAL,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAO,YAAA,IAAAP,CAAA,QAAAG,aAAA;IAG3CK,EAAA,GAAAA,CAAA;MAAA,IACMH,YAAA;QACF;UAAAI;QAAA,IAAuBZ,sBAAA;UAAAO,SAAA;UAAAG;QAAA,CAAiD;QACxEJ,aAAA,CAAcM,UAAA;MAAA;IAAA;IAElBT,CAAA,MAAAK,YAAA;IAAAL,CAAA,MAAAI,SAAA;IAAAJ,CAAA,MAAAO,YAAA;IAAAP,CAAA,MAAAG,aAAA;IAAAH,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EAAA,IAAAU,EAAA;EAAA,IAAAV,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAK,YAAA,IAAAL,CAAA,SAAAC,MAAA;IAEAS,EAAA,IAACN,SAAA,EAAWC,YAAA,EAAcJ,MAAA;IAAOD,CAAA,MAAAI,SAAA;IAAAJ,CAAA,MAAAK,YAAA;IAAAL,CAAA,OAAAC,MAAA;IAAAD,CAAA,OAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EARnCP,kBAAA,CACEe,EAKA,OAEAE,EAAiC;EAAA;AAAA,CAIrC","ignoreList":[]}

package/dist/forms/{buildStateFromSchema → fieldSchemasToFormState}/addFieldStatePromise.d.ts

@@ -1,6 +1,7 @@
-import type { Data, DocumentPreferences, Field, FormState, PayloadRequest } from 'payload';
+import type { Data, DocumentPermissions, DocumentPreferences, Field, FieldSchemaMap, FormState, FormStateWithoutComponents, PayloadRequest } from 'payload';
+import type { RenderFieldMethod } from './types.js';
 export type AddFieldStatePromiseArgs = {
-    addErrorPathToParent: (path: string) => void;
+    addErrorPathToParent: (fieldPath: string) => void;
     /**
      * if all parents are localized, then the field is localized
      */
@@ -9,6 +10,7 @@ export type AddFieldStatePromiseArgs = {
     data: Data;
     field: Field;
     fieldIndex: number;
+    fieldSchemaMap: FieldSchemaMap;
     /**
      * You can use this to filter down to only `localized` fields that require translation (type: text, textarea, etc.). Another plugin might want to look for only `point` type fields to do some GIS function. With the filter function you can go in like a surgeon.
      */
@@ -28,9 +30,15 @@ export type AddFieldStatePromiseArgs = {
      */
     omitParents?: boolean;
     operation: 'create' | 'update';
+    parentIndexPath: string;
+    parentPath: string;
+    parentSchemaPath: string;
     passesCondition: boolean;
-    path: string;
+    permissions: DocumentPermissions['fields'];
     preferences: DocumentPreferences;
+    previousFormState: FormState;
+    renderAllFields: boolean;
+    renderFieldFn: RenderFieldMethod;
     /**
      * Req is used for validation and defaultValue calculation. If you don't need validation,
      * just create your own req and pass in the locale and the user
@@ -44,7 +52,7 @@ export type AddFieldStatePromiseArgs = {
      * Whether to skip validating the field. @default false
      */
     skipValidation?: boolean;
-    state: FormState;
+    state: FormStateWithoutComponents;
 };
 /**
  * Flattens the fields schema and fields data.

package/dist/forms/fieldSchemasToFormState/addFieldStatePromise.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"addFieldStatePromise.d.ts","sourceRoot":"","sources":["../../../src/forms/fieldSchemasToFormState/addFieldStatePromise.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,IAAI,EACJ,mBAAmB,EACnB,mBAAmB,EACnB,KAAK,EACL,cAAc,EAEd,SAAS,EACT,0BAA0B,EAC1B,cAAc,EACf,MAAM,SAAS,CAAA;AAWhB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAQnD,MAAM,MAAM,wBAAwB,GAAG;IACrC,oBAAoB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAA;IACjD;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,IAAI,EAAE,IAAI,CAAA;IACV,KAAK,EAAE,KAAK,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;IAClB,cAAc,EAAE,cAAc,CAAA;IAC9B;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,wBAAwB,KAAK,OAAO,CAAA;IACpD;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,QAAQ,EAAE,IAAI,CAAA;IACd,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,SAAS,EAAE,QAAQ,GAAG,QAAQ,CAAA;IAC9B,eAAe,EAAE,MAAM,CAAA;IACvB,UAAU,EAAE,MAAM,CAAA;IAClB,gBAAgB,EAAE,MAAM,CAAA;IACxB,eAAe,EAAE,OAAO,CAAA;IACxB,WAAW,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAA;IAC1C,WAAW,EAAE,mBAAmB,CAAA;IAChC,iBAAiB,EAAE,SAAS,CAAA;IAC5B,eAAe,EAAE,OAAO,CAAA;IACxB,aAAa,EAAE,iBAAiB,CAAA;IAChC;;;OAGG;IACH,GAAG,EAAE,cAAc,CAAA;IACnB;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,KAAK,EAAE,0BAA0B,CAAA;CAClC,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,oBAAoB,SAAgB,wBAAwB,KAAG,OAAO,CAAC,IAAI,CAwnBvF,CAAA"}

package/dist/forms/{buildStateFromSchema → fieldSchemasToFormState}/addFieldStatePromise.js

@@ -1,5 +1,5 @@
 import ObjectIdImport from 'bson-objectid';
-import { fieldAffectsData, fieldHasSubFields, tabHasName } from 'payload/shared';
+import { fieldAffectsData, fieldHasSubFields, fieldIsSidebar, getFieldPaths, tabHasName } from 'payload/shared';
 import { getFilterOptionsQuery } from './getFilterOptionsQuery.js';
 import { iterateFields } from './iterateFields.js';
 const ObjectId = ObjectIdImport.default || ObjectIdImport;
@@ -16,26 +16,61 @@ export const addFieldStatePromise = async args => {
     data,
     field,
     fieldIndex,
+    fieldSchemaMap,
     filter,
     forceFullValue = false,
     fullData,
     includeSchema = false,
     omitParents = false,
     operation,
+    parentIndexPath,
+    parentPath,
+    parentSchemaPath,
     passesCondition,
-    path,
+    permissions,
     preferences,
+    previousFormState,
+    renderAllFields,
+    renderFieldFn,
     req,
     skipConditionChecks = false,
     skipValidation = false,
     state
   } = args;
-  if (fieldAffectsData(field)) {
+  const {
+    indexPath,
+    path,
+    schemaPath
+  } = getFieldPaths({
+    field,
+    index: fieldIndex,
+    parentIndexPath: 'name' in field ? '' : parentIndexPath,
+    parentPath,
+    parentSchemaPath
+  });
+  const requiresRender = renderAllFields || previousFormState?.[path]?.requiresRender;
+  const isHiddenField = 'hidden' in field && field?.hidden;
+  const disabledFromAdmin = field?.admin && 'disabled' in field.admin && field.admin.disabled;
+  if (fieldAffectsData(field) && !(isHiddenField || disabledFromAdmin)) {
+    let hasPermission = typeof permissions?.[field.name]?.read === 'boolean' ? permissions[field.name].read : true;
+    if (typeof field?.access?.read === 'function') {
+      hasPermission = await field.access.read({
+        doc: fullData,
+        req,
+        siblingData: data
+      });
+    } else {
+      hasPermission = true;
+    }
+    if (!hasPermission) {
+      return;
+    }
     const validate = field.validate;
     const fieldState = {
       errorPaths: [],
       fieldSchema: includeSchema ? field : undefined,
       initialValue: undefined,
+      isSidebar: fieldIsSidebar(field),
       passesCondition,
       valid: true,
       value: undefined
@@ -74,7 +109,7 @@ export const addFieldStatePromise = async args => {
     if (typeof validationResult === 'string') {
       fieldState.errorMessage = validationResult;
       fieldState.valid = false;
-      addErrorPathToParent(`${path}${field.name}`);
+      addErrorPathToParent(path);
     } else {
       fieldState.valid = true;
     }
@@ -84,12 +119,12 @@ export const addFieldStatePromise = async args => {
           const arrayValue = Array.isArray(data[field.name]) ? data[field.name] : [];
           const {
             promises,
-            rowMetadata
+            rows
           } = arrayValue.reduce((acc, row, i) => {
-            const rowPath = `${path}${field.name}.${i}.`;
+            const parentPath = path + '.' + i;
             row.id = row?.id || new ObjectId().toHexString();
             if (!omitParents && (!filter || filter(args))) {
-              state[`${rowPath}id`] = {
+              state[parentPath + '.id'] = {
                 fieldSchema: includeSchema ? field.fields.find(field => 'name' in field && field.name === 'id') : undefined,
                 initialValue: row.id,
                 valid: true,
@@ -100,33 +135,46 @@ export const addFieldStatePromise = async args => {
               id,
               addErrorPathToParent,
               anyParentLocalized: field.localized || anyParentLocalized,
+              collectionSlug,
               data: row,
               fields: field.fields,
+              fieldSchemaMap,
               filter,
               forceFullValue,
               fullData,
               includeSchema,
               omitParents,
               operation,
+              parentIndexPath: '',
               parentPassesCondition: passesCondition,
-              path: rowPath,
+              parentPath,
+              parentSchemaPath: schemaPath,
+              permissions: permissions?.[field.name]?.fields || {},
               preferences,
+              previousFormState,
+              renderAllFields: requiresRender,
+              renderFieldFn,
               req,
               skipConditionChecks,
               skipValidation,
               state
             }));
-            const collapsedRowIDs = preferences?.fields?.[`${path}${field.name}`]?.collapsed;
-            acc.rowMetadata.push({
+            const collapsedRowIDs = preferences?.fields?.[path]?.collapsed;
+            acc.rows.push({
               id: row.id,
               collapsed: collapsedRowIDs === undefined ? field.admin.initCollapsed : collapsedRowIDs.includes(row.id)
             });
             return acc;
           }, {
             promises: [],
-            rowMetadata: []
+            rows: []
           });
+          // Wait for all promises and update fields with the results
           await Promise.all(promises);
+          fieldState.rows = rows;
+          // Unset requiresRender
+          // so it will be removed from form state
+          fieldState.requiresRender = false;
           // Add values to field state
           if (data[field.name] === null) {
             fieldState.value = null;
@@ -138,10 +186,9 @@ export const addFieldStatePromise = async args => {
               fieldState.disableFormData = true;
             }
           }
-          fieldState.rows = rowMetadata;
           // Add field to state
           if (!omitParents && (!filter || filter(args))) {
-            state[`${path}${field.name}`] = fieldState;
+            state[path] = fieldState;
           }
           break;
         }
@@ -153,23 +200,27 @@ export const addFieldStatePromise = async args => {
             rowMetadata
           } = blocksValue.reduce((acc, row, i) => {
             const block = field.blocks.find(blockType => blockType.slug === row.blockType);
-            const rowPath = `${path}${field.name}.${i}.`;
+            if (!block) {
+              throw new Error(`Block with type "${row.blockType}" was found in block data, but no block with that type is defined in the config for field with schema path ${schemaPath}.`);
+            }
+            const parentPath = path + '.' + i;
+            const rowSchemaPath = schemaPath + '.' + block.slug;
             if (block) {
               row.id = row?.id || new ObjectId().toHexString();
               if (!omitParents && (!filter || filter(args))) {
-                state[`${rowPath}id`] = {
+                state[parentPath + '.id'] = {
                   fieldSchema: includeSchema ? block.fields.find(blockField => 'name' in blockField && blockField.name === 'id') : undefined,
                   initialValue: row.id,
                   valid: true,
                   value: row.id
                 };
-                state[`${rowPath}blockType`] = {
+                state[parentPath + '.blockType'] = {
                   fieldSchema: includeSchema ? block.fields.find(blockField => 'name' in blockField && blockField.name === 'blockType') : undefined,
                   initialValue: row.blockType,
                   valid: true,
                   value: row.blockType
                 };
-                state[`${rowPath}blockName`] = {
+                state[parentPath + '.blockName'] = {
                   fieldSchema: includeSchema ? block.fields.find(blockField => 'name' in blockField && blockField.name === 'blockName') : undefined,
                   initialValue: row.blockName,
                   valid: true,
@@ -180,23 +231,31 @@ export const addFieldStatePromise = async args => {
                 id,
                 addErrorPathToParent,
                 anyParentLocalized: field.localized || anyParentLocalized,
+                collectionSlug,
                 data: row,
                 fields: block.fields,
+                fieldSchemaMap,
                 filter,
                 forceFullValue,
                 fullData,
                 includeSchema,
                 omitParents,
                 operation,
+                parentIndexPath: '',
                 parentPassesCondition: passesCondition,
-                path: rowPath,
+                parentPath,
+                parentSchemaPath: rowSchemaPath,
+                permissions: permissions?.[field.name]?.blocks?.[block.slug]?.fields || {},
                 preferences,
+                previousFormState,
+                renderAllFields: requiresRender,
+                renderFieldFn,
                 req,
                 skipConditionChecks,
                 skipValidation,
                 state
               }));
-              const collapsedRowIDs = preferences?.fields?.[`${path}${field.name}`]?.collapsed;
+              const collapsedRowIDs = preferences?.fields?.[path]?.collapsed;
               acc.rowMetadata.push({
                 id: row.id,
                 blockType: row.blockType,
@@ -221,9 +280,12 @@ export const addFieldStatePromise = async args => {
             }
           }
           fieldState.rows = rowMetadata;
+          // Unset requiresRender
+          // so it will be removed from form state
+          fieldState.requiresRender = false;
           // Add field to state
           if (!omitParents && (!filter || filter(args))) {
-            state[`${path}${field.name}`] = fieldState;
+            state[path] = fieldState;
           }
           break;
         }
@@ -231,23 +293,31 @@ export const addFieldStatePromise = async args => {
         {
           if (!filter || filter(args)) {
             fieldState.disableFormData = true;
-            state[`${path}${field.name}`] = fieldState;
+            state[path] = fieldState;
           }
           await iterateFields({
             id,
             addErrorPathToParent,
             anyParentLocalized: field.localized || anyParentLocalized,
+            collectionSlug,
             data: data?.[field.name] || {},
             fields: field.fields,
+            fieldSchemaMap,
             filter,
             forceFullValue,
             fullData,
             includeSchema,
             omitParents,
             operation,
+            parentIndexPath: '',
             parentPassesCondition: passesCondition,
-            path: `${path}${field.name}.`,
+            parentPath: path,
+            parentSchemaPath: schemaPath,
+            permissions: permissions?.[field.name]?.fields || {},
             preferences,
+            previousFormState,
+            renderAllFields,
+            renderFieldFn,
             req,
             skipConditionChecks,
             skipValidation,
@@ -255,8 +325,8 @@ export const addFieldStatePromise = async args => {
           });
           break;
         }
-      case 'upload':
       case 'relationship':
+      case 'upload':
         {
           if (field.filterOptions) {
             if (typeof field.filterOptions === 'object') {
@@ -313,7 +383,7 @@ export const addFieldStatePromise = async args => {
             fieldState.initialValue = relationshipValue;
           }
           if (!filter || filter(args)) {
-            state[`${path}${field.name}`] = fieldState;
+            state[path] = fieldState;
           }
           break;
         }
@@ -323,15 +393,15 @@ export const addFieldStatePromise = async args => {
           fieldState.initialValue = data[field.name];
           // Add field to state
           if (!filter || filter(args)) {
-            state[`${path}${field.name}`] = fieldState;
+            state[path] = fieldState;
           }
           break;
         }
     }
-  } else if (fieldHasSubFields(field)) {
+  } else if (fieldHasSubFields(field) && !fieldAffectsData(field)) {
     // Handle field types that do not use names (row, etc)
     if (!filter || filter(args)) {
-      state[`${path}_index-${fieldIndex}`] = {
+      state[path] = {
         disableFormData: true,
         errorPaths: [],
         initialValue: undefined,
@@ -345,41 +415,70 @@ export const addFieldStatePromise = async args => {
       // passthrough parent functionality
       addErrorPathToParent: addErrorPathToParentArg,
       anyParentLocalized: field.localized || anyParentLocalized,
+      collectionSlug,
       data,
       fields: field.fields,
+      fieldSchemaMap,
       filter,
       forceFullValue,
       fullData,
       includeSchema,
       omitParents,
       operation,
+      parentIndexPath: indexPath,
       parentPassesCondition: passesCondition,
-      path,
+      parentPath,
+      parentSchemaPath,
+      permissions,
       preferences,
+      previousFormState,
+      renderAllFields,
+      renderFieldFn,
       req,
       skipConditionChecks,
       skipValidation,
       state
     });
   } else if (field.type === 'tabs') {
-    const promises = field.tabs.map(tab => {
+    const promises = field.tabs.map((tab, tabIndex) => {
       const isNamedTab = tabHasName(tab);
+      const {
+        indexPath: tabIndexPath,
+        path: tabPath,
+        schemaPath: tabSchemaPath
+      } = getFieldPaths({
+        field: {
+          ...tab,
+          type: 'tab'
+        },
+        index: tabIndex,
+        parentIndexPath: indexPath,
+        parentPath,
+        parentSchemaPath
+      });
       return iterateFields({
         id,
-        // passthrough parent functionality
         addErrorPathToParent: addErrorPathToParentArg,
         anyParentLocalized: tab.localized || anyParentLocalized,
+        collectionSlug,
         data: isNamedTab ? data?.[tab.name] || {} : data,
         fields: tab.fields,
+        fieldSchemaMap,
         filter,
         forceFullValue,
         fullData,
         includeSchema,
         omitParents,
         operation,
+        parentIndexPath: tabHasName(tab) ? '' : tabIndexPath,
         parentPassesCondition: passesCondition,
-        path: isNamedTab ? `${path}${tab.name}.` : path,
+        parentPath: tabHasName(tab) ? tabPath : parentPath,
+        parentSchemaPath: tabHasName(tab) ? tabSchemaPath : parentSchemaPath,
+        permissions: tabHasName(tab) ? permissions?.[tab.name]?.fields || {} : permissions,
         preferences,
+        previousFormState,
+        renderAllFields,
+        renderFieldFn,
         req,
         skipConditionChecks,
         skipValidation,
@@ -389,15 +488,51 @@ export const addFieldStatePromise = async args => {
     await Promise.all(promises);
   } else if (field.type === 'ui') {
     if (!filter || filter(args)) {
-      state[`${path}_index-${fieldIndex}`] = {
+      state[path] = {
         disableFormData: true,
         errorPaths: [],
+        fieldSchema: includeSchema ? field : undefined,
         initialValue: undefined,
+        isSidebar: fieldIsSidebar(field),
         passesCondition,
         valid: true,
         value: undefined
       };
     }
   }
+  const isDisabled = field?.admin && 'disabled' in field.admin && field.admin.disabled;
+  if (requiresRender && !isDisabled && renderFieldFn) {
+    const fieldState = state[path];
+    const fieldConfig = fieldSchemaMap.get(schemaPath);
+    if (!fieldConfig) {
+      if (schemaPath.endsWith('.blockType')) {
+        return;
+      } else {
+        throw new Error(`Field config not found for ${schemaPath}`);
+      }
+    }
+    if (!fieldState) {
+      // Some fields (ie `Tab`) do not live in form state
+      // therefore we cannot attach customComponents to them
+      return;
+    }
+    renderFieldFn({
+      data: fullData,
+      fieldConfig: fieldConfig,
+      fieldSchemaMap,
+      fieldState,
+      formState: state,
+      indexPath,
+      operation,
+      parentPath,
+      parentSchemaPath,
+      path,
+      permissions,
+      previousFieldState: previousFormState?.[path],
+      req,
+      schemaPath,
+      siblingData: data
+    });
+  }
 };
 //# sourceMappingURL=addFieldStatePromise.js.map