@firecms/core 3.0.0-canary.218 → 3.0.0-canary.219

package/dist/index.umd.js

@@ -860,7 +860,7 @@
     }
   }
   function resolvedSelectedEntityView(customViews, customizationController, selectedTab, canEdit) {
-    const resolvedEntityViews = customViews ? customViews.map((e) => resolveEntityView(e, customizationController.entityViews)).filter((e) => Boolean(e)).filter((e) => canEdit || !e.includeActions) : [];
+    const resolvedEntityViews = customViews ? customViews.map((e) => resolveEntityView(e, customizationController.entityViews)).filter((e) => Boolean(e)) : [];
     const selectedEntityView = resolvedEntityViews.find((e) => e.key === selectedTab);
     const selectedSecondaryForm = customViews && resolvedEntityViews.filter((e) => e.includeActions).find((e) => e.key === selectedTab);
     return {
@@ -13926,12 +13926,14 @@
     onEntityChange,
     openEntityMode = "full_screen",
     formex: formexProp,
+    disabled: disabledProp,
     Builder,
     EntityFormActionsComponent = EntityFormActions,
     showDefaultActions = true,
     showEntityPath = true,
     children
   }) {
+    console.log("disabledProp", disabledProp);
     if (collection.customId && collection.formAutoSave) {
       console.warn(`The collection ${collection.path} has customId and formAutoSave enabled. This is not supported and formAutoSave will be ignored`);
     }
@@ -14163,6 +14165,8 @@
         setSavingError(e_4);
       });
     };
+    const disabled = formex$1.isSubmitting || Boolean(disabledProp);
+    console.log("disabled", disabled);
     const formContext = {
       // @ts-ignore
       setFieldValue: React.useCallback(formex$1.setFieldValue, []),
@@ -14175,7 +14179,8 @@
       entity,
       savingError,
       status,
-      openEntityMode
+      openEntityMode,
+      disabled
     };
     React.useEffect(() => {
       onFormContextReady?.(formContext);
@@ -14188,6 +14193,7 @@
     }, []);
     const pluginActions = [];
     const plugins = customizationController.plugins;
+    const actionsDisabled = disabled || formex$1.isSubmitting || status === "existing" && !formex$1.dirty || Boolean(disabledProp);
     if (plugins && collection) {
       const actionProps = {
         entityId,
@@ -14197,7 +14203,8 @@
         context,
         currentEntityId: entityId,
         formContext,
-        openEntityMode
+        openEntityMode,
+        disabled: actionsDisabled
       };
       pluginActions.push(...plugins.map((plugin) => plugin.form?.Actions ? /* @__PURE__ */ jsxRuntime.jsx(plugin.form.Actions, { ...actionProps }, `actions_${plugin.key}`) : null).filter(Boolean));
     }
@@ -14266,13 +14273,13 @@
         const property_0 = resolvedCollection.properties[key_1];
         if (property_0) {
           const underlyingValueHasChanged = !!underlyingChanges && Object.keys(underlyingChanges).includes(key_1) && formex$1.touched[key_1];
-          const disabled = !autoSave && formex$1.isSubmitting || isReadOnly(property_0) || Boolean(property_0.disabled);
+          const disabled_0 = disabledProp || !autoSave && formex$1.isSubmitting || isReadOnly(property_0) || Boolean(property_0.disabled);
           const hidden = isHidden(property_0);
           if (hidden) return null;
           const widthPercentage = property_0.widthPercentage ?? 100;
           const cmsFormFieldProps = {
             propertyKey: key_1,
-            disabled,
+            disabled: disabled_0,
             property: property_0,
             includeDescription: property_0.description || property_0.longDescription,
             underlyingValueHasChanged: underlyingValueHasChanged && !autoSave,
@@ -14323,11 +14330,10 @@
     React.useEffect(() => {
       if (entityId && onIdChange) onIdChange(entityId);
     }, [entityId, onIdChange]);
-    const disabled_0 = formex$1.isSubmitting || !formex$1.dirty && status === "existing";
     if (!resolvedCollection || !path) {
       throw Error("INTERNAL: Collection and path must be defined in form context");
     }
-    const dialogActions = /* @__PURE__ */ jsxRuntime.jsx(EntityFormActionsComponent, { collection: resolvedCollection, path, entity, layout: forceActionsAtTheBottom ? "bottom" : "side", savingError, formex: formex$1, disabled: disabled_0, status, pluginActions, openEntityMode, showDefaultActions });
+    const dialogActions = /* @__PURE__ */ jsxRuntime.jsx(EntityFormActionsComponent, { collection: resolvedCollection, path, entity, layout: forceActionsAtTheBottom ? "bottom" : "side", savingError, formex: formex$1, disabled: actionsDisabled, status, pluginActions, openEntityMode, showDefaultActions });
     return /* @__PURE__ */ jsxRuntime.jsx(formex.Formex, { value: formex$1, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: formex$1.handleSubmit, onReset: () => formex$1.resetForm({
       values: getInitialEntityValues(authController, collection, path, status, entity, customizationController.propertyConfigs)
     }), noValidate: true, className: ui.cls("flex-1 flex flex-row w-full overflow-y-auto justify-center", className), children: [
@@ -14697,7 +14703,7 @@
     return t2;
   }
   function SelectFieldBinding(t0) {
-    const $ = reactCompilerRuntime.c(46);
+    const $ = reactCompilerRuntime.c(47);
     const {
       propertyKey,
       value,
@@ -14794,68 +14800,69 @@
       t12 = $[19];
     }
     let t13;
-    if ($[20] !== handleClearClick || $[21] !== property.clearable) {
-      t13 = property.clearable && /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { onClick: handleClearClick, children: /* @__PURE__ */ jsxRuntime.jsx(ui.CloseIcon, {}) });
-      $[20] = handleClearClick;
-      $[21] = property.clearable;
-      $[22] = t13;
+    if ($[20] !== disabled || $[21] !== handleClearClick || $[22] !== property.clearable) {
+      t13 = property.clearable && !disabled && /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { onClick: handleClearClick, children: /* @__PURE__ */ jsxRuntime.jsx(ui.CloseIcon, {}) });
+      $[20] = disabled;
+      $[21] = handleClearClick;
+      $[22] = property.clearable;
+      $[23] = t13;
     } else {
-      t13 = $[22];
+      t13 = $[23];
     }
     let t14;
-    if ($[23] !== property.dataType || $[24] !== setValue) {
+    if ($[24] !== property.dataType || $[25] !== setValue) {
       t14 = (updatedValue) => {
         const newValue = updatedValue ? property.dataType === "number" ? parseFloat(updatedValue) : updatedValue : null;
         return setValue(newValue);
       };
-      $[23] = property.dataType;
-      $[24] = setValue;
-      $[25] = t14;
+      $[24] = property.dataType;
+      $[25] = setValue;
+      $[26] = t14;
     } else {
-      t14 = $[25];
+      t14 = $[26];
     }
     const t15 = (enumKey) => /* @__PURE__ */ jsxRuntime.jsx(EnumValuesChip, { enumKey, enumValues, size });
     const t16 = enumValues && enumValues.map((option) => /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: String(option.id), children: /* @__PURE__ */ jsxRuntime.jsx(EnumValuesChip, { enumKey: String(option.id), enumValues, size }) }, option.id));
     let t17;
-    if ($[26] !== T0 || $[27] !== disabled || $[28] !== size || $[29] !== t12 || $[30] !== t13 || $[31] !== t14 || $[32] !== t15 || $[33] !== t16 || $[34] !== t5 || $[35] !== t8) {
+    if ($[27] !== T0 || $[28] !== disabled || $[29] !== size || $[30] !== t12 || $[31] !== t13 || $[32] !== t14 || $[33] !== t15 || $[34] !== t16 || $[35] !== t5 || $[36] !== t8) {
       t17 = /* @__PURE__ */ jsxRuntime.jsx(T0, { value: t5, disabled, size, fullWidth: t6, position: t7, inputClassName: t8, label: t12, endAdornment: t13, onValueChange: t14, renderValue: t15, children: t16 });
-      $[26] = T0;
-      $[27] = disabled;
-      $[28] = size;
-      $[29] = t12;
-      $[30] = t13;
-      $[31] = t14;
-      $[32] = t15;
-      $[33] = t16;
-      $[34] = t5;
-      $[35] = t8;
-      $[36] = t17;
+      $[27] = T0;
+      $[28] = disabled;
+      $[29] = size;
+      $[30] = t12;
+      $[31] = t13;
+      $[32] = t14;
+      $[33] = t15;
+      $[34] = t16;
+      $[35] = t5;
+      $[36] = t8;
+      $[37] = t17;
     } else {
-      t17 = $[36];
+      t17 = $[37];
     }
     let t18;
-    if ($[37] !== disabled || $[38] !== error || $[39] !== includeDescription || $[40] !== property || $[41] !== showError) {
+    if ($[38] !== disabled || $[39] !== error || $[40] !== includeDescription || $[41] !== property || $[42] !== showError) {
       t18 = /* @__PURE__ */ jsxRuntime.jsx(FieldHelperText, { includeDescription, showError, error, disabled, property });
-      $[37] = disabled;
-      $[38] = error;
-      $[39] = includeDescription;
-      $[40] = property;
-      $[41] = showError;
-      $[42] = t18;
+      $[38] = disabled;
+      $[39] = error;
+      $[40] = includeDescription;
+      $[41] = property;
+      $[42] = showError;
+      $[43] = t18;
     } else {
-      t18 = $[42];
+      t18 = $[43];
     }
     let t19;
-    if ($[43] !== t17 || $[44] !== t18) {
+    if ($[44] !== t17 || $[45] !== t18) {
       t19 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         t17,
         t18
       ] });
-      $[43] = t17;
-      $[44] = t18;
-      $[45] = t19;
+      $[44] = t17;
+      $[45] = t18;
+      $[46] = t19;
     } else {
-      t19 = $[45];
+      t19 = $[46];
     }
     return t19;
   }
@@ -15083,7 +15090,7 @@
   const acceptDropClasses = "transition-colors duration-200 ease-[cubic-bezier(0,0,0.2,1)] border-2 border-solid border-green-500";
   const rejectDropClasses = "transition-colors duration-200 ease-[cubic-bezier(0,0,0.2,1)] border-2 border-solid border-red-500";
   function StorageUploadFieldBinding(t0) {
-    const $ = reactCompilerRuntime.c(47);
+    const $ = reactCompilerRuntime.c(48);
     const {
       propertyKey,
       value,
@@ -15103,18 +15110,19 @@
     }
     const storageSource = useStorageSource(context.collection);
     let t1;
-    if ($[0] !== isSubmitting || $[1] !== property) {
-      t1 = isReadOnly(property) || !!property.disabled || isSubmitting;
-      $[0] = isSubmitting;
-      $[1] = property;
-      $[2] = t1;
+    if ($[0] !== context.disabled || $[1] !== isSubmitting || $[2] !== property) {
+      t1 = isReadOnly(property) || !!property.disabled || isSubmitting || context.disabled;
+      $[0] = context.disabled;
+      $[1] = isSubmitting;
+      $[2] = property;
+      $[3] = t1;
     } else {
-      t1 = $[2];
+      t1 = $[3];
     }
     const disabled = t1;
     const t2 = disabled ?? false;
     let t3;
-    if ($[3] !== context.entityId || $[4] !== context.path || $[5] !== context.values || $[6] !== property || $[7] !== propertyKey || $[8] !== setValue || $[9] !== storageSource || $[10] !== t2 || $[11] !== value) {
+    if ($[4] !== context.entityId || $[5] !== context.path || $[6] !== context.values || $[7] !== property || $[8] !== propertyKey || $[9] !== setValue || $[10] !== storageSource || $[11] !== t2 || $[12] !== value) {
       t3 = {
         entityValues: context.values,
         entityId: context.entityId,
@@ -15126,18 +15134,18 @@
         disabled: t2,
         onChange: setValue
       };
-      $[3] = context.entityId;
-      $[4] = context.path;
-      $[5] = context.values;
-      $[6] = property;
-      $[7] = propertyKey;
-      $[8] = setValue;
-      $[9] = storageSource;
-      $[10] = t2;
-      $[11] = value;
-      $[12] = t3;
+      $[4] = context.entityId;
+      $[5] = context.path;
+      $[6] = context.values;
+      $[7] = property;
+      $[8] = propertyKey;
+      $[9] = setValue;
+      $[10] = storageSource;
+      $[11] = t2;
+      $[12] = value;
+      $[13] = t3;
     } else {
-      t3 = $[12];
+      t3 = $[13];
     }
     const {
       internalValue,
@@ -15149,90 +15157,90 @@
       multipleFilesSupported
     } = useStorageUploadController(t3);
     let t4;
-    if ($[13] !== property || $[14] !== setValue || $[15] !== value) {
+    if ($[14] !== property || $[15] !== setValue || $[16] !== value) {
       t4 = {
         property,
         value,
         setValue
       };
-      $[13] = property;
-      $[14] = setValue;
-      $[15] = value;
-      $[16] = t4;
+      $[14] = property;
+      $[15] = setValue;
+      $[16] = value;
+      $[17] = t4;
     } else {
-      t4 = $[16];
+      t4 = $[17];
     }
     useClearRestoreValue(t4);
     const t5 = property;
     let t6;
-    if ($[17] !== authController || $[18] !== t5) {
+    if ($[18] !== authController || $[19] !== t5) {
       t6 = resolveProperty({
         propertyOrBuilder: t5,
         authController
       });
-      $[17] = authController;
-      $[18] = t5;
-      $[19] = t6;
+      $[18] = authController;
+      $[19] = t5;
+      $[20] = t6;
     } else {
-      t6 = $[19];
+      t6 = $[20];
     }
     const resolvedProperty = t6;
     let t7;
-    if ($[20] !== minimalistView || $[21] !== property || $[22] !== propertyKey) {
+    if ($[21] !== minimalistView || $[22] !== property || $[23] !== propertyKey) {
       t7 = !minimalistView && /* @__PURE__ */ jsxRuntime.jsx(LabelWithIconAndTooltip, { propertyKey, icon: getIconForProperty(property, "small"), required: property.validation?.required, title: property.name, className: "h-8text-text-secondary dark:text-text-secondary-dark ml-3.5" });
-      $[20] = minimalistView;
-      $[21] = property;
-      $[22] = propertyKey;
-      $[23] = t7;
+      $[21] = minimalistView;
+      $[22] = property;
+      $[23] = propertyKey;
+      $[24] = t7;
     } else {
-      t7 = $[23];
+      t7 = $[24];
     }
     const t8 = disabled ?? false;
     const t9 = autoFocus ?? false;
     let t10;
-    if ($[24] !== internalValue || $[25] !== multipleFilesSupported || $[26] !== onFileUploadComplete || $[27] !== onFilesAdded || $[28] !== propertyKey || $[29] !== resolvedProperty || $[30] !== setInternalValue || $[31] !== setValue || $[32] !== storage || $[33] !== storagePathBuilder || $[34] !== t8 || $[35] !== t9) {
+    if ($[25] !== internalValue || $[26] !== multipleFilesSupported || $[27] !== onFileUploadComplete || $[28] !== onFilesAdded || $[29] !== propertyKey || $[30] !== resolvedProperty || $[31] !== setInternalValue || $[32] !== setValue || $[33] !== storage || $[34] !== storagePathBuilder || $[35] !== t8 || $[36] !== t9) {
       t10 = /* @__PURE__ */ jsxRuntime.jsx(StorageUpload, { value: internalValue, name: propertyKey, disabled: t8, autoFocus: t9, property: resolvedProperty, onChange: setValue, setInternalValue, onFilesAdded, onFileUploadComplete, storagePathBuilder, storage, multipleFilesSupported });
-      $[24] = internalValue;
-      $[25] = multipleFilesSupported;
-      $[26] = onFileUploadComplete;
-      $[27] = onFilesAdded;
-      $[28] = propertyKey;
-      $[29] = resolvedProperty;
-      $[30] = setInternalValue;
-      $[31] = setValue;
-      $[32] = storage;
-      $[33] = storagePathBuilder;
-      $[34] = t8;
-      $[35] = t9;
-      $[36] = t10;
-    } else {
-      t10 = $[36];
+      $[25] = internalValue;
+      $[26] = multipleFilesSupported;
+      $[27] = onFileUploadComplete;
+      $[28] = onFilesAdded;
+      $[29] = propertyKey;
+      $[30] = resolvedProperty;
+      $[31] = setInternalValue;
+      $[32] = setValue;
+      $[33] = storage;
+      $[34] = storagePathBuilder;
+      $[35] = t8;
+      $[36] = t9;
+      $[37] = t10;
+    } else {
+      t10 = $[37];
     }
     let t11;
-    if ($[37] !== disabled || $[38] !== error || $[39] !== includeDescription || $[40] !== property || $[41] !== showError) {
+    if ($[38] !== disabled || $[39] !== error || $[40] !== includeDescription || $[41] !== property || $[42] !== showError) {
       t11 = /* @__PURE__ */ jsxRuntime.jsx(FieldHelperText, { includeDescription, showError, error, disabled, property });
-      $[37] = disabled;
-      $[38] = error;
-      $[39] = includeDescription;
-      $[40] = property;
-      $[41] = showError;
-      $[42] = t11;
+      $[38] = disabled;
+      $[39] = error;
+      $[40] = includeDescription;
+      $[41] = property;
+      $[42] = showError;
+      $[43] = t11;
     } else {
-      t11 = $[42];
+      t11 = $[43];
     }
     let t12;
-    if ($[43] !== t10 || $[44] !== t11 || $[45] !== t7) {
+    if ($[44] !== t10 || $[45] !== t11 || $[46] !== t7) {
       t12 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         t7,
         t10,
         t11
       ] });
-      $[43] = t10;
-      $[44] = t11;
-      $[45] = t7;
-      $[46] = t12;
+      $[44] = t10;
+      $[45] = t11;
+      $[46] = t7;
+      $[47] = t12;
     } else {
-      t12 = $[46];
+      t12 = $[47];
     }
     return t12;
   }
@@ -16148,7 +16156,7 @@
           index,
           authController
         });
-        const disabled = disabledProp || isReadOnly(resolvedProperty) || Boolean(resolvedProperty?.disabled);
+        const disabled = disabledProp || isReadOnly(resolvedProperty) || Boolean(resolvedProperty?.disabled) || context.disabled;
         if (resolvedProperty === null || isHidden(resolvedProperty)) {
           return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
         } else {
@@ -18191,7 +18199,8 @@
       save: saveValue,
       formex: formex$1,
       status: "existing",
-      openEntityMode: "side_panel"
+      openEntityMode: "side_panel",
+      disabled: false
     };
     const property = propertyKey && getPropertyInPath(collection?.properties ?? {}, propertyKey);
     const fieldProps = propertyKey && property ? {
@@ -21236,6 +21245,9 @@
         return entity ? canEditEntity(props.collection, authController, props.path, entity ?? null) : void 0;
       }
     }, [authController, entity, status]);
+    console.log({
+      canEdit
+    });
     if (dataLoading && !cachedValues || (!entity || canEdit === void 0) && (status === "existing" || status === "copy")) {
       return /* @__PURE__ */ jsxRuntime.jsx(CircularProgressCenter, {});
     }
@@ -21291,7 +21303,7 @@
       resolvedEntityViews,
       selectedEntityView,
       selectedSecondaryForm
-    } = resolvedSelectedEntityView(customViews, customizationController, selectedTab, canEdit);
+    } = resolvedSelectedEntityView(customViews, customizationController, selectedTab);
     const actionsAtTheBottom = !largeLayout || layout === "side_panel" || selectedEntityView?.includeActions === "bottom";
     const mainViewVisible = selectedTab === MAIN_TAB_VALUE || Boolean(selectedSecondaryForm);
     const authController = useAuthController();
@@ -21309,6 +21321,7 @@
       const formexStub = createFormexStub(usedEntity?.values ?? {});
       const usedFormContext = formContext ?? {
         entityId,
+        disabled: false,
         openEntityMode: layout,
         status,
         values: usedEntity?.values ?? {},
@@ -21360,10 +21373,11 @@
         });
       }
     };
-    const entityView = !canEdit ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cls("flex-1 flex flex-row w-full overflow-y-auto justify-center", !mainViewVisible ? "hidden" : ""), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("relative flex flex-col max-w-4xl lg:max-w-3xl xl:max-w-4xl 2xl:max-w-6xl w-full h-fit"), children: [
+    const entityReadOnlyView = /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cls("flex-1 flex flex-row w-full overflow-y-auto justify-center", canEdit || !mainViewVisible || selectedSecondaryForm ? "hidden" : ""), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("relative flex flex-col max-w-4xl lg:max-w-3xl xl:max-w-4xl 2xl:max-w-6xl w-full h-fit"), children: [
       /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { className: "mt-16 mb-8 mx-8", variant: "h4", children: collection.singularName ?? collection.name }),
       /* @__PURE__ */ jsxRuntime.jsx(EntityView, { className: "px-8 h-full overflow-auto", entity, path, collection })
-    ] }) }) : /* @__PURE__ */ jsxRuntime.jsx(EntityForm, { collection, path, entityId: entityId ?? usedEntity?.id, onValuesModified, entity, initialDirtyValues: cachedDirtyValues, openEntityMode: layout, forceActionsAtTheBottom: actionsAtTheBottom, initialStatus: status, className: ui.cls(!mainViewVisible ? "hidden" : "", formProps?.className), EntityFormActionsComponent: EntityEditViewFormActions, ...formProps, onEntityChange: (entity_0) => {
+    ] }) });
+    const entityView = /* @__PURE__ */ jsxRuntime.jsx(EntityForm, { collection, path, entityId: entityId ?? usedEntity?.id, onValuesModified, entity, initialDirtyValues: cachedDirtyValues, openEntityMode: layout, forceActionsAtTheBottom: actionsAtTheBottom, initialStatus: status, className: ui.cls((!mainViewVisible || !canEdit) && !selectedSecondaryForm ? "hidden" : "", formProps?.className), EntityFormActionsComponent: EntityEditViewFormActions, disabled: !canEdit, ...formProps, onEntityChange: (entity_0) => {
       setUsedEntity(entity_0);
       formProps?.onEntityChange?.(entity_0);
     }, onStatusChange: (status_0) => {
@@ -21396,7 +21410,10 @@
           subcollectionTabs
         ] })
       ] }),
-      globalLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full pt-12 pb-16 px-4 sm:px-8 md:px-10", children: /* @__PURE__ */ jsxRuntime.jsx(CircularProgressCenter, {}) }) : entityView,
+      globalLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full pt-12 pb-16 px-4 sm:px-8 md:px-10", children: /* @__PURE__ */ jsxRuntime.jsx(CircularProgressCenter, {}) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        entityReadOnlyView,
+        entityView
+      ] }),
       jsonView,
       customViewsView,
       subCollectionsViews