@payloadcms/ui 3.0.0-canary.c27a334 → 3.0.0-canary.cb7fa00

package/dist/fields/Email/index.js

@@ -2,16 +2,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React, { useCallback } from 'react';
-import { FieldDescription } from '../../forms/FieldDescription/index.js';
-import { FieldError } from '../../forms/FieldError/index.js';
-import { FieldLabel } from '../../forms/FieldLabel/index.js';
 import { useFieldProps } from '../../forms/FieldPropsProvider/index.js';
 import { useField } from '../../forms/useField/index.js';
 import { withCondition } from '../../forms/withCondition/index.js';
+import { RenderComponent } from '../../providers/Config/RenderComponent.js';
 import { useTranslation } from '../../providers/Translation/index.js';
+import { FieldDescription } from '../FieldDescription/index.js';
+import { FieldError } from '../FieldError/index.js';
+import { FieldLabel } from '../FieldLabel/index.js';
 import { fieldBaseClass } from '../shared/index.js';
-const EmailField = (props)=>{
-    const { name, AfterInput, BeforeInput, CustomDescription, CustomError, CustomLabel, autoComplete, className, descriptionProps, errorProps, label, labelProps, path: pathFromProps, placeholder, readOnly: readOnlyFromProps, required, style, validate, width } = props;
+import './index.scss';
+const EmailFieldComponent = (props)=>{
+    const { autoComplete, descriptionProps, errorProps, field, field: { name, _path: pathFromProps, admin: { readOnly: readOnlyFromAdmin, className, description, placeholder, style, width } = {}, label, required } = {}, labelProps, readOnly: readOnlyFromTopLevelProps, validate } = props;
+    const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin;
     const { i18n } = useTranslation();
     const memoizedValidate = useCallback((value, options)=>{
         if (typeof validate === 'function') {
@@ -26,7 +29,7 @@ const EmailField = (props)=>{
     ]);
     const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps();
     const { formInitializing, formProcessing, path, setValue, showError, value } = useField({
-        path: pathFromContext || pathFromProps || name,
+        path: pathFromContext ?? pathFromProps ?? name,
         validate: memoizedValidate
     });
     const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing;
@@ -44,7 +47,7 @@ const EmailField = (props)=>{
         },
         children: [
             /*#__PURE__*/ _jsx(FieldLabel, {
-                CustomLabel: CustomLabel,
+                Label: field?.admin?.components?.Label,
                 label: label,
                 required: required,
                 ...labelProps || {}
@@ -53,11 +56,13 @@ const EmailField = (props)=>{
                 className: `${fieldBaseClass}__wrap`,
                 children: [
                     /*#__PURE__*/ _jsx(FieldError, {
-                        CustomError: CustomError,
+                        CustomError: field?.admin?.components?.Error,
                         path: path,
                         ...errorProps || {}
                     }),
-                    BeforeInput,
+                    /*#__PURE__*/ _jsx(RenderComponent, {
+                        mappedComponent: field?.admin?.components?.beforeInput
+                    }),
                     /*#__PURE__*/ _jsx("input", {
                         autoComplete: autoComplete,
                         disabled: disabled,
@@ -65,18 +70,23 @@ const EmailField = (props)=>{
                         name: path,
                         onChange: setValue,
                         placeholder: getTranslation(placeholder, i18n),
+                        required: required,
                         type: "email",
                         value: value || ''
                     }),
-                    AfterInput
+                    /*#__PURE__*/ _jsx(RenderComponent, {
+                        mappedComponent: field?.admin?.components?.afterInput
+                    })
                 ]
             }),
-            CustomDescription !== undefined ? CustomDescription : /*#__PURE__*/ _jsx(FieldDescription, {
+            /*#__PURE__*/ _jsx(FieldDescription, {
+                Description: field?.admin?.components?.Description,
+                description: description,
                 ...descriptionProps || {}
             })
         ]
     });
 };
-export const Email = withCondition(EmailField);
+export const EmailField = withCondition(EmailFieldComponent);
 
 //# sourceMappingURL=index.js.map

package/dist/fields/Email/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Email/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientValidate } from 'payload/types'\nimport type { EmailField as EmailFieldType } from 'payload/types'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback } from 'react'\n\nimport type { FormFieldBase } from '../shared/index.js'\n\nimport { FieldDescription } from '../../forms/FieldDescription/index.js'\nimport { FieldError } from '../../forms/FieldError/index.js'\nimport { FieldLabel } from '../../forms/FieldLabel/index.js'\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nexport type EmailFieldProps = FormFieldBase & {\n  autoComplete?: string\n  name?: string\n  path?: string\n  placeholder?: EmailFieldType['admin']['placeholder']\n  width?: string\n}\n\nconst EmailField: React.FC<EmailFieldProps> = (props) => {\n  const {\n    name,\n    AfterInput,\n    BeforeInput,\n    CustomDescription,\n    CustomError,\n    CustomLabel,\n    autoComplete,\n    className,\n    descriptionProps,\n    errorProps,\n    label,\n    labelProps,\n    path: pathFromProps,\n    placeholder,\n    readOnly: readOnlyFromProps,\n    required,\n    style,\n    validate,\n    width,\n  } = props\n\n  const { i18n } = useTranslation()\n\n  const memoizedValidate: ClientValidate = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, required })\n      }\n    },\n    [validate, required],\n  )\n\n  const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps()\n\n  const { formInitializing, formProcessing, path, setValue, showError, value } = useField({\n    path: pathFromContext || pathFromProps || name,\n    validate: memoizedValidate,\n  })\n\n  const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing\n\n  return (\n    <div\n      className={[fieldBaseClass, 'email', className, showError && 'error', disabled && 'read-only']\n        .filter(Boolean)\n        .join(' ')}\n      style={{\n        ...style,\n        width,\n      }}\n    >\n      <FieldLabel\n        CustomLabel={CustomLabel}\n        label={label}\n        required={required}\n        {...(labelProps || {})}\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <FieldError CustomError={CustomError} path={path} {...(errorProps || {})} />\n        {BeforeInput}\n        <input\n          autoComplete={autoComplete}\n          disabled={disabled}\n          id={`field-${path.replace(/\\./g, '__')}`}\n          name={path}\n          onChange={setValue}\n          placeholder={getTranslation(placeholder, i18n)}\n          type=\"email\"\n          value={(value as string) || ''}\n        />\n        {AfterInput}\n      </div>\n      {CustomDescription !== undefined ? (\n        CustomDescription\n      ) : (\n        <FieldDescription {...(descriptionProps || {})} />\n      )}\n    </div>\n  )\n}\n\nexport const Email = withCondition(EmailField)\n"],"names":["getTranslation","React","useCallback","FieldDescription","FieldError","FieldLabel","useFieldProps","useField","withCondition","useTranslation","fieldBaseClass","EmailField","props","name","AfterInput","BeforeInput","CustomDescription","CustomError","CustomLabel","autoComplete","className","descriptionProps","errorProps","label","labelProps","path","pathFromProps","placeholder","readOnly","readOnlyFromProps","required","style","validate","width","i18n","memoizedValidate","value","options","pathFromContext","readOnlyFromContext","formInitializing","formProcessing","setValue","showError","disabled","div","filter","Boolean","join","input","id","replace","onChange","type","undefined","Email"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAIA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,SAASC,WAAW,QAAQ,QAAO;AAI1C,SAASC,gBAAgB,QAAQ,wCAAuC;AACxE,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,SAASC,aAAa,QAAQ,0CAAyC;AACvE,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,aAAa,QAAQ,qCAAoC;AAClE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,cAAc,QAAQ,qBAAoB;AAWnD,MAAMC,aAAwC,CAACC;IAC7C,MAAM,EACJC,IAAI,EACJC,UAAU,EACVC,WAAW,EACXC,iBAAiB,EACjBC,WAAW,EACXC,WAAW,EACXC,YAAY,EACZC,SAAS,EACTC,gBAAgB,EAChBC,UAAU,EACVC,KAAK,EACLC,UAAU,EACVC,MAAMC,aAAa,EACnBC,WAAW,EACXC,UAAUC,iBAAiB,EAC3BC,QAAQ,EACRC,KAAK,EACLC,QAAQ,EACRC,KAAK,EACN,GAAGrB;IAEJ,MAAM,EAAEsB,IAAI,EAAE,GAAGzB;IAEjB,MAAM0B,mBAAmCjC,YACvC,CAACkC,OAAOC;QACN,IAAI,OAAOL,aAAa,YAAY;YAClC,OAAOA,SAASI,OAAO;gBAAE,GAAGC,OAAO;gBAAEP;YAAS;QAChD;IACF,GACA;QAACE;QAAUF;KAAS;IAGtB,MAAM,EAAEL,MAAMa,eAAe,EAAEV,UAAUW,mBAAmB,EAAE,GAAGjC;IAEjE,MAAM,EAAEkC,gBAAgB,EAAEC,cAAc,EAAEhB,IAAI,EAAEiB,QAAQ,EAAEC,SAAS,EAAEP,KAAK,EAAE,GAAG7B,SAAS;QACtFkB,MAAMa,mBAAmBZ,iBAAiBb;QAC1CmB,UAAUG;IACZ;IAEA,MAAMS,WAAWf,qBAAqBU,uBAAuBE,kBAAkBD;IAE/E,qBACE,MAACK;QACCzB,WAAW;YAACV;YAAgB;YAASU;YAAWuB,aAAa;YAASC,YAAY;SAAY,CAC3FE,MAAM,CAACC,SACPC,IAAI,CAAC;QACRjB,OAAO;YACL,GAAGA,KAAK;YACRE;QACF;;0BAEA,KAAC5B;gBACCa,aAAaA;gBACbK,OAAOA;gBACPO,UAAUA;gBACT,GAAIN,cAAc,CAAC,CAAC;;0BAEvB,MAACqB;gBAAIzB,WAAW,CAAC,EAAEV,eAAe,MAAM,CAAC;;kCACvC,KAACN;wBAAWa,aAAaA;wBAAaQ,MAAMA;wBAAO,GAAIH,cAAc,CAAC,CAAC;;oBACtEP;kCACD,KAACkC;wBACC9B,cAAcA;wBACdyB,UAAUA;wBACVM,IAAI,CAAC,MAAM,EAAEzB,KAAK0B,OAAO,CAAC,OAAO,MAAM,CAAC;wBACxCtC,MAAMY;wBACN2B,UAAUV;wBACVf,aAAa3B,eAAe2B,aAAaO;wBACzCmB,MAAK;wBACLjB,OAAO,AAACA,SAAoB;;oBAE7BtB;;;YAEFE,sBAAsBsC,YACrBtC,kCAEA,KAACb;gBAAkB,GAAIkB,oBAAoB,CAAC,CAAC;;;;AAIrD;AAEA,OAAO,MAAMkC,QAAQ/C,cAAcG,YAAW"}
+{"version":3,"sources":["../../../src/fields/Email/index.tsx"],"sourcesContent":["'use client'\nimport type { EmailFieldProps, EmailFieldValidation } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback } from 'react'\n\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { FieldError } from '../FieldError/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\n\nconst EmailFieldComponent: React.FC<EmailFieldProps> = (props) => {\n  const {\n    autoComplete,\n    descriptionProps,\n    errorProps,\n    field,\n    field: {\n      name,\n      _path: pathFromProps,\n      admin: {\n        readOnly: readOnlyFromAdmin,\n\n        className,\n        description,\n        placeholder,\n        style,\n        width,\n      } = {} as EmailFieldProps['field']['admin'],\n      label,\n      required,\n    } = {} as EmailFieldProps['field'],\n    labelProps,\n    readOnly: readOnlyFromTopLevelProps,\n    validate,\n  } = props\n  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin\n\n  const { i18n } = useTranslation()\n\n  const memoizedValidate: EmailFieldValidation = useCallback(\n    (value, options) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, required })\n      }\n    },\n    [validate, required],\n  )\n\n  const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps()\n\n  const { formInitializing, formProcessing, path, setValue, showError, value } = useField({\n    path: pathFromContext ?? pathFromProps ?? name,\n    validate: memoizedValidate,\n  })\n\n  const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing\n\n  return (\n    <div\n      className={[fieldBaseClass, 'email', className, showError && 'error', disabled && 'read-only']\n        .filter(Boolean)\n        .join(' ')}\n      style={{\n        ...style,\n        width,\n      }}\n    >\n      <FieldLabel\n        Label={field?.admin?.components?.Label}\n        label={label}\n        required={required}\n        {...(labelProps || {})}\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <FieldError\n          CustomError={field?.admin?.components?.Error}\n          path={path}\n          {...(errorProps || {})}\n        />\n        <RenderComponent mappedComponent={field?.admin?.components?.beforeInput} />\n        {/* disable eslint here because the label is dynamic */}\n        {/* eslint-disable-next-line jsx-a11y/control-has-associated-label */}\n        <input\n          autoComplete={autoComplete}\n          disabled={disabled}\n          id={`field-${path.replace(/\\./g, '__')}`}\n          name={path}\n          onChange={setValue}\n          placeholder={getTranslation(placeholder, i18n)}\n          required={required}\n          type=\"email\"\n          value={(value as string) || ''}\n        />\n        <RenderComponent mappedComponent={field?.admin?.components?.afterInput} />\n      </div>\n      <FieldDescription\n        Description={field?.admin?.components?.Description}\n        description={description}\n        {...(descriptionProps || {})}\n      />\n    </div>\n  )\n}\n\nexport const EmailField = withCondition(EmailFieldComponent)\n"],"names":["getTranslation","React","useCallback","useFieldProps","useField","withCondition","RenderComponent","useTranslation","FieldDescription","FieldError","FieldLabel","fieldBaseClass","EmailFieldComponent","props","autoComplete","descriptionProps","errorProps","field","name","_path","pathFromProps","admin","readOnly","readOnlyFromAdmin","className","description","placeholder","style","width","label","required","labelProps","readOnlyFromTopLevelProps","validate","readOnlyFromProps","i18n","memoizedValidate","value","options","path","pathFromContext","readOnlyFromContext","formInitializing","formProcessing","setValue","showError","disabled","div","filter","Boolean","join","Label","components","CustomError","Error","mappedComponent","beforeInput","input","id","replace","onChange","type","afterInput","Description","EmailField"],"mappings":"AAAA;;AAGA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,SAASC,WAAW,QAAQ,QAAO;AAE1C,SAASC,aAAa,QAAQ,0CAAyC;AACvE,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,aAAa,QAAQ,qCAAoC;AAClE,SAASC,eAAe,QAAQ,4CAA2C;AAC3E,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,gBAAgB,QAAQ,+BAA8B;AAC/D,SAASC,UAAU,QAAQ,yBAAwB;AACnD,SAASC,UAAU,QAAQ,yBAAwB;AACnD,SAASC,cAAc,QAAQ,qBAAoB;AACnD,OAAO,eAAc;AAErB,MAAMC,sBAAiD,CAACC;IACtD,MAAM,EACJC,YAAY,EACZC,gBAAgB,EAChBC,UAAU,EACVC,KAAK,EACLA,OAAO,EACLC,IAAI,EACJC,OAAOC,aAAa,EACpBC,OAAO,EACLC,UAAUC,iBAAiB,EAE3BC,SAAS,EACTC,WAAW,EACXC,WAAW,EACXC,KAAK,EACLC,KAAK,EACN,GAAG,CAAC,CAAsC,EAC3CC,KAAK,EACLC,QAAQ,EACT,GAAG,CAAC,CAA6B,EAClCC,UAAU,EACVT,UAAUU,yBAAyB,EACnCC,QAAQ,EACT,GAAGpB;IACJ,MAAMqB,oBAAoBF,6BAA6BT;IAEvD,MAAM,EAAEY,IAAI,EAAE,GAAG5B;IAEjB,MAAM6B,mBAAyClC,YAC7C,CAACmC,OAAOC;QACN,IAAI,OAAOL,aAAa,YAAY;YAClC,OAAOA,SAASI,OAAO;gBAAE,GAAGC,OAAO;gBAAER;YAAS;QAChD;IACF,GACA;QAACG;QAAUH;KAAS;IAGtB,MAAM,EAAES,MAAMC,eAAe,EAAElB,UAAUmB,mBAAmB,EAAE,GAAGtC;IAEjE,MAAM,EAAEuC,gBAAgB,EAAEC,cAAc,EAAEJ,IAAI,EAAEK,QAAQ,EAAEC,SAAS,EAAER,KAAK,EAAE,GAAGjC,SAAS;QACtFmC,MAAMC,mBAAmBpB,iBAAiBF;QAC1Ce,UAAUG;IACZ;IAEA,MAAMU,WAAWZ,qBAAqBO,uBAAuBE,kBAAkBD;IAE/E,qBACE,MAACK;QACCvB,WAAW;YAACb;YAAgB;YAASa;YAAWqB,aAAa;YAASC,YAAY;SAAY,CAC3FE,MAAM,CAACC,SACPC,IAAI,CAAC;QACRvB,OAAO;YACL,GAAGA,KAAK;YACRC;QACF;;0BAEA,KAAClB;gBACCyC,OAAOlC,OAAOI,OAAO+B,YAAYD;gBACjCtB,OAAOA;gBACPC,UAAUA;gBACT,GAAIC,cAAc,CAAC,CAAC;;0BAEvB,MAACgB;gBAAIvB,WAAW,CAAC,EAAEb,eAAe,MAAM,CAAC;;kCACvC,KAACF;wBACC4C,aAAapC,OAAOI,OAAO+B,YAAYE;wBACvCf,MAAMA;wBACL,GAAIvB,cAAc,CAAC,CAAC;;kCAEvB,KAACV;wBAAgBiD,iBAAiBtC,OAAOI,OAAO+B,YAAYI;;kCAG5D,KAACC;wBACC3C,cAAcA;wBACdgC,UAAUA;wBACVY,IAAI,CAAC,MAAM,EAAEnB,KAAKoB,OAAO,CAAC,OAAO,MAAM,CAAC;wBACxCzC,MAAMqB;wBACNqB,UAAUhB;wBACVlB,aAAa1B,eAAe0B,aAAaS;wBACzCL,UAAUA;wBACV+B,MAAK;wBACLxB,OAAO,AAACA,SAAoB;;kCAE9B,KAAC/B;wBAAgBiD,iBAAiBtC,OAAOI,OAAO+B,YAAYU;;;;0BAE9D,KAACtD;gBACCuD,aAAa9C,OAAOI,OAAO+B,YAAYW;gBACvCtC,aAAaA;gBACZ,GAAIV,oBAAoB,CAAC,CAAC;;;;AAInC;AAEA,OAAO,MAAMiD,aAAa3D,cAAcO,qBAAoB"}

package/dist/fields/FieldDescription/index.d.ts

@@ -0,0 +1,5 @@
+import type { GenericDescriptionProps } from 'payload';
+import React from 'react';
+import './index.scss';
+export declare const FieldDescription: React.FC<GenericDescriptionProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/fields/FieldDescription/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/FieldDescription/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAGtD,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AA+BrB,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAQ9D,CAAA"}

package/dist/{forms → fields}/FieldDescription/index.js

@@ -2,8 +2,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React from 'react';
+import { useFieldProps } from '../../forms/FieldPropsProvider/index.js';
+import { RenderComponent } from '../../providers/Config/RenderComponent.js';
 import { useTranslation } from '../../providers/Translation/index.js';
-import { useFieldProps } from '../FieldPropsProvider/index.js';
+import './index.scss';
 const baseClass = 'field-description';
 const DefaultFieldDescription = (props)=>{
     const { className, description, marginPlacement } = props;
@@ -23,12 +25,15 @@ const DefaultFieldDescription = (props)=>{
     return null;
 };
 export const FieldDescription = (props)=>{
-    const { CustomDescription } = props;
-    if (CustomDescription !== undefined) {
-        return CustomDescription;
+    const { Description, ...rest } = props;
+    if (Description) {
+        return /*#__PURE__*/ _jsx(RenderComponent, {
+            clientProps: rest,
+            mappedComponent: Description
+        });
     }
     return /*#__PURE__*/ _jsx(DefaultFieldDescription, {
-        ...props
+        ...rest
     });
 };
 

package/dist/fields/FieldDescription/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/fields/FieldDescription/index.tsx"],"sourcesContent":["'use client'\nimport type { GenericDescriptionProps } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'field-description'\n\nconst DefaultFieldDescription: React.FC<GenericDescriptionProps> = (props) => {\n  const { className, description, marginPlacement } = props\n\n  const { path } = useFieldProps()\n\n  const { i18n } = useTranslation()\n\n  if (description) {\n    return (\n      <div\n        className={[\n          baseClass,\n          className,\n          `field-description-${path.replace(/\\./g, '__')}`,\n          marginPlacement && `${baseClass}--margin-${marginPlacement}`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n      >\n        {getTranslation(description, i18n)}\n      </div>\n    )\n  }\n\n  return null\n}\n\nexport const FieldDescription: React.FC<GenericDescriptionProps> = (props) => {\n  const { Description, ...rest } = props\n\n  if (Description) {\n    return <RenderComponent clientProps={rest} mappedComponent={Description} />\n  }\n\n  return <DefaultFieldDescription {...rest} />\n}\n"],"names":["getTranslation","React","useFieldProps","RenderComponent","useTranslation","baseClass","DefaultFieldDescription","props","className","description","marginPlacement","path","i18n","div","replace","filter","Boolean","join","FieldDescription","Description","rest","clientProps","mappedComponent"],"mappings":"AAAA;;AAGA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAEzB,SAASC,aAAa,QAAQ,0CAAyC;AACvE,SAASC,eAAe,QAAQ,4CAA2C;AAC3E,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,MAAMC,0BAA6D,CAACC;IAClE,MAAM,EAAEC,SAAS,EAAEC,WAAW,EAAEC,eAAe,EAAE,GAAGH;IAEpD,MAAM,EAAEI,IAAI,EAAE,GAAGT;IAEjB,MAAM,EAAEU,IAAI,EAAE,GAAGR;IAEjB,IAAIK,aAAa;QACf,qBACE,KAACI;YACCL,WAAW;gBACTH;gBACAG;gBACA,CAAC,kBAAkB,EAAEG,KAAKG,OAAO,CAAC,OAAO,MAAM,CAAC;gBAChDJ,mBAAmB,CAAC,EAAEL,UAAU,SAAS,EAAEK,gBAAgB,CAAC;aAC7D,CACEK,MAAM,CAACC,SACPC,IAAI,CAAC;sBAEPjB,eAAeS,aAAaG;;IAGnC;IAEA,OAAO;AACT;AAEA,OAAO,MAAMM,mBAAsD,CAACX;IAClE,MAAM,EAAEY,WAAW,EAAE,GAAGC,MAAM,GAAGb;IAEjC,IAAIY,aAAa;QACf,qBAAO,KAAChB;YAAgBkB,aAAaD;YAAME,iBAAiBH;;IAC9D;IAEA,qBAAO,KAACb;QAAyB,GAAGc,IAAI;;AAC1C,EAAC"}

package/dist/fields/FieldError/index.d.ts

@@ -0,0 +1,5 @@
+import type { GenericErrorProps } from 'payload';
+import React from 'react';
+import './index.scss';
+export declare const FieldError: React.FC<GenericErrorProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/fields/FieldError/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/FieldError/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,cAAc,CAAA;AAkCrB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAQlD,CAAA"}

package/dist/{forms → fields}/FieldError/index.js

@@ -2,13 +2,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { Tooltip } from '../../elements/Tooltip/index.js';
-import { useFieldProps } from '../FieldPropsProvider/index.js';
-import { useFormFields, useFormSubmitted } from '../Form/context.js';
+import { useFieldProps } from '../../forms/FieldPropsProvider/index.js';
+import { useFormFields, useFormSubmitted } from '../../forms/Form/context.js';
+import { RenderComponent } from '../../providers/Config/RenderComponent.js';
+import './index.scss';
 const baseClass = 'field-error';
 const DefaultFieldError = (props)=>{
     const { alignCaret = 'right', message: messageFromProps, path: pathFromProps, showError: showErrorFromProps } = props;
     const { path: pathFromContext } = useFieldProps();
-    const path = pathFromContext || pathFromProps;
+    const path = pathFromContext ?? pathFromProps;
     const hasSubmitted = useFormSubmitted();
     const field = useFormFields(([fields])=>fields && fields?.[path] || null);
     const { errorMessage, valid } = field || {};
@@ -26,12 +28,15 @@ const DefaultFieldError = (props)=>{
     return null;
 };
 export const FieldError = (props)=>{
-    const { CustomError } = props;
-    if (CustomError !== undefined) {
-        return CustomError;
+    const { CustomError, ...rest } = props;
+    if (CustomError) {
+        return /*#__PURE__*/ _jsx(RenderComponent, {
+            clientProps: rest,
+            mappedComponent: CustomError
+        });
     }
     return /*#__PURE__*/ _jsx(DefaultFieldError, {
-        ...props
+        ...rest
     });
 };
 

package/dist/fields/FieldError/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/fields/FieldError/index.tsx"],"sourcesContent":["'use client'\n\nimport type { GenericErrorProps } from 'payload'\n\nimport React from 'react'\n\nimport { Tooltip } from '../../elements/Tooltip/index.js'\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport { useFormFields, useFormSubmitted } from '../../forms/Form/context.js'\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\nimport './index.scss'\n\nconst baseClass = 'field-error'\n\nconst DefaultFieldError: React.FC<GenericErrorProps> = (props) => {\n  const {\n    alignCaret = 'right',\n    message: messageFromProps,\n    path: pathFromProps,\n    showError: showErrorFromProps,\n  } = props\n\n  const { path: pathFromContext } = useFieldProps()\n  const path = pathFromContext ?? pathFromProps\n\n  const hasSubmitted = useFormSubmitted()\n  const field = useFormFields(([fields]) => (fields && fields?.[path]) || null)\n\n  const { errorMessage, valid } = field || {}\n\n  const message = messageFromProps || errorMessage\n  const showMessage = showErrorFromProps || (hasSubmitted && valid === false)\n\n  if (showMessage && message?.length) {\n    return (\n      <Tooltip alignCaret={alignCaret} className={baseClass} delay={0} staticPositioning>\n        {message}\n      </Tooltip>\n    )\n  }\n\n  return null\n}\n\nexport const FieldError: React.FC<GenericErrorProps> = (props) => {\n  const { CustomError, ...rest } = props\n\n  if (CustomError) {\n    return <RenderComponent clientProps={rest} mappedComponent={CustomError} />\n  }\n\n  return <DefaultFieldError {...rest} />\n}\n"],"names":["React","Tooltip","useFieldProps","useFormFields","useFormSubmitted","RenderComponent","baseClass","DefaultFieldError","props","alignCaret","message","messageFromProps","path","pathFromProps","showError","showErrorFromProps","pathFromContext","hasSubmitted","field","fields","errorMessage","valid","showMessage","length","className","delay","staticPositioning","FieldError","CustomError","rest","clientProps","mappedComponent"],"mappings":"AAAA;;AAIA,OAAOA,WAAW,QAAO;AAEzB,SAASC,OAAO,QAAQ,kCAAiC;AACzD,SAASC,aAAa,QAAQ,0CAAyC;AACvE,SAASC,aAAa,EAAEC,gBAAgB,QAAQ,8BAA6B;AAC7E,SAASC,eAAe,QAAQ,4CAA2C;AAC3E,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,MAAMC,oBAAiD,CAACC;IACtD,MAAM,EACJC,aAAa,OAAO,EACpBC,SAASC,gBAAgB,EACzBC,MAAMC,aAAa,EACnBC,WAAWC,kBAAkB,EAC9B,GAAGP;IAEJ,MAAM,EAAEI,MAAMI,eAAe,EAAE,GAAGd;IAClC,MAAMU,OAAOI,mBAAmBH;IAEhC,MAAMI,eAAeb;IACrB,MAAMc,QAAQf,cAAc,CAAC,CAACgB,OAAO,GAAK,AAACA,UAAUA,QAAQ,CAACP,KAAK,IAAK;IAExE,MAAM,EAAEQ,YAAY,EAAEC,KAAK,EAAE,GAAGH,SAAS,CAAC;IAE1C,MAAMR,UAAUC,oBAAoBS;IACpC,MAAME,cAAcP,sBAAuBE,gBAAgBI,UAAU;IAErE,IAAIC,eAAeZ,SAASa,QAAQ;QAClC,qBACE,KAACtB;YAAQQ,YAAYA;YAAYe,WAAWlB;YAAWmB,OAAO;YAAGC,iBAAiB;sBAC/EhB;;IAGP;IAEA,OAAO;AACT;AAEA,OAAO,MAAMiB,aAA0C,CAACnB;IACtD,MAAM,EAAEoB,WAAW,EAAE,GAAGC,MAAM,GAAGrB;IAEjC,IAAIoB,aAAa;QACf,qBAAO,KAACvB;YAAgByB,aAAaD;YAAME,iBAAiBH;;IAC9D;IAEA,qBAAO,KAACrB;QAAmB,GAAGsB,IAAI;;AACpC,EAAC"}

package/dist/fields/FieldError/index.scss

@@ -0,0 +1,16 @@
+@import '../../scss/styles';
+
+.field-error.tooltip {
+  font-family: var(--font-body);
+  left: auto;
+  max-width: 75%;
+  right: 0;
+  transform: translateY(calc(var(--caret-size) * -1));
+  color: var(--theme-error-950);
+  background-color: var(--theme-error-300);
+
+  &::after {
+    border-top-color: var(--theme-error-300);
+    border-bottom-color: var(--theme-error-300);
+  }
+}

package/dist/fields/FieldLabel/index.d.ts

@@ -0,0 +1,5 @@
+import type { GenericLabelProps } from 'payload';
+import React from 'react';
+import './index.scss';
+export declare const FieldLabel: React.FC<GenericLabelProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/fields/FieldLabel/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/FieldLabel/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAGhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,OAAO,cAAc,CAAA;AA8BrB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAQlD,CAAA"}

package/dist/{forms → fields}/FieldLabel/index.js

@@ -2,11 +2,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React from 'react';
+import { useFieldProps } from '../../forms/FieldPropsProvider/index.js';
+import { useForm } from '../../forms/Form/context.js';
+import { RenderComponent } from '../../providers/Config/RenderComponent.js';
 import { useEditDepth } from '../../providers/EditDepth/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { generateFieldID } from '../../utilities/generateFieldID.js';
-import { useFieldProps } from '../FieldPropsProvider/index.js';
-import { useForm } from '../Form/context.js';
+import './index.scss';
 const DefaultFieldLabel = (props)=>{
     const { as: Element = 'label', htmlFor: htmlForFromProps, label: labelFromProps, required = false, unstyled = false } = props;
     const { uuid } = useForm();
@@ -30,12 +32,15 @@ const DefaultFieldLabel = (props)=>{
     return null;
 };
 export const FieldLabel = (props)=>{
-    const { CustomLabel } = props;
-    if (CustomLabel !== undefined) {
-        return CustomLabel;
+    const { Label, ...rest } = props;
+    if (Label) {
+        return /*#__PURE__*/ _jsx(RenderComponent, {
+            clientProps: rest,
+            mappedComponent: Label
+        });
     }
     return /*#__PURE__*/ _jsx(DefaultFieldLabel, {
-        ...props
+        ...rest
     });
 };
 

package/dist/fields/FieldLabel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/fields/FieldLabel/index.tsx"],"sourcesContent":["'use client'\n\nimport type { GenericLabelProps } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport { useForm } from '../../forms/Form/context.js'\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { generateFieldID } from '../../utilities/generateFieldID.js'\nimport './index.scss'\n\nconst DefaultFieldLabel: React.FC<GenericLabelProps> = (props) => {\n  const {\n    as: Element = 'label',\n    htmlFor: htmlForFromProps,\n    label: labelFromProps,\n    required = false,\n    unstyled = false,\n  } = props\n\n  const { uuid } = useForm()\n  const { path } = useFieldProps()\n  const editDepth = useEditDepth()\n  const htmlFor = htmlForFromProps || generateFieldID(path, editDepth, uuid)\n\n  const { i18n } = useTranslation()\n\n  if (labelFromProps) {\n    return (\n      <Element className={`field-label ${unstyled ? 'unstyled' : ''}`} htmlFor={htmlFor}>\n        {getTranslation(labelFromProps, i18n)}\n        {required && !unstyled && <span className=\"required\">*</span>}\n      </Element>\n    )\n  }\n\n  return null\n}\n\nexport const FieldLabel: React.FC<GenericLabelProps> = (props) => {\n  const { Label, ...rest } = props\n\n  if (Label) {\n    return <RenderComponent clientProps={rest} mappedComponent={Label} />\n  }\n\n  return <DefaultFieldLabel {...rest} />\n}\n"],"names":["getTranslation","React","useFieldProps","useForm","RenderComponent","useEditDepth","useTranslation","generateFieldID","DefaultFieldLabel","props","as","Element","htmlFor","htmlForFromProps","label","labelFromProps","required","unstyled","uuid","path","editDepth","i18n","className","span","FieldLabel","Label","rest","clientProps","mappedComponent"],"mappings":"AAAA;;AAIA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAEzB,SAASC,aAAa,QAAQ,0CAAyC;AACvE,SAASC,OAAO,QAAQ,8BAA6B;AACrD,SAASC,eAAe,QAAQ,4CAA2C;AAC3E,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,eAAe,QAAQ,qCAAoC;AACpE,OAAO,eAAc;AAErB,MAAMC,oBAAiD,CAACC;IACtD,MAAM,EACJC,IAAIC,UAAU,OAAO,EACrBC,SAASC,gBAAgB,EACzBC,OAAOC,cAAc,EACrBC,WAAW,KAAK,EAChBC,WAAW,KAAK,EACjB,GAAGR;IAEJ,MAAM,EAAES,IAAI,EAAE,GAAGf;IACjB,MAAM,EAAEgB,IAAI,EAAE,GAAGjB;IACjB,MAAMkB,YAAYf;IAClB,MAAMO,UAAUC,oBAAoBN,gBAAgBY,MAAMC,WAAWF;IAErE,MAAM,EAAEG,IAAI,EAAE,GAAGf;IAEjB,IAAIS,gBAAgB;QAClB,qBACE,MAACJ;YAAQW,WAAW,CAAC,YAAY,EAAEL,WAAW,aAAa,GAAG,CAAC;YAAEL,SAASA;;gBACvEZ,eAAee,gBAAgBM;gBAC/BL,YAAY,CAACC,0BAAY,KAACM;oBAAKD,WAAU;8BAAW;;;;IAG3D;IAEA,OAAO;AACT;AAEA,OAAO,MAAME,aAA0C,CAACf;IACtD,MAAM,EAAEgB,KAAK,EAAE,GAAGC,MAAM,GAAGjB;IAE3B,IAAIgB,OAAO;QACT,qBAAO,KAACrB;YAAgBuB,aAAaD;YAAME,iBAAiBH;;IAC9D;IAEA,qBAAO,KAACjB;QAAmB,GAAGkB,IAAI;;AACpC,EAAC"}

package/dist/fields/Group/index.d.ts

@@ -1,17 +1,8 @@
-import type { FieldPermissions } from 'payload/auth';
+import type { GroupFieldProps } from 'payload';
 import React from 'react';
-import type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js';
-import type { FormFieldBase } from '../shared/index.js';
 import './index.scss';
 import { GroupProvider, useGroup } from './provider.js';
-export type GroupFieldProps = FormFieldBase & {
-    fieldMap: FieldMap;
-    forceRender?: boolean;
-    hideGutter?: boolean;
-    name?: string;
-    permissions: FieldPermissions;
-    width?: string;
-};
+export declare const GroupFieldComponent: React.FC<GroupFieldProps>;
 export { GroupProvider, useGroup };
-export declare const Group: React.FC<GroupFieldProps>;
+export declare const GroupField: React.FC<GroupFieldProps>;
 //# sourceMappingURL=index.d.ts.map

package/dist/fields/Group/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Group/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAGpD,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yDAAyD,CAAA;AACvF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAkBvD,OAAO,cAAc,CAAA;AACrB,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAIvD,MAAM,MAAM,eAAe,GAAG,aAAa,GAAG;IAC5C,QAAQ,EAAE,QAAQ,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,gBAAgB,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAyFD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,CAAA;AAElC,eAAO,MAAM,KAAK,2BAA4B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Group/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAG9C,OAAO,KAAK,MAAM,OAAO,CAAA;AAmBzB,OAAO,cAAc,CAAA;AACrB,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAIvD,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAuFzD,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,CAAA;AAElC,eAAO,MAAM,UAAU,2BAAqC,CAAA"}

package/dist/fields/Group/index.js

@@ -1,23 +1,26 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import React, { Fragment } from 'react';
+import React from 'react';
 import { useCollapsible } from '../../elements/Collapsible/provider.js';
 import { ErrorPill } from '../../elements/ErrorPill/index.js';
-import { FieldDescription } from '../../forms/FieldDescription/index.js';
 import { useFieldProps } from '../../forms/FieldPropsProvider/index.js';
 import { useFormInitializing, useFormProcessing, useFormSubmitted } from '../../forms/Form/context.js';
 import { RenderFields } from '../../forms/RenderFields/index.js';
 import { useField } from '../../forms/useField/index.js';
 import { withCondition } from '../../forms/withCondition/index.js';
+import { RenderComponent } from '../../providers/Config/RenderComponent.js';
 import { useTranslation } from '../../providers/Translation/index.js';
+import { FieldDescription } from '../FieldDescription/index.js';
 import { useRow } from '../Row/provider.js';
 import { useTabs } from '../Tabs/provider.js';
 import { fieldBaseClass } from '../shared/index.js';
+import './index.scss';
 import { GroupProvider, useGroup } from './provider.js';
 const baseClass = 'group-field';
-const GroupField = (props)=>{
-    const { CustomDescription, CustomLabel, className, descriptionProps, fieldMap, hideGutter, label, readOnly: readOnlyFromProps, style, width } = props;
+export const GroupFieldComponent = (props)=>{
+    const { descriptionProps, field, field: { admin: { className, description, hideGutter, readOnly: readOnlyFromAdmin, style, width } = {}, fields, label }, readOnly: readOnlyFromTopLevelProps } = props;
+    const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin;
     const { path, permissions, readOnly: readOnlyFromContext, schemaPath } = useFieldProps();
     const { i18n } = useTranslation();
     const { isWithinCollapsible } = useCollapsible();
@@ -34,65 +37,70 @@ const GroupField = (props)=>{
     const fieldHasErrors = submitted && errorCount > 0;
     const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing;
     const isTopLevel = !(isWithinCollapsible || isWithinGroup || isWithinRow);
-    return /*#__PURE__*/ _jsx(Fragment, {
-        children: /*#__PURE__*/ _jsx("div", {
-            className: [
-                fieldBaseClass,
-                baseClass,
-                isTopLevel && `${baseClass}--top-level`,
-                isWithinCollapsible && `${baseClass}--within-collapsible`,
-                isWithinGroup && `${baseClass}--within-group`,
-                isWithinRow && `${baseClass}--within-row`,
-                isWithinTab && `${baseClass}--within-tab`,
-                !hideGutter && isWithinGroup && `${baseClass}--gutter`,
-                fieldHasErrors && `${baseClass}--has-error`,
-                className
-            ].filter(Boolean).join(' '),
-            id: `field-${path?.replace(/\./g, '__')}`,
-            style: {
-                ...style,
-                width
-            },
-            children: /*#__PURE__*/ _jsx(GroupProvider, {
-                children: /*#__PURE__*/ _jsxs("div", {
-                    className: `${baseClass}__wrap`,
-                    children: [
-                        /*#__PURE__*/ _jsxs("div", {
-                            className: `${baseClass}__header`,
-                            children: [
-                                (CustomLabel || CustomDescription || label) && /*#__PURE__*/ _jsxs("header", {
-                                    children: [
-                                        CustomLabel !== undefined ? CustomLabel : label ? /*#__PURE__*/ _jsx("h3", {
-                                            className: `${baseClass}__title`,
-                                            children: getTranslation(label, i18n)
-                                        }) : null,
-                                        CustomDescription !== undefined ? CustomDescription : /*#__PURE__*/ _jsx(FieldDescription, {
-                                            ...descriptionProps || {}
-                                        })
-                                    ]
-                                }),
-                                fieldHasErrors && /*#__PURE__*/ _jsx(ErrorPill, {
-                                    count: errorCount,
-                                    i18n: i18n,
-                                    withMessage: true
-                                })
-                            ]
-                        }),
-                        /*#__PURE__*/ _jsx(RenderFields, {
-                            fieldMap: fieldMap,
-                            margins: "small",
-                            path: path,
-                            permissions: permissions?.fields,
-                            readOnly: disabled,
-                            schemaPath: schemaPath
-                        })
-                    ]
-                })
+    return /*#__PURE__*/ _jsx("div", {
+        className: [
+            fieldBaseClass,
+            baseClass,
+            isTopLevel && `${baseClass}--top-level`,
+            isWithinCollapsible && `${baseClass}--within-collapsible`,
+            isWithinGroup && `${baseClass}--within-group`,
+            isWithinRow && `${baseClass}--within-row`,
+            isWithinTab && `${baseClass}--within-tab`,
+            !hideGutter && isWithinGroup && `${baseClass}--gutter`,
+            fieldHasErrors && `${baseClass}--has-error`,
+            className
+        ].filter(Boolean).join(' '),
+        id: `field-${path?.replace(/\./g, '__')}`,
+        style: {
+            ...style,
+            width
+        },
+        children: /*#__PURE__*/ _jsx(GroupProvider, {
+            children: /*#__PURE__*/ _jsxs("div", {
+                className: `${baseClass}__wrap`,
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: `${baseClass}__header`,
+                        children: [
+                            (field?.admin?.components?.Label || field?.admin?.components?.Description || label) && /*#__PURE__*/ _jsxs("header", {
+                                children: [
+                                    field?.admin?.components?.Label !== undefined ? /*#__PURE__*/ _jsx(RenderComponent, {
+                                        clientProps: {
+                                            label
+                                        },
+                                        mappedComponent: field?.admin?.components?.Label
+                                    }) : label ? /*#__PURE__*/ _jsx("h3", {
+                                        className: `${baseClass}__title`,
+                                        children: getTranslation(label, i18n)
+                                    }) : null,
+                                    /*#__PURE__*/ _jsx(FieldDescription, {
+                                        Description: field?.admin?.components?.Description,
+                                        description: description,
+                                        ...descriptionProps || {}
+                                    })
+                                ]
+                            }),
+                            fieldHasErrors && /*#__PURE__*/ _jsx(ErrorPill, {
+                                count: errorCount,
+                                i18n: i18n,
+                                withMessage: true
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx(RenderFields, {
+                        fields: fields,
+                        margins: "small",
+                        path: path,
+                        permissions: permissions?.fields,
+                        readOnly: disabled,
+                        schemaPath: schemaPath
+                    })
+                ]
             })
         })
     });
 };
 export { GroupProvider, useGroup };
-export const Group = withCondition(GroupField);
+export const GroupField = withCondition(GroupFieldComponent);
 
 //# sourceMappingURL=index.js.map

package/dist/fields/Group/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Group/index.tsx"],"sourcesContent":["'use client'\nimport type { FieldPermissions } from 'payload/auth'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { Fragment } from 'react'\n\nimport type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js'\nimport type { FormFieldBase } from '../shared/index.js'\n\nimport { useCollapsible } from '../../elements/Collapsible/provider.js'\nimport { ErrorPill } from '../../elements/ErrorPill/index.js'\nimport { FieldDescription } from '../../forms/FieldDescription/index.js'\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport {\n  useFormInitializing,\n  useFormProcessing,\n  useFormSubmitted,\n} from '../../forms/Form/context.js'\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { useRow } from '../Row/provider.js'\nimport { useTabs } from '../Tabs/provider.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\nimport { GroupProvider, useGroup } from './provider.js'\n\nconst baseClass = 'group-field'\n\nexport type GroupFieldProps = FormFieldBase & {\n  fieldMap: FieldMap\n  forceRender?: boolean\n  hideGutter?: boolean\n  name?: string\n  permissions: FieldPermissions\n  width?: string\n}\n\nconst GroupField: React.FC<GroupFieldProps> = (props) => {\n  const {\n    CustomDescription,\n    CustomLabel,\n    className,\n    descriptionProps,\n    fieldMap,\n    hideGutter,\n    label,\n    readOnly: readOnlyFromProps,\n    style,\n    width,\n  } = props\n\n  const { path, permissions, readOnly: readOnlyFromContext, schemaPath } = useFieldProps()\n  const { i18n } = useTranslation()\n  const { isWithinCollapsible } = useCollapsible()\n  const isWithinGroup = useGroup()\n  const isWithinRow = useRow()\n  const isWithinTab = useTabs()\n  const { errorPaths } = useField({ path })\n  const formInitializing = useFormInitializing()\n  const formProcessing = useFormProcessing()\n  const submitted = useFormSubmitted()\n  const errorCount = errorPaths.length\n  const fieldHasErrors = submitted && errorCount > 0\n  const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing\n\n  const isTopLevel = !(isWithinCollapsible || isWithinGroup || isWithinRow)\n\n  return (\n    <Fragment>\n      <div\n        className={[\n          fieldBaseClass,\n          baseClass,\n          isTopLevel && `${baseClass}--top-level`,\n          isWithinCollapsible && `${baseClass}--within-collapsible`,\n          isWithinGroup && `${baseClass}--within-group`,\n          isWithinRow && `${baseClass}--within-row`,\n          isWithinTab && `${baseClass}--within-tab`,\n          !hideGutter && isWithinGroup && `${baseClass}--gutter`,\n          fieldHasErrors && `${baseClass}--has-error`,\n          className,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        id={`field-${path?.replace(/\\./g, '__')}`}\n        style={{\n          ...style,\n          width,\n        }}\n      >\n        <GroupProvider>\n          <div className={`${baseClass}__wrap`}>\n            <div className={`${baseClass}__header`}>\n              {(CustomLabel || CustomDescription || label) && (\n                <header>\n                  {CustomLabel !== undefined ? (\n                    CustomLabel\n                  ) : label ? (\n                    <h3 className={`${baseClass}__title`}>{getTranslation(label, i18n)}</h3>\n                  ) : null}\n                  {CustomDescription !== undefined ? (\n                    CustomDescription\n                  ) : (\n                    <FieldDescription {...(descriptionProps || {})} />\n                  )}\n                </header>\n              )}\n              {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} withMessage />}\n            </div>\n            <RenderFields\n              fieldMap={fieldMap}\n              margins=\"small\"\n              path={path}\n              permissions={permissions?.fields}\n              readOnly={disabled}\n              schemaPath={schemaPath}\n            />\n          </div>\n        </GroupProvider>\n      </div>\n    </Fragment>\n  )\n}\n\nexport { GroupProvider, useGroup }\n\nexport const Group = withCondition(GroupField)\n"],"names":["getTranslation","React","Fragment","useCollapsible","ErrorPill","FieldDescription","useFieldProps","useFormInitializing","useFormProcessing","useFormSubmitted","RenderFields","useField","withCondition","useTranslation","useRow","useTabs","fieldBaseClass","GroupProvider","useGroup","baseClass","GroupField","props","CustomDescription","CustomLabel","className","descriptionProps","fieldMap","hideGutter","label","readOnly","readOnlyFromProps","style","width","path","permissions","readOnlyFromContext","schemaPath","i18n","isWithinCollapsible","isWithinGroup","isWithinRow","isWithinTab","errorPaths","formInitializing","formProcessing","submitted","errorCount","length","fieldHasErrors","disabled","isTopLevel","div","filter","Boolean","join","id","replace","header","undefined","h3","count","withMessage","margins","fields","Group"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/fields/Group/index.tsx"],"sourcesContent":["'use client'\n\nimport type { GroupFieldProps } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { useCollapsible } from '../../elements/Collapsible/provider.js'\nimport { ErrorPill } from '../../elements/ErrorPill/index.js'\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport {\n  useFormInitializing,\n  useFormProcessing,\n  useFormSubmitted,\n} from '../../forms/Form/context.js'\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { useRow } from '../Row/provider.js'\nimport { useTabs } from '../Tabs/provider.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.scss'\nimport { GroupProvider, useGroup } from './provider.js'\n\nconst baseClass = 'group-field'\n\nexport const GroupFieldComponent: React.FC<GroupFieldProps> = (props) => {\n  const {\n    descriptionProps,\n    field,\n    field: {\n      admin: { className, description, hideGutter, readOnly: readOnlyFromAdmin, style, width } = {},\n      fields,\n      label,\n    },\n    readOnly: readOnlyFromTopLevelProps,\n  } = props\n  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin\n\n  const { path, permissions, readOnly: readOnlyFromContext, schemaPath } = useFieldProps()\n  const { i18n } = useTranslation()\n  const { isWithinCollapsible } = useCollapsible()\n  const isWithinGroup = useGroup()\n  const isWithinRow = useRow()\n  const isWithinTab = useTabs()\n  const { errorPaths } = useField({ path })\n  const formInitializing = useFormInitializing()\n  const formProcessing = useFormProcessing()\n  const submitted = useFormSubmitted()\n  const errorCount = errorPaths.length\n  const fieldHasErrors = submitted && errorCount > 0\n  const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing\n\n  const isTopLevel = !(isWithinCollapsible || isWithinGroup || isWithinRow)\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        baseClass,\n        isTopLevel && `${baseClass}--top-level`,\n        isWithinCollapsible && `${baseClass}--within-collapsible`,\n        isWithinGroup && `${baseClass}--within-group`,\n        isWithinRow && `${baseClass}--within-row`,\n        isWithinTab && `${baseClass}--within-tab`,\n        !hideGutter && isWithinGroup && `${baseClass}--gutter`,\n        fieldHasErrors && `${baseClass}--has-error`,\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      id={`field-${path?.replace(/\\./g, '__')}`}\n      style={{\n        ...style,\n        width,\n      }}\n    >\n      <GroupProvider>\n        <div className={`${baseClass}__wrap`}>\n          <div className={`${baseClass}__header`}>\n            {(field?.admin?.components?.Label ||\n              field?.admin?.components?.Description ||\n              label) && (\n              <header>\n                {field?.admin?.components?.Label !== undefined ? (\n                  <RenderComponent\n                    clientProps={{ label }}\n                    mappedComponent={field?.admin?.components?.Label}\n                  />\n                ) : label ? (\n                  <h3 className={`${baseClass}__title`}>{getTranslation(label, i18n)}</h3>\n                ) : null}\n                <FieldDescription\n                  Description={field?.admin?.components?.Description}\n                  description={description}\n                  {...(descriptionProps || {})}\n                />\n              </header>\n            )}\n            {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} withMessage />}\n          </div>\n          <RenderFields\n            fields={fields}\n            margins=\"small\"\n            path={path}\n            permissions={permissions?.fields}\n            readOnly={disabled}\n            schemaPath={schemaPath}\n          />\n        </div>\n      </GroupProvider>\n    </div>\n  )\n}\n\nexport { GroupProvider, useGroup }\n\nexport const GroupField = withCondition(GroupFieldComponent)\n"],"names":["getTranslation","React","useCollapsible","ErrorPill","useFieldProps","useFormInitializing","useFormProcessing","useFormSubmitted","RenderFields","useField","withCondition","RenderComponent","useTranslation","FieldDescription","useRow","useTabs","fieldBaseClass","GroupProvider","useGroup","baseClass","GroupFieldComponent","props","descriptionProps","field","admin","className","description","hideGutter","readOnly","readOnlyFromAdmin","style","width","fields","label","readOnlyFromTopLevelProps","readOnlyFromProps","path","permissions","readOnlyFromContext","schemaPath","i18n","isWithinCollapsible","isWithinGroup","isWithinRow","isWithinTab","errorPaths","formInitializing","formProcessing","submitted","errorCount","length","fieldHasErrors","disabled","isTopLevel","div","filter","Boolean","join","id","replace","components","Label","Description","header","undefined","clientProps","mappedComponent","h3","count","withMessage","margins","GroupField"],"mappings":"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"}

package/dist/fields/Group/provider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Group/provider.tsx"],"sourcesContent":["'use client'\nimport React, { createContext, useContext } from 'react'\n\nexport const GroupContext = createContext(false)\n\nexport const GroupProvider: React.FC<{ children?: React.ReactNode; withinGroup?: boolean }> = ({\n  children,\n  withinGroup = true,\n}) => {\n  return <GroupContext.Provider value={withinGroup}>{children}</GroupContext.Provider>\n}\n\nexport const useGroup = (): boolean => useContext(GroupContext)\n"],"names":["React","createContext","useContext","GroupContext","GroupProvider","children","withinGroup","Provider","value","useGroup"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,SAASC,aAAa,EAAEC,UAAU,QAAQ,QAAO;AAExD,OAAO,MAAMC,6BAAeF,cAAc,OAAM;AAEhD,OAAO,MAAMG,gBAAiF,CAAC,EAC7FC,QAAQ,EACRC,cAAc,IAAI,EACnB;IACC,qBAAO,KAACH,aAAaI,QAAQ;QAACC,OAAOF;kBAAcD;;AACrD,EAAC;AAED,OAAO,MAAMI,WAAW,IAAeP,WAAWC,cAAa"}
+{"version":3,"sources":["../../../src/fields/Group/provider.tsx"],"sourcesContent":["'use client'\nimport React, { createContext, useContext } from 'react'\n\nexport const GroupContext = createContext(false)\n\nexport const GroupProvider: React.FC<{ children?: React.ReactNode; withinGroup?: boolean }> = ({\n  children,\n  withinGroup = true,\n}) => {\n  return <GroupContext.Provider value={withinGroup}>{children}</GroupContext.Provider>\n}\n\nexport const useGroup = (): boolean => useContext(GroupContext)\n"],"names":["React","createContext","useContext","GroupContext","GroupProvider","children","withinGroup","Provider","value","useGroup"],"mappings":"AAAA;;AACA,OAAOA,SAASC,aAAa,EAAEC,UAAU,QAAQ,QAAO;AAExD,OAAO,MAAMC,6BAAeF,cAAc,OAAM;AAEhD,OAAO,MAAMG,gBAAiF,CAAC,EAC7FC,QAAQ,EACRC,cAAc,IAAI,EACnB;IACC,qBAAO,KAACH,aAAaI,QAAQ;QAACC,OAAOF;kBAAcD;;AACrD,EAAC;AAED,OAAO,MAAMI,WAAW,IAAeP,WAAWC,cAAa"}

package/dist/fields/Hidden/index.d.ts

@@ -0,0 +1,4 @@
+import type { HiddenFieldProps } from 'payload';
+import React from 'react';
+export declare const HiddenField: React.FC<HiddenFieldProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/fields/Hidden/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Hidden/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE/C,OAAO,KAAoB,MAAM,OAAO,CAAA;AAyCxC,eAAO,MAAM,WAAW,4BAAsC,CAAA"}

package/dist/fields/{HiddenInput → Hidden}/index.js

@@ -7,8 +7,8 @@ import { withCondition } from '../../forms/withCondition/index.js';
 /**
  * This is mainly used to save a value on the form that is not visible to the user.
  * For example, this sets the `ìd` property of a block in the Blocks field.
- */ const HiddenInputField = (props)=>{
-    const { name, disableModifyingForm = true, forceUsePathFromProps, path: pathFromProps, value: valueFromProps } = props;
+ */ const HiddenFieldComponent = (props)=>{
+    const { disableModifyingForm = true, field: { name, _path: pathFromProps }, forceUsePathFromProps, value: valueFromProps } = props;
     const { path: pathFromContext } = useFieldProps();
     const { path, setValue, value } = useField({
         path: (!forceUsePathFromProps ? pathFromContext : null) || pathFromProps || name
@@ -30,6 +30,6 @@ import { withCondition } from '../../forms/withCondition/index.js';
         value: value || ''
     });
 };
-export const HiddenInput = withCondition(HiddenInputField);
+export const HiddenField = withCondition(HiddenFieldComponent);
 
 //# sourceMappingURL=index.js.map