@firecms/collection_editor 3.0.0-beta.2 → 3.0.0-beta.4

package/src/ui/collection_editor/properties/MapPropertyField.tsx

@@ -1,11 +1,10 @@
 import React, { useCallback, useState } from "react";
-import { MapProperty, Property, PropertyConfig, } from "@firecms/core";
+import { FieldCaption, MapProperty, Property, PropertyConfig, } from "@firecms/core";
 import { AddIcon, BooleanSwitchWithLabel, Button, Paper, Typography } from "@firecms/ui";
 import { PropertyFormDialog } from "../PropertyEditView";
 import { getIn, useFormex } from "@firecms/formex";
 import { PropertyTree } from "../PropertyTree";
 import { getFullId, idToPropertiesPath, namespaceToPropertiesOrderPath, namespaceToPropertiesPath } from "../util";
-import { FieldHelperView } from "./FieldHelperView";
 
 export function MapPropertyField({ disabled, getData, allowDataInference, propertyConfigs, collectionEditable }: {
     disabled: boolean;
@@ -113,9 +112,9 @@ export function MapPropertyField({ disabled, getData, allowDataInference, proper
                     onValueChange={(v) => setFieldValue("spreadChildren", v)}
                     value={values.spreadChildren ?? false}
                 />
-                <FieldHelperView>
+                <FieldCaption>
                     Set this flag to true if you want to display the children of this group as individual columns.
-                </FieldHelperView>
+                </FieldCaption>
             </div>
 
             <PropertyFormDialog

package/src/ui/collection_editor/properties/ReferencePropertyField.tsx

@@ -1,8 +1,7 @@
 import React from "react";
 import { Field, getIn, useFormex } from "@firecms/formex";
-import { IconForView, NumberProperty, StringProperty, useNavigationController } from "@firecms/core";
+import { FieldCaption, IconForView, NumberProperty, StringProperty, useNavigationController } from "@firecms/core";
 import { CircularProgress, Select, SelectGroup, SelectItem, Typography, } from "@firecms/ui";
-import { FieldHelperView } from "./FieldHelperView";
 
 export function ReferencePropertyField({
                                            existing,
@@ -40,7 +39,7 @@ export function ReferencePropertyField({
                 <Field name={pathPath}
                        pathPath={pathPath}
                        type="select"
-                       disabled={existing || disabled}
+                       disabled={(existing && Boolean(pathValue)) || disabled}
                        value={pathValue}
                        error={pathError}
                        handleChange={handleChange}
@@ -52,7 +51,6 @@ export function ReferencePropertyField({
     );
 }
 
-
 export function CollectionsSelect({
                                       disabled,
                                       pathPath,
@@ -153,10 +151,10 @@ export function CollectionsSelect({
 
             </Select>
 
-            <FieldHelperView>
+            <FieldCaption>
                 You can only edit the reference collection upon field
                 creation.
-            </FieldHelperView>
+            </FieldCaption>
         </>
     );
 }

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

@@ -1,10 +1,9 @@
 import React from "react";
 
 import { Field, FormexFieldProps, getIn, useFormex } from "@firecms/formex";
-import { serializeRegExp } from "@firecms/core";
+import { FieldCaption, serializeRegExp } from "@firecms/core";
 import { DebouncedTextField, } from "@firecms/ui";
 import { GeneralPropertyValidation } from "./GeneralPropertyValidation";
-import { FieldHelperView } from "../FieldHelperView";
 import { SwitchControl } from "../../SwitchControl";
 
 export function StringPropertyValidation({
@@ -140,9 +139,9 @@ export function StringPropertyValidation({
                        disabled={disabled}
                        value={matchesStringValue}
                        error={Boolean(matchesError)}/>
-                <FieldHelperView error={Boolean(matchesError)}>
+                <FieldCaption error={Boolean(matchesError)}>
                     {matchesError ? "Not a valid regexp" : "e.g. /^\\d+$/ for digits only"}
-                </FieldHelperView>
+                </FieldCaption>
             </div>}
 
         </div>

package/src/ui/collection_editor/utils/supported_fields.tsx

@@ -1,6 +1,6 @@
-import { DEFAULT_FIELD_CONFIGS, FieldConfigId, PropertyConfig } from "@firecms/core";
+import { DEFAULT_FIELD_CONFIGS, PropertyConfigId, PropertyConfig } from "@firecms/core";
 
-export const supportedFieldsIds: FieldConfigId[] = [
+export const supportedFieldsIds: PropertyConfigId[] = [
     "text_field",
     "multiline",
     "markdown",
@@ -24,6 +24,6 @@ export const supportedFieldsIds: FieldConfigId[] = [
 ];
 
 export const supportedFields: Record<string, PropertyConfig> = Object.entries(DEFAULT_FIELD_CONFIGS)
-    .filter(([id]) => supportedFieldsIds.includes(id as FieldConfigId))
+    .filter(([id]) => supportedFieldsIds.includes(id as PropertyConfigId))
     .map(([id, config]) => ({ [id]: config }))
     .reduce((a, b) => ({ ...a, ...b }), {});

package/src/useCollectionEditorPlugin.tsx

@@ -81,11 +81,8 @@ export function useCollectionEditorPlugin<EC extends PersistedCollection = Persi
  }: CollectionConfigControllerProps<EC, UserType>): FireCMSPlugin<any, any, PersistedCollection> {
 
     return {
-        name: "Collection Editor",
+        key: "collection_editor",
         loading: collectionConfigController.loading,
-        collections: {
-            CollectionActions: EditorCollectionAction
-        },
         provider: {
             Component: ConfigControllerProvider,
             props: {
@@ -108,6 +105,7 @@ export function useCollectionEditorPlugin<EC extends PersistedCollection = Persi
             AdditionalCards: introMode ? undefined : NewCollectionCard,
         },
         collectionView: {
+            CollectionActions: EditorCollectionAction,
             HeaderAction: CollectionViewHeaderAction,
             AddColumnComponent: PropertyAddColumnComponent
         }

package/dist/ui/collection_editor/properties/FieldHelperView.d.ts

@@ -1,4 +0,0 @@
-export declare function FieldHelperView({ error, children }: {
-    error?: boolean;
-    children?: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element | null;

package/src/ui/collection_editor/properties/FieldHelperView.tsx

@@ -1,13 +0,0 @@
-import { Typography } from "@firecms/ui";
-
-export function FieldHelperView({
-                                    error,
-                                    children
-                                }: { error?: boolean, children?: React.ReactNode }) {
-    if (!children) return null;
-    return (
-        <Typography variant={"caption"} color={error ? "error" : "secondary"} className={"ml-3.5 mt-0.5"}>
-            {children}
-        </Typography>
-    );
-}