@payloadcms/ui 3.0.0-canary.92e4997 → 3.0.0-canary.95fcd13

package/dist/providers/ComponentMap/buildComponentMap/fields.js

@@ -1,81 +1,72 @@
-import { FieldDescription } from '@payloadcms/ui/forms/FieldDescription';
-import { fieldAffectsData, fieldIsPresentationalOnly } from 'payload/types';
-import { isPlainFunction, isReactComponent } from 'payload/utilities';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { MissingEditorProp } from 'payload';
+import { fieldAffectsData, fieldIsPresentationalOnly } from 'payload/shared';
 import React, { Fragment } from 'react';
-import { HiddenInput } from '../../../fields/HiddenInput/index.js';
+// eslint-disable-next-line payload/no-imports-from-exports-dir
+import { FieldDescription, HiddenField } from '../../../exports/client/index.js';
+function generateFieldPath(parentPath, name) {
+    let tabPath = parentPath || '';
+    if (parentPath && name) {
+        tabPath = `${parentPath}.${name}`;
+    } else if (!parentPath && name) {
+        tabPath = name;
+    }
+    return tabPath;
+}
 export const mapFields = (args)=>{
     const { WithServerSideProps, config, disableAddingID, fieldSchema, filter, i18n, i18n: { t }, parentPath, readOnly: readOnlyOverride } = args;
     const result = fieldSchema.reduce((acc, field)=>{
         const fieldIsPresentational = fieldIsPresentationalOnly(field);
         let CustomFieldComponent = field.admin?.components?.Field;
-        const CustomCellComponent = field.admin?.components?.Cell;
+        let CustomCellComponent = field.admin?.components?.Cell;
         const isHidden = field?.admin && 'hidden' in field.admin && field.admin.hidden;
         if (fieldIsPresentational || !field?.hidden && field?.admin?.disabled !== true) {
             if (filter && typeof filter === 'function' && filter(field) || !filter) {
                 if (isHidden) {
                     if (CustomFieldComponent) {
-                        CustomFieldComponent = HiddenInput;
+                        CustomFieldComponent = HiddenField;
                     }
                 }
                 const isFieldAffectingData = fieldAffectsData(field);
-                const path = `${parentPath ? `${parentPath}.` : ''}${field.path || (isFieldAffectingData && 'name' in field ? field.name : '')}`;
-                const AfterInput = 'admin' in field && 'components' in field.admin && 'afterInput' in field.admin.components && Array.isArray(field.admin?.components?.afterInput) && /*#__PURE__*/ React.createElement(Fragment, null, field.admin.components.afterInput.map((Component, i)=>/*#__PURE__*/ React.createElement(WithServerSideProps, {
-                        Component: Component,
-                        key: i
-                    }))) || null;
-                const BeforeInput = 'admin' in field && field.admin?.components && 'beforeInput' in field.admin.components && Array.isArray(field.admin.components.beforeInput) && /*#__PURE__*/ React.createElement(Fragment, null, field.admin.components.beforeInput.map((Component, i)=>/*#__PURE__*/ React.createElement(WithServerSideProps, {
-                        Component: Component,
-                        key: i
-                    }))) || null;
-                const labelProps = {
-                    label: 'label' in field && !isPlainFunction(field.label) && !isReactComponent(field.label) ? field.label : undefined,
-                    required: 'required' in field ? field.required : undefined
-                };
-                const CustomLabelComponent = 'admin' in field && field.admin?.components && 'Label' in field.admin.components && field.admin.components?.Label || undefined;
-                const CustomLabel = CustomLabelComponent !== undefined ? /*#__PURE__*/ React.createElement(WithServerSideProps, {
-                    Component: CustomLabelComponent,
-                    ...labelProps || {}
-                }) : undefined;
-                const descriptionProps = {
-                    description: field.admin && 'description' in field.admin && ((typeof field.admin?.description === 'string' || typeof field.admin?.description === 'object') && field.admin.description || typeof field.admin?.description === 'function' && isPlainFunction(field.admin?.description) && field.admin?.description({
-                        t
-                    })) || undefined
-                };
-                const CustomDescriptionComponent = field.admin && 'description' in field.admin && (isReactComponent(field.admin.description) && field.admin.description || field.admin.description && FieldDescription) || undefined;
-                const CustomDescription = CustomDescriptionComponent !== undefined ? /*#__PURE__*/ React.createElement(WithServerSideProps, {
-                    Component: CustomDescriptionComponent,
-                    ...descriptionProps || {}
-                }) : undefined;
-                const errorProps = {
-                    path
-                };
-                const CustomErrorComponent = 'admin' in field && field.admin?.components && 'Error' in field.admin.components && field.admin?.components?.Error || undefined;
-                const CustomError = CustomErrorComponent !== undefined ? /*#__PURE__*/ React.createElement(WithServerSideProps, {
-                    Component: CustomErrorComponent,
-                    ...errorProps || {}
-                }) : undefined;
+                const path = generateFieldPath(parentPath, isFieldAffectingData && 'name' in field ? field.name : '');
+                const AfterInput = 'admin' in field && 'components' in field.admin && 'afterInput' in field.admin.components && Array.isArray(field.admin?.components?.afterInput) && /*#__PURE__*/ _jsx(Fragment, {
+                    children: field.admin.components.afterInput.map((Component, i)=>/*#__PURE__*/ _jsx(WithServerSideProps, {
+                            Component: Component
+                        }, i))
+                }) || null;
+                const BeforeInput = 'admin' in field && field.admin?.components && 'beforeInput' in field.admin.components && Array.isArray(field.admin.components.beforeInput) && /*#__PURE__*/ _jsx(Fragment, {
+                    children: field.admin.components.beforeInput.map((Component, i)=>/*#__PURE__*/ _jsx(WithServerSideProps, {
+                            Component: Component
+                        }, i))
+                }) || null;
+                let label = undefined;
+                if ('label' in field) {
+                    if (typeof field.label === 'string' || typeof field.label === 'object') {
+                        label = field.label;
+                    } else if (typeof field.label === 'function') {
+                        label = field.label({
+                            t
+                        });
+                    }
+                }
+                // These fields are shared across all field types even if they are not used in the default field, as the custom field component can use them
                 const baseFieldProps = {
                     AfterInput,
                     BeforeInput,
-                    CustomDescription,
-                    CustomError,
-                    CustomLabel,
                     custom: 'admin' in field && 'custom' in field.admin ? field.admin?.custom : undefined,
-                    descriptionProps,
                     disabled: 'admin' in field && 'disabled' in field.admin ? field.admin?.disabled : false,
-                    errorProps,
-                    labelProps,
+                    label,
                     path,
                     required: 'required' in field ? field.required : undefined
                 };
-                let fieldComponentProps;
+                let fieldComponentPropsBase;
                 let fieldOptions;
                 if ('options' in field) {
                     fieldOptions = field.options.map((option)=>{
                         if (typeof option === 'object' && typeof option.label === 'function') {
                             return {
                                 label: option.label({
-                                    t: i18n.t
+                                    t
                                 }),
                                 value: option.value
                             };
@@ -87,25 +78,18 @@ export const mapFields = (args)=>{
                     name: 'name' in field ? field.name : undefined,
                     fieldType: field.type,
                     isFieldAffectingData,
-                    label: 'label' in field && field.label && typeof field.label !== 'function' ? field.label : undefined,
+                    label,
                     labels: 'labels' in field ? field.labels : undefined,
                     options: 'options' in field ? fieldOptions : undefined,
-                    relationTo: 'relationTo' in field ? field.relationTo : undefined
+                    relationTo: 'relationTo' in field ? field.relationTo : undefined,
+                    schemaPath: path
                 };
                 switch(field.type){
                     case 'array':
                         {
-                            let CustomRowLabel;
-                            if ('admin' in field && field.admin.components && 'RowLabel' in field.admin.components && field.admin.components.RowLabel && isReactComponent(field.admin.components.RowLabel)) {
-                                const CustomRowLabelComponent = field.admin.components.RowLabel;
-                                CustomRowLabel = /*#__PURE__*/ React.createElement(WithServerSideProps, {
-                                    Component: CustomRowLabelComponent
-                                });
-                            }
                             const arrayFieldProps = {
                                 ...baseFieldProps,
                                 name: field.name,
-                                CustomRowLabel,
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
                                 fieldMap: mapFields({
@@ -118,7 +102,6 @@ export const mapFields = (args)=>{
                                     readOnly: readOnlyOverride
                                 }),
                                 isSortable: field.admin?.isSortable,
-                                label: field?.label,
                                 labels: field.labels,
                                 maxRows: field.maxRows,
                                 minRows: field.minRows,
@@ -127,7 +110,7 @@ export const mapFields = (args)=>{
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = arrayFieldProps;
+                            fieldComponentPropsBase = arrayFieldProps;
                             break;
                         }
                     case 'blocks':
@@ -144,6 +127,7 @@ export const mapFields = (args)=>{
                                 });
                                 const reducedBlock = {
                                     slug: block.slug,
+                                    LabelComponent: block.admin?.components?.Label,
                                     custom: block.admin?.custom,
                                     fieldMap: blockFieldMap,
                                     imageAltText: block.imageAltText,
@@ -159,7 +143,6 @@ export const mapFields = (args)=>{
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
                                 isSortable: field.admin?.isSortable,
-                                label: field?.label,
                                 labels: field.labels,
                                 maxRows: field.maxRows,
                                 minRows: field.minRows,
@@ -168,7 +151,7 @@ export const mapFields = (args)=>{
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = blocksField;
+                            fieldComponentPropsBase = blocksField;
                             cellComponentProps.blocks = field.blocks.map((b)=>({
                                     slug: b.slug,
                                     labels: b.labels
@@ -182,13 +165,12 @@ export const mapFields = (args)=>{
                                 name: field.name,
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
-                                label: field.label,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = checkboxField;
+                            fieldComponentPropsBase = checkboxField;
                             break;
                         }
                     case 'code':
@@ -199,28 +181,19 @@ export const mapFields = (args)=>{
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
                                 editorOptions: field.admin?.editorOptions,
-                                label: field.label,
                                 language: field.admin?.language,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = codeField;
+                            fieldComponentPropsBase = codeField;
                             break;
                         }
                     case 'collapsible':
                         {
-                            let CustomCollapsibleLabel;
-                            if (isReactComponent(field.label) || isPlainFunction(field.label)) {
-                                const CustomCollapsibleLabelComponent = field.label;
-                                CustomCollapsibleLabel = /*#__PURE__*/ React.createElement(WithServerSideProps, {
-                                    Component: CustomCollapsibleLabelComponent
-                                });
-                            }
                             const collapsibleField = {
                                 ...baseFieldProps,
-                                CustomLabel: CustomCollapsibleLabel,
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
                                 fieldMap: mapFields({
@@ -234,13 +207,12 @@ export const mapFields = (args)=>{
                                     readOnly: readOnlyOverride
                                 }),
                                 initCollapsed: field.admin?.initCollapsed,
-                                label: !CustomCollapsibleLabel ? field.label : undefined,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = collapsibleField // TODO: dunno why this is needed
+                            fieldComponentPropsBase = collapsibleField // TODO: dunno why this is needed
                             ;
                             break;
                         }
@@ -252,14 +224,13 @@ export const mapFields = (args)=>{
                                 className: field.admin?.className,
                                 date: field.admin?.date,
                                 disabled: field.admin?.disabled,
-                                label: field.label,
                                 placeholder: field.admin?.placeholder,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = dateField;
+                            fieldComponentPropsBase = dateField;
                             cellComponentProps.dateDisplayFormat = field.admin?.date?.displayFormat;
                             break;
                         }
@@ -268,16 +239,16 @@ export const mapFields = (args)=>{
                             const emailField = {
                                 ...baseFieldProps,
                                 name: field.name,
+                                autoComplete: field.admin?.autoComplete,
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
-                                label: field.label,
                                 placeholder: field.admin?.placeholder,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = emailField;
+                            fieldComponentPropsBase = emailField;
                             break;
                         }
                     case 'group':
@@ -297,12 +268,12 @@ export const mapFields = (args)=>{
                                     parentPath: path,
                                     readOnly: readOnlyOverride
                                 }),
-                                label: field.label,
+                                hideGutter: field.admin?.hideGutter,
                                 readOnly: field.admin?.readOnly,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = groupField;
+                            fieldComponentPropsBase = groupField;
                             break;
                         }
                     case 'json':
@@ -314,13 +285,12 @@ export const mapFields = (args)=>{
                                 disabled: field.admin?.disabled,
                                 editorOptions: field.admin?.editorOptions,
                                 jsonSchema: field.jsonSchema,
-                                label: field.label,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = jsonField;
+                            fieldComponentPropsBase = jsonField;
                             break;
                         }
                     case 'number':
@@ -331,7 +301,6 @@ export const mapFields = (args)=>{
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
                                 hasMany: field.hasMany,
-                                label: field.label,
                                 max: field.max,
                                 maxRows: field.maxRows,
                                 min: field.min,
@@ -341,7 +310,7 @@ export const mapFields = (args)=>{
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = numberField;
+                            fieldComponentPropsBase = numberField;
                             break;
                         }
                     case 'point':
@@ -351,13 +320,12 @@ export const mapFields = (args)=>{
                                 name: field.name,
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
-                                label: field.label,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = pointField;
+                            fieldComponentPropsBase = pointField;
                             break;
                         }
                     case 'relationship':
@@ -369,7 +337,7 @@ export const mapFields = (args)=>{
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
                                 hasMany: field.hasMany,
-                                label: field.label,
+                                isSortable: field.admin?.isSortable,
                                 readOnly: field.admin?.readOnly,
                                 relationTo: field.relationTo,
                                 required: field.required,
@@ -378,7 +346,7 @@ export const mapFields = (args)=>{
                                 width: field.admin?.width
                             };
                             cellComponentProps.relationTo = field.relationTo;
-                            fieldComponentProps = relationshipField;
+                            fieldComponentPropsBase = relationshipField;
                             break;
                         }
                     case 'radio':
@@ -388,7 +356,7 @@ export const mapFields = (args)=>{
                                 name: field.name,
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
-                                label: field.label,
+                                layout: field.admin?.layout,
                                 options: fieldOptions,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
@@ -396,7 +364,7 @@ export const mapFields = (args)=>{
                                 width: field.admin?.width
                             };
                             cellComponentProps.options = fieldOptions;
-                            fieldComponentProps = radioField;
+                            fieldComponentPropsBase = radioField;
                             break;
                         }
                     case 'richText':
@@ -406,12 +374,15 @@ export const mapFields = (args)=>{
                                 name: field.name,
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
-                                label: field.label,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
+                            if (!field?.editor) {
+                                throw new MissingEditorProp(field) // while we allow disabling editor functionality, you should not have any richText fields defined if you do not have an editor
+                                ;
+                            }
                             if (typeof field?.editor === 'function') {
                                 throw new Error('Attempted to access unsanitized rich text editor.');
                             }
@@ -431,11 +402,9 @@ export const mapFields = (args)=>{
                                 CustomFieldComponent = RichTextFieldComponent;
                             }
                             if (RichTextCellComponent) {
-                                cellComponentProps.CellComponentOverride = /*#__PURE__*/ React.createElement(WithServerSideProps, {
-                                    Component: RichTextCellComponent
-                                });
+                                CustomCellComponent = RichTextCellComponent;
                             }
-                            fieldComponentProps = richTextField;
+                            fieldComponentPropsBase = richTextField;
                             break;
                         }
                     case 'row':
@@ -459,7 +428,7 @@ export const mapFields = (args)=>{
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = rowField;
+                            fieldComponentPropsBase = rowField;
                             break;
                         }
                     case 'tabs':
@@ -494,7 +463,7 @@ export const mapFields = (args)=>{
                                 tabs,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = tabsField;
+                            fieldComponentPropsBase = tabsField;
                             break;
                         }
                     case 'text':
@@ -505,7 +474,6 @@ export const mapFields = (args)=>{
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
                                 hasMany: field.hasMany,
-                                label: field.label,
                                 maxLength: field.maxLength,
                                 minLength: field.minLength,
                                 placeholder: field.admin?.placeholder,
@@ -514,7 +482,7 @@ export const mapFields = (args)=>{
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = textField;
+                            fieldComponentPropsBase = textField;
                             break;
                         }
                     case 'textarea':
@@ -524,7 +492,6 @@ export const mapFields = (args)=>{
                                 name: field.name,
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
-                                label: field.label,
                                 maxLength: field.maxLength,
                                 minLength: field.minLength,
                                 placeholder: field.admin?.placeholder,
@@ -534,12 +501,12 @@ export const mapFields = (args)=>{
                                 style: field.admin?.style,
                                 width: field.admin?.width
                             };
-                            fieldComponentProps = textareaField;
+                            fieldComponentPropsBase = textareaField;
                             break;
                         }
                     case 'ui':
                         {
-                            fieldComponentProps = baseFieldProps;
+                            fieldComponentPropsBase = baseFieldProps;
                             break;
                         }
                     case 'upload':
@@ -550,7 +517,6 @@ export const mapFields = (args)=>{
                                 className: field.admin?.className,
                                 disabled: field.admin?.disabled,
                                 filterOptions: field.filterOptions,
-                                label: field.label,
                                 readOnly: field.admin?.readOnly,
                                 relationTo: field.relationTo,
                                 required: field.required,
@@ -558,7 +524,8 @@ export const mapFields = (args)=>{
                                 width: field.admin?.width
                             };
                             cellComponentProps.relationTo = field.relationTo;
-                            fieldComponentProps = uploadField;
+                            cellComponentProps.displayPreview = field.displayPreview;
+                            fieldComponentPropsBase = uploadField;
                             break;
                         }
                     case 'select':
@@ -570,7 +537,6 @@ export const mapFields = (args)=>{
                                 disabled: field.admin?.disabled,
                                 hasMany: field.hasMany,
                                 isClearable: field.admin?.isClearable,
-                                label: field.label,
                                 options: fieldOptions,
                                 readOnly: field.admin?.readOnly,
                                 required: field.required,
@@ -578,7 +544,7 @@ export const mapFields = (args)=>{
                                 width: field.admin?.width
                             };
                             cellComponentProps.options = fieldOptions;
-                            fieldComponentProps = selectField;
+                            fieldComponentPropsBase = selectField;
                             break;
                         }
                     default:
@@ -586,20 +552,108 @@ export const mapFields = (args)=>{
                             break;
                         }
                 }
+                const labelProps = {
+                    type: field.type,
+                    label,
+                    required: 'required' in field ? field.required : undefined,
+                    schemaPath: path
+                };
+                const CustomLabelComponent = 'admin' in field && field.admin?.components && 'Label' in field.admin.components && field.admin.components?.Label || undefined;
+                // If we return undefined here (so if no CUSTOM label component is set),
+                // the field client component is responsible for falling back to the default label
+                let CustomLabel = CustomLabelComponent !== undefined ? /*#__PURE__*/ _jsx(WithServerSideProps, {
+                    Component: CustomLabelComponent,
+                    ...labelProps || {}
+                }) : undefined;
+                switch(field.type){
+                    case 'array':
+                        {
+                            let CustomRowLabel;
+                            if ('admin' in field && field.admin.components && 'RowLabel' in field.admin.components && field.admin.components.RowLabel) {
+                                const CustomRowLabelComponent = field.admin.components.RowLabel;
+                                CustomRowLabel = /*#__PURE__*/ _jsx(WithServerSideProps, {
+                                    Component: CustomRowLabelComponent,
+                                    ...labelProps || {}
+                                });
+                            }
+                            // @ts-expect-error
+                            fieldComponentPropsBase.CustomRowLabel = CustomRowLabel;
+                            break;
+                        }
+                    case 'collapsible':
+                        {
+                            let CustomCollapsibleLabel;
+                            if (field?.admin?.components && 'RowLabel' in field.admin.components && field?.admin?.components?.RowLabel) {
+                                const CustomCollapsibleLabelComponent = field.admin.components.RowLabel;
+                                CustomCollapsibleLabel = /*#__PURE__*/ _jsx(WithServerSideProps, {
+                                    Component: CustomCollapsibleLabelComponent,
+                                    ...labelProps || {}
+                                });
+                            }
+                            CustomLabel = CustomCollapsibleLabel;
+                            break;
+                        }
+                    default:
+                        break;
+                }
+                let description = undefined;
+                if (field.admin && 'description' in field.admin) {
+                    if (typeof field.admin?.description === 'string' || typeof field.admin?.description === 'object') {
+                        description = field.admin.description;
+                    } else if (typeof field.admin?.description === 'function') {
+                        description = field.admin?.description({
+                            t
+                        });
+                    }
+                }
+                const descriptionProps = {
+                    type: field.type,
+                    description
+                };
+                let CustomDescriptionComponent = undefined;
+                if (field.admin?.components && 'Description' in field.admin.components && field.admin.components?.Description) {
+                    CustomDescriptionComponent = field.admin.components.Description;
+                } else if (description) {
+                    CustomDescriptionComponent = FieldDescription;
+                }
+                const CustomDescription = CustomDescriptionComponent !== undefined ? /*#__PURE__*/ _jsx(WithServerSideProps, {
+                    Component: CustomDescriptionComponent,
+                    ...descriptionProps || {}
+                }) : undefined;
+                const errorProps = {
+                    path
+                };
+                const CustomErrorComponent = 'admin' in field && field.admin?.components && 'Error' in field.admin.components && field.admin?.components?.Error || undefined;
+                const CustomError = CustomErrorComponent !== undefined ? /*#__PURE__*/ _jsx(WithServerSideProps, {
+                    Component: CustomErrorComponent,
+                    ...errorProps || {}
+                }) : undefined;
+                const fieldComponentProps = {
+                    ...fieldComponentPropsBase,
+                    type: undefined,
+                    CustomDescription,
+                    CustomError,
+                    CustomLabel,
+                    descriptionProps,
+                    errorProps,
+                    labelProps
+                };
                 const reducedField = {
                     name: 'name' in field ? field.name : undefined,
                     type: field.type,
-                    CustomCell: CustomCellComponent ? /*#__PURE__*/ React.createElement(WithServerSideProps, {
+                    CustomCell: CustomCellComponent ? /*#__PURE__*/ _jsx(WithServerSideProps, {
                         Component: CustomCellComponent,
                         ...cellComponentProps
                     }) : undefined,
-                    CustomField: CustomFieldComponent ? /*#__PURE__*/ React.createElement(WithServerSideProps, {
+                    CustomField: CustomFieldComponent ? /*#__PURE__*/ _jsx(WithServerSideProps, {
                         Component: CustomFieldComponent,
-                        ...fieldComponentProps
+                        ...fieldComponentPropsBase
                     }) : undefined,
                     cellComponentProps,
                     custom: field?.admin?.custom,
                     disableBulkEdit: 'admin' in field && 'disableBulkEdit' in field.admin && field.admin.disableBulkEdit,
+                    disableListColumn: 'admin' in field && 'disableListColumn' in field.admin && field.admin.disableListColumn,
+                    disableListFilter: 'admin' in field && 'disableListFilter' in field.admin && field.admin.disableListFilter,
                     fieldComponentProps,
                     fieldIsPresentational,
                     isFieldAffectingData,
@@ -615,21 +669,20 @@ export const mapFields = (args)=>{
     }, []);
     const hasID = result.findIndex((f)=>'name' in f && f.isFieldAffectingData && f.name === 'id') > -1;
     if (!disableAddingID && !hasID) {
-        // TODO: For all fields (not just this one) we need to add the name to both .fieldComponentProps.name AND .name. This can probably be improved
+        // TODO: For all fields (not just this one) we need to add the name to both .fieldComponentPropsBase.name AND .name. This can probably be improved
         result.push({
             name: 'id',
             type: 'text',
             CustomField: null,
             cellComponentProps: {
-                name: 'id'
+                name: 'id',
+                schemaPath: 'id'
             },
             disableBulkEdit: true,
             fieldComponentProps: {
                 name: 'id',
-                label: 'ID',
-                labelProps: {
-                    label: 'ID'
-                }
+                type: undefined,
+                label: 'ID'
             },
             fieldIsPresentational: false,
             isFieldAffectingData: true,