@firecms/core 3.0.0-canary.71 → 3.0.0-canary.73

package/dist/types/properties.d.ts

@@ -97,7 +97,7 @@ 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.

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@firecms/core",
     "type": "module",
-    "version": "3.0.0-canary.71",
+    "version": "3.0.0-canary.73",
     "description": "Awesome Firebase/Firestore-based headless open-source CMS",
     "funding": {
         "url": "https://github.com/sponsors/firecmsco"
@@ -46,8 +46,8 @@
         "./package.json": "./package.json"
     },
     "dependencies": {
-        "@firecms/formex": "^3.0.0-canary.71",
-        "@firecms/ui": "^3.0.0-canary.71",
+        "@firecms/formex": "^3.0.0-canary.73",
+        "@firecms/ui": "^3.0.0-canary.73",
         "@fontsource/jetbrains-mono": "^5.0.20",
         "@hello-pangea/dnd": "^16.6.0",
         "@radix-ui/react-portal": "^1.0.4",
@@ -111,7 +111,7 @@
         "dist",
         "src"
     ],
-    "gitHead": "e08cb16e7d806bb6b7d74a850fe0e410889f32d5",
+    "gitHead": "3d43eb099c5584b289cb3189c25ac3c7cbb286f1",
     "publishConfig": {
         "access": "public"
     },

package/src/form/field_bindings/ArrayCustomShapedFieldBinding.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { FieldProps } from "../../types";
 import { FieldHelperText, LabelWithIcon } from "../components";
 import { PropertyFieldBinding } from "../PropertyFieldBinding";
-import { ExpandablePanel } from "@firecms/ui";
+import { ExpandablePanel, Typography } from "@firecms/ui";
 import { getIconForProperty } from "../../util";
 import { useClearRestoreValue } from "../useClearRestoreValue";
 
@@ -39,10 +39,13 @@ export function ArrayCustomShapedFieldBinding<T extends Array<any>>({
         setValue
     });
 
-    const title = <LabelWithIcon icon={getIconForProperty(property, "small")}
-                                 required={property.validation?.required}
-                                 className={"text-text-secondary dark:text-text-secondary-dark"}
-                                 title={property.name}/>;
+    const title = (<>
+        <LabelWithIcon icon={getIconForProperty(property, "small")}
+                       required={property.validation?.required}
+                       title={property.name}
+                       className={"flex-grow text-text-secondary dark:text-text-secondary-dark"}/>
+        {Array.isArray(value) && <Typography variant={"caption"} className={"px-4"}>({value.length})</Typography>}
+    </>);
 
     const body = property.resolvedProperties.map((childProperty, index) => {
         const fieldProps = {

package/src/form/field_bindings/ArrayOfReferencesFieldBinding.tsx

@@ -6,7 +6,7 @@ import { ErrorView } from "../../components";
 import { getIconForProperty, getReferenceFrom } from "../../util";
 
 import { useNavigationController, useReferenceDialog } from "../../hooks";
-import { Button, cls, ExpandablePanel, fieldBackgroundMixin } from "@firecms/ui";
+import { Button, cls, ExpandablePanel, fieldBackgroundMixin, Typography } from "@firecms/ui";
 import { useClearRestoreValue } from "../useClearRestoreValue";
 
 type ArrayOfReferencesFieldProps = FieldProps<EntityReference[]>;
@@ -94,12 +94,13 @@ export function ArrayOfReferencesFieldBinding({
         );
     }, [ofProperty.path, ofProperty.previewProperties, value]);
 
-    const title = (
+    const title = (<>
         <LabelWithIcon icon={getIconForProperty(property, "small")}
                        required={property.validation?.required}
                        title={property.name}
-                       className={"text-text-secondary dark:text-text-secondary-dark"}/>
-    );
+                       className={"flex-grow text-text-secondary dark:text-text-secondary-dark"}/>
+        {Array.isArray(value) && <Typography variant={"caption"} className={"px-4"}>({value.length})</Typography>}
+    </>);
 
     const body = <>
         {!collection && <ErrorView

package/src/form/field_bindings/RepeatFieldBinding.tsx

@@ -2,9 +2,9 @@ import React, { useState } from "react";
 import { CMSType, FieldProps, ResolvedProperty } from "../../types";
 import { FieldHelperText, FormikArrayContainer, LabelWithIcon } from "../components";
 import { ErrorBoundary } from "../../components";
-import { getIconForProperty } from "../../util";
+import { getDefaultValueFor, getIconForProperty } from "../../util";
 import { PropertyFieldBinding } from "../PropertyFieldBinding";
-import { ExpandablePanel } from "@firecms/ui";
+import { ExpandablePanel, Typography } from "@firecms/ui";
 import { useClearRestoreValue } from "../useClearRestoreValue";
 
 /**
@@ -75,12 +75,15 @@ export function RepeatFieldBinding<T extends Array<any>>({
                                                  onInternalIdAdded={setLastAddedId}
                                                  disabled={isSubmitting || Boolean(property.disabled)}
                                                  includeAddButton={!property.disabled}
-                                                 newDefaultEntry={property.of.defaultValue}/>;
+                                                 newDefaultEntry={getDefaultValueFor(property.of)}/>;
 
-    const title = (<LabelWithIcon icon={getIconForProperty(property, "small")}
-                                  required={property.validation?.required}
-                                  title={property.name}
-                                  className={"text-text-secondary dark:text-text-secondary-dark"}/>);
+    const title = (<>
+        <LabelWithIcon icon={getIconForProperty(property, "small")}
+                       required={property.validation?.required}
+                       title={property.name}
+                       className={"flex-grow text-text-secondary dark:text-text-secondary-dark"}/>
+        {Array.isArray(value) && <Typography variant={"caption"} className={"px-4"}>({value.length})</Typography>}
+    </>);
 
     return (
 

package/src/types/properties.ts

@@ -149,7 +149,7 @@ 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

package/src/util/entities.ts

@@ -52,7 +52,7 @@ export function getDefaultValueFor(property: PropertyOrBuilder) {
         const defaultValuesFor = getDefaultValuesFor(property.properties as Properties);
         if (Object.keys(defaultValuesFor).length === 0) return undefined;
         return defaultValuesFor;
-    } else if (property.defaultValue) {
+    } else if (property.defaultValue || property.defaultValue === null) {
         return property.defaultValue;
     } else {
         return getDefaultValueForDataType(property.dataType);