nextjs-cms 0.5.9 → 0.5.10

package/dist/core/fields/richText.js

@@ -1,338 +1,338 @@
-import { Field, baseFieldConfigSchema } from "./field.js";
-import { entityKind } from "../helpers.js";
-import * as z from 'zod';
-import { customAlphabet } from 'nanoid';
-import sharp from 'sharp';
-import path from 'path';
-import { db } from "../../db/client.js";
-import { EditorPhotosTable } from "../../db/schema.js";
-import fs from 'fs';
-import { and, eq } from 'drizzle-orm';
-import { getCMSConfig } from "../config.js";
-import { sanitizeRichText } from "../security/dom.js";
-const positiveInt = z.number().int().positive();
-const nonNegativeInt = z.number().int().nonnegative();
-const allowImageUploadsSchema = z.strictObject({
-    /**
-     * The public URL prefix for inline photos.
-     * This url should be handled by the website app, not the NextJS-CMS app
-     * This is the URL that will be used to access the photos publicly on the website
-     * The name of the photo will be appended to this URL
-     */
-    publicURLPrefix: z.url().describe('The public URL prefix for inline photos'),
-    size: z
-        .strictObject({
-        width: positiveInt,
-        height: positiveInt,
-        crop: z.boolean().default(false),
-    })
-        .optional(),
-    maxFileSize: z
-        .strictObject({
-        size: positiveInt,
-        unit: z.enum(['kb', 'mb']),
-    })
-        .optional(),
-    handleMethod: z.enum(['base64', 'tempSave']).optional(),
-    /**
-     * Omit the extension of the image when saving it to disk
-     */
-    omitExtension: z.boolean().optional(),
-    format: z.enum(['webp', 'jpg', 'jpeg', 'png']).optional(),
-});
-const baseRichTextExtraConfigSchema = z
-    .strictObject({
-    placeholder: z.string().optional(),
-    minLength: nonNegativeInt.optional(),
-    maxLength: positiveInt.optional(),
-    /**
-     * Whether to sanitize the value before saving it to the database.
-     * If true, the value will be sanitized using DOMPurify (removes scripts, keeps HTML).
-     * If false, the value will be saved as is (raw input).
-     * @default true
-     */
-    sanitize: z.boolean().optional().describe('Sanitize the value before saving'),
-})
-    .superRefine((value, ctx) => {
-    if (value.minLength !== undefined && value.maxLength !== undefined && value.minLength > value.maxLength) {
-        ctx.addIssue({
-            code: 'custom',
-            path: ['maxLength'],
-            message: 'maxLength must be greater than or equal to minLength',
-        });
-    }
-});
-const richTextFieldWithMediaConfigSchema = baseRichTextExtraConfigSchema.safeExtend({
-    allowMedia: z.literal(true),
-    allowImageUploads: allowImageUploadsSchema.optional(),
-});
-const richTextFieldWithoutMediaConfigSchema = baseRichTextExtraConfigSchema.safeExtend({
-    allowMedia: z.literal(false).optional(),
-});
-const configSchema = z.discriminatedUnion('allowMedia', [
-    richTextFieldWithMediaConfigSchema,
-    richTextFieldWithoutMediaConfigSchema,
-]);
-export class RichTextField extends Field {
-    static [entityKind] = 'RichTextField';
-    maxLength;
-    minLength;
-    placeholder;
-    allowMedia;
-    allowImageUploads;
-    sanitize;
-    _inlinePhotos = [];
-    uploadsFolder = getCMSConfig().files.upload.uploadPath;
-    constructor(config) {
-        super(config, 'rich_text');
-        this.maxLength = config.maxLength;
-        this.minLength = config.minLength;
-        this.placeholder = config.placeholder;
-        this.sanitize = config.sanitize ?? true;
-        if (config.allowMedia && config.allowImageUploads?.publicURLPrefix) {
-            this.allowMedia = true;
-            this.allowImageUploads = {
-                publicURLPrefix: config.allowImageUploads.publicURLPrefix,
-                size: config.allowImageUploads.size ?? { width: 400, height: 400, crop: false },
-                maxFileSize: config.allowImageUploads.maxFileSize ?? { size: 1, unit: 'mb' },
-                handleMethod: config.allowImageUploads.handleMethod ?? 'base64',
-                omitExtension: config.allowImageUploads.omitExtension ?? true,
-                format: config.allowImageUploads.format ?? 'webp',
-            };
-        }
-        else {
-            this.allowMedia = false;
-            this.allowImageUploads = false;
-        }
-    }
-    /**
-     * Get the value of the field
-     */
-    getValue() {
-        return this.value;
-    }
-    exportForClient() {
-        return {
-            ...super.exportForClient(),
-            maxLength: this.maxLength,
-            minLength: this.minLength,
-            placeholder: this.placeholder,
-            allowMedia: this.allowMedia,
-            allowImageUploads: this.allowImageUploads,
-            sanitize: this.sanitize,
-        };
-    }
-    /**
-     * Sanitize the value
-     */
-    sanitizeValue() {
-        /**
-         * Check if the value is not undefined
-         */
-        if (this.value !== undefined && this.sanitize) {
-            /**
-             * Sanitize the value
-             */
-            this.value = sanitizeRichText(this.value);
-        }
-    }
-    checkRequired() {
-        /**
-         * Check if the field is required
-         */
-        if (this.required) {
-            if (!this.value || this.value.trim().length === 0) {
-                throw new Error(`Field ${this.label} is required`);
-            }
-        }
-    }
-    /**
-     * Extract inline images from the value
-     */
-    extractInlineImages() {
-        if (!this.value)
-            return;
-        if (!this.allowImageUploads)
-            return;
-        const regex = /<img.*?src="(data:image\/.*?;base64,.*?)".*?>/g;
-        const matches = this.value.matchAll(regex);
-        for (const match of matches) {
-            const base64String = match[1];
-            const extension = base64String.split(';')[0].split('/')[1];
-            const randomString = customAlphabet('1234567890abcdef', 21)();
-            const name = `${randomString}${this.allowImageUploads.omitExtension ? '' : `.${extension}`}`;
-            this._inlinePhotos.push({
-                base64String,
-                extension,
-                name: name,
-            });
-            /**
-             * Replace the inline image src with the name of the image
-             */
-            this.value = this.value.replace(base64String, `${this.allowImageUploads?.publicURLPrefix}/${name}`);
-        }
-    }
-    async writeInlineImages(sectionName, itemId) {
-        if (!this.allowImageUploads)
-            return;
-        /**
-         * If .photos, and 'sectionName' folders don't exist, create them
-         */
-        const photosFolder = path.join(this.uploadsFolder, '.photos', sectionName);
-        if (!fs.existsSync(photosFolder)) {
-            fs.mkdirSync(photosFolder, { recursive: true });
-        }
-        for (const photo of this._inlinePhotos) {
-            const str = photo.base64String.split(',')[1];
-            if (!str)
-                continue;
-            /**
-             * Use sharp to write the image to disk
-             */
-            const buffer = Buffer.from(str, 'base64');
-            sharp.cache({ files: 0 });
-            sharp.cache(false);
-            const image = sharp(buffer);
-            await image
-                .toFormat(this.allowImageUploads.format ?? 'webp')
-                .toFile(path.join(this.uploadsFolder, '.photos', sectionName, photo.name));
-            /**
-             * Insert the image into the database
-             */
-            await db.insert(EditorPhotosTable).values({
-                name: photo.name,
-                itemId: itemId,
-                section: sectionName,
-                field: this.name,
-                linked: true,
-            });
-            /**
-             * Destroy the image to free up memory
-             */
-            image.destroy();
-        }
-    }
-    /**
-     * Prepare the field for submission
-     */
-    async prepareForSubmission() {
-        /**
-         * Sanitize the value
-         */
-        this.sanitizeValue();
-        /**
-         * Check minimum length
-         */
-        if (this.minLength) {
-            if (this.minLength > this.value.length) {
-                throw new Error(`Field ${this.label} must be at least ${this.minLength} characters long`);
-            }
-        }
-        /**
-         * Check maximum length
-         */
-        if (this.maxLength) {
-            if (this.maxLength < this.value.length) {
-                throw new Error(`Field ${this.label} must be at most ${this.maxLength} characters long`);
-            }
-        }
-        this.extractInlineImages();
-    }
-    async postSubmit({ sectionName, itemId }) {
-        if (!this._inlinePhotos)
-            return;
-        /**
-         * First, check if there are any inline images saved in the `editor_photos` table (edit operation)
-         * If there are, check if they are still present in the rich text value
-         * If they are not present (admin deleted them), delete them from the database and disk
-         */
-        await this.checkPreviousInlineImages(sectionName, itemId);
-        await this.writeInlineImages(sectionName, itemId);
-    }
-    async checkPreviousInlineImages(sectionName, itemId) {
-        if (!this.allowImageUploads)
-            return;
-        /**
-         * Get all the photos saved in the database for this field
-         */
-        const tablePhotos = await db
-            .select()
-            .from(EditorPhotosTable)
-            .where(and(eq(EditorPhotosTable.section, sectionName), eq(EditorPhotosTable.itemId, itemId), eq(EditorPhotosTable.field, this.name)));
-        if (tablePhotos.length === 0)
-            return;
-        /**
-         * Extract the photos from the value (only photos that has the publicURLPrefix)
-         */
-        const regex = new RegExp(`${this.allowImageUploads.publicURLPrefix}/(.*?)`, 'g');
-        const matches = this.value.matchAll(regex);
-        const photosInValue = [];
-        for (const match of matches) {
-            photosInValue.push(match[1]);
-        }
-        /**
-         * Check if the photos in the database are still present in the value
-         */
-        for (const tablePhoto of tablePhotos) {
-            if (!photosInValue.includes(tablePhoto.name)) {
-                /**
-                 * Delete the photo from the database
-                 */
-                await db
-                    .delete(EditorPhotosTable)
-                    .where(and(eq(EditorPhotosTable.section, sectionName), eq(EditorPhotosTable.itemId, itemId), eq(EditorPhotosTable.field, this.name), eq(EditorPhotosTable.name, tablePhoto.name)));
-                /**
-                 * Delete the photo from disk
-                 */
-                try {
-                    await fs.promises.unlink(path.join(this.uploadsFolder, '.photos', sectionName, tablePhoto.name));
-                }
-                catch (error) {
-                    console.log(`${this.label}: Error deleting file from disk`);
-                }
-            }
-        }
-    }
-}
-const richTextFieldWithMediaOptionsSchema = z.strictObject({
-    ...baseFieldConfigSchema.shape,
-    ...richTextFieldWithMediaConfigSchema.shape,
-});
-const richTextFieldWithoutMediaOptionsSchema = z.strictObject({
-    ...baseFieldConfigSchema.shape,
-    ...richTextFieldWithoutMediaConfigSchema.shape,
-});
-const optionsSchema = z.discriminatedUnion('allowMedia', [
-    richTextFieldWithMediaOptionsSchema,
-    richTextFieldWithoutMediaOptionsSchema,
-]);
-const richTextFieldConfigSchema = z.intersection(optionsSchema, z.strictObject({
-    type: z.literal('rich_text').describe('The type of the field'),
-    build: z
-        .function()
-        .output(z.instanceof(RichTextField))
-        .describe('Build a RichTextField instance from this config'),
-}));
-/**
- * Helper function to create a rich text field configuration
- * Returns a config object with a build() method that can be serialized and used anywhere
- * @param field
- */
-export function richTextField(field) {
-    /**
-     * Validate the field config
-     */
-    const result = optionsSchema.safeParse(field);
-    if (!result.success) {
-        throw new Error(`[Field: ${field.name}]: ${z.prettifyError(result.error)}`);
-    }
-    const config = {
-        ...field,
-        type: 'rich_text',
-        build() {
-            // Use the original field config directly (it doesn't have build() method)
-            return new RichTextField(field);
-        },
-    };
-    return config;
-}
+import { Field, baseFieldConfigSchema } from './field.js';
+import { entityKind } from '../helpers/index.js';
+import * as z from 'zod';
+import { customAlphabet } from 'nanoid';
+import sharp from 'sharp';
+import path from 'path';
+import { db } from '../../db/client.js';
+import { EditorPhotosTable } from '../../db/schema.js';
+import fs from 'fs';
+import { and, eq } from 'drizzle-orm';
+import { getCMSConfig } from '../config/index.js';
+import { sanitizeRichText } from '../security/dom.js';
+const positiveInt = z.number().int().positive();
+const nonNegativeInt = z.number().int().nonnegative();
+const allowImageUploadsSchema = z.strictObject({
+    /**
+     * The public URL prefix for inline photos.
+     * This url should be handled by the website app, not the NextJS-CMS app
+     * This is the URL that will be used to access the photos publicly on the website
+     * The name of the photo will be appended to this URL
+     */
+    publicURLPrefix: z.url().describe('The public URL prefix for inline photos'),
+    size: z
+        .strictObject({
+        width: positiveInt,
+        height: positiveInt,
+        crop: z.boolean().default(false),
+    })
+        .optional(),
+    maxFileSize: z
+        .strictObject({
+        size: positiveInt,
+        unit: z.enum(['kb', 'mb']),
+    })
+        .optional(),
+    handleMethod: z.enum(['base64', 'tempSave']).optional(),
+    /**
+     * Omit the extension of the image when saving it to disk
+     */
+    omitExtension: z.boolean().optional(),
+    format: z.enum(['webp', 'jpg', 'jpeg', 'png']).optional(),
+});
+const baseRichTextExtraConfigSchema = z
+    .strictObject({
+    placeholder: z.string().optional(),
+    minLength: nonNegativeInt.optional(),
+    maxLength: positiveInt.optional(),
+    /**
+     * Whether to sanitize the value before saving it to the database.
+     * If true, the value will be sanitized using DOMPurify (removes scripts, keeps HTML).
+     * If false, the value will be saved as is (raw input).
+     * @default true
+     */
+    sanitize: z.boolean().optional().describe('Sanitize the value before saving'),
+})
+    .superRefine((value, ctx) => {
+    if (value.minLength !== undefined && value.maxLength !== undefined && value.minLength > value.maxLength) {
+        ctx.addIssue({
+            code: 'custom',
+            path: ['maxLength'],
+            message: 'maxLength must be greater than or equal to minLength',
+        });
+    }
+});
+const richTextFieldWithMediaConfigSchema = baseRichTextExtraConfigSchema.safeExtend({
+    allowMedia: z.literal(true),
+    allowImageUploads: allowImageUploadsSchema.optional(),
+});
+const richTextFieldWithoutMediaConfigSchema = baseRichTextExtraConfigSchema.safeExtend({
+    allowMedia: z.literal(false).optional(),
+});
+const configSchema = z.discriminatedUnion('allowMedia', [
+    richTextFieldWithMediaConfigSchema,
+    richTextFieldWithoutMediaConfigSchema,
+]);
+export class RichTextField extends Field {
+    static [entityKind] = 'RichTextField';
+    maxLength;
+    minLength;
+    placeholder;
+    allowMedia;
+    allowImageUploads;
+    sanitize;
+    _inlinePhotos = [];
+    uploadsFolder = getCMSConfig().files.upload.uploadPath;
+    constructor(config) {
+        super(config, 'rich_text');
+        this.maxLength = config.maxLength;
+        this.minLength = config.minLength;
+        this.placeholder = config.placeholder;
+        this.sanitize = config.sanitize ?? true;
+        if (config.allowMedia && config.allowImageUploads?.publicURLPrefix) {
+            this.allowMedia = true;
+            this.allowImageUploads = {
+                publicURLPrefix: config.allowImageUploads.publicURLPrefix,
+                size: config.allowImageUploads.size ?? { width: 400, height: 400, crop: false },
+                maxFileSize: config.allowImageUploads.maxFileSize ?? { size: 1, unit: 'mb' },
+                handleMethod: config.allowImageUploads.handleMethod ?? 'base64',
+                omitExtension: config.allowImageUploads.omitExtension ?? true,
+                format: config.allowImageUploads.format ?? 'webp',
+            };
+        }
+        else {
+            this.allowMedia = false;
+            this.allowImageUploads = false;
+        }
+    }
+    /**
+     * Get the value of the field
+     */
+    getValue() {
+        return this.value;
+    }
+    exportForClient() {
+        return {
+            ...super.exportForClient(),
+            maxLength: this.maxLength,
+            minLength: this.minLength,
+            placeholder: this.placeholder,
+            allowMedia: this.allowMedia,
+            allowImageUploads: this.allowImageUploads,
+            sanitize: this.sanitize,
+        };
+    }
+    /**
+     * Sanitize the value
+     */
+    sanitizeValue() {
+        /**
+         * Check if the value is not undefined
+         */
+        if (this.value !== undefined && this.sanitize) {
+            /**
+             * Sanitize the value
+             */
+            this.value = sanitizeRichText(this.value);
+        }
+    }
+    checkRequired() {
+        /**
+         * Check if the field is required
+         */
+        if (this.required) {
+            if (!this.value || this.value.trim().length === 0) {
+                throw new Error(`Field ${this.label} is required`);
+            }
+        }
+    }
+    /**
+     * Extract inline images from the value
+     */
+    extractInlineImages() {
+        if (!this.value)
+            return;
+        if (!this.allowImageUploads)
+            return;
+        const regex = /<img.*?src="(data:image\/.*?;base64,.*?)".*?>/g;
+        const matches = this.value.matchAll(regex);
+        for (const match of matches) {
+            const base64String = match[1];
+            const extension = base64String.split(';')[0].split('/')[1];
+            const randomString = customAlphabet('1234567890abcdef', 21)();
+            const name = `${randomString}${this.allowImageUploads.omitExtension ? '' : `.${extension}`}`;
+            this._inlinePhotos.push({
+                base64String,
+                extension,
+                name: name,
+            });
+            /**
+             * Replace the inline image src with the name of the image
+             */
+            this.value = this.value.replace(base64String, `${this.allowImageUploads?.publicURLPrefix}/${name}`);
+        }
+    }
+    async writeInlineImages(sectionName, itemId) {
+        if (!this.allowImageUploads)
+            return;
+        /**
+         * If .photos, and 'sectionName' folders don't exist, create them
+         */
+        const photosFolder = path.join(this.uploadsFolder, '.photos', sectionName);
+        if (!fs.existsSync(photosFolder)) {
+            fs.mkdirSync(photosFolder, { recursive: true });
+        }
+        for (const photo of this._inlinePhotos) {
+            const str = photo.base64String.split(',')[1];
+            if (!str)
+                continue;
+            /**
+             * Use sharp to write the image to disk
+             */
+            const buffer = Buffer.from(str, 'base64');
+            sharp.cache({ files: 0 });
+            sharp.cache(false);
+            const image = sharp(buffer);
+            await image
+                .toFormat(this.allowImageUploads.format ?? 'webp')
+                .toFile(path.join(this.uploadsFolder, '.photos', sectionName, photo.name));
+            /**
+             * Insert the image into the database
+             */
+            await db.insert(EditorPhotosTable).values({
+                name: photo.name,
+                itemId: itemId,
+                section: sectionName,
+                field: this.name,
+                linked: true,
+            });
+            /**
+             * Destroy the image to free up memory
+             */
+            image.destroy();
+        }
+    }
+    /**
+     * Prepare the field for submission
+     */
+    async prepareForSubmission() {
+        /**
+         * Sanitize the value
+         */
+        this.sanitizeValue();
+        /**
+         * Check minimum length
+         */
+        if (this.minLength) {
+            if (this.minLength > this.value.length) {
+                throw new Error(`Field ${this.label} must be at least ${this.minLength} characters long`);
+            }
+        }
+        /**
+         * Check maximum length
+         */
+        if (this.maxLength) {
+            if (this.maxLength < this.value.length) {
+                throw new Error(`Field ${this.label} must be at most ${this.maxLength} characters long`);
+            }
+        }
+        this.extractInlineImages();
+    }
+    async postSubmit({ sectionName, itemId }) {
+        if (!this._inlinePhotos)
+            return;
+        /**
+         * First, check if there are any inline images saved in the `editor_photos` table (edit operation)
+         * If there are, check if they are still present in the rich text value
+         * If they are not present (admin deleted them), delete them from the database and disk
+         */
+        await this.checkPreviousInlineImages(sectionName, itemId);
+        await this.writeInlineImages(sectionName, itemId);
+    }
+    async checkPreviousInlineImages(sectionName, itemId) {
+        if (!this.allowImageUploads)
+            return;
+        /**
+         * Get all the photos saved in the database for this field
+         */
+        const tablePhotos = await db
+            .select()
+            .from(EditorPhotosTable)
+            .where(and(eq(EditorPhotosTable.section, sectionName), eq(EditorPhotosTable.itemId, itemId), eq(EditorPhotosTable.field, this.name)));
+        if (tablePhotos.length === 0)
+            return;
+        /**
+         * Extract the photos from the value (only photos that has the publicURLPrefix)
+         */
+        const regex = new RegExp(`${this.allowImageUploads.publicURLPrefix}/(.*?)`, 'g');
+        const matches = this.value.matchAll(regex);
+        const photosInValue = [];
+        for (const match of matches) {
+            photosInValue.push(match[1]);
+        }
+        /**
+         * Check if the photos in the database are still present in the value
+         */
+        for (const tablePhoto of tablePhotos) {
+            if (!photosInValue.includes(tablePhoto.name)) {
+                /**
+                 * Delete the photo from the database
+                 */
+                await db
+                    .delete(EditorPhotosTable)
+                    .where(and(eq(EditorPhotosTable.section, sectionName), eq(EditorPhotosTable.itemId, itemId), eq(EditorPhotosTable.field, this.name), eq(EditorPhotosTable.name, tablePhoto.name)));
+                /**
+                 * Delete the photo from disk
+                 */
+                try {
+                    await fs.promises.unlink(path.join(this.uploadsFolder, '.photos', sectionName, tablePhoto.name));
+                }
+                catch (error) {
+                    console.log(`${this.label}: Error deleting file from disk`);
+                }
+            }
+        }
+    }
+}
+const richTextFieldWithMediaOptionsSchema = z.strictObject({
+    ...baseFieldConfigSchema.shape,
+    ...richTextFieldWithMediaConfigSchema.shape,
+});
+const richTextFieldWithoutMediaOptionsSchema = z.strictObject({
+    ...baseFieldConfigSchema.shape,
+    ...richTextFieldWithoutMediaConfigSchema.shape,
+});
+const optionsSchema = z.discriminatedUnion('allowMedia', [
+    richTextFieldWithMediaOptionsSchema,
+    richTextFieldWithoutMediaOptionsSchema,
+]);
+const richTextFieldConfigSchema = z.intersection(optionsSchema, z.strictObject({
+    type: z.literal('rich_text').describe('The type of the field'),
+    build: z
+        .function()
+        .output(z.instanceof(RichTextField))
+        .describe('Build a RichTextField instance from this config'),
+}));
+/**
+ * Helper function to create a rich text field configuration
+ * Returns a config object with a build() method that can be serialized and used anywhere
+ * @param field
+ */
+export function richTextField(field) {
+    /**
+     * Validate the field config
+     */
+    const result = optionsSchema.safeParse(field);
+    if (!result.success) {
+        throw new Error(`[Field: ${field.name}]: ${z.prettifyError(result.error)}`);
+    }
+    const config = {
+        ...field,
+        type: 'rich_text',
+        build() {
+            // Use the original field config directly (it doesn't have build() method)
+            return new RichTextField(field);
+        },
+    };
+    return config;
+}