@firecms/core 3.0.0-canary.285 → 3.0.0-canary.287

package/dist/index.umd.js

@@ -1052,6 +1052,12 @@
       };
     });
   };
+  function getLocalChangesBackup(collection) {
+    if (!collection.localChangesBackup) {
+      return "manual_apply";
+    }
+    return collection.localChangesBackup;
+  }
   const kebabCaseRegex = /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g;
   const toKebabCase = (str) => {
     const regExpMatchArray = str.match(kebabCaseRegex);
@@ -9755,7 +9761,6 @@
     return value;
   }
   function saveEntityToCache(path, data) {
-    entityCache.set(path, data);
     if (isLocalStorageAvailable) {
       try {
         const key = LOCAL_STORAGE_PREFIX + path;
@@ -9766,17 +9771,22 @@
       }
     }
   }
-  function getEntityFromCache(path, useLocalStorage = true) {
-    if (entityCache.has(path)) {
-      return entityCache.get(path);
-    }
-    if (isLocalStorageAvailable && useLocalStorage) {
+  function removeEntityFromMemoryCache(path) {
+    entityCache.delete(path);
+  }
+  function saveEntityToMemoryCache(path, data) {
+    entityCache.set(path, data);
+  }
+  function getEntityFromMemoryCache(path) {
+    return entityCache.get(path);
+  }
+  function getEntityFromCache(path) {
+    if (isLocalStorageAvailable) {
       try {
         const key = LOCAL_STORAGE_PREFIX + path;
         const entityString = localStorage.getItem(key);
         if (entityString) {
           const entity = JSON.parse(entityString, customReviver);
-          entityCache.set(path, entity);
           return entity;
         }
       } catch (error) {
@@ -9785,12 +9795,7 @@
     }
     return void 0;
   }
-  function hasEntityInCache(path) {
-    return entityCache.has(path);
-  }
   function removeEntityFromCache(path) {
-    console.debug("Removing entity from cache", path);
-    entityCache.delete(path);
     if (isLocalStorageAvailable) {
       try {
         const key = LOCAL_STORAGE_PREFIX + path;
@@ -9827,7 +9832,8 @@
     const hasCollapsedActions = actions.some((a) => a.collapsed || a.collapsed === void 0);
     const collapsedActions = actions.filter((a_0) => a_0.collapsed || a_0.collapsed === void 0);
     const uncollapsedActions = actions.filter((a_1) => a_1.collapsed === false);
-    const hasDraft = hasEntityInCache(fullPath + "/" + entity.id);
+    const enableLocalChangesBackup = collection ? getLocalChangesBackup(collection) : false;
+    const hasDraft = enableLocalChangesBackup ? getEntityFromCache(fullPath + "/" + entity.id) : false;
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("h-full flex items-center justify-center flex-col bg-surface-50 dark:bg-surface-900 bg-opacity-90 dark:bg-opacity-90 z-10", frozen ? "sticky left-0" : ""), onClick: React.useCallback((event) => {
       event.stopPropagation();
     }, []), style: {
@@ -15162,6 +15168,273 @@
       savingError && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-right", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { color: "error", children: savingError.message }) })
     ] });
   }
+  function LocalChangesMenu(t0) {
+    const $ = reactCompilerRuntime.c(43);
+    const {
+      localChangesData,
+      formex: formex$1,
+      onClearLocalChanges,
+      cacheKey,
+      properties
+    } = t0;
+    const snackbarController = useSnackbarController();
+    const [previewDialogOpen, setPreviewDialogOpen] = React.useState(false);
+    const [open, setOpen] = React.useState(false);
+    let t1;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+      t1 = () => {
+        setOpen(true);
+      };
+      $[0] = t1;
+    } else {
+      t1 = $[0];
+    }
+    const handleOpenMenu = t1;
+    let t2;
+    if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+      t2 = () => {
+        setOpen(false);
+      };
+      $[1] = t2;
+    } else {
+      t2 = $[1];
+    }
+    const handleCloseMenu = t2;
+    let t3;
+    if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+      t3 = () => {
+        setPreviewDialogOpen(true);
+        handleCloseMenu();
+      };
+      $[2] = t3;
+    } else {
+      t3 = $[2];
+    }
+    const handlePreview = t3;
+    let t4;
+    if ($[3] !== formex$1 || $[4] !== localChangesData || $[5] !== onClearLocalChanges || $[6] !== snackbarController) {
+      t4 = () => {
+        const mergedValues = mergeDeep(formex$1.values, localChangesData);
+        const touched = {
+          ...formex$1.touched
+        };
+        const newTouched = formex.flattenKeys(localChangesData);
+        newTouched.forEach((key) => {
+          touched[key] = true;
+        });
+        formex$1.setTouched(touched);
+        formex$1.setValues(mergedValues);
+        snackbarController.open({
+          type: "info",
+          message: "Local changes applied to the form"
+        });
+        handleCloseMenu();
+        onClearLocalChanges?.();
+      };
+      $[3] = formex$1;
+      $[4] = localChangesData;
+      $[5] = onClearLocalChanges;
+      $[6] = snackbarController;
+      $[7] = t4;
+    } else {
+      t4 = $[7];
+    }
+    const handleApply = t4;
+    let t5;
+    if ($[8] !== cacheKey || $[9] !== onClearLocalChanges || $[10] !== snackbarController) {
+      t5 = () => {
+        removeEntityFromCache(cacheKey);
+        snackbarController.open({
+          type: "info",
+          message: "Local changes discarded"
+        });
+        handleCloseMenu();
+        onClearLocalChanges?.();
+      };
+      $[8] = cacheKey;
+      $[9] = onClearLocalChanges;
+      $[10] = snackbarController;
+      $[11] = t5;
+    } else {
+      t5 = $[11];
+    }
+    const handleDiscard = t5;
+    let t6;
+    if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
+      t6 = /* @__PURE__ */ jsxRuntime.jsx(ui.WarningIcon, { size: "smallest", className: "mr-1 text-yellow-600 dark:text-yellow-400" });
+      $[12] = t6;
+    } else {
+      t6 = $[12];
+    }
+    let t7;
+    if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
+      t7 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { size: "small", className: "font-semibold text-xs rounded-full px-4 py-1 bg-yellow-200 dark:bg-yellow-900 hover:bg-yellow-300 dark:hover:bg-yellow-800 text-yellow-800 dark:text-yellow-200", onClick: handleOpenMenu, children: [
+        t6,
+        "Unsaved Local changes",
+        /* @__PURE__ */ jsxRuntime.jsx(ui.KeyboardArrowDownIcon, { size: "smallest" })
+      ] });
+      $[13] = t7;
+    } else {
+      t7 = $[13];
+    }
+    let t8;
+    if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
+      t8 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-xs px-4 py-4 text-sm text-gray-700 dark:text-gray-300", children: "This document was edited locally and has unsaved changes." });
+      $[14] = t8;
+    } else {
+      t8 = $[14];
+    }
+    let t9;
+    if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+      t9 = /* @__PURE__ */ jsxRuntime.jsxs(ui.MenuItem, { dense: true, onClick: handlePreview, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.VisibilityIcon, { size: "small" }),
+        "Preview Changes"
+      ] });
+      $[15] = t9;
+    } else {
+      t9 = $[15];
+    }
+    let t10;
+    if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
+      t10 = /* @__PURE__ */ jsxRuntime.jsx(ui.CheckIcon, { size: "small" });
+      $[16] = t10;
+    } else {
+      t10 = $[16];
+    }
+    let t11;
+    if ($[17] !== handleApply) {
+      t11 = /* @__PURE__ */ jsxRuntime.jsxs(ui.MenuItem, { dense: true, onClick: handleApply, children: [
+        t10,
+        "Apply Changes"
+      ] });
+      $[17] = handleApply;
+      $[18] = t11;
+    } else {
+      t11 = $[18];
+    }
+    let t12;
+    if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
+      t12 = /* @__PURE__ */ jsxRuntime.jsx(ui.CancelIcon, { size: "small" });
+      $[19] = t12;
+    } else {
+      t12 = $[19];
+    }
+    let t13;
+    if ($[20] !== handleDiscard) {
+      t13 = /* @__PURE__ */ jsxRuntime.jsxs(ui.MenuItem, { dense: true, onClick: handleDiscard, children: [
+        t12,
+        "Discard Local Changes"
+      ] });
+      $[20] = handleDiscard;
+      $[21] = t13;
+    } else {
+      t13 = $[21];
+    }
+    let t14;
+    if ($[22] !== open || $[23] !== t11 || $[24] !== t13) {
+      t14 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Menu, { trigger: t7, open, onOpenChange: setOpen, children: [
+        t8,
+        t9,
+        t11,
+        t13
+      ] });
+      $[22] = open;
+      $[23] = t11;
+      $[24] = t13;
+      $[25] = t14;
+    } else {
+      t14 = $[25];
+    }
+    let t15;
+    let t16;
+    if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
+      t15 = /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl mb-4", children: "Preview Local Changes" });
+      t16 = /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4", children: "These are the local changes that will be applied to the form." });
+      $[26] = t15;
+      $[27] = t16;
+    } else {
+      t15 = $[26];
+      t16 = $[27];
+    }
+    let t17;
+    if ($[28] !== localChangesData || $[29] !== properties) {
+      t17 = formex.flattenKeys(localChangesData).map((key_0) => {
+        const value = formex.getIn(localChangesData, key_0);
+        const property = getPropertyInPath(properties, key_0);
+        if (!property) {
+          return null;
+        }
+        return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-12 gap-x-4 px-4 py-3 items-center", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-3 text-right", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "caption", className: "text-gray-500 dark:text-gray-400 break-words", children: property.name || key_0 }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-9", children: /* @__PURE__ */ jsxRuntime.jsx(PropertyPreview, { propertyKey: key_0, value, property, size: "small" }) })
+        ] }, key_0);
+      });
+      $[28] = localChangesData;
+      $[29] = properties;
+      $[30] = t17;
+    } else {
+      t17 = $[30];
+    }
+    let t18;
+    if ($[31] !== t17) {
+      t18 = /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogContent, { children: [
+        t15,
+        t16,
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `border rounded-lg divide-y divide-surface-200 divide-surface-opacity-40 dark:divide-surface-700 dark:divide-opacity-40 ${ui.defaultBorderMixin}`, children: t17 })
+      ] });
+      $[31] = t17;
+      $[32] = t18;
+    } else {
+      t18 = $[32];
+    }
+    let t19;
+    if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
+      t19 = /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: () => setPreviewDialogOpen(false), children: "Close" });
+      $[33] = t19;
+    } else {
+      t19 = $[33];
+    }
+    let t20;
+    if ($[34] !== handleApply) {
+      t20 = /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogActions, { children: [
+        t19,
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "filled", onClick: () => {
+          handleApply();
+          setPreviewDialogOpen(false);
+        }, children: "Apply changes" })
+      ] });
+      $[34] = handleApply;
+      $[35] = t20;
+    } else {
+      t20 = $[35];
+    }
+    let t21;
+    if ($[36] !== previewDialogOpen || $[37] !== t18 || $[38] !== t20) {
+      t21 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Dialog, { open: previewDialogOpen, onOpenChange: setPreviewDialogOpen, maxWidth: "4xl", children: [
+        t18,
+        t20
+      ] });
+      $[36] = previewDialogOpen;
+      $[37] = t18;
+      $[38] = t20;
+      $[39] = t21;
+    } else {
+      t21 = $[39];
+    }
+    let t22;
+    if ($[40] !== t14 || $[41] !== t21) {
+      t22 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        t14,
+        t21
+      ] });
+      $[40] = t14;
+      $[41] = t21;
+      $[42] = t22;
+    } else {
+      t22 = $[42];
+    }
+    return t22;
+  }
   function extractTouchedValues(values, touched) {
     let acc = {};
     if (!touched || typeof touched !== "object") {
@@ -15249,6 +15522,12 @@
     const [entityIdError, setEntityIdError] = React.useState(false);
     const [savingError, setSavingError] = React.useState();
     const autoSave = collection.formAutoSave && !collection.customId;
+    const baseInitialValues = React.useMemo(() => getInitialEntityValues(authController, collection, path, status, entity, customizationController.propertyConfigs), [authController, collection, path, status, entity, customizationController.propertyConfigs]);
+    const localChangesDataRaw = React.useMemo(() => entityId ? getEntityFromCache(path + "/" + entityId) : getEntityFromCache(path + "#new"), [entityId, path]);
+    const [localChangesCleared, setLocalChangesCleared] = React.useState(false);
+    const localChangesBackup = getLocalChangesBackup(collection);
+    const autoApplyLocalChanges = localChangesBackup === "auto_apply";
+    const manualApplyLocalChanges = localChangesBackup === "manual_apply";
     const onSubmit = (values, formexController) => {
       if (mustSetCustomId && !entityId) {
         console.error("Missing custom Id");
@@ -15279,12 +15558,31 @@
         formexController.setSubmitting(false);
       });
     };
-    const baseInitialValues = getInitialEntityValues(authController, collection, path, status, entity, customizationController.propertyConfigs);
-    const initialValues = initialDirtyValues ? mergeDeep(baseInitialValues, initialDirtyValues) : baseInitialValues;
-    const initialDirty = Boolean(initialDirtyValues) && initialDirtyValues && Object.keys(initialDirtyValues).length > 0;
+    const [initialValues_0, initialDirty_0] = React.useMemo(() => {
+      const initialValuesWithLocalChanges = autoApplyLocalChanges && localChangesDataRaw ? mergeDeep(baseInitialValues, localChangesDataRaw) : baseInitialValues;
+      const initialValues = initialDirtyValues ? mergeDeep(initialValuesWithLocalChanges, initialDirtyValues) : initialValuesWithLocalChanges;
+      const initialDirty = Boolean(initialDirtyValues) && initialDirtyValues && Object.keys(initialDirtyValues).length > 0;
+      return [initialValues, initialDirty];
+    }, [autoApplyLocalChanges, localChangesDataRaw, baseInitialValues, initialDirtyValues]);
+    const localChangesData = React.useMemo(() => {
+      if (!localChangesDataRaw) {
+        return void 0;
+      }
+      let filteredChanges = {};
+      const flattenedKeys = formex.flattenKeys(localChangesDataRaw);
+      flattenedKeys.forEach((key) => {
+        const localValue = formex.getIn(localChangesDataRaw, key);
+        const initialValue = formex.getIn(initialValues_0, key);
+        if (!equal(localValue, initialValue)) {
+          filteredChanges = formex.setIn(filteredChanges, key, localValue);
+        }
+      });
+      return filteredChanges;
+    }, [localChangesDataRaw, initialValues_0]);
+    const hasLocalChanges = !localChangesCleared && localChangesData && Object.keys(localChangesData).length > 0;
     const formex$1 = formexProp ?? formex.useCreateFormex({
-      initialValues,
-      initialDirty,
+      initialValues: initialValues_0,
+      initialDirty: initialDirty_0,
       initialTouched: initialDirtyValues ? formex.flattenKeys(initialDirtyValues).reduce((previousValue, currentValue) => ({
         ...previousValue,
         [currentValue]: true
@@ -15292,13 +15590,13 @@
       onSubmit,
       onReset: () => {
         clearDirtyCache();
-        onValuesModified?.(false);
+        onValuesModified?.(false, initialValues_0);
       },
       onValuesChangeDeferred: (values_0, controller) => {
-        const key = status === "new" || status === "copy" ? path + "#new" : path + "/" + entityId;
+        const key_0 = status === "new" || status === "copy" ? path + "#new" : path + "/" + entityId;
         if (controller.dirty) {
           const touchedValues = extractTouchedValues(values_0, controller.touched);
-          saveEntityToCache(key, touchedValues);
+          saveEntityToCache(key_0, touchedValues);
         }
       },
       validation: (values_1) => {
@@ -15351,14 +15649,16 @@
     }, [snackbarController]);
     function clearDirtyCache() {
       if (status === "new" || status === "copy") {
+        removeEntityFromMemoryCache(path + "#new");
         removeEntityFromCache(path + "#new");
       } else {
+        removeEntityFromMemoryCache(path + "/" + entityId);
         removeEntityFromCache(path + "/" + entityId);
       }
     }
     const onSaveSuccess = (updatedEntity) => {
       clearDirtyCache();
-      onValuesModified?.(false);
+      onValuesModified?.(false, updatedEntity.values);
       if (!autoSave) snackbarController.open({
         type: "success",
         message: `${collection.singularName ?? collection.name}: Saved correctly`
@@ -15518,7 +15818,7 @@
     }, [doOnIdUpdate]);
     React.useEffect(() => {
       if (!autoSave) {
-        onValuesModified?.(modified);
+        onValuesModified?.(modified, formex$1.values);
       }
     }, [formex$1.dirty]);
     const modified = formex$1.dirty;
@@ -15530,11 +15830,11 @@
     useOnAutoSave(autoSave, formex$1, lastSavedValues, save);
     React.useEffect(() => {
       if (!autoSave && !formex$1.isSubmitting && underlyingChanges && entity) {
-        Object.entries(underlyingChanges).forEach(([key_0, value_0]) => {
-          const formValue = formex$1.values[key_0];
-          if (!equal(value_0, formValue) && !formex$1.touched[key_0]) {
-            console.debug("Updated value from the datasource:", key_0, value_0);
-            formex$1.setFieldValue(key_0, value_0 !== void 0 ? value_0 : null);
+        Object.entries(underlyingChanges).forEach(([key_1, value_0]) => {
+          const formValue = formex$1.values[key_1];
+          if (!equal(value_0, formValue) && !formex$1.touched[key_1]) {
+            console.debug("Updated value from the datasource:", key_1, value_0);
+            formex$1.setFieldValue(key_1, value_0 !== void 0 ? value_0 : null);
           }
         });
       }
@@ -15544,16 +15844,16 @@
       if (Builder) {
         return /* @__PURE__ */ jsxRuntime.jsx(Builder, { collection, entity, modifiedValues: formex$1.values, formContext });
       }
-      return /* @__PURE__ */ jsxRuntime.jsx(FormLayout, { children: formFieldKeys.map((key_1) => {
-        const property = resolvedCollection.properties[key_1];
+      return /* @__PURE__ */ jsxRuntime.jsx(FormLayout, { children: formFieldKeys.map((key_2) => {
+        const property = resolvedCollection.properties[key_2];
         if (property) {
-          const underlyingValueHasChanged = !!underlyingChanges && Object.keys(underlyingChanges).includes(key_1) && formex$1.touched[key_1];
+          const underlyingValueHasChanged = !!underlyingChanges && Object.keys(underlyingChanges).includes(key_2) && formex$1.touched[key_2];
           const disabled_0 = disabledProp || !autoSave && formex$1.isSubmitting || isReadOnly(property) || Boolean(property.disabled);
           const hidden = isHidden(property);
           if (hidden) return null;
           const widthPercentage = property.widthPercentage ?? 100;
           const cmsFormFieldProps = {
-            propertyKey: key_1,
+            propertyKey: key_2,
             disabled: disabled_0,
             property,
             includeDescription: property.description || property.longDescription,
@@ -15563,9 +15863,9 @@
             minimalistView: false,
             autoFocus: false
           };
-          return /* @__PURE__ */ jsxRuntime.jsx(FormEntry, { propertyKey: key_1, widthPercentage, children: /* @__PURE__ */ jsxRuntime.jsx(PropertyFieldBinding, { ...cmsFormFieldProps }) }, `field_${key_1}`);
+          return /* @__PURE__ */ jsxRuntime.jsx(FormEntry, { propertyKey: key_2, widthPercentage, children: /* @__PURE__ */ jsxRuntime.jsx(PropertyFieldBinding, { ...cmsFormFieldProps }) }, `field_${key_2}`);
         }
-        const additionalField = resolvedCollection.additionalFields?.find((f) => f.key === key_1);
+        const additionalField = resolvedCollection.additionalFields?.find((f) => f.key === key_2);
         if (additionalField && entity) {
           const Builder_0 = additionalField.Builder;
           if (!Builder_0 && !additionalField.value) {
@@ -15576,11 +15876,11 @@
             context
           })?.toString() });
           return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(LabelWithIconAndTooltip, { propertyKey: key_1, icon: /* @__PURE__ */ jsxRuntime.jsx(ui.NotesIcon, { size: "small" }), title: additionalField.name, className: "text-text-secondary dark:text-text-secondary-dark ml-3.5" }),
+            /* @__PURE__ */ jsxRuntime.jsx(LabelWithIconAndTooltip, { propertyKey: key_2, icon: /* @__PURE__ */ jsxRuntime.jsx(ui.NotesIcon, { size: "small" }), title: additionalField.name, className: "text-text-secondary dark:text-text-secondary-dark ml-3.5" }),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cls(ui.paperMixin, "w-full min-h-14 p-4 md:p-6 overflow-x-scroll no-scrollbar"), children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary, { children: child }) })
-          ] }, `additional_${key_1}`);
+          ] }, `additional_${key_2}`);
         }
-        console.warn(`Property ${key_1} not found in collection ${resolvedCollection.name} in properties or additional fields. Skipping.`);
+        console.warn(`Property ${key_2} not found in collection ${resolvedCollection.name} in properties or additional fields. Skipping.`);
         return null;
       }).filter(Boolean) });
     };
@@ -15615,7 +15915,10 @@
       values: baseInitialValues
     }), noValidate: true, className: ui.cls("flex-1 flex flex-row w-full overflow-y-auto justify-center", className), children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { id: `form_${path}`, className: ui.cls("relative flex flex-row max-w-4xl lg:max-w-3xl xl:max-w-4xl 2xl:max-w-6xl w-full h-fit"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("flex flex-col w-full pt-12 pb-16 px-4 sm:px-8 md:px-10"), children: [
-        formex$1.dirty ? /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "Local unsaved changes", className: "self-end sticky top-4 z-10", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { size: "small", colorScheme: "orangeDarker", children: /* @__PURE__ */ jsxRuntime.jsx(ui.EditIcon, { size: "smallest" }) }) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "In sync with the database", className: "self-end sticky top-4 z-10", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { size: "small", children: /* @__PURE__ */ jsxRuntime.jsx(ui.CheckIcon, { size: "smallest" }) }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row gap-4 self-end sticky top-4 z-10", children: [
+          manualApplyLocalChanges && hasLocalChanges && /* @__PURE__ */ jsxRuntime.jsx(LocalChangesMenu, { cacheKey: status === "new" || status === "copy" ? path + "#new" : path + "/" + entityId, properties: resolvedCollection.properties, localChangesData, formex: formex$1, onClearLocalChanges: () => setLocalChangesCleared(true) }),
+          formex$1.dirty ? /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "There are local unsaved changes", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { size: "small", colorScheme: "orangeDarker", children: /* @__PURE__ */ jsxRuntime.jsx(ui.EditIcon, { size: "smallest" }) }) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "The current form is in sync with the database", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { size: "small", children: /* @__PURE__ */ jsxRuntime.jsx(ui.CheckIcon, { size: "smallest" }) }) })
+        ] }),
         formView
       ] }) }),
       dialogActions
@@ -20425,7 +20728,7 @@
         /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "subtitle2", children: "So empty..." }),
         /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { color: "primary", variant: "outlined", onClick: onNewClick, className: "mt-4", children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.AddIcon, {}),
-          "Create your first entity"
+          "Create your first entry"
         ] })
       ] }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "label", children: "No results with the applied filter/sort" }), hoverRow, inlineEditing: checkInlineEditing(), AdditionalHeaderWidget: buildAdditionalHeaderWidget, AddColumnComponent: addColumnComponentInternal, getIdColumnWidth, additionalIDHeaderWidget: /* @__PURE__ */ jsxRuntime.jsx(EntityIdHeaderWidget, { path: fullPath, fullIdPath: fullIdPath ?? fullPath, collection }), openEntityMode }, `collection_table_${fullPath}`),
       popupCell && /* @__PURE__ */ jsxRuntime.jsx(PopupFormField, { open: Boolean(popupCell), onClose: onPopupClose, cellRect: popupCell?.cellRect, propertyKey: popupCell?.propertyKey, collection, entityId: popupCell.entityId, tableKey: tableKey.current, customFieldValidator: uniqueFieldValidator, path: resolvedFullPath, onCellValueChange: onValueChange, container: containerRef.current }, `popup_form_${popupCell?.propertyKey}_${popupCell?.entityId}`),
@@ -23084,6 +23387,7 @@
   function createFormexStub(values) {
     const errorMessage = "You are in a read-only context. You cannot modify the formex controller.";
     return {
+      debugId: "",
       values,
       initialValues: values,
       touched: {},
@@ -23098,6 +23402,9 @@
       setValues: () => {
         throw new Error(errorMessage);
       },
+      setTouched(touched) {
+        throw new Error(errorMessage);
+      },
       setFieldValue: () => {
         throw new Error(errorMessage);
       },
@@ -23157,8 +23464,7 @@
       databaseId: props.databaseId,
       useCache: false
     });
-    const enableLocalChangesBackup = props.collection.enableLocalChangesBackup !== void 0 ? props.collection.enableLocalChangesBackup : true;
-    const initialDirtyValues = entityId ? getEntityFromCache(props.path + "/" + entityId, enableLocalChangesBackup) : getEntityFromCache(props.path + "#new", enableLocalChangesBackup);
+    const initialDirtyValues = entityId ? getEntityFromMemoryCache(props.path + "/" + entityId) : getEntityFromMemoryCache(props.path + "#new");
     const authController = useAuthController();
     const initialStatus = props.copy ? "copy" : entityId ? "existing" : "new";
     const [status, setStatus] = React.useState(initialStatus);
@@ -23317,6 +23623,7 @@
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-16" })
     ] }) }) : null;
     const entityView = /* @__PURE__ */ jsxRuntime.jsx(EntityForm, { fullIdPath, collection, path, entityId: entityId ?? usedEntity?.id, onValuesModified, entity, initialDirtyValues, openEntityMode: layout, forceActionsAtTheBottom: actionsAtTheBottom, initialStatus: status, className: ui.cls((!mainViewVisible || !canEdit) && !selectedSecondaryForm ? "hidden" : "", formProps?.className), EntityFormActionsComponent: EntityEditViewFormActions, disabled: !canEdit, ...formProps, onEntityChange: (entity_0) => {
+      console.log("333 EntityEditView onEntityChange:", entity_0);
       setUsedEntity(entity_0);
       formProps?.onEntityChange?.(entity_0);
     }, onStatusChange: (status_0) => {
@@ -23339,7 +23646,12 @@
     const shouldShowTopBar = Boolean(barActions) || hasAdditionalViews;
     let result = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col h-full w-full bg-white dark:bg-surface-900", children: [
       shouldShowTopBar && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("h-14 items-center flex overflow-visible overflow-x-scroll w-full no-scrollbar h-14 border-b pl-2 pr-2 pt-1 flex bg-surface-50 dark:bg-surface-900", ui.defaultBorderMixin), children: [
-        barActions,
+        barActions?.({
+          path: fullIdPath ?? path,
+          entityId,
+          values: formContext?.values ?? usedEntity?.values ?? {},
+          status
+        }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-grow" }),
         pluginActionsTop,
         globalLoading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "self-center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.CircularProgress, { size: "small" }) }),
@@ -23442,9 +23754,14 @@
     if (!props || !collection) {
       return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full" });
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary, { children: /* @__PURE__ */ jsxRuntime.jsx(EntityEditView, { ...props, fullIdPath, layout: "side_panel", collection, parentCollectionIds, onValuesModified, onSaved: onUpdate, barActions: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary, { children: /* @__PURE__ */ jsxRuntime.jsx(EntityEditView, { ...props, fullIdPath, layout: "side_panel", collection, parentCollectionIds, onValuesModified, onSaved: onUpdate, barActions: ({
+      status,
+      values
+    }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "self-center", onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsx(ui.CloseIcon, { size: "small" }) }),
       allowFullScreen && /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "self-center", onClick: () => {
+        const key = status === "new" || status === "copy" ? path + "#new" : path + "/" + entityId;
+        saveEntityToMemoryCache(key, values);
         if (entityId) navigate(location.pathname);
         else navigate(location.pathname + "#new");
       }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.OpenInFullIcon, { size: "small" }) })
@@ -26224,6 +26541,7 @@
   exports2.getIdIcon = getIdIcon;
   exports2.getLabelOrConfigFrom = getLabelOrConfigFrom;
   exports2.getLastSegment = getLastSegment;
+  exports2.getLocalChangesBackup = getLocalChangesBackup;
   exports2.getPropertiesWithPropertiesOrder = getPropertiesWithPropertiesOrder;
   exports2.getPropertyInPath = getPropertyInPath;
   exports2.getRandomId = getRandomId;