payload 0.15.1 → 0.15.4

package/dist/admin/components/forms/field-types/Checkbox/index.js

@@ -8,11 +8,10 @@ import FieldDescription from '../../FieldDescription';
 import './index.scss';
 const baseClass = 'checkbox';
 const Checkbox = (props) => {
-    const { name, path: pathFromProps, required, validate = checkbox, label, onChange, disableFormData, admin: { readOnly, style, className, width, description, condition, } = {}, } = props;
+    const { name, path: pathFromProps, validate = checkbox, label, onChange, disableFormData, required, admin: { readOnly, style, className, width, description, condition, } = {}, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required });
-        return validationResult;
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, required });
     }, [validate, required]);
     const { value, showError, errorMessage, setValue, } = useField({
         path,

package/dist/admin/components/forms/field-types/Code/Code.js

@@ -11,7 +11,7 @@ import FieldDescription from '../../FieldDescription';
 import { code } from '../../../../../fields/validations';
 import './index.scss';
 const Code = (props) => {
-    const { path: pathFromProps, name, required, validate = code, admin: { readOnly, style, className, width, language, description, condition, } = {}, label, minLength, maxLength, } = props;
+    const { path: pathFromProps, name, required, validate = code, admin: { readOnly, style, className, width, language, description, condition, } = {}, label, } = props;
     const [highlighter] = useState(() => {
         if (languages[language]) {
             return (content) => highlight(content, languages[language]);
@@ -19,10 +19,9 @@ const Code = (props) => {
         return (content) => content;
     });
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { minLength, maxLength, required });
-        return validationResult;
-    }, [validate, maxLength, minLength, required]);
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, required });
+    }, [validate, required]);
     const { value, showError, setValue, errorMessage, } = useField({
         path,
         validate: memoizedValidate,

package/dist/admin/components/forms/field-types/DateTime/index.js

@@ -11,9 +11,8 @@ const baseClass = 'date-time-field';
 const DateTime = (props) => {
     const { path: pathFromProps, name, required, validate = dateValidation, label, admin: { placeholder, readOnly, style, className, width, date, description, condition, } = {}, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required });
-        return validationResult;
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, required });
     }, [validate, required]);
     const { value, showError, errorMessage, setValue, } = useField({
         path,

package/dist/admin/components/forms/field-types/Email/index.js

@@ -9,9 +9,8 @@ import './index.scss';
 const Email = (props) => {
     const { name, path: pathFromProps, required, validate = email, admin: { readOnly, style, className, width, placeholder, autoComplete, description, condition, } = {}, label, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required });
-        return validationResult;
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, required });
     }, [validate, required]);
     const fieldType = useField({
         path,

package/dist/admin/components/forms/field-types/Number/index.js

@@ -9,10 +9,9 @@ import './index.scss';
 const NumberField = (props) => {
     const { name, path: pathFromProps, required, validate = number, label, max, min, admin: { readOnly, style, className, width, step, placeholder, description, condition, } = {}, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { min, max, required });
-        return validationResult;
-    }, [validate, max, min, required]);
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, min, max, required });
+    }, [validate, min, max, required]);
     const { value, showError, setValue, errorMessage, } = useField({
         path,
         validate: memoizedValidate,

package/dist/admin/components/forms/field-types/Password/index.js

@@ -8,8 +8,8 @@ import './index.scss';
 const Password = (props) => {
     const { path: pathFromProps, name, required, validate = password, style, className, width, autoComplete, label, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required });
+    const memoizedValidate = useCallback((value, options) => {
+        const validationResult = validate(value, { ...options, required });
         return validationResult;
     }, [validate, required]);
     const { value, showError, formProcessing, setValue, errorMessage, } = useField({

package/dist/admin/components/forms/field-types/Point/index.js

@@ -10,9 +10,8 @@ const baseClass = 'point';
 const PointField = (props) => {
     const { name, path: pathFromProps, required, validate = point, label, admin: { readOnly, style, className, width, step, placeholder, description, condition, } = {}, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required });
-        return validationResult;
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, required });
     }, [validate, required]);
     const { value = [null, null], showError, setValue, errorMessage, } = useField({
         path,

package/dist/admin/components/forms/field-types/RadioGroup/index.js

@@ -12,10 +12,9 @@ const baseClass = 'radio-group';
 const RadioGroup = (props) => {
     const { name, path: pathFromProps, required, validate = radio, label, admin: { readOnly, layout = 'horizontal', style, className, width, description, condition, } = {}, options, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required, options });
-        return validationResult;
-    }, [validate, required, options]);
+    const memoizedValidate = useCallback((value, validationOptions) => {
+        return validate(value, { ...validationOptions, options, required });
+    }, [validate, options, required]);
     const { value, showError, errorMessage, setValue, } = useField({
         path,
         validate: memoizedValidate,

package/dist/admin/components/forms/field-types/Relationship/index.js

@@ -1,5 +1,6 @@
 import React, { useCallback, useEffect, useState, useReducer, } from 'react';
-import { useConfig } from '@payloadcms/config-provider';
+import equal from 'deep-equal';
+import { useAuth, useConfig } from '@payloadcms/config-provider';
 import qs from 'qs';
 import withCondition from '../../withCondition';
 import ReactSelect from '../../../elements/ReactSelect';
@@ -8,27 +9,32 @@ import Label from '../../Label';
 import Error from '../../Error';
 import FieldDescription from '../../FieldDescription';
 import { relationship } from '../../../../../fields/validations';
-import { useFormProcessing } from '../../Form/context';
+import { useFormProcessing, useWatchForm } from '../../Form/context';
 import optionsReducer from './optionsReducer';
 import { createRelationMap } from './createRelationMap';
 import { useDebouncedCallback } from '../../../../hooks/useDebouncedCallback';
+import { useDocumentInfo } from '../../../utilities/DocumentInfo';
+import { getFilterOptionsQuery } from '../getFilterOptionsQuery';
 import './index.scss';
 const maxResultsPerRequest = 10;
 const baseClass = 'relationship';
 const Relationship = (props) => {
-    const { relationTo, validate = relationship, path, name, required, label, hasMany, admin: { readOnly, style, className, width, description, condition, } = {}, } = props;
+    const { relationTo, validate = relationship, path, name, required, label, hasMany, filterOptions, admin: { readOnly, style, className, width, description, condition, } = {}, } = props;
     const { serverURL, routes: { api, }, collections, } = useConfig();
+    const { id } = useDocumentInfo();
+    const { user } = useAuth();
+    const { getData, getSiblingData } = useWatchForm();
     const formProcessing = useFormProcessing();
     const hasMultipleRelations = Array.isArray(relationTo);
     const [options, dispatchOptions] = useReducer(optionsReducer, required || hasMany ? [] : [{ value: 'null', label: 'None' }]);
     const [lastFullyLoadedRelation, setLastFullyLoadedRelation] = useState(-1);
     const [lastLoadedPage, setLastLoadedPage] = useState(1);
     const [errorLoading, setErrorLoading] = useState('');
+    const [optionFilters, setOptionFilters] = useState();
     const [hasLoadedValueOptions, setHasLoadedValueOptions] = useState(false);
     const [search, setSearch] = useState('');
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required });
-        return validationResult;
+    const memoizedValidate = useCallback((value, validationOptions) => {
+        return validate(value, { ...validationOptions, required });
     }, [validate, required]);
     const { value, showError, errorMessage, setValue, initialValue, } = useField({
         path: path || name,
@@ -51,9 +57,13 @@ const Relationship = (props) => {
                     const fieldToSearch = ((_a = collection === null || collection === void 0 ? void 0 : collection.admin) === null || _a === void 0 ? void 0 : _a.useAsTitle) || 'id';
                     const query = {
                         where: {
-                            id: {
-                                not_in: relationMap[relation],
-                            },
+                            and: [
+                                {
+                                    id: {
+                                        not_in: relationMap[relation],
+                                    },
+                                },
+                            ],
                         },
                         limit: maxResultsPerRequest,
                         page: lastLoadedPageToUse,
@@ -61,9 +71,14 @@ const Relationship = (props) => {
                         depth: 0,
                     };
                     if (searchArg) {
-                        query.where[fieldToSearch] = {
-                            like: searchArg,
-                        };
+                        query.where.and.push({
+                            [fieldToSearch]: {
+                                like: searchArg,
+                            },
+                        });
+                    }
+                    if (optionFilters[relation]) {
+                        query.where.and.push(optionFilters[relation]);
                     }
                     const response = await fetch(`${serverURL}${api}/${relation}?${qs.stringify(query)}`);
                     if (response.ok) {
@@ -88,7 +103,7 @@ const Relationship = (props) => {
                 }
             }, Promise.resolve());
         }
-    }, [api, collections, serverURL, errorLoading, relationTo, hasMany, hasMultipleRelations]);
+    }, [relationTo, hasMany, errorLoading, collections, optionFilters, serverURL, api, hasMultipleRelations]);
     const findOptionsByValue = useCallback(() => {
         if (value) {
             if (hasMany) {
@@ -182,11 +197,28 @@ const Relationship = (props) => {
         }
     }, [hasMany, hasMultipleRelations, relationTo, initialValue, hasLoadedValueOptions, errorLoading, collections, api, serverURL]);
     useEffect(() => {
-        setHasLoadedValueOptions(false);
-        getResults({
-            value: initialValue,
+        if (!filterOptions) {
+            return;
+        }
+        const newOptionFilters = getFilterOptionsQuery(filterOptions, {
+            id,
+            data: getData(),
+            relationTo,
+            siblingData: getSiblingData(path),
+            user,
         });
-    }, [initialValue, getResults]);
+        if (!equal(newOptionFilters, optionFilters)) {
+            setOptionFilters(newOptionFilters);
+        }
+    }, [relationTo, filterOptions, optionFilters, id, getData, getSiblingData, path, user]);
+    useEffect(() => {
+        if (optionFilters) {
+            setHasLoadedValueOptions(false);
+            getResults({
+                value: initialValue,
+            });
+        }
+    }, [initialValue, getResults, optionFilters]);
     const classes = [
         'field-type',
         baseClass,

package/dist/admin/components/forms/field-types/RichText/RichText.js

@@ -51,9 +51,8 @@ const RichText = (props) => {
         }
         return (React.createElement("span", { ...attributes }, children));
     }, [enabledLeaves, path, props]);
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required });
-        return validationResult;
+    const memoizedValidate = useCallback((value, validationOptions) => {
+        return validate(value, { ...validationOptions, required });
     }, [validate, required]);
     const fieldType = useField({
         path,
@@ -147,7 +146,7 @@ const RichText = (props) => {
                             return null;
                         })),
                     React.createElement("div", { className: `${baseClass}__editor`, ref: editorRef },
-                        React.createElement(Editable, { className: `${baseClass}__input`, renderElement: renderElement, renderLeaf: renderLeaf, placeholder: placeholder, spellCheck: true, readOnly: readOnly, onBlur: onBlur, onKeyDown: (event) => {
+                        React.createElement(Editable, { renderElement: renderElement, renderLeaf: renderLeaf, placeholder: placeholder, spellCheck: true, readOnly: readOnly, onBlur: onBlur, onKeyDown: (event) => {
                                 if (event.key === 'Enter') {
                                     if (event.shiftKey) {
                                         event.preventDefault();

package/dist/admin/components/forms/field-types/RichText/elements/upload/Element/EditModal/index.js

@@ -2,6 +2,7 @@ import React, { useCallback, useEffect, useState } from 'react';
 import { Transforms } from 'slate';
 import { ReactEditor, useSlateStatic } from 'slate-react';
 import { Modal } from '@faceless-ui/modal';
+import { useAuth } from '@payloadcms/config-provider';
 import buildStateFromSchema from '../../../../../../Form/buildStateFromSchema';
 import MinimalTemplate from '../../../../../../../templates/Minimal';
 import Button from '../../../../../../../elements/Button';
@@ -15,6 +16,7 @@ const baseClass = 'edit-upload-modal';
 export const EditModal = ({ slug, closeModal, relatedCollectionConfig, fieldSchema, element }) => {
     const editor = useSlateStatic();
     const [initialState, setInitialState] = useState({});
+    const { user } = useAuth();
     const handleUpdateEditData = useCallback((fields) => {
         const newNode = {
             fields: reduceFieldsToValues(fields, true),
@@ -25,11 +27,11 @@ export const EditModal = ({ slug, closeModal, relatedCollectionConfig, fieldSche
     }, [closeModal, editor, element]);
     useEffect(() => {
         const awaitInitialState = async () => {
-            const state = await buildStateFromSchema(fieldSchema, element === null || element === void 0 ? void 0 : element.fields);
+            const state = await buildStateFromSchema({ fieldSchema, data: element === null || element === void 0 ? void 0 : element.fields, user, operation: 'update' });
             setInitialState(state);
         };
         awaitInitialState();
-    }, [fieldSchema, element.fields]);
+    }, [fieldSchema, element.fields, user]);
     return (React.createElement(Modal, { slug: slug, className: baseClass },
         React.createElement(MinimalTemplate, { width: "normal" },
             React.createElement("header", { className: `${baseClass}__header` },

package/dist/admin/components/forms/field-types/Row/index.js

@@ -4,8 +4,13 @@ import withCondition from '../../withCondition';
 import { fieldAffectsData } from '../../../../../fields/config/types';
 import './index.scss';
 const Row = (props) => {
-    const { fields, fieldTypes, path, permissions, admin: { readOnly, }, } = props;
-    return (React.createElement(RenderFields, { readOnly: readOnly, className: "field-type row", permissions: permissions === null || permissions === void 0 ? void 0 : permissions.fields, fieldTypes: fieldTypes, fieldSchema: fields.map((field) => ({
+    const { fields, fieldTypes, path, permissions, admin: { readOnly, className, }, } = props;
+    const classes = [
+        'field-type',
+        'row',
+        className,
+    ].filter(Boolean).join(' ');
+    return (React.createElement(RenderFields, { readOnly: readOnly, className: classes, permissions: permissions === null || permissions === void 0 ? void 0 : permissions.fields, fieldTypes: fieldTypes, fieldSchema: fields.map((field) => ({
             ...field,
             path: `${path ? `${path}.` : ''}${fieldAffectsData(field) ? field.name : ''}`,
         })) }));

package/dist/admin/components/forms/field-types/Select/index.js

@@ -13,16 +13,15 @@ const formatOptions = (options) => options.map((option) => {
     };
 });
 const Select = (props) => {
-    const { path: pathFromProps, name, required, validate = select, label, options: optionsFromProps, hasMany, admin: { readOnly, style, className, width, description, condition, } = {}, } = props;
+    const { path: pathFromProps, name, validate = select, label, options: optionsFromProps, hasMany, required, admin: { readOnly, style, className, width, description, condition, } = {}, } = props;
     const path = pathFromProps || name;
     const [options, setOptions] = useState(formatOptions(optionsFromProps));
     useEffect(() => {
         setOptions(formatOptions(optionsFromProps));
     }, [optionsFromProps]);
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required, options });
-        return validationResult;
-    }, [validate, required, options]);
+    const memoizedValidate = useCallback((value, validationOptions) => {
+        return validate(value, { ...validationOptions, options, hasMany, required });
+    }, [validate, required, hasMany, options]);
     const { value, showError, setValue, errorMessage, } = useField({
         path,
         validate: memoizedValidate,

package/dist/admin/components/forms/field-types/Text/index.js

@@ -1,14 +1,17 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 import useField from '../../useField';
 import withCondition from '../../withCondition';
 import { text } from '../../../../../fields/validations';
 import TextInput from './Input';
 const Text = (props) => {
-    const { path: pathFromProps, name, required, validate = text, label, admin: { placeholder, readOnly, style, className, width, description, condition, } = {}, } = props;
+    const { path: pathFromProps, name, required, validate = text, label, minLength, maxLength, admin: { placeholder, readOnly, style, className, width, description, condition, } = {}, } = props;
     const path = pathFromProps || name;
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, minLength, maxLength, required });
+    }, [validate, minLength, maxLength, required]);
     const field = useField({
         path,
-        validate,
+        validate: memoizedValidate,
         enableDebouncedValue: true,
         condition,
     });

package/dist/admin/components/forms/field-types/Textarea/index.js

@@ -5,12 +5,11 @@ import { textarea } from '../../../../../fields/validations';
 import TextareaInput from './Input';
 import './index.scss';
 const Textarea = (props) => {
-    const { path: pathFromProps, name, required, validate = textarea, admin: { readOnly, style, className, width, placeholder, rows, description, condition, } = {}, label, minLength, maxLength, } = props;
+    const { path: pathFromProps, name, required, validate = textarea, maxLength, minLength, admin: { readOnly, style, className, width, placeholder, rows, description, condition, } = {}, label, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { minLength, maxLength, required });
-        return validationResult;
-    }, [validate, maxLength, minLength, required]);
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, required, maxLength, minLength });
+    }, [validate, required, maxLength, minLength]);
     const { value, showError, setValue, errorMessage, } = useField({
         path,
         validate: memoizedValidate,

package/dist/admin/components/forms/field-types/Upload/Add/index.js

@@ -26,7 +26,7 @@ const AddUploadModal = (props) => {
     const collectionPermissions = (_b = (_a = permissions === null || permissions === void 0 ? void 0 : permissions.collections) === null || _a === void 0 ? void 0 : _a[collection.slug]) === null || _b === void 0 ? void 0 : _b.fields;
     return (React.createElement(Modal, { className: classes, slug: slug },
         React.createElement(MinimalTemplate, { width: "wide" },
-            React.createElement(Form, { method: "post", action: `${serverURL}${api}/${collection.slug}`, onSuccess: onSuccess, disableSuccessStatus: true },
+            React.createElement(Form, { method: "post", action: `${serverURL}${api}/${collection.slug}`, onSuccess: onSuccess, disableSuccessStatus: true, validationOperation: "create" },
                 React.createElement("header", { className: `${baseClass}__header` },
                     React.createElement("div", null,
                         React.createElement("h1", null,

package/dist/admin/components/forms/field-types/Upload/Input.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UploadField } from '../../../../../fields/config/types';
+import { FilterOptions, UploadField } from '../../../../../fields/config/types';
 import { Description } from '../../FieldDescription/types';
 import { FieldTypes } from '..';
 import { SanitizedCollectionConfig } from '../../../../../collections/config/types';
@@ -21,6 +21,7 @@ export declare type UploadInputProps = Omit<UploadField, 'type'> & {
     collection?: SanitizedCollectionConfig;
     serverURL?: string;
     api?: string;
+    filterOptions: FilterOptions;
 };
 declare const UploadInput: React.FC<UploadInputProps>;
 export default UploadInput;

package/dist/admin/components/forms/field-types/Upload/Input.js

@@ -10,7 +10,7 @@ import SelectExistingModal from './SelectExisting';
 import './index.scss';
 const baseClass = 'upload';
 const UploadInput = (props) => {
-    const { path, required, readOnly, style, className, width, description, label, relationTo, fieldTypes, value, onChange, showError, serverURL = 'http://localhost:3000', api = '/api', collection, errorMessage, } = props;
+    const { path, required, readOnly, style, className, width, description, label, relationTo, fieldTypes, value, onChange, showError, serverURL = 'http://localhost:3000', api = '/api', collection, errorMessage, filterOptions, } = props;
     const { toggle } = useModal();
     const addModalSlug = `${path}-add`;
     const selectExistingModalSlug = `${path}-select-existing`;
@@ -78,6 +78,8 @@ const UploadInput = (props) => {
                     slug: selectExistingModalSlug,
                     setValue: onChange,
                     addModalSlug,
+                    filterOptions,
+                    path,
                 } }),
             React.createElement(FieldDescription, { value: file, description: description })))));
 };

package/dist/admin/components/forms/field-types/Upload/SelectExisting/index.js

@@ -1,6 +1,7 @@
 import React, { Fragment, useState, useEffect } from 'react';
+import equal from 'deep-equal';
 import { Modal, useModal } from '@faceless-ui/modal';
-import { useConfig } from '@payloadcms/config-provider';
+import { useAuth, useConfig } from '@payloadcms/config-provider';
 import MinimalTemplate from '../../../../templates/Minimal';
 import Button from '../../../../elements/Button';
 import usePayloadAPI from '../../../../../hooks/usePayloadAPI';
@@ -10,17 +11,24 @@ import UploadGallery from '../../../../elements/UploadGallery';
 import PerPage from '../../../../elements/PerPage';
 import formatFields from '../../../../views/collections/List/formatFields';
 import './index.scss';
+import { getFilterOptionsQuery } from '../../getFilterOptionsQuery';
+import { useDocumentInfo } from '../../../../utilities/DocumentInfo';
+import { useWatchForm } from '../../../Form/context';
 const baseClass = 'select-existing-upload-modal';
 const SelectExistingUploadModal = (props) => {
     var _a, _b;
-    const { setValue, collection, collection: { slug: collectionSlug, admin: { description, pagination: { defaultLimit, }, } = {}, } = {}, slug: modalSlug, } = props;
+    const { setValue, collection, collection: { slug: collectionSlug, admin: { description, pagination: { defaultLimit, }, } = {}, } = {}, slug: modalSlug, path, filterOptions, } = props;
     const { serverURL, routes: { api } } = useConfig();
+    const { id } = useDocumentInfo();
+    const { user } = useAuth();
+    const { getData, getSiblingData } = useWatchForm();
     const { closeAll, currentModal } = useModal();
     const [fields] = useState(() => formatFields(collection));
     const [limit, setLimit] = useState(defaultLimit);
     const [sort, setSort] = useState(null);
     const [where, setWhere] = useState(null);
     const [page, setPage] = useState(null);
+    const [optionFilters, setOptionFilters] = useState();
     const classes = [
         baseClass,
     ].filter(Boolean).join(' ');
@@ -32,13 +40,28 @@ const SelectExistingUploadModal = (props) => {
         if (page)
             params.page = page;
         if (where)
-            params.where = where;
+            params.where = { and: [where, optionFilters] };
         if (sort)
             params.sort = sort;
         if (limit)
             params.limit = limit;
         setParams(params);
-    }, [setParams, page, sort, where, limit]);
+    }, [setParams, page, sort, where, limit, optionFilters]);
+    useEffect(() => {
+        if (!filterOptions || !isOpen) {
+            return;
+        }
+        const newOptionFilters = getFilterOptionsQuery(filterOptions, {
+            id,
+            relationTo: collectionSlug,
+            data: getData(),
+            siblingData: getSiblingData(path),
+            user,
+        })[collectionSlug];
+        if (!equal(newOptionFilters, optionFilters)) {
+            setOptionFilters(newOptionFilters);
+        }
+    }, [collectionSlug, filterOptions, optionFilters, id, getData, getSiblingData, path, user, isOpen]);
     return (React.createElement(Modal, { className: classes, slug: modalSlug }, isOpen && (React.createElement(MinimalTemplate, { width: "wide" },
         React.createElement("header", { className: `${baseClass}__header` },
             React.createElement("div", null,

package/dist/admin/components/forms/field-types/Upload/SelectExisting/types.d.ts

@@ -1,8 +1,11 @@
 import { SanitizedCollectionConfig } from '../../../../../../collections/config/types';
+import { FilterOptions } from '../../../../../../fields/config/types';
 export declare type Props = {
     setValue: (val: {
         id: string;
     } | null) => void;
     collection: SanitizedCollectionConfig;
     slug: string;
+    path: any;
+    filterOptions: FilterOptions;
 };

package/dist/admin/components/forms/field-types/Upload/index.js

@@ -7,11 +7,10 @@ import UploadInput from './Input';
 import './index.scss';
 const Upload = (props) => {
     const { collections, serverURL, routes: { api, }, } = useConfig();
-    const { path, name, required, admin: { readOnly, style, className, width, description, condition, } = {}, label, validate = upload, relationTo, fieldTypes, } = props;
+    const { path, name, required, admin: { readOnly, style, className, width, description, condition, } = {}, label, validate = upload, relationTo, fieldTypes, filterOptions, } = props;
     const collection = collections.find((coll) => coll.slug === relationTo);
-    const memoizedValidate = useCallback((value) => {
-        const validationResult = validate(value, { required });
-        return validationResult;
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, required });
     }, [validate, required]);
     const field = useField({
         path,
@@ -26,7 +25,7 @@ const Upload = (props) => {
         setValue,
     ]);
     if (collection.upload) {
-        return (React.createElement(UploadInput, { path: path, value: value, onChange: onChange, description: description, label: label, required: required, showError: showError, serverURL: serverURL, api: api, errorMessage: errorMessage, readOnly: readOnly, style: style, className: className, width: width, collection: collection, fieldTypes: fieldTypes, name: name, relationTo: relationTo }));
+        return (React.createElement(UploadInput, { path: path, value: value, onChange: onChange, description: description, label: label, required: required, showError: showError, serverURL: serverURL, api: api, errorMessage: errorMessage, readOnly: readOnly, style: style, className: className, width: width, collection: collection, fieldTypes: fieldTypes, name: name, relationTo: relationTo, filterOptions: filterOptions }));
     }
     return null;
 };

package/dist/admin/components/forms/field-types/getFilterOptionsQuery.d.ts

@@ -0,0 +1,5 @@
+import { Where } from '../../../../types';
+import { FilterOptions, FilterOptionsProps } from '../../../../fields/config/types';
+export declare const getFilterOptionsQuery: (filterOptions: FilterOptions, options: FilterOptionsProps) => {
+    [collection: string]: Where;
+};

package/dist/admin/components/forms/field-types/getFilterOptionsQuery.js

@@ -0,0 +1,11 @@
+export const getFilterOptionsQuery = (filterOptions, options) => {
+    const { relationTo } = options;
+    const relations = Array.isArray(relationTo) ? relationTo : [relationTo];
+    const query = {};
+    if (typeof filterOptions !== 'undefined') {
+        relations.forEach((relation) => {
+            query[relation] = typeof filterOptions === 'function' ? filterOptions(options) : filterOptions;
+        });
+    }
+    return query;
+};