payload 0.12.10-beta.0 → 0.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +28 -23
- package/components/forms.ts +2 -1
- package/dist/admin/components/elements/PreviewButton/index.js +19 -4
- package/dist/admin/components/elements/WhereBuilder/Condition/Relationship/types.d.ts +1 -1
- package/dist/admin/components/forms/DraggableSection/SectionTitle/index.js +2 -2
- package/dist/admin/components/forms/FieldDescription/types.d.ts +1 -2
- package/dist/admin/components/forms/FieldDescription/types.js +11 -3
- package/dist/admin/components/forms/field-types/Array/Array.js +2 -2
- package/dist/admin/components/forms/field-types/Array/types.d.ts +2 -1
- package/dist/admin/components/forms/field-types/Blocks/Blocks.js +2 -2
- package/dist/admin/components/forms/field-types/Blocks/types.d.ts +2 -1
- package/dist/admin/components/forms/field-types/Checkbox/index.js +2 -2
- package/dist/admin/components/forms/field-types/Code/Code.js +2 -2
- package/dist/admin/components/forms/field-types/ConfirmPassword/index.js +2 -2
- package/dist/admin/components/forms/field-types/DateTime/index.js +2 -2
- package/dist/admin/components/forms/field-types/Email/index.js +2 -2
- package/dist/admin/components/forms/field-types/HiddenInput/index.js +2 -2
- package/dist/admin/components/forms/field-types/Number/index.js +2 -2
- package/dist/admin/components/forms/field-types/Password/index.js +2 -2
- package/dist/admin/components/forms/field-types/Password/types.d.ts +2 -1
- package/dist/admin/components/forms/field-types/Point/index.js +2 -2
- package/dist/admin/components/forms/field-types/RadioGroup/index.js +2 -2
- package/dist/admin/components/forms/field-types/Relationship/index.js +2 -2
- package/dist/admin/components/forms/field-types/Relationship/types.d.ts +1 -1
- package/dist/admin/components/forms/field-types/RichText/RichText.js +2 -2
- package/dist/admin/components/forms/field-types/Select/index.js +32 -16
- package/dist/admin/components/forms/field-types/Text/index.js +19 -6
- package/dist/admin/components/forms/field-types/Textarea/index.js +2 -2
- package/dist/admin/components/forms/field-types/Upload/index.js +21 -8
- package/dist/admin/components/forms/useField/index.d.ts +3 -0
- package/dist/admin/components/forms/{useFieldType → useField}/index.js +30 -9
- package/dist/admin/components/forms/{useFieldType → useField}/types.d.ts +0 -0
- package/dist/admin/components/forms/{useFieldType → useField}/types.js +0 -0
- package/dist/admin/components/views/collections/Edit/Auth/APIKey.js +2 -2
- package/dist/admin/components/views/collections/Edit/Upload/index.js +2 -2
- package/dist/admin/components/views/collections/List/types.d.ts +1 -1
- package/dist/auth/getExecuteStaticAccess.d.ts +1 -1
- package/dist/auth/getExecuteStaticAccess.js +20 -4
- package/dist/bin/generateTypes.js +20 -10
- package/dist/collections/config/types.d.ts +102 -39
- package/dist/collections/operations/create.d.ts +1 -0
- package/dist/collections/operations/create.js +12 -4
- package/dist/collections/operations/delete.js +5 -5
- package/dist/collections/operations/find.d.ts +2 -2
- package/dist/collections/operations/find.js +15 -8
- package/dist/collections/operations/findByID.d.ts +2 -3
- package/dist/collections/operations/findByID.js +1 -1
- package/dist/collections/operations/local/create.d.ts +1 -0
- package/dist/collections/operations/local/create.js +3 -2
- package/dist/collections/operations/local/delete.d.ts +2 -1
- package/dist/collections/operations/local/delete.js +1 -1
- package/dist/collections/operations/local/find.d.ts +2 -2
- package/dist/collections/operations/local/find.js +1 -1
- package/dist/collections/operations/local/findByID.d.ts +2 -1
- package/dist/collections/operations/local/findByID.js +1 -1
- package/dist/collections/operations/local/update.d.ts +2 -1
- package/dist/collections/operations/local/update.js +1 -1
- package/dist/collections/operations/update.js +11 -3
- package/dist/collections/requestHandlers/find.d.ts +2 -2
- package/dist/collections/requestHandlers/find.js +1 -1
- package/dist/config/types.d.ts +4 -1
- package/dist/express/static.js +2 -2
- package/dist/fields/baseFields/getBaseUploadFields.js +3 -1
- package/dist/fields/config/types.d.ts +21 -16
- package/dist/fields/config/types.js +1 -1
- package/dist/fields/validations.d.ts +17 -17
- package/dist/index.d.ts +8 -9
- package/dist/index.js +1 -1
- package/dist/mongoose/buildQuery.js +14 -11
- package/dist/mongoose/buildSchema.js +6 -1
- package/dist/mongoose/sanitizeFormattedValue.js +18 -22
- package/dist/uploads/fileExists.d.ts +2 -2
- package/dist/uploads/fileExists.js +4 -3
- package/dist/uploads/fileOrDocExists.d.ts +3 -0
- package/dist/uploads/fileOrDocExists.js +22 -0
- package/dist/uploads/getSafeFilename.d.ts +2 -1
- package/dist/uploads/getSafeFilename.js +4 -4
- package/dist/uploads/imageResizer.d.ts +11 -1
- package/dist/uploads/imageResizer.js +2 -2
- package/dist/uploads/isImage.js +2 -2
- package/dist/utilities/sanitizeInternalFields.d.ts +2 -1
- package/dist/utilities/sanitizeInternalFields.js +1 -1
- package/docs/admin/components.mdx +3 -3
- package/docs/fields/blocks.mdx +9 -0
- package/docs/fields/overview.mdx +12 -0
- package/docs/fields/rich-text.mdx +11 -0
- package/docs/hooks/collections.mdx +23 -0
- package/docs/hooks/fields.mdx +28 -0
- package/docs/hooks/globals.mdx +17 -0
- package/docs/typescript/generating-types.mdx +114 -0
- package/docs/typescript/overview.mdx +36 -0
- package/package.json +1 -1
- package/types.d.ts +18 -2
- package/dist/admin/components/forms/useFieldType/index.d.ts +0 -3
|
@@ -4,7 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
const sanitize_filename_1 = __importDefault(require("sanitize-filename"));
|
|
7
|
-
const
|
|
7
|
+
const fileOrDocExists_1 = __importDefault(require("./fileOrDocExists"));
|
|
8
8
|
const incrementName = (name) => {
|
|
9
9
|
const extension = name.split('.').pop();
|
|
10
10
|
const baseFilename = (0, sanitize_filename_1.default)(name.substr(0, name.lastIndexOf('.')) || name);
|
|
@@ -23,13 +23,13 @@ const incrementName = (name) => {
|
|
|
23
23
|
}
|
|
24
24
|
return `${incrementedName}.${extension}`;
|
|
25
25
|
};
|
|
26
|
-
async function getSafeFileName(staticPath, desiredFilename) {
|
|
26
|
+
async function getSafeFileName(Model, staticPath, desiredFilename) {
|
|
27
27
|
let modifiedFilename = desiredFilename;
|
|
28
28
|
// eslint-disable-next-line no-await-in-loop
|
|
29
|
-
while (await (0,
|
|
29
|
+
while (await (0, fileOrDocExists_1.default)(Model, staticPath, modifiedFilename)) {
|
|
30
30
|
modifiedFilename = incrementName(modifiedFilename);
|
|
31
31
|
}
|
|
32
32
|
return modifiedFilename;
|
|
33
33
|
}
|
|
34
34
|
exports.default = getSafeFileName;
|
|
35
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
35
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ2V0U2FmZUZpbGVuYW1lLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL3VwbG9hZHMvZ2V0U2FmZUZpbGVuYW1lLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsMEVBQXlDO0FBRXpDLHdFQUFnRDtBQUVoRCxNQUFNLGFBQWEsR0FBRyxDQUFDLElBQVksRUFBRSxFQUFFO0lBQ3JDLE1BQU0sU0FBUyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLENBQUMsR0FBRyxFQUFFLENBQUM7SUFDeEMsTUFBTSxZQUFZLEdBQUcsSUFBQSwyQkFBUSxFQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQyxFQUFFLElBQUksQ0FBQyxXQUFXLENBQUMsR0FBRyxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMsQ0FBQztJQUM3RSxJQUFJLGVBQWUsR0FBRyxZQUFZLENBQUM7SUFDbkMsTUFBTSxLQUFLLEdBQUcsWUFBWSxDQUFDO0lBQzNCLE1BQU0sS0FBSyxHQUFHLFlBQVksQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDeEMsSUFBSSxLQUFLLEtBQUssSUFBSSxFQUFFO1FBQ2xCLGVBQWUsSUFBSSxJQUFJLENBQUM7S0FDekI7U0FBTTtRQUNMLE1BQU0sV0FBVyxHQUFHLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUM3QixNQUFNLGFBQWEsR0FBRyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUM7UUFDL0IsTUFBTSxXQUFXLEdBQUcsTUFBTSxDQUFDLGFBQWEsQ0FBQyxHQUFHLENBQUMsQ0FBQztRQUM5QyxNQUFNLE9BQU8sR0FBRyxHQUFHLFdBQVcsSUFBSSxXQUFXLEVBQUUsQ0FBQztRQUNoRCxlQUFlLEdBQUcsT0FBTyxDQUFDO0tBQzNCO0lBQ0QsT0FBTyxHQUFHLGVBQWUsSUFBSSxTQUFTLEVBQUUsQ0FBQztBQUMzQyxDQUFDLENBQUM7QUFFRixLQUFLLFVBQVUsZUFBZSxDQUFDLEtBQXNCLEVBQUUsVUFBa0IsRUFBRSxlQUF1QjtJQUNoRyxJQUFJLGdCQUFnQixHQUFHLGVBQWUsQ0FBQztJQUV2Qyw0Q0FBNEM7SUFDNUMsT0FBTyxNQUFNLElBQUEseUJBQWUsRUFBQyxLQUFLLEVBQUUsVUFBVSxFQUFFLGdCQUFnQixDQUFDLEVBQUU7UUFDakUsZ0JBQWdCLEdBQUcsYUFBYSxDQUFDLGdCQUFnQixDQUFDLENBQUM7S0FDcEQ7SUFDRCxPQUFPLGdCQUFnQixDQUFDO0FBQzFCLENBQUM7QUFFRCxrQkFBZSxlQUFlLENBQUMifQ==
|
|
@@ -3,6 +3,15 @@ import { ProbedImageSize } from './getImageSize';
|
|
|
3
3
|
import { SanitizedCollectionConfig } from '../collections/config/types';
|
|
4
4
|
import { FileSizes } from './types';
|
|
5
5
|
import { PayloadRequest } from '../express/types';
|
|
6
|
+
declare type Args = {
|
|
7
|
+
req: PayloadRequest;
|
|
8
|
+
file: Buffer;
|
|
9
|
+
dimensions: ProbedImageSize;
|
|
10
|
+
staticPath: string;
|
|
11
|
+
config: SanitizedCollectionConfig;
|
|
12
|
+
savedFilename: string;
|
|
13
|
+
mimeType: string;
|
|
14
|
+
};
|
|
6
15
|
/**
|
|
7
16
|
* @description
|
|
8
17
|
* @param staticPath Path to save images
|
|
@@ -11,4 +20,5 @@ import { PayloadRequest } from '../express/types';
|
|
|
11
20
|
* @param mimeType
|
|
12
21
|
* @returns image sizes keyed to strings
|
|
13
22
|
*/
|
|
14
|
-
export default function resizeAndSave(req
|
|
23
|
+
export default function resizeAndSave({ req, file, dimensions, staticPath, config, savedFilename, mimeType, }: Args): Promise<FileSizes>;
|
|
24
|
+
export {};
|
|
@@ -25,7 +25,7 @@ function getOutputImage(sourceImage, size) {
|
|
|
25
25
|
* @param mimeType
|
|
26
26
|
* @returns image sizes keyed to strings
|
|
27
27
|
*/
|
|
28
|
-
async function resizeAndSave(req, file, dimensions, staticPath, config, savedFilename, mimeType) {
|
|
28
|
+
async function resizeAndSave({ req, file, dimensions, staticPath, config, savedFilename, mimeType, }) {
|
|
29
29
|
const { imageSizes, disableLocalStorage } = config.upload;
|
|
30
30
|
const sizes = imageSizes
|
|
31
31
|
.filter((desiredSize) => desiredSize.width < dimensions.width || desiredSize.height < dimensions.height)
|
|
@@ -70,4 +70,4 @@ async function resizeAndSave(req, file, dimensions, staticPath, config, savedFil
|
|
|
70
70
|
}), {});
|
|
71
71
|
}
|
|
72
72
|
exports.default = resizeAndSave;
|
|
73
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
73
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2VSZXNpemVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL3VwbG9hZHMvaW1hZ2VSZXNpemVyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsNENBQW9CO0FBQ3BCLGtEQUEwQjtBQUMxQiwwRUFBeUM7QUFFekMsOERBQXNDO0FBZXRDLFNBQVMsY0FBYyxDQUFDLFdBQW1CLEVBQUUsSUFBZTtJQUMxRCxNQUFNLFNBQVMsR0FBRyxXQUFXLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDLEdBQUcsRUFBRSxDQUFDO0lBQy9DLE1BQU0sSUFBSSxHQUFHLElBQUEsMkJBQVEsRUFBQyxXQUFXLENBQUMsTUFBTSxDQUFDLENBQUMsRUFBRSxXQUFXLENBQUMsV0FBVyxDQUFDLEdBQUcsQ0FBQyxDQUFDLElBQUksV0FBVyxDQUFDLENBQUM7SUFFMUYsT0FBTztRQUNMLElBQUk7UUFDSixTQUFTO1FBQ1QsS0FBSyxFQUFFLElBQUksQ0FBQyxLQUFLO1FBQ2pCLE1BQU0sRUFBRSxJQUFJLENBQUMsTUFBTTtLQUNwQixDQUFDO0FBQ0osQ0FBQztBQUVEOzs7Ozs7O0dBT0c7QUFDWSxLQUFLLFVBQVUsYUFBYSxDQUFDLEVBQzFDLEdBQUcsRUFDSCxJQUFJLEVBQ0osVUFBVSxFQUNWLFVBQVUsRUFDVixNQUFNLEVBQ04sYUFBYSxFQUNiLFFBQVEsR0FDSDtJQUNMLE1BQU0sRUFBRSxVQUFVLEVBQUUsbUJBQW1CLEVBQUUsR0FBRyxNQUFNLENBQUMsTUFBTSxDQUFDO0lBRTFELE1BQU0sS0FBSyxHQUFHLFVBQVU7U0FDckIsTUFBTSxDQUFDLENBQUMsV0FBVyxFQUFFLEVBQUUsQ0FBQyxXQUFXLENBQUMsS0FBSyxHQUFHLFVBQVUsQ0FBQyxLQUFLLElBQUksV0FBVyxDQUFDLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1NBQ3ZHLEdBQUcsQ0FBQyxLQUFLLEVBQUUsV0FBVyxFQUFFLEVBQUU7UUFDekIsTUFBTSxPQUFPLEdBQUcsTUFBTSxJQUFBLGVBQUssRUFBQyxJQUFJLENBQUM7YUFDOUIsTUFBTSxDQUFDLFdBQVcsQ0FBQyxLQUFLLEVBQUUsV0FBVyxDQUFDLE1BQU0sRUFBRTtZQUM3QyxRQUFRLEVBQUUsV0FBVyxDQUFDLElBQUksSUFBSSxRQUFRO1NBQ3ZDLENBQUMsQ0FBQztRQUVMLE1BQU0sWUFBWSxHQUFHLE1BQU0sT0FBTyxDQUFDLFFBQVEsQ0FBQztZQUMxQyxpQkFBaUIsRUFBRSxJQUFJO1NBQ3hCLENBQUMsQ0FBQztRQUVILEdBQUcsQ0FBQyxrQkFBa0IsQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLEdBQUcsWUFBWSxDQUFDLElBQUksQ0FBQztRQUU3RCxNQUFNLFdBQVcsR0FBRyxjQUFjLENBQUMsYUFBYSxFQUFFLFdBQVcsQ0FBQyxDQUFDO1FBQy9ELE1BQU0sdUJBQXVCLEdBQUcsR0FBRyxXQUFXLENBQUMsSUFBSSxJQUFJLFlBQVksQ0FBQyxJQUFJLENBQUMsS0FBSyxJQUFJLFlBQVksQ0FBQyxJQUFJLENBQUMsTUFBTSxJQUFJLFdBQVcsQ0FBQyxTQUFTLEVBQUUsQ0FBQztRQUN0SSxNQUFNLFNBQVMsR0FBRyxHQUFHLFVBQVUsSUFBSSx1QkFBdUIsRUFBRSxDQUFDO1FBQzdELE1BQU0saUJBQWlCLEdBQUcsTUFBTSxJQUFBLG9CQUFVLEVBQUMsU0FBUyxDQUFDLENBQUM7UUFFdEQsSUFBSSxpQkFBaUIsRUFBRTtZQUNyQixZQUFFLENBQUMsVUFBVSxDQUFDLFNBQVMsQ0FBQyxDQUFDO1NBQzFCO1FBRUQsSUFBSSxDQUFDLG1CQUFtQixFQUFFO1lBQ3hCLE1BQU0sT0FBTyxDQUFDLE1BQU0sQ0FBQyxTQUFTLENBQUMsQ0FBQztTQUNqQztRQUVELE9BQU87WUFDTCxJQUFJLEVBQUUsV0FBVyxDQUFDLElBQUk7WUFDdEIsS0FBSyxFQUFFLFlBQVksQ0FBQyxJQUFJLENBQUMsS0FBSztZQUM5QixNQUFNLEVBQUUsWUFBWSxDQUFDLElBQUksQ0FBQyxNQUFNO1lBQ2hDLFFBQVEsRUFBRSx1QkFBdUI7WUFDakMsUUFBUSxFQUFFLFlBQVksQ0FBQyxJQUFJLENBQUMsSUFBSTtZQUNoQyxRQUFRO1NBQ1QsQ0FBQztJQUNKLENBQUMsQ0FBQyxDQUFDO0lBRUwsTUFBTSxVQUFVLEdBQUcsTUFBTSxPQUFPLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBRTVDLE9BQU8sVUFBVSxDQUFDLE1BQU0sQ0FBQyxDQUFDLE9BQU8sRUFBRSxJQUFJLEVBQUUsRUFBRSxDQUFDLENBQUM7UUFDM0MsR0FBRyxPQUFPO1FBQ1YsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEVBQUU7WUFDWCxLQUFLLEVBQUUsSUFBSSxDQUFDLEtBQUs7WUFDakIsTUFBTSxFQUFFLElBQUksQ0FBQyxNQUFNO1lBQ25CLFFBQVEsRUFBRSxJQUFJLENBQUMsUUFBUTtZQUN2QixRQUFRLEVBQUUsSUFBSSxDQUFDLFFBQVE7WUFDdkIsUUFBUSxFQUFFLElBQUksQ0FBQyxRQUFRO1NBQ3hCO0tBQ0YsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDO0FBQ1YsQ0FBQztBQTVERCxnQ0E0REMifQ==
|
package/dist/uploads/isImage.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
function isImage(mimeType) {
|
|
4
|
-
return ['image/jpeg', 'image/png', 'image/gif', 'image/svg+xml'].indexOf(mimeType) > -1;
|
|
4
|
+
return ['image/jpeg', 'image/png', 'image/gif', 'image/svg+xml', 'image/webp'].indexOf(mimeType) > -1;
|
|
5
5
|
}
|
|
6
6
|
exports.default = isImage;
|
|
7
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
7
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaXNJbWFnZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy91cGxvYWRzL2lzSW1hZ2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7QUFBQSxTQUF3QixPQUFPLENBQUMsUUFBZ0I7SUFDOUMsT0FBTyxDQUFDLFlBQVksRUFBRSxXQUFXLEVBQUUsV0FBVyxFQUFFLGVBQWUsRUFBRSxZQUFZLENBQUMsQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUM7QUFDeEcsQ0FBQztBQUZELDBCQUVDIn0=
|
|
@@ -17,4 +17,4 @@ const sanitizeInternalFields = (incomingDoc) => Object.entries(incomingDoc).redu
|
|
|
17
17
|
};
|
|
18
18
|
}, {});
|
|
19
19
|
exports.default = sanitizeInternalFields;
|
|
20
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
20
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2FuaXRpemVJbnRlcm5hbEZpZWxkcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy91dGlsaXRpZXMvc2FuaXRpemVJbnRlcm5hbEZpZWxkcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOztBQUVBLE1BQU0sY0FBYyxHQUFHLENBQUMsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLENBQUMsQ0FBQztBQUUvQyxNQUFNLHNCQUFzQixHQUFHLENBQTZCLFdBQVcsRUFBSyxFQUFFLENBQUMsTUFBTSxDQUFDLE9BQU8sQ0FBQyxXQUFXLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxNQUFNLEVBQUUsQ0FBQyxHQUFHLEVBQUUsR0FBRyxDQUFDLEVBQUssRUFBRTtJQUMxSSxJQUFJLEdBQUcsS0FBSyxLQUFLLEVBQUU7UUFDakIsT0FBTztZQUNMLEdBQUcsTUFBTTtZQUNULEVBQUUsRUFBRSxHQUFHO1NBQ1IsQ0FBQztLQUNIO0lBRUQsSUFBSSxjQUFjLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUMsQ0FBQyxFQUFFO1FBQ3BDLE9BQU8sTUFBTSxDQUFDO0tBQ2Y7SUFFRCxPQUFPO1FBQ0wsR0FBRyxNQUFNO1FBQ1QsQ0FBQyxHQUFHLENBQUMsRUFBRSxHQUFHO0tBQ1gsQ0FBQztBQUNKLENBQUMsRUFBRSxFQUFPLENBQUMsQ0FBQztBQUVaLGtCQUFlLHNCQUFzQixDQUFDIn0=
|
|
@@ -90,13 +90,13 @@ All Payload fields support the ability to swap in your own React components. So,
|
|
|
90
90
|
|
|
91
91
|
#### Sending and receiving values from the form
|
|
92
92
|
|
|
93
|
-
When swapping out the `Field` component, you'll be responsible for sending and receiving the field's `value` from the form itself. To do so, import the `
|
|
93
|
+
When swapping out the `Field` component, you'll be responsible for sending and receiving the field's `value` from the form itself. To do so, import the `useField` hook as follows:
|
|
94
94
|
|
|
95
95
|
```js
|
|
96
|
-
import {
|
|
96
|
+
import { useField } from 'payload/components/forms';
|
|
97
97
|
|
|
98
98
|
const CustomTextField = ({ path }) => {
|
|
99
|
-
const { value, setValue } =
|
|
99
|
+
const { value, setValue } = useField({ path });
|
|
100
100
|
|
|
101
101
|
return (
|
|
102
102
|
<input
|
package/docs/fields/blocks.mdx
CHANGED
|
@@ -106,3 +106,12 @@ const ExampleCollection = {
|
|
|
106
106
|
}
|
|
107
107
|
|
|
108
108
|
```
|
|
109
|
+
|
|
110
|
+
### TypeScript
|
|
111
|
+
|
|
112
|
+
As you build your own Block configs, you might want to store them in separate files but retain typing accordingly. To do so, you can import and use Payload's `Block` type:
|
|
113
|
+
|
|
114
|
+
```js
|
|
115
|
+
import type { Block } from 'payload/types';
|
|
116
|
+
|
|
117
|
+
```
|
package/docs/fields/overview.mdx
CHANGED
|
@@ -239,3 +239,15 @@ This example will display the number of characters allowed as the user types.
|
|
|
239
239
|
}
|
|
240
240
|
```
|
|
241
241
|
This component will count the number of characters entered.
|
|
242
|
+
|
|
243
|
+
### TypeScript
|
|
244
|
+
|
|
245
|
+
You can import the internal Payload `Field` type as well as other common field types as follows:
|
|
246
|
+
|
|
247
|
+
```js
|
|
248
|
+
import type {
|
|
249
|
+
Field,
|
|
250
|
+
Validate,
|
|
251
|
+
Condition,
|
|
252
|
+
} from 'payload/types';
|
|
253
|
+
```
|
|
@@ -313,3 +313,14 @@ Above, you can see that we are creating a custom SlateJS element with a name of
|
|
|
313
313
|
|
|
314
314
|
The plugin itself extends Payload's built-in `shouldBreakOutOnEnter` Slate function to add its own element name to the list of elements that should "break out" when the `enter` key is pressed.
|
|
315
315
|
|
|
316
|
+
### TypeScript
|
|
317
|
+
|
|
318
|
+
If you are building your own custom Rich Text elements or leaves, you may benefit from importing the following types:
|
|
319
|
+
|
|
320
|
+
```js
|
|
321
|
+
import type {
|
|
322
|
+
RichTextCustomElement,
|
|
323
|
+
RichTextCustomLeaf,
|
|
324
|
+
} from 'payload/types';
|
|
325
|
+
|
|
326
|
+
```
|
|
@@ -188,3 +188,26 @@ const afterLoginHook = async ({
|
|
|
188
188
|
return user;
|
|
189
189
|
}
|
|
190
190
|
```
|
|
191
|
+
|
|
192
|
+
## TypeScript
|
|
193
|
+
|
|
194
|
+
Payload exports a type for each Collection hook which can be accessed as follows:
|
|
195
|
+
|
|
196
|
+
```js
|
|
197
|
+
import type {
|
|
198
|
+
CollectionBeforeOperationHook,
|
|
199
|
+
CollectionBeforeValidateHook,
|
|
200
|
+
CollectionBeforeChangeHook,
|
|
201
|
+
CollectionAfterChangeHook,
|
|
202
|
+
CollectionAfterReadHook,
|
|
203
|
+
CollectionBeforeReadHook,
|
|
204
|
+
CollectionBeforeDeleteHook,
|
|
205
|
+
CollectionAfterDeleteHook,
|
|
206
|
+
CollectionBeforeLoginHook,
|
|
207
|
+
CollectionAfterLoginHook,
|
|
208
|
+
CollectionAfterForgotPasswordHook,
|
|
209
|
+
} from 'payload/types';
|
|
210
|
+
|
|
211
|
+
// Use hook types here...
|
|
212
|
+
}
|
|
213
|
+
```
|
package/docs/hooks/fields.mdx
CHANGED
|
@@ -70,3 +70,31 @@ All field hooks can optionally modify the return value of the field before the o
|
|
|
70
70
|
<strong>Important</strong><br/>
|
|
71
71
|
Due to GraphQL's typed nature, you should never change the type of data that you return from a field, otherwise GraphQL will produce errors. If you need to change the shape or type of data, reconsider Field Hooks and instead evaluate if Collection / Global hooks might suit you better.
|
|
72
72
|
</Banner>
|
|
73
|
+
|
|
74
|
+
## TypeScript
|
|
75
|
+
|
|
76
|
+
Payload exports a type for field hooks which can be accessed and used as follows:
|
|
77
|
+
|
|
78
|
+
```js
|
|
79
|
+
import type { FieldHook } from 'payload/types';
|
|
80
|
+
|
|
81
|
+
// Field hook type is a generic that takes two arguments:
|
|
82
|
+
// 1: The document type
|
|
83
|
+
// 2: the value type
|
|
84
|
+
|
|
85
|
+
type ExampleFieldHook = FieldHook<ExampleDocumentType, string>;
|
|
86
|
+
|
|
87
|
+
const exampleFieldHook: ExampleFieldHook = (args) => {
|
|
88
|
+
const {
|
|
89
|
+
value, // Typed as `string` as shown above
|
|
90
|
+
data, // Typed as a Partial of your ExampleDocumentType
|
|
91
|
+
originalDoc, // Typed as ExampleDocumentType
|
|
92
|
+
operation,
|
|
93
|
+
req,
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
// Do something here...
|
|
97
|
+
|
|
98
|
+
return value; // should return a string as typed above, undefined, or null
|
|
99
|
+
}
|
|
100
|
+
```
|
package/docs/hooks/globals.mdx
CHANGED
|
@@ -98,3 +98,20 @@ const afterReadHook = async ({
|
|
|
98
98
|
req, // full express request
|
|
99
99
|
}) => {...}
|
|
100
100
|
```
|
|
101
|
+
|
|
102
|
+
## TypeScript
|
|
103
|
+
|
|
104
|
+
Payload exports a type for each Global hook which can be accessed as follows:
|
|
105
|
+
|
|
106
|
+
```js
|
|
107
|
+
import type {
|
|
108
|
+
GlobalBeforeValidateHook,
|
|
109
|
+
GlobalBeforeChangeHook,
|
|
110
|
+
GlobalAfterChangeHook,
|
|
111
|
+
GlobalBeforeReadHook,
|
|
112
|
+
GlobalAfterReadHook,
|
|
113
|
+
} from 'payload/types';
|
|
114
|
+
|
|
115
|
+
// Use hook types here...
|
|
116
|
+
}
|
|
117
|
+
```
|
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: Generating TypeScript Interfaces
|
|
3
|
+
label: Generating Types
|
|
4
|
+
order: 20
|
|
5
|
+
desc: Generate your own TypeScript interfaces based on your collections and globals.
|
|
6
|
+
keywords: headless cms, typescript, documentation, Content Management System, cms, headless, javascript, node, react, express
|
|
7
|
+
---
|
|
8
|
+
|
|
9
|
+
While building your own custom functionality into Payload, like plugins, hooks, access control functions, custom routes, GraphQL queries / mutations, or anything else, you may benefit from generating your own TypeScript types dynamically from your Payload config itself.
|
|
10
|
+
|
|
11
|
+
Run the following command in a Payload project to generate types:
|
|
12
|
+
|
|
13
|
+
```
|
|
14
|
+
payload generate:types
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
You can run this command whenever you need to regenerate your types, and then you can use these types in your Payload code directly.
|
|
18
|
+
|
|
19
|
+
For example, let's look at the following simple Payload config:
|
|
20
|
+
|
|
21
|
+
```ts
|
|
22
|
+
const config: Config = {
|
|
23
|
+
serverURL: process.env.PAYLOAD_PUBLIC_SERVER_URL,
|
|
24
|
+
admin: {
|
|
25
|
+
user: 'users',
|
|
26
|
+
}
|
|
27
|
+
collections: [
|
|
28
|
+
{
|
|
29
|
+
slug: 'users',
|
|
30
|
+
fields: [
|
|
31
|
+
{
|
|
32
|
+
name: 'name',
|
|
33
|
+
type: 'text',
|
|
34
|
+
required: true,
|
|
35
|
+
}
|
|
36
|
+
]
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
slug: 'posts',
|
|
40
|
+
admin: {
|
|
41
|
+
useAsTitle: 'title',
|
|
42
|
+
},
|
|
43
|
+
fields: [
|
|
44
|
+
{
|
|
45
|
+
name: 'title',
|
|
46
|
+
type: 'text',
|
|
47
|
+
},
|
|
48
|
+
{
|
|
49
|
+
name: 'author',
|
|
50
|
+
type: 'relationship',
|
|
51
|
+
relationTo: 'users',
|
|
52
|
+
},
|
|
53
|
+
]
|
|
54
|
+
}
|
|
55
|
+
]
|
|
56
|
+
}
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
By generating types, we'll end up with a file containing the following two TypeScript interfaces:
|
|
60
|
+
|
|
61
|
+
```ts
|
|
62
|
+
export interface User {
|
|
63
|
+
id: string;
|
|
64
|
+
name: string;
|
|
65
|
+
email?: string;
|
|
66
|
+
resetPasswordToken?: string;
|
|
67
|
+
resetPasswordExpiration?: string;
|
|
68
|
+
loginAttempts?: number;
|
|
69
|
+
lockUntil?: string;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
export interface Post {
|
|
73
|
+
id: string;
|
|
74
|
+
title?: string;
|
|
75
|
+
author?: string | User;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
#### Customizing the output path of your generated types
|
|
81
|
+
|
|
82
|
+
You can specify where you want your types to be generated by adding a property to your Payload config:
|
|
83
|
+
|
|
84
|
+
```
|
|
85
|
+
{
|
|
86
|
+
// the remainder of your config
|
|
87
|
+
typescript: {
|
|
88
|
+
outputFile: path.resolve(__dirname, './generated-types.ts'),
|
|
89
|
+
},
|
|
90
|
+
}
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
The above example places your types next to your Payload config itself as the file `generated-types.ts`. By default, the file will be output to your current working directory as `payload-types.ts`.
|
|
94
|
+
|
|
95
|
+
#### Adding an NPM script
|
|
96
|
+
|
|
97
|
+
<Banner type="warning">
|
|
98
|
+
<strong>Important:</strong><br/>
|
|
99
|
+
Payload needs to be able to find your config to generate your types.
|
|
100
|
+
</Banner>
|
|
101
|
+
|
|
102
|
+
Payload will automatically try and locate your config, but might not always be able to find it. For example, if you are working in a `/src` directory or similar, you need to tell Payload where to find your config manually by using an environment variable. If this applies to you, you can create an NPM script to make generating your types easier.
|
|
103
|
+
|
|
104
|
+
To add an NPM script to generate your types and show Payload where to find your config, open your `package.json` and update the `scripts` property to the following:
|
|
105
|
+
|
|
106
|
+
```
|
|
107
|
+
{
|
|
108
|
+
"scripts": {
|
|
109
|
+
"generate:types": "PAYLOAD_CONFIG_PATH=src/payload.config.ts payload generate:types",
|
|
110
|
+
},
|
|
111
|
+
}
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
Now you can run `yarn generate:types` to easily generate your types.
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: TypeScript - Overview
|
|
3
|
+
label: Overview
|
|
4
|
+
order: 10
|
|
5
|
+
desc: Payload is the most powerful TypeScript headless CMS available.
|
|
6
|
+
keywords: headless cms, typescript, documentation, Content Management System, cms, headless, javascript, node, react, express
|
|
7
|
+
---
|
|
8
|
+
|
|
9
|
+
Payload supports TypeScript natively, and not only that, the entirety of the CMS is built with TypeScript. To get started developing with Payload and TypeScript, you can use one of Payload's built-in boilerplates in one line via `create-payload-app`:
|
|
10
|
+
|
|
11
|
+
```
|
|
12
|
+
npx create-payload-app
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
Pick a TypeScript project type to get started easily.
|
|
16
|
+
|
|
17
|
+
#### Setting up from Scratch
|
|
18
|
+
|
|
19
|
+
It's also possible to set up a TypeScript project from scratch. We plan to write up a guide for exactly how—so keep an eye out for that, too.
|
|
20
|
+
|
|
21
|
+
## Using Payload's Exported Types
|
|
22
|
+
|
|
23
|
+
Payload exports a number of types that you may find useful while writing your own plugins, hooks, access control functions, custom routes, GraphQL queries / mutations, or anything else.
|
|
24
|
+
|
|
25
|
+
##### Config Types
|
|
26
|
+
|
|
27
|
+
- [Base config](/docs/configuration/overview#typescript)
|
|
28
|
+
- [Collections](/docs/configuration/collections#typescript)
|
|
29
|
+
- [Globals](/docs/configuration/globals#typescript)
|
|
30
|
+
- [Fields](/docs/fields/overview#typescript)
|
|
31
|
+
|
|
32
|
+
##### Hook Types
|
|
33
|
+
|
|
34
|
+
- [Collection hooks](/docs/hooks/collections#typescript)
|
|
35
|
+
- [Global hooks](/docs/hooks/globals#typescript)
|
|
36
|
+
- [Field hooks](/docs/hooks/fields#typescript)
|
package/package.json
CHANGED
package/types.d.ts
CHANGED
|
@@ -16,5 +16,21 @@ export {
|
|
|
16
16
|
AfterForgotPasswordHook as CollectionAfterForgotPasswordHook,
|
|
17
17
|
} from './dist/collections/config/types';
|
|
18
18
|
|
|
19
|
-
export {
|
|
20
|
-
|
|
19
|
+
export {
|
|
20
|
+
GlobalConfig,
|
|
21
|
+
SanitizedGlobalConfig,
|
|
22
|
+
BeforeValidateHook as GlobalBeforeValidateHook,
|
|
23
|
+
BeforeChangeHook as GlobalBeforeChangeHook,
|
|
24
|
+
AfterChangeHook as GlobalAfterChangeHook,
|
|
25
|
+
BeforeReadHook as GlobalBeforeReadHook,
|
|
26
|
+
AfterReadHook as GlobalAfterReadHook,
|
|
27
|
+
} from './dist/globals/config/types';
|
|
28
|
+
|
|
29
|
+
export {
|
|
30
|
+
Field,
|
|
31
|
+
FieldHook,
|
|
32
|
+
FieldAccess,
|
|
33
|
+
RichTextCustomElement,
|
|
34
|
+
RichTextCustomLeaf,
|
|
35
|
+
Block,
|
|
36
|
+
} from './dist/fields/config/types';
|