@rebasepro/cms 0.17.3 → 0.18.0

package/src/collection_editor/ui/collection_editor/properties/conditions/property_paths.ts

@@ -1,93 +0,0 @@
-import { Properties, Property } from "@rebasepro/types";
-import { isPropertyBuilder } from "@rebasepro/common";
-
-/**
- * Recursively extract all property paths from a Properties object.
- * For nested map properties, creates dot-notation paths like "address.city".
- * Skips PropertyBuilder functions (callbacks) as they cannot be statically analyzed.
- *
- * @param properties - The properties object to extract paths from
- * @param prefix - Optional prefix for nested paths (used in recursion)
- * @returns Array of property path strings
- */
-export function getPropertyPaths(
-    properties: Properties | undefined,
-    prefix = ""
-): string[] {
-    if (!properties) return [];
-
-    const paths: string[] = [];
-
-    for (const [key, propertyOrBuilder] of Object.entries(properties)) {
-        if (!propertyOrBuilder) continue;
-
-        // Skip PropertyBuilder functions - they require runtime values to resolve
-        if (isPropertyBuilder(propertyOrBuilder)) continue;
-
-        const property = propertyOrBuilder as Property;
-        const fullPath = prefix ? `${prefix}.${key}` : key;
-        paths.push(fullPath);
-
-        // Recursively add nested map properties
-        if (property.type === "map" && property.properties) {
-            const nestedPaths = getPropertyPaths(
-                property.properties as Properties,
-                fullPath
-            );
-            paths.push(...nestedPaths);
-        }
-
-        // For arrays with object items, add the nested paths too
-        if (property.type === "array" && property.of) {
-            const ofPropertyOrBuilder = property.of as Property;
-            // Skip if the array's 'of' is a PropertyBuilder
-            if (!isPropertyBuilder(ofPropertyOrBuilder)) {
-                const ofProperty = ofPropertyOrBuilder as Property;
-                if (ofProperty.type === "map" && ofProperty.properties) {
-                    const nestedPaths = getPropertyPaths(
-                        ofProperty.properties as Properties,
-                        `${fullPath}[]`
-                    );
-                    paths.push(...nestedPaths);
-                }
-            }
-        }
-    }
-
-    return paths;
-}
-
-/**
- * Get property paths grouped by top-level property for UI display.
- * Skips PropertyBuilder functions.
- *
- * @param properties - The properties object
- * @returns Object with top-level keys mapping to their nested paths
- */
-export function getGroupedPropertyPaths(
-    properties: Properties | undefined
-): Record<string, string[]> {
-    if (!properties) return {};
-
-    const grouped: Record<string, string[]> = {};
-
-    for (const [key, propertyOrBuilder] of Object.entries(properties)) {
-        if (!propertyOrBuilder) continue;
-
-        // Skip PropertyBuilder functions
-        if (isPropertyBuilder(propertyOrBuilder)) continue;
-
-        const property = propertyOrBuilder as Property;
-        grouped[key] = [key];
-
-        if (property.type === "map" && property.properties) {
-            const nestedPaths = getPropertyPaths(
-                property.properties as Properties,
-                key
-            );
-            grouped[key].push(...nestedPaths);
-        }
-    }
-
-    return grouped;
-}

package/src/collection_editor/ui/collection_editor/properties/validation/ArrayPropertyValidation.tsx

@@ -1,52 +0,0 @@
-import React from "react";
-
-import { getIn, useFormex } from "@rebasepro/forms";
-import { DebouncedTextField } from "@rebasepro/ui";
-import { useTranslation } from "@rebasepro/app";
-import { GeneralPropertyValidation } from "./GeneralPropertyValidation";
-
-export function ArrayPropertyValidation({
-    max = true,
-    min = true,
-    disabled
-}: {
-    min?: boolean;
-    max?: boolean;
-    disabled: boolean;
-}) {
-
-    const {
-        values,
-        handleChange
-    } = useFormex();
-    const { t } = useTranslation();
-
-    const validationMin = "validation.min";
-    const validationMax = "validation.max";
-
-    return (
-        <div className={"grid grid-cols-12 gap-2"}>
-
-            <GeneralPropertyValidation disabled={disabled}/>
-
-            {min && <div className={"col-span-6"}>
-                <DebouncedTextField value={getIn(values, validationMin) as number | undefined}
-                    disabled={disabled}
-                    label={t("min_length")}
-                    name={validationMin}
-                    type="number"
-                    size="small"
-                    onChange={handleChange}/>
-            </div>}
-            {max && <div className={"col-span-6"}>
-                <DebouncedTextField value={getIn(values, validationMax) as number | undefined}
-                    disabled={disabled}
-                    label={t("max_length")}
-                    name={validationMax}
-                    type="number"
-                    size="small"
-                    onChange={handleChange}/>
-            </div>}
-        </div>
-    );
-}

package/src/collection_editor/ui/collection_editor/properties/validation/GeneralPropertyValidation.tsx

@@ -1,63 +0,0 @@
-import React from "react";
-
-import { Field, FormexFieldProps, getIn, useFormex } from "@rebasepro/forms";
-import { DebouncedTextField } from "@rebasepro/ui";
-import { useTranslation } from "@rebasepro/app";
-import { SwitchControl } from "../../SwitchControl";
-
-export function GeneralPropertyValidation({ disabled }: {
-    required?: boolean;
-    disabled: boolean;
-}) {
-
-    const { values, handleChange } = useFormex();
-    const { t } = useTranslation();
-
-    const validationRequired = "validation.required";
-    const validationRequiredMessage = "validation.requiredMessage";
-    const validationUnique = "validation.unique";
-    const validationUniqueInArray = "validation.uniqueInArray";
-
-    return (
-        <>
-            <div className={"col-span-6"}>
-                <Field name={validationRequired}
-                    type="checkbox">
-                    {({ field, form }: FormexFieldProps) => {
-                        return <SwitchControl
-                            disabled={disabled}
-                            label={t("required")}
-                            tooltip={t("required_tooltip")}
-                            form={form}
-                            field={field}/>
-                    }}
-                </Field>
-            </div>
-
-            <div className={"col-span-6"}>
-
-                <Field name={validationUnique}
-                    type="checkbox">
-                    {({ field, form }: FormexFieldProps) => {
-                        return <SwitchControl
-                            disabled={disabled}
-                            label={t("unique")}
-                            tooltip={t("unique_tooltip")}
-                            form={form}
-                            field={field}/>
-                    }}
-                </Field>
-            </div>
-
-            {getIn(values, validationRequired) && <div className={"col-span-12"}>
-                <DebouncedTextField
-                    disabled={disabled}
-                    value={getIn(values, validationRequiredMessage) as string | undefined}
-                    label={t("required_message")}
-                    name={validationRequiredMessage}
-                    size="small"
-                    onChange={handleChange}/>
-            </div>}
-        </>
-    );
-}

package/src/collection_editor/ui/collection_editor/properties/validation/NumberPropertyValidation.tsx

@@ -1,114 +0,0 @@
-import React from "react";
-
-import { Field, FormexFieldProps, getIn, useFormex } from "@rebasepro/forms";
-import { DebouncedTextField } from "@rebasepro/ui";
-import { useTranslation } from "@rebasepro/app";
-import { GeneralPropertyValidation } from "./GeneralPropertyValidation";
-import { SwitchControl } from "../../SwitchControl";
-
-export function NumberPropertyValidation({ disabled }: {
-    disabled: boolean;
-}) {
-
-    const {
-        values,
-        handleChange
-    } = useFormex();
-    const { t } = useTranslation();
-
-    const validationMin = "validation.min";
-    const validationMax = "validation.max";
-    const validationLessThan = "validation.lessThan";
-    const validationMoreThan = "validation.moreThan";
-    const validationPositive = "validation.positive";
-    const validationNegative = "validation.negative";
-    const validationInteger = "validation.integer";
-
-    return (
-
-        <div className={"grid grid-cols-12 gap-2"}>
-            <GeneralPropertyValidation disabled={disabled}/>
-
-
-            <div className={"col-span-6"}>
-                <DebouncedTextField value={getIn(values, validationMin) as number | undefined}
-                    label={t("min_value")}
-                    name={validationMin}
-                    type="number"
-                    size="small"
-                    disabled={disabled}
-                    onChange={handleChange}/>
-            </div>
-
-            <div className={"col-span-6"}>
-                <DebouncedTextField value={getIn(values, validationMax) as number | undefined}
-                    label={t("max_value")}
-                    name={validationMax}
-                    type="number"
-                    size="small"
-                    disabled={disabled}
-                    onChange={handleChange}/>
-            </div>
-
-
-            <div className={"col-span-6"}>
-                <DebouncedTextField
-                    value={getIn(values, validationLessThan) as number | undefined}
-                    label={t("less_than")}
-                    name={validationLessThan}
-                    type="number"
-                    size="small"
-                    disabled={disabled}
-                    onChange={handleChange}/>
-            </div>
-
-            <div className={"col-span-6"}>
-                <DebouncedTextField
-                    value={getIn(values, validationMoreThan) as number | undefined}
-                    label={t("more_than")}
-                    name={validationMoreThan}
-                    type="number"
-                    size="small"
-                    disabled={disabled}
-                    onChange={handleChange}/>
-            </div>
-
-            <div className={"col-span-4"}>
-                <Field name={validationPositive}
-                    type="checkbox">
-                    {({ field, form }: FormexFieldProps) => {
-                        return <SwitchControl
-                            label={t("positive_value")}
-                            disabled={disabled}
-                            form={form}
-                            field={field}/>
-                    }}
-                </Field>
-            </div>
-            <div className={"col-span-4"}>
-                <Field name={validationNegative}
-                    type="checkbox">
-                    {({ field, form }: FormexFieldProps) => {
-                        return <SwitchControl
-                            label={t("negative_value")}
-                            disabled={disabled}
-                            form={form}
-                            field={field}/>
-                    }}
-                </Field>
-            </div>
-            <div className={"col-span-4"}>
-                <Field name={validationInteger}
-                    type="checkbox">
-                    {({ field, form }: FormexFieldProps) => {
-                        return <SwitchControl
-                            label={t("integer_value")}
-                            disabled={disabled}
-                            form={form}
-                            field={field}/>
-                    }}
-                </Field>
-            </div>
-        </div>
-    );
-}

package/src/collection_editor/ui/collection_editor/properties/validation/StringPropertyValidation.tsx

@@ -1,154 +0,0 @@
-import { FieldCaption } from "../../../../_cms_internals";
-import React from "react";
-
-import { Field, FormexFieldProps, getIn, useFormex } from "@rebasepro/forms";
-;
-import { DebouncedTextField } from "@rebasepro/ui";
-import { useTranslation } from "@rebasepro/app";
-import { GeneralPropertyValidation } from "./GeneralPropertyValidation";
-import { SwitchControl } from "../../SwitchControl";
-import { serializeRegExp } from "@rebasepro/utils";
-
-export function StringPropertyValidation({
-    length,
-    lowercase,
-    matches,
-    max,
-    min,
-    trim,
-    uppercase,
-    disabled,
-    showErrors
-}: {
-    length?: boolean;
-    min?: boolean;
-    max?: boolean;
-    trim?: boolean;
-    matches?: boolean;
-    lowercase?: boolean;
-    uppercase?: boolean;
-    disabled: boolean;
-    showErrors: boolean;
-}) {
-
-    const {
-        values,
-        handleChange,
-        errors
-    } = useFormex();
-    const { t } = useTranslation();
-
-    const validationLength = "validation.length";
-    const validationMin = "validation.min";
-    const validationMax = "validation.max";
-    const validationTrim = "validation.trim";
-    const validationMatches = "validation.matches";
-    const validationLowercase = "validation.lowercase";
-    const validationUppercase = "validation.uppercase";
-
-    const matchesError = getIn(errors, validationMatches);
-
-    const matchesValue = getIn(values, validationMatches);
-    const matchesStringValue = typeof matchesValue === "string" ? matchesValue : serializeRegExp(matchesValue as RegExp);
-    return (
-        <div className={"grid grid-cols-12 gap-2"}>
-
-            <GeneralPropertyValidation disabled={disabled}/>
-
-            <div className={"grid grid-cols-12 gap-2 col-span-12"}>
-
-                {lowercase && <div className={"col-span-4"}>
-                    <Field name={validationLowercase}
-                        type="checkbox">
-                        {({ field, form }: FormexFieldProps) => {
-                            return <SwitchControl
-                                label={t("lowercase")}
-                                disabled={disabled}
-                                form={form}
-                                field={field}/>
-                        }}
-                    </Field>
-                </div>}
-
-                {uppercase && <div className={"col-span-4"}>
-                    <Field name={validationUppercase}
-                        type="checkbox">
-                        {({ field, form }: FormexFieldProps) => {
-                            return <SwitchControl
-                                label={t("uppercase")}
-                                disabled={disabled}
-                                form={form}
-                                field={field}/>
-                        }}
-                    </Field>
-                </div>}
-
-                {trim && <div className={"col-span-4"}>
-                    <Field name={validationTrim}
-                        type="checkbox">
-                        {({ field, form }: FormexFieldProps) => {
-                            return <SwitchControl
-                                label={t("trim")}
-                                disabled={disabled}
-                                form={form}
-                                field={field}/>
-                        }}
-                    </Field>
-                </div>}
-
-            </div>
-
-            <div className={"grid grid-cols-12 gap-2 col-span-12"}>
-                {length && <div className={"col-span-4"}>
-                    <DebouncedTextField
-                        value={getIn(values, validationLength) as number | undefined}
-                        label={t("exact_length")}
-                        name={validationLength}
-                        type="number"
-                        size="small"
-
-                        disabled={disabled}
-                        onChange={handleChange}/>
-                </div>}
-
-                {min && <div className={"col-span-4"}>
-                    <DebouncedTextField value={getIn(values, validationMin) as number | undefined}
-                        label={t("min_length")}
-                        name={validationMin}
-                        type="number"
-                        size="small"
-
-                        disabled={disabled}
-                        onChange={handleChange}/>
-                </div>}
-
-                {max && <div className={"col-span-4"}>
-                    <DebouncedTextField value={getIn(values, validationMax) as number | undefined}
-                        label={t("max_length")}
-                        name={validationMax}
-                        type="number"
-                        size="small"
-
-                        disabled={disabled}
-                        onChange={handleChange}/>
-                </div>}
-
-            </div>
-
-            {matches && <div className={"col-span-12"}>
-                <Field name={validationMatches}
-                    as={DebouncedTextField}
-                    label={t("matches_regex")}
-                    size="small"
-                    disabled={disabled}
-                    value={matchesStringValue}
-                    error={Boolean(matchesError)}/>
-                <FieldCaption error={Boolean(matchesError)}>
-                    {matchesError ? t("not_valid_regexp") : t("regex_helper")}
-                </FieldCaption>
-            </div>}
-
-        </div>
-    );
-
-}

package/src/collection_editor/ui/collection_editor/properties/validation/ValidationPanel.tsx

@@ -1,28 +0,0 @@
-import { PropsWithChildren } from "react";
-
-import { CheckSquareIcon, ExpandablePanel, Typography } from "@rebasepro/ui";
-
-export function ValidationPanel({
-    children
-}: { children?: React.ReactNode }) {
-
-    return (
-        <ExpandablePanel
-            initiallyExpanded={false}
-            asField={true}
-            innerClassName="p-4"
-            title={
-                <div className="flex flex-row text-surface-500 text-text-secondary dark:text-text-secondary-dark">
-                    <CheckSquareIcon/>
-                    <Typography variant={"subtitle2"}
-                        className="ml-4">
-                        Validation
-                    </Typography>
-                </div>
-            }>
-
-            {children}
-
-        </ExpandablePanel>
-    )
-}

package/src/collection_editor/ui/collection_editor/templates/blog_template.ts

@@ -1,112 +0,0 @@
-import type { AdminCollection } from "@rebasepro/cms-types";
-
-export const blogCollectionTemplate = {
-    slug: "blog",
-    table: "blog",
-    name: "Blog",
-    singularName: "Blog entry",
-    icon: "FileText",
-    description: "A collection of blog entries",
-    defaultSize: "l",
-    properties: {
-        name: {
-            name: "Name",
-            validation: { required: true },
-            type: "string"
-        },
-        header_image: {
-            name: "Header image",
-            type: "string",
-            storage: {
-                storagePath: "images",
-                acceptedFiles: ["image/*"],
-                metadata: {
-                    cacheControl: "max-age=1000000"
-                }
-            }
-        },
-        content: {
-            name: "Content",
-            description: "Content blocks for the blog entry",
-            validation: { required: true },
-            type: "array",
-            oneOf: {
-                typeField: "type",
-                valueField: "value",
-                properties: {
-                    text: {
-                        type: "string",
-                        name: "Text",
-                        markdown: true
-                    },
-                    quote: {
-                        type: "string",
-                        name: "Quote",
-                        multiline: true
-                    },
-                    images: {
-                        name: "Images",
-                        type: "array",
-                        of: {
-                            type: "string",
-                            storage: {
-                                storagePath: "images",
-                                acceptedFiles: ["image/*"],
-                                metadata: {
-                                    cacheControl: "max-age=1000000"
-                                }
-                            }
-                        },
-                        description: "This fields allows uploading multiple images at once and reordering"
-                    },
-                    products: {
-                        name: "Products",
-                        type: "array",
-                        of: {
-                            type: "reference",
-                            path: "products",
-                            previewProperties: ["name", "main_image"]
-                        }
-                    }
-                },
-                propertiesOrder: ["text", "quote", "images", "products"]
-            }
-        },
-        created_on: {
-            name: "Created on",
-            type: "date",
-            autoValue: "on_create"
-        },
-        status: {
-            name: "Status",
-            validation: { required: true },
-            type: "string",
-            enum: {
-                published: {
-                    id: "published",
-                    label: "Published"
-                },
-                draft: "Draft"
-            },
-            defaultValue: "draft"
-        },
-        publish_date: {
-            name: "Publish date",
-            type: "date",
-            admin: { clearable: true }
-        },
-        reviewed: {
-            name: "Reviewed",
-            type: "boolean"
-        },
-        tags: {
-            name: "Tags",
-            description: "Example of generic array",
-            type: "array",
-            of: {
-                type: "string",
-                previewAsTag: true
-            }
-        }
-    }
-} as unknown as AdminCollection;