@firecms/core 3.0.0-canary.29 → 3.0.0-canary.290

package/src/types/properties.ts

@@ -1,10 +1,11 @@
 import React from "react";
 import { FieldProps } from "./fields";
 import { PropertyPreviewProps } from "../preview";
-import { EntityReference, EntityValues, GeoPoint } from "./entities";
+import { EntityReference, EntityValues, GeoPoint, Vector } from "./entities";
 import { ResolvedArrayProperty, ResolvedStringProperty } from "./resolved_entities";
 import { FilterValues } from "./collections";
 import { ChipColorKey, ChipColorScheme } from "@firecms/ui";
+import { AuthController } from "./auth";
 
 /**
  * @group Entity properties
@@ -15,9 +16,10 @@ export type DataType<T extends CMSType = CMSType> =
             T extends boolean ? "boolean" :
                 T extends Date ? "date" :
                     T extends GeoPoint ? "geopoint" :
-                        T extends EntityReference ? "reference" :
-                            T extends Array<CMSType> ? "array" :
-                                T extends Record<string, any> ? "map" : never;
+                        T extends Vector ? "vector" :
+                            T extends EntityReference ? "reference" :
+                                T extends Array<any> ? "array" :
+                                    T extends Record<string, any> ? "map" : never;
 
 /**
  * @group Entity properties
@@ -48,7 +50,7 @@ export type AnyProperty =
 /**
  * @group Entity properties
  */
-export type Property<T extends CMSType = CMSType> =
+export type Property<T extends CMSType = any> =
     T extends string ? StringProperty :
         T extends number ? NumberProperty :
             T extends boolean ? BooleanProperty :
@@ -148,13 +150,23 @@ export interface BaseProperty<T extends CMSType, CustomProps = any> {
     /**
      * This value will be set by default for new entities.
      */
-    defaultValue?: T;
+    defaultValue?: T | null;
 
     /**
      * Should this property be editable. If set to true, the user will be able to modify the property and
      * save the new config. The saved config will then become the source of truth.
+     * Defaults to `true.
+     * This props is only useful when you are using the collection editor to modify collection
+     * configurations from the CMS itself. You can also use the `editable` prop in the
+     * `EntityCollection` interface to disable the edition of all properties in a collection.
      */
     editable?: boolean;
+
+    /**
+     * A number between 0 and 100 that indicates the width of the field in the form view.
+     * It defaults to 100, but you can set it to 50 to have two fields in the same row.
+     */
+    widthPercentage?: number;
 }
 
 /**
@@ -263,6 +275,11 @@ export type PropertyBuilderProps<M extends Record<string, any> = any> =
          * Entity ID
          */
         entityId?: string;
+
+        /**
+         * Controller to manage authentication
+         */
+        authController: AuthController;
     };
 
 /**
@@ -276,21 +293,23 @@ export type PropertyBuilder<T extends CMSType = any, M extends Record<string, an
          values,
          previousValues,
          propertyValue,
+         index,
          path,
-         entityId
+         entityId,
+         authController
      }: PropertyBuilderProps<M>) => Property<T> | null;
 
 /**
  * @group Entity properties
  */
-export type PropertyOrBuilder<T extends CMSType = CMSType, M extends Record<string, any> = Record<string, any>> =
+export type PropertyOrBuilder<T extends CMSType = CMSType, M extends Record<string, any> = any> =
     Property<T>
     | PropertyBuilder<T, M>;
 
 /**
  * @group Entity properties
  */
-export type PropertiesOrBuilders<M extends Record<string, any> = Record<string, any>> =
+export type PropertiesOrBuilders<M extends Record<string, any> = any> =
     {
         [k in keyof M]: PropertyOrBuilder<M[k], M>;
     };
@@ -369,10 +388,20 @@ export interface StringProperty extends BaseProperty<string> {
 
     /**
      * You can specify a `Storage` configuration. It is used to
-     * indicate that this string refers to a path in Google Cloud Storage.
+     * indicate that this string refers to a path in your storage provider.
      */
     storage?: StorageConfig;
 
+    /**
+     * This property is used to indicate that the string is a user ID, and
+     * it will be rendered as a user picker.
+     * Note that the user ID needs to be the one used in your authentication
+     * provider, e.g. Firebase Auth.
+     * You can also use a property builder to specify the user path dynamically
+     * based on other values of the entity.
+     */
+    userSelect?: boolean;
+
     /**
      * If the value of this property is a URL, you can set this flag to true
      * to add a link, or one of the supported media types to render a preview
@@ -398,12 +427,20 @@ export interface StringProperty extends BaseProperty<string> {
      * Add an icon to clear the value and set it to `null`. Defaults to `false`
      */
     clearable?: boolean;
+
+    /**
+     * You can use this property (a string) to behave as a reference to another
+     * collection. The stored value is the ID of the entity in the
+     * collection, and the `path` prop is used to
+     * define the collection this reference points to.
+     */
+    reference?: ReferenceProperty;
 }
 
 /**
  * @group Entity properties
  */
-export interface ArrayProperty<T extends ArrayT[] = any[], ArrayT extends CMSType = CMSType> extends BaseProperty<T> {
+export interface ArrayProperty<T extends ArrayT[] = any[], ArrayT extends CMSType = any> extends BaseProperty<T> {
 
     dataType: "array";
 
@@ -467,6 +504,24 @@ export interface ArrayProperty<T extends ArrayT[] = any[], ArrayT extends CMSTyp
      */
     expanded?: boolean;
 
+    /**
+     * Display the child properties directly, without being wrapped in an
+     * extendable panel.
+     */
+    minimalistView?: boolean;
+
+    /**
+     * Can the elements in this array be reordered. Defaults to `true`.
+     * This prop has no effect if `disabled` is set to true.
+     */
+    sortable?: boolean;
+
+    /**
+     * Can the elements in this array be added. Defaults to `true`
+     * This prop has no effect if `disabled` is set to true.
+     */
+    canAddElements?: boolean;
+
 }
 
 /**
@@ -515,6 +570,12 @@ export interface MapProperty<T extends Record<string, CMSType> = Record<string,
      */
     spreadChildren?: boolean;
 
+    /**
+     * Display the child properties directly, without being wrapped in an
+     * extendable panel. Note that this will also hide the title of this property.
+     */
+    minimalistView?: boolean;
+
     /**
      * Should the field be initially expanded. Defaults to `true`
      */
@@ -591,7 +652,7 @@ export interface ReferenceProperty extends BaseProperty<EntityReference> {
      * You can leave this prop undefined if the path is not yet know, e.g.
      * you are using a property builder and the path depends on a different
      * property.
-     * Note that you can also use a collection alias.
+     * Note that you can also use a collection id.
      */
     path?: string;
 
@@ -608,6 +669,16 @@ export interface ReferenceProperty extends BaseProperty<EntityReference> {
      */
     previewProperties?: string[];
 
+    /**
+     * Should the reference include the ID of the entity. Defaults to `true`
+     */
+    includeId?: boolean;
+
+    /**
+     * Should the reference include a link to the entity (open the entity details). Defaults to `true`
+     */
+    includeEntityLink?: boolean;
+
 }
 
 /**
@@ -708,8 +779,16 @@ export type StorageConfig = {
     /**
      * Use client side image compression and resizing
      * Will only be applied to these MIME types: image/jpeg, image/png and image/webp
+     * @deprecated Use `imageResize` instead
      */
-    imageCompression?: ImageCompression;
+    imageCompression?: ImageResize;
+
+    /**
+     * Advanced image resizing and cropping configuration.
+     * Applied before upload to optimize storage and bandwidth.
+     * Only applies to image MIME types: image/jpeg, image/png, image/webp
+     */
+    imageResize?: ImageResize;
 
     /**
      * Specific metadata set in your uploaded file.
@@ -722,13 +801,13 @@ export type StorageConfig = {
      * You can use this prop to customize the uploaded filename.
      * You can use a function as a callback or a string where you
      * specify some placeholders that get replaced with the corresponding values.
-     * - {file} - Full file name
-     * - {file.name} - Name of the file without extension
-     * - {file.ext} - Extension of the file
-     * - {rand} - Random value used to avoid name collisions
-     * - {entityId} - ID of the entity
-     * - {propertyKey} - ID of this property
-     * - {path} - Path of this entity
+     * - `{file}` - Full file name
+     * - `{file.name}` - Name of the file without extension
+     * - `{file.ext}` - Extension of the file
+     * - `{rand}` - Random value used to avoid name collisions
+     * - `{entityId}` - ID of the entity
+     * - `{propertyKey}` - ID of this property
+     * - `{path}` - Path of this entity
      *
      * @param context
      */
@@ -739,13 +818,13 @@ export type StorageConfig = {
      *
      * You can use a function as a callback or a string where you
      * specify some placeholders that get replaced with the corresponding values.
-     * - {file} - Full file name
-     * - {file.name} - Name of the file without extension
-     * - {file.ext} - Extension of the file
-     * - {rand} - Random value used to avoid name collisions
-     * - {entityId} - ID of the entity
-     * - {propertyKey} - ID of this property
-     * - {path} - Path of this entity
+     * - `{file}` - Full file name
+     * - `{file.name}` - Name of the file without extension
+     * - `{file.ext}` - Extension of the file
+     * - `{rand}` - Random value used to avoid name collisions
+     * - `{entityId}` - ID of the entity
+     * - `{propertyKey}` - ID of this property
+     * - `{path}` - Path of this entity
      */
     storagePath: string | ((context: UploadedFileContext) => string);
 
@@ -766,12 +845,24 @@ export type StorageConfig = {
      */
     maxSize?: number,
 
+    /**
+     * Use this callback to process the file before uploading it to the storage.
+     * If nothing is returned, the file is uploaded as it is.
+     * @param file
+     */
+    processFile?: (file: File) => Promise<File> | undefined;
+
     /**
      * Postprocess the saved value (storage path or URL)
      * after it has been resolved.
      */
     postProcess?: (pathOrUrl: string) => Promise<string>;
 
+    /**
+     * You can use this prop in order to provide a custom preview URL.
+     * Useful when the file's path is different from the original field value
+     */
+    previewUrl?: (fileName: string) => string;
 }
 
 /**
@@ -801,7 +892,7 @@ export interface UploadedFileContext {
     /**
      * Entity path. E.g. `products/PID/locales`
      */
-    path: string;
+    path?: string;
 
     /**
      * Values of the current entity
@@ -834,19 +925,36 @@ export type FileType =
     | "font/*"
     | string;
 
-export interface ImageCompression {
+export interface ImageResize {
     /**
-     * New image max height (ratio is preserved)
+     * Maximum width in pixels. Image will be scaled down proportionally if wider.
+     */
+    maxWidth?: number;
+
+    /**
+     * Maximum height in pixels. Image will be scaled down proportionally if taller.
      */
     maxHeight?: number;
 
     /**
-     * New image max width (ratio is preserved)
+     * Resize mode determines how the image fits within maxWidth/maxHeight bounds.
+     * - `contain`: Scale down to fit within bounds, preserving aspect ratio (default)
+     * - `cover`: Scale to fill bounds, preserving aspect ratio (may crop)
      */
-    maxWidth?: number;
+    mode?: 'contain' | 'cover';
+
+    /**
+     * Output format for the resized image.
+     * - `original`: Keep the original format (default)
+     * - `jpeg`: Convert to JPEG
+     * - `png`: Convert to PNG
+     * - `webp`: Convert to WebP
+     */
+    format?: 'original' | 'jpeg' | 'png' | 'webp';
 
     /**
-     * A number between 0 and 100. Used for the JPEG compression.(if no compress is needed, just set it to 100)
+     * Quality for lossy formats (JPEG, WebP). Number between 0 and 100.
+     * Higher is better quality but larger file size. Defaults to 80.
      */
     quality?: number;
 }

package/src/types/property_config.tsx

@@ -23,8 +23,6 @@ export type PropertyConfig<T extends CMSType = any> = {
      * Default config for the property.
      * This property or builder will be used as the base values for the resulting property.
      * You can also use a builder function to generate the base property.
-     * You can use a builder function to generate the property based on the values or the path.
-     * You can also define a custom Field as a React component to be used for this property.
      */
     property: PropertyOrBuilder<T>;
 
@@ -54,6 +52,7 @@ export type PropertyConfigId =
     "markdown" |
     "url" |
     "email" |
+    "user_select" |
     "select" |
     "multi_select" |
     "number_input" |
@@ -64,6 +63,7 @@ export type PropertyConfigId =
     "group" |
     "key_value" |
     "reference" |
+    "reference_as_string" |
     "multi_references" |
     "switch" |
     "date_time" |

package/src/types/roles.ts

@@ -30,6 +30,9 @@ export type Role = {
      */
     collectionPermissions?: Record<string, Permissions>;
 
+    /**
+     * Permissions related to editing the collections
+     */
     config?: {
 
         createCollections?: boolean;

package/src/types/side_dialogs_controller.tsx

@@ -1,3 +1,6 @@
+import React from "react";
+import { EntityFormProps } from "../form";
+
 /**
  * Controller to open the side dialog
  * @group Hooks and utilities
@@ -14,6 +17,12 @@ export interface SideDialogsController {
      */
     sidePanels: SideDialogPanelProps[];
 
+    /**
+     * Override the current side panels
+     * @param panels
+     */
+    setSidePanels: (panels: SideDialogPanelProps[]) => void;
+
     /**
      * Open one or multiple side panels
      * @param props
@@ -65,4 +74,10 @@ export interface SideDialogPanelProps {
      * Callback when the panel is closed
      */
     onClose?: () => void;
+
+    /**
+     * Use this prop to store additional data in the panel
+     */
+    additional?: any;
+
 }

package/src/types/side_entity_controller.tsx

@@ -2,6 +2,7 @@ import { EntityCollection } from "./collections";
 import { ResolvedEntityCollection } from "./resolved_entities";
 import { Entity } from "./entities";
 import { EntityOverrides } from "./entity_overrides";
+import { EntityFormProps } from "../form";
 
 /**
  * Props used to open a side dialog
@@ -14,6 +15,11 @@ export interface EntitySidePanelProps<M extends Record<string, any> = any> {
      */
     path: string;
 
+    /**
+     * Full CMS path of the entity, including the collection and sub-collections.
+     */
+    fullIdPath?: string;
+
     /**
      * ID of the entity, if not set, it means we are creating a new entity
      */
@@ -28,7 +34,7 @@ export interface EntitySidePanelProps<M extends Record<string, any> = any> {
      * Open the entity with a selected sub-collection view. If the panel for this
      * entity was already open, it is replaced.
      */
-    selectedSubPath?: string;
+    selectedTab?: string;
 
     /**
      * Use this prop to override the width of the form view.
@@ -66,6 +72,15 @@ export interface EntitySidePanelProps<M extends Record<string, any> = any> {
      */
     closeOnSave?: boolean;
 
+    /**
+     * Override some form properties
+     */
+    formProps?: Partial<EntityFormProps<M>>;
+
+    /**
+     * Allow the user to open the entity fullscreen
+     */
+    allowFullScreen?: boolean;
 }
 
 /**

package/src/types/storage.ts

@@ -101,5 +101,87 @@ export interface StorageSource {
      * @param props
      * @param bucket
      */
-    getFile: (path:string, bucket?: string) => Promise<File | null>;
+    getFile: (path: string, bucket?: string) => Promise<File | null>;
+
+    /**
+     * Delete a file.
+     * @param path
+     * @param bucket
+     */
+    deleteFile: (path: string, bucket?: string) => Promise<void>;
+
+    /**
+     * List the contents of a path.
+     * @param path
+     * @param options
+     */
+    list: (path: string, options?: {
+        bucket?: string,
+        maxResults?: number,
+        pageToken?: string
+    }) => Promise<StorageListResult>;
+
+}
+
+/**
+ * Result returned by list().
+ * @public
+ */
+export declare interface StorageListResult {
+    /**
+     * References to prefixes (sub-folders). You can call list() on them to
+     * get its contents.
+     *
+     * Folders are implicit based on '/' in the object paths.
+     * For example, if a bucket has two objects '/a/b/1' and '/a/b/2', list('/a')
+     * will return '/a/b' as a prefix.
+     */
+    prefixes: StorageReference[];
+    /**
+     * Objects in this directory.
+     * You can call getMetadata() and getDownloadUrl() on them.
+     */
+    items: StorageReference[];
+    /**
+     * If set, there might be more results for this list. Use this token to resume the list.
+     */
+    nextPageToken?: string;
+}
+
+/**
+ * Represents a reference to a Google Cloud Storage object. Developers can
+ * upload, download, and delete objects, as well as get/set object metadata.
+ * @public
+ */
+export declare interface StorageReference {
+    /**
+     * Returns a gs:// URL for this object in the form
+     *   `gs://<bucket>/<path>/<to>/<object>`
+     * @returns The gs:// URL.
+     */
+    toString(): string;
+
+    /**
+     * A reference to the root of this object's bucket.
+     */
+    root: StorageReference;
+    /**
+     * The name of the bucket containing this reference's object.
+     */
+    bucket: string;
+    /**
+     * The full path of this object.
+     */
+    fullPath: string;
+    /**
+     * The short name of this object, which is the last component of the full path.
+     * For example, if fullPath is 'full/path/image.png', name is 'image.png'.
+     */
+    name: string;
+
+    /**
+     * A reference pointing to the parent location of this reference, or null if
+     * this reference is the root.
+     */
+    parent: StorageReference | null;
 }

package/src/types/user.ts

@@ -37,8 +37,10 @@ export type User = {
     readonly isAnonymous: boolean;
 
     /**
-     *
+     * Custom roles assigned to the user.
      */
     roles?: Role[];
 
+    getIdToken?: (forceRefresh?: boolean) => Promise<string>;
+
 };

package/src/util/builders.ts

@@ -26,10 +26,12 @@ import {
  * @param collection
  * @group Builder
  */
-export function buildCollection<M extends Record<string, any> = any,
-    UserType extends User = User>(
-    collection: EntityCollection<M, UserType>
-): EntityCollection<M, UserType> {
+export function buildCollection<
+    M extends Record<string, any> = any,
+    USER extends User = User>
+(
+    collection: EntityCollection<M, USER>
+): EntityCollection<M, USER> {
     return collection;
 }
 
@@ -39,7 +41,7 @@ export function buildCollection<M extends Record<string, any> = any,
  * @param property
  * @group Builder
  */
-export function buildProperty<T extends CMSType = CMSType, P extends PropertyOrBuilder<T> = PropertyOrBuilder<T>, M extends Record<string, any> = Record<string, any>>(
+export function buildProperty<T extends CMSType = CMSType, P extends PropertyOrBuilder<T> = PropertyOrBuilder<T>, M extends Record<string, any> = any>(
     property: P
 ):
     P extends StringProperty ? StringProperty :
@@ -120,9 +122,9 @@ export function buildEntityCallbacks<M extends Record<string, any> = any>(
  * @param additionalFieldDelegate
  * @group Builder
  */
-export function buildAdditionalFieldDelegate<M extends Record<string, any>, UserType extends User = User>(
-    additionalFieldDelegate: AdditionalFieldDelegate<M, UserType>
-): AdditionalFieldDelegate<M, UserType> {
+export function buildAdditionalFieldDelegate<M extends Record<string, any>, USER extends User = User>(
+    additionalFieldDelegate: AdditionalFieldDelegate<M, USER>
+): AdditionalFieldDelegate<M, USER> {
     return additionalFieldDelegate;
 }