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

package/dist/index.umd.js

@@ -1,6 +1,6 @@
 (function(global, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react/jsx-runtime"), require("react-compiler-runtime"), require("react"), require("@firecms/ui"), require("notistack"), require("object-hash"), require("@firecms/formex"), require("react-router-dom"), require("fuse.js"), require("react-fast-compare"), require("date-fns"), require("date-fns/locale"), require("react-use-measure"), require("yup"), require("react-window"), require("@dnd-kit/core"), require("@dnd-kit/sortable"), require("@dnd-kit/utilities"), require("@dnd-kit/modifiers"), require("react-dropzone"), require("react-image-file-resizer"), require("@firecms/editor"), require("prism-react-renderer"), require("react-router"), require("@radix-ui/react-portal")) : typeof define === "function" && define.amd ? define(["exports", "react/jsx-runtime", "react-compiler-runtime", "react", "@firecms/ui", "notistack", "object-hash", "@firecms/formex", "react-router-dom", "fuse.js", "react-fast-compare", "date-fns", "date-fns/locale", "react-use-measure", "yup", "react-window", "@dnd-kit/core", "@dnd-kit/sortable", "@dnd-kit/utilities", "@dnd-kit/modifiers", "react-dropzone", "react-image-file-resizer", "@firecms/editor", "prism-react-renderer", "react-router", "@radix-ui/react-portal"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global["FireCMS Core"] = {}, global.jsxRuntime, global.reactCompilerRuntime, global.React, global.ui, global.notistack, global.hash, global.formex, global.reactRouterDom, global.Fuse, global.equal, global.dateFns, global.locales, global.useMeasure, global.yup, global.reactWindow, global.core, global.sortable, global.utilities, global.modifiers, global.reactDropzone, global.Resizer, global.editor, global.prismReactRenderer, global.reactRouter, global.Portal));
-})(this, (function(exports2, jsxRuntime, reactCompilerRuntime, React, ui, notistack, hash, formex, reactRouterDom, Fuse, equal, dateFns, locales, useMeasure, yup, reactWindow, core, sortable, utilities, modifiers, reactDropzone, Resizer, editor, prismReactRenderer, reactRouter, Portal) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react/jsx-runtime"), require("react-compiler-runtime"), require("react"), require("@firecms/ui"), require("notistack"), require("object-hash"), require("@firecms/formex"), require("react-router-dom"), require("fuse.js"), require("react-fast-compare"), require("date-fns"), require("date-fns/locale"), require("react-use-measure"), require("yup"), require("react-window"), require("@dnd-kit/core"), require("@dnd-kit/sortable"), require("@dnd-kit/utilities"), require("@dnd-kit/modifiers"), require("react-dropzone"), require("compressorjs"), require("@firecms/editor"), require("prism-react-renderer"), require("react-router"), require("@radix-ui/react-portal")) : typeof define === "function" && define.amd ? define(["exports", "react/jsx-runtime", "react-compiler-runtime", "react", "@firecms/ui", "notistack", "object-hash", "@firecms/formex", "react-router-dom", "fuse.js", "react-fast-compare", "date-fns", "date-fns/locale", "react-use-measure", "yup", "react-window", "@dnd-kit/core", "@dnd-kit/sortable", "@dnd-kit/utilities", "@dnd-kit/modifiers", "react-dropzone", "compressorjs", "@firecms/editor", "prism-react-renderer", "react-router", "@radix-ui/react-portal"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global["FireCMS Core"] = {}, global.jsxRuntime, global.reactCompilerRuntime, global.React, global.ui, global.notistack, global.hash, global.formex, global.reactRouterDom, global.Fuse, global.equal, global.dateFns, global.locales, global.useMeasure, global.yup, global.reactWindow, global.core, global.sortable, global.utilities, global.modifiers, global.reactDropzone, global.Compressor, global.editor, global.prismReactRenderer, global.reactRouter, global.Portal));
+})(this, (function(exports2, jsxRuntime, reactCompilerRuntime, React, ui, notistack, hash, formex, reactRouterDom, Fuse, equal, dateFns, locales, useMeasure, yup, reactWindow, core, sortable, utilities, modifiers, reactDropzone, Compressor, editor, prismReactRenderer, reactRouter, Portal) {
   "use strict";
   function _interopNamespaceDefault(e) {
     const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -3542,26 +3542,6 @@
     });
     return properties;
   }
-  function makePropertiesNonEditable(properties) {
-    return Object.entries(properties).reduce((acc, [key, property]) => {
-      if (!isPropertyBuilder(property) && property.dataType === "map" && property.properties) {
-        const updated = {
-          ...property,
-          properties: makePropertiesNonEditable(property.properties)
-        };
-        acc[key] = updated;
-      }
-      if (isPropertyBuilder(property)) {
-        acc[key] = property;
-      } else {
-        acc[key] = {
-          ...property,
-          editable: false
-        };
-      }
-      return acc;
-    }, {});
-  }
   function applyModifyFunction(modifyCollection, collection, parentPaths) {
     if (modifyCollection) {
       const modified = modifyCollection({
@@ -3643,8 +3623,8 @@
       return target;
     } else {
       const mergedProperty = mergeDeep(target, source);
-      const targetEditable = Boolean(target.editable);
-      const sourceEditable = Boolean(source.editable);
+      const targetEditable = target.editable === void 0 ? true : Boolean(target.editable);
+      const sourceEditable = source.editable === void 0 ? true : Boolean(source.editable);
       if (source.dataType === "map" && source.properties) {
         const targetProperties = "properties" in target ? target.properties : {};
         const sourceProperties = "properties" in source ? source.properties : {};
@@ -7497,7 +7477,7 @@
       const isArrayOfMaps = ofProp?.dataType === "map";
       const isArrayOfPrimitives = property?.dataType === "array" && ofProp && ofProp.dataType !== "map";
       if (baseKey && property && isArrayOfPrimitives) {
-        const t52 = `grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${ui.defaultBorderMixin}` : ""}`;
+        const t52 = `grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${ui.defaultBorderMixin} last:border-b-0` : ""}`;
         let t62;
         if ($[3] !== arrayLabel) {
           t62 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-4 pr-2", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "caption", color: "secondary", component: "span", className: "break-words", children: arrayLabel }) });
@@ -7532,7 +7512,7 @@
         }
         return t82;
       }
-      const t5 = `${isTopLevel ? "py-4" : "py-1"} ${isTopLevel ? `border-b ${ui.defaultBorderMixin}` : ""}`;
+      const t5 = `${isTopLevel ? "py-4" : "py-1"} ${isTopLevel ? `border-b ${ui.defaultBorderMixin} last:border-b-0` : ""}`;
       let t6;
       if ($[14] !== arrayLabel || $[15] !== baseKey || $[16] !== suppressHeader) {
         t6 = baseKey && arrayLabel && !suppressHeader && /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "caption", color: "secondary", component: "span", children: arrayLabel });
@@ -7624,7 +7604,7 @@
         if (!property_0) {
           return null;
         }
-        const t52 = `grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${ui.defaultBorderMixin}` : ""}`;
+        const t52 = `grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${ui.defaultBorderMixin} last:border-b-0` : ""}`;
         let t62;
         if ($[41] !== label) {
           t62 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-4 pr-2", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "caption", color: "secondary", component: "span", className: "break-words", children: label }) });
@@ -7671,7 +7651,7 @@
       }
       const showMapHeader = t5;
       const headerText = property_0?.name || label;
-      const t6 = `${isTopLevel ? "py-4" : "py-1"} ${isTopLevel ? `border-b ${ui.defaultBorderMixin}` : ""}`;
+      const t6 = `${isTopLevel ? "py-4" : "py-1"} ${isTopLevel ? `border-b ${ui.defaultBorderMixin} last:border-b-0` : ""}`;
       let t7;
       if ($[56] !== headerText || $[57] !== showMapHeader) {
         t7 = showMapHeader && /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "caption", color: "secondary", component: "span", children: headerText });
@@ -7751,7 +7731,7 @@
       if (!property_1) {
         return null;
       }
-      const t5 = `grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${ui.defaultBorderMixin}` : ""}`;
+      const t5 = `grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${ui.defaultBorderMixin} last:border-b-0` : ""}`;
       let t6;
       if ($[78] !== label_0) {
         t6 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-4 pr-2", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "caption", color: "secondary", component: "span", className: "break-words", children: label_0 }) });
@@ -8318,7 +8298,8 @@
     const processFile = storage?.processFile;
     const metadata = storage?.metadata;
     const size = multipleFilesSupported ? "medium" : "large";
-    const compression = storage?.imageCompression;
+    const imageResize = storage?.imageResize;
+    const legacyCompression = storage?.imageCompression;
     const internalInitialValue = getInternalInitialValue(multipleFilesSupported, value, metadata, size);
     const [initialValue, setInitialValue] = React.useState(value);
     const [internalValue, setInternalValue] = React.useState(internalInitialValue);
@@ -8390,6 +8371,11 @@
         onChange(fieldValue ? fieldValue[0] : null);
       }
     }, [internalValue, multipleFilesSupported, onChange, storage, storageSource]);
+    const onFileUploadError = React.useCallback((entry_0) => {
+      console.debug("onFileUploadError", entry_0);
+      const newValue_0 = internalValue.filter((item) => item.id !== entry_0.id);
+      setInternalValue(newValue_0);
+    }, [internalValue]);
     const onFilesAdded = React.useCallback(async (acceptedFiles) => {
       if (!acceptedFiles.length || disabled) return;
       if (processFile) {
@@ -8408,8 +8394,8 @@
       let newInternalValue;
       if (multipleFilesSupported) {
         newInternalValue = [...internalValue, ...await Promise.all(acceptedFiles.map(async (file_2) => {
-          if (compression && compressionFormat(file_2)) {
-            file_2 = await resizeAndCompressImage(file_2, compression);
+          if ((imageResize || legacyCompression) && isImageFile(file_2)) {
+            file_2 = await resizeImage(file_2, imageResize, legacyCompression);
           }
           return {
             id: getRandomId$2(),
@@ -8421,8 +8407,8 @@
         }))];
       } else {
         let file_3 = acceptedFiles[0];
-        if (compression && compressionFormat(file_3)) {
-          file_3 = await resizeAndCompressImage(file_3, compression);
+        if ((imageResize || legacyCompression) && isImageFile(file_3)) {
+          file_3 = await resizeImage(file_3, imageResize, legacyCompression);
         }
         newInternalValue = [{
           id: getRandomId$2(),
@@ -8434,7 +8420,7 @@
       }
       newInternalValue = removeDuplicates(newInternalValue);
       setInternalValue(newInternalValue);
-    }, [disabled, fileNameBuilder, internalValue, metadata, multipleFilesSupported, size]);
+    }, [disabled, fileNameBuilder, internalValue, metadata, multipleFilesSupported, size, imageResize, legacyCompression]);
     return {
       internalValue,
       setInternalValue,
@@ -8442,6 +8428,7 @@
       fileNameBuilder,
       storagePathBuilder,
       onFileUploadComplete,
+      onFileUploadError,
       onFilesAdded,
       multipleFilesSupported
     };
@@ -8472,22 +8459,42 @@
   function getRandomId$2() {
     return Math.floor(Math.random() * Math.floor(Number.MAX_SAFE_INTEGER));
   }
-  const supportedTypes = {
-    "image/jpeg": "JPEG",
-    "image/png": "PNG",
-    "image/webp": "WEBP"
-  };
-  const compressionFormat = (file) => supportedTypes[file.type] ? supportedTypes[file.type] : null;
-  const defaultQuality = 100;
-  const resizeAndCompressImage = (file, compression) => new Promise((resolve) => {
-    const inputQuality = compression.quality === void 0 ? defaultQuality : compression.quality;
-    const quality = inputQuality >= 0 ? inputQuality <= 100 ? inputQuality : 100 : 100;
-    const format = compressionFormat(file);
-    if (!format) {
-      throw Error("resizeAndCompressImage: Unsupported image format");
-    }
-    Resizer.imageFileResizer(file, compression.maxWidth || Number.MAX_VALUE, compression.maxHeight || Number.MAX_VALUE, format, quality, 0, (file2) => resolve(file2), "file");
-  });
+  function isImageFile(file) {
+    return file.type === "image/jpeg" || file.type === "image/png" || file.type === "image/webp";
+  }
+  async function resizeImage(file, imageResize, legacyCompression) {
+    const maxWidth = imageResize?.maxWidth ?? legacyCompression?.maxWidth;
+    const maxHeight = imageResize?.maxHeight ?? legacyCompression?.maxHeight;
+    const quality = (imageResize?.quality ?? legacyCompression?.quality ?? 80) / 100;
+    const mode = imageResize?.mode ?? "contain";
+    let mimeType = file.type;
+    if (imageResize?.format && imageResize.format !== "original") {
+      mimeType = `image/${imageResize.format}`;
+    }
+    return new Promise((resolve, reject) => {
+      new Compressor(file, {
+        quality,
+        maxWidth,
+        maxHeight,
+        mimeType,
+        // Use cover mode if specified (crops to fit)
+        // Otherwise use contain mode (scales to fit)
+        ...mode === "cover" || mode === void 0 ? {
+          width: maxWidth,
+          height: maxHeight,
+          resize: "cover"
+        } : {},
+        success: (result) => {
+          const compressedFile = new File([result], file.name, {
+            type: result.type,
+            lastModified: Date.now()
+          });
+          resolve(compressedFile);
+        },
+        error: reject
+      });
+    });
+  }
   function StorageUploadProgress({
     storagePath,
     entry,
@@ -11832,7 +11839,7 @@
         if (value_1 !== "") {
           updateFilter(operation, dataType === "number" ? parseInt(value_1) : value_1);
         }
-      }, endAdornment: internalValue && /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "absolute right-2 top-3", onClick: (e_0) => updateFilter(operation, void 0), children: /* @__PURE__ */ jsxRuntime.jsx(ui.CloseIcon, {}) }), renderValue: (enumKey) => {
+      }, endAdornment: internalValue && /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { onClick: (e_0) => updateFilter(operation, void 0), children: /* @__PURE__ */ jsxRuntime.jsx(ui.CloseIcon, {}) }), renderValue: (enumKey) => {
         if (enumKey === null) {
           return "Filter for null values";
         }
@@ -11989,7 +11996,7 @@
   };
   const multipleSelectOperations = ["array-contains-any", "in"];
   function DateTimeFilterField(t0) {
-    const $ = reactCompilerRuntime.c(38);
+    const $ = reactCompilerRuntime.c(39);
     const {
       isArray,
       mode,
@@ -12030,7 +12037,7 @@
           newValue = newOpIsArray ? val ? [val] : [] : "";
         }
         setOperation(op);
-        setInternalValue(newValue === null ? void 0 : newValue);
+        setInternalValue(newValue);
         const hasNewValue = newValue !== null && Array.isArray(newValue) ? newValue.length > 0 : newValue !== void 0;
         if (op && hasNewValue) {
           setValue([op, newValue]);
@@ -12074,83 +12081,85 @@
     } else {
       t6 = $[16];
     }
-    const t7 = internalValue ?? void 0;
-    let t8;
+    const t7 = internalValue === null;
+    const t8 = internalValue ?? void 0;
+    let t9;
     if ($[17] !== operation || $[18] !== updateFilter) {
-      t8 = (dateValue) => {
+      t9 = (dateValue) => {
         updateFilter(operation, dateValue === null ? void 0 : dateValue);
       };
       $[17] = operation;
       $[18] = updateFilter;
-      $[19] = t8;
+      $[19] = t9;
     } else {
-      t8 = $[19];
+      t9 = $[19];
     }
-    let t9;
-    if ($[20] !== locale || $[21] !== mode || $[22] !== t7 || $[23] !== t8) {
-      t9 = /* @__PURE__ */ jsxRuntime.jsx(ui.DateTimeField, { mode, size: "large", locale, value: t7, onChange: t8, clearable: true });
+    let t10;
+    if ($[20] !== locale || $[21] !== mode || $[22] !== t7 || $[23] !== t8 || $[24] !== t9) {
+      t10 = /* @__PURE__ */ jsxRuntime.jsx(ui.DateTimeField, { mode, size: "large", locale, disabled: t7, value: t8, onChange: t9, clearable: true });
       $[20] = locale;
       $[21] = mode;
       $[22] = t7;
       $[23] = t8;
       $[24] = t9;
+      $[25] = t10;
     } else {
-      t9 = $[24];
+      t10 = $[25];
     }
-    const t10 = internalValue === null;
-    let t11;
-    if ($[25] !== internalValue || $[26] !== operation || $[27] !== updateFilter) {
-      t11 = (checked) => {
+    const t11 = internalValue === null;
+    let t12;
+    if ($[26] !== internalValue || $[27] !== operation || $[28] !== updateFilter) {
+      t12 = (checked) => {
         if (internalValue !== null) {
           updateFilter(operation, null);
         } else {
           updateFilter(operation, void 0);
         }
       };
-      $[25] = internalValue;
-      $[26] = operation;
-      $[27] = updateFilter;
-      $[28] = t11;
+      $[26] = internalValue;
+      $[27] = operation;
+      $[28] = updateFilter;
+      $[29] = t12;
     } else {
-      t11 = $[28];
+      t12 = $[29];
     }
-    let t12;
-    if ($[29] !== t10 || $[30] !== t11) {
-      t12 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Label, { className: "border cursor-pointer rounded-md p-2 flex items-center gap-2 [&:has(:checked)]:bg-surface-100 dark:[&:has(:checked)]:bg-surface-800", htmlFor: "null-filter", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { id: "null-filter", checked: t10, size: "small", onCheckedChange: t11 }),
+    let t13;
+    if ($[30] !== t11 || $[31] !== t12) {
+      t13 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Label, { className: "border cursor-pointer rounded-md p-2 flex items-center gap-2 [&:has(:checked)]:bg-surface-100 dark:[&:has(:checked)]:bg-surface-800", htmlFor: "null-filter", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { id: "null-filter", checked: t11, size: "small", onCheckedChange: t12 }),
         "Filter for null values"
       ] });
-      $[29] = t10;
       $[30] = t11;
       $[31] = t12;
+      $[32] = t13;
     } else {
-      t12 = $[31];
+      t13 = $[32];
     }
-    let t13;
-    if ($[32] !== t12 || $[33] !== t9) {
-      t13 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-grow ml-2 flex flex-col gap-2", children: [
-        t9,
-        t12
+    let t14;
+    if ($[33] !== t10 || $[34] !== t13) {
+      t14 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-grow ml-2 flex flex-col gap-2", children: [
+        t10,
+        t13
       ] });
-      $[32] = t12;
-      $[33] = t9;
+      $[33] = t10;
       $[34] = t13;
+      $[35] = t14;
     } else {
-      t13 = $[34];
+      t14 = $[35];
     }
-    let t14;
-    if ($[35] !== t13 || $[36] !== t6) {
-      t14 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-[440px]", children: [
+    let t15;
+    if ($[36] !== t14 || $[37] !== t6) {
+      t15 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-[440px]", children: [
         t6,
-        t13
+        t14
       ] });
-      $[35] = t13;
-      $[36] = t6;
-      $[37] = t14;
+      $[36] = t14;
+      $[37] = t6;
+      $[38] = t15;
     } else {
-      t14 = $[37];
+      t15 = $[38];
     }
-    return t14;
+    return t15;
   }
   function _temp2$5(op_1) {
     return /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: op_1, children: operationLabels[op_1] }, op_1);
@@ -14295,14 +14304,16 @@
     return t5;
   }
   function useHomePageDnd({
-    items: dndItems,
-    setItems: setDndItems,
+    items,
+    setItems,
     disabled,
     onCardMovedBetweenGroups,
     onGroupMoved,
     onNewGroupDrop,
     onPersist
   }) {
+    const dndItems = items;
+    const setDndItems = setItems;
     const [activeId, setActiveId] = React.useState(null);
     const [activeIsGroup, setActiveIsGroup] = React.useState(false);
     const [currentDraggingGroupId, setCurrentDraggingGroupId] = React.useState(null);
@@ -14310,6 +14321,9 @@
     const [isDraggingCardOnly, setIsDraggingCardOnly] = React.useState(false);
     const [dialogOpenForGroup, setDialogOpenForGroup] = React.useState(null);
     const [isHoveringNewGroupDropZone, setIsHoveringNewGroupDropZone] = React.useState(false);
+    const [pendingNewGroupName, setPendingNewGroupName] = React.useState(null);
+    const [stateBeforeNewGroup, setStateBeforeNewGroup] = React.useState(null);
+    const preDragItemsRef = React.useRef(null);
     const interimItemsRef = React.useRef(null);
     React.useEffect(() => {
       interimItemsRef.current = dndItems;
@@ -14401,6 +14415,7 @@
     }) => {
       setDndKitActiveNode(active);
       if (disabled) return;
+      preDragItemsRef.current = cloneItemsForDnd(dndItems);
       const isGroup = dndItems.some((g_7) => g_7.name === active.id);
       if (!active.data.current) active.data.current = {};
       active.data.current.type = isGroup ? "group" : "item";
@@ -14424,18 +14439,30 @@
       if (!activeCont) return;
       if (overCont && activeCont !== overCont) {
         recentlyMovedToNewContainer.current = true;
-        const newState = cloneItemsForDnd(dndItems);
-        const srcIdx = newState.findIndex((g_8) => g_8.name === activeCont);
-        const tgtIdx = newState.findIndex((g_9) => g_9.name === overCont);
-        if (srcIdx === -1 || tgtIdx === -1) return;
-        const src = newState[srcIdx];
-        const tgt = newState[tgtIdx];
-        const idxInSrc = src.entries.findIndex((e_2) => e_2.url === activeIdNow);
-        if (idxInSrc === -1) return;
-        const [moved] = src.entries.splice(idxInSrc, 1);
-        tgt.entries.push(moved);
-        interimItemsRef.current = newState;
-        setDndItems(newState);
+        lastOverId.current = overIdNow;
+        setDndItems((current) => {
+          const newState = cloneItemsForDnd(current);
+          const srcIdx = newState.findIndex((g_8) => g_8.name === activeCont);
+          const tgtIdx = newState.findIndex((g_9) => g_9.name === overCont);
+          if (srcIdx === -1 || tgtIdx === -1) return current;
+          const src = newState[srcIdx];
+          const tgt = newState[tgtIdx];
+          const idxInSrc = src.entries.findIndex((e_2) => e_2.url === activeIdNow);
+          if (idxInSrc === -1) return current;
+          const [moved] = src.entries.splice(idxInSrc, 1);
+          const overIsContainer_0 = overIdNow === overCont;
+          if (overIsContainer_0) {
+            tgt.entries.push(moved);
+          } else {
+            const overIdx = tgt.entries.findIndex((e_3) => e_3.url === overIdNow);
+            if (overIdx !== -1) {
+              tgt.entries.splice(overIdx, 0, moved);
+            } else {
+              tgt.entries.push(moved);
+            }
+          }
+          return newState;
+        });
       } else if (activeCont === overCont) {
         recentlyMovedToNewContainer.current = false;
       }
@@ -14462,55 +14489,101 @@
           }
         }
       } else {
-        const activeCont_0 = findDndContainer(activeIdNow_0);
+        const findContainerInState = (id_0, state) => {
+          const group_0 = state.find((g_13) => g_13.name === id_0);
+          if (group_0) return group_0.name;
+          for (const g_14 of state) {
+            if (g_14.entries.some((e_4) => e_4.url === id_0)) return g_14.name;
+          }
+          return void 0;
+        };
+        const sourceState = preDragItemsRef.current || dndItems;
+        const activeCont_0 = findContainerInState(activeIdNow_0, sourceState);
+        findDndContainer(overIdNow_0);
         if (overIdNow_0 === "new-group-drop-zone") {
           if (activeCont_0) {
+            setStateBeforeNewGroup(cloneItemsForDnd(dndItems));
             const newState_1 = cloneItemsForDnd(dndItems);
-            const srcIdx_0 = newState_1.findIndex((g_13) => g_13.name === activeCont_0);
+            const srcIdx_0 = newState_1.findIndex((g_15) => g_15.name === activeCont_0);
             if (srcIdx_0 !== -1) {
               const src_0 = newState_1[srcIdx_0];
-              const idxInSrc_0 = src_0.entries.findIndex((e_3) => e_3.url === activeIdNow_0);
+              const idxInSrc_0 = src_0.entries.findIndex((e_5) => e_5.url === activeIdNow_0);
               if (idxInSrc_0 !== -1) {
                 const [dragged] = src_0.entries.splice(idxInSrc_0, 1);
                 if (src_0.entries.length === 0) newState_1.splice(srcIdx_0, 1);
                 let tentative = "New Group";
                 let counter = 1;
-                while (newState_1.some((g_14) => g_14.name === tentative)) tentative = `New Group ${counter++}`;
+                while (newState_1.some((g_16) => g_16.name === tentative)) tentative = `New Group ${counter++}`;
                 newState_1.push({
                   name: tentative,
                   entries: [dragged]
                 });
                 setDndItems(newState_1);
-                onPersist?.(newState_1);
+                setPendingNewGroupName(tentative);
                 setDialogOpenForGroup(tentative);
                 onNewGroupDrop?.();
               }
             }
           }
         } else {
-          const overCont_0 = findDndContainer(overIdNow_0);
-          if (activeCont_0 === overCont_0) {
-            const grpIdx = dndItems.findIndex((g_15) => g_15.name === activeCont_0);
+          const overCont_1 = findDndContainer(overIdNow_0);
+          if (activeCont_0 === overCont_1) {
+            const grpIdx = dndItems.findIndex((g_17) => g_17.name === activeCont_0);
             if (grpIdx !== -1) {
-              const group_0 = dndItems[grpIdx];
-              const oldIdx = group_0.entries.findIndex((e_4) => e_4.url === activeIdNow_0);
-              let newIdx = group_0.entries.findIndex((e_5) => e_5.url === overIdNow_0);
-              if (newIdx === -1 && overIdNow_0 === activeCont_0) newIdx = group_0.entries.length - 1;
+              const group_1 = dndItems[grpIdx];
+              const oldIdx = group_1.entries.findIndex((e_6) => e_6.url === activeIdNow_0);
+              let newIdx = group_1.entries.findIndex((e_7) => e_7.url === overIdNow_0);
+              if (newIdx === -1 && overIdNow_0 === activeCont_0) newIdx = group_1.entries.length - 1;
               if (oldIdx !== -1 && newIdx !== -1 && oldIdx !== newIdx) {
-                const reordered = sortable.arrayMove(group_0.entries, oldIdx, newIdx);
+                const reordered = sortable.arrayMove(group_1.entries, oldIdx, newIdx);
                 const newState_2 = [...dndItems];
                 newState_2[grpIdx] = {
-                  ...group_0,
+                  ...group_1,
                   entries: reordered
                 };
                 setDndItems(newState_2);
                 onPersist?.(newState_2);
               }
             }
-          } else if (recentlyMovedToNewContainer.current && interimItemsRef.current) {
-            onPersist?.(interimItemsRef.current);
+          } else if (overCont_1 && activeCont_0 !== overCont_1) {
+            const finalState = cloneItemsForDnd(sourceState);
+            const finalOverId = lastOverId.current || overIdNow_0;
+            const cleanOverCont = findContainerInState(finalOverId, sourceState) || overCont_1;
+            const srcIdx_1 = finalState.findIndex((g_18) => g_18.name === activeCont_0);
+            const tgtIdx_0 = finalState.findIndex((g_19) => g_19.name === cleanOverCont);
+            if (srcIdx_1 !== -1 && tgtIdx_0 !== -1) {
+              const src_1 = finalState[srcIdx_1];
+              const tgt_0 = finalState[tgtIdx_0];
+              const idxInSrc_1 = src_1.entries.findIndex((e_8) => e_8.url === activeIdNow_0);
+              if (idxInSrc_1 !== -1) {
+                const [moved_0] = src_1.entries.splice(idxInSrc_1, 1);
+                const overIsContainer_1 = finalOverId === cleanOverCont;
+                if (overIsContainer_1) {
+                  tgt_0.entries.push(moved_0);
+                } else {
+                  const overIdx_0 = tgt_0.entries.findIndex((e_9) => e_9.url === finalOverId);
+                  if (overIdx_0 !== -1) {
+                    tgt_0.entries.splice(overIdx_0, 0, moved_0);
+                  } else {
+                    tgt_0.entries.push(moved_0);
+                  }
+                }
+                if (src_1.entries.length === 0) {
+                  finalState.splice(srcIdx_1, 1);
+                }
+                setDndItems(finalState);
+                onPersist?.(finalState);
+                onCardMovedBetweenGroups?.(moved_0);
+              }
+            }
+          } else if (recentlyMovedToNewContainer.current) {
+            console.error("Move between containers detected but conditions not met", {
+              activeCont: activeCont_0,
+              overCont: overCont_1,
+              activeIdNow: activeIdNow_0,
+              overIdNow: overIdNow_0
+            });
           }
-          onCardMovedBetweenGroups?.(dndItems.flatMap((g_16) => g_16.entries).find((e_6) => e_6.url === activeIdNow_0));
         }
       }
       resetDragState();
@@ -14525,11 +14598,11 @@
     };
     const handleDragCancel = () => resetDragState();
     const handleRenameGroup = (oldName, newName) => {
-      setDndItems((current) => {
-        const idx = current.findIndex((g_17) => g_17.name === oldName);
-        if (idx === -1) return current;
-        if (current.some((g_18) => g_18.name === newName && g_18.name !== oldName)) return current;
-        const updated = [...current];
+      setDndItems((current_0) => {
+        const idx = current_0.findIndex((g_20) => g_20.name === oldName);
+        if (idx === -1) return current_0;
+        if (current_0.some((g_21) => g_21.name === newName && g_21.name !== oldName)) return current_0;
+        const updated = [...current_0];
         updated[idx] = {
           ...updated[idx],
           name: newName
@@ -14537,10 +14610,20 @@
         onPersist?.(updated);
         return updated;
       });
+      setPendingNewGroupName(null);
+      setStateBeforeNewGroup(null);
       setDialogOpenForGroup(null);
     };
-    const activeItemForOverlay = disabled || !activeId || activeIsGroup ? null : dndItems.flatMap((g_19) => g_19.entries).find((e_7) => e_7.url === activeId) || null;
-    const activeGroupData = disabled || !activeId || !activeIsGroup ? null : dndItems.find((g_20) => g_20.name === activeId) || null;
+    const handleDialogClose = () => {
+      if (pendingNewGroupName && dialogOpenForGroup === pendingNewGroupName && stateBeforeNewGroup) {
+        setDndItems(stateBeforeNewGroup);
+      }
+      setPendingNewGroupName(null);
+      setStateBeforeNewGroup(null);
+      setDialogOpenForGroup(null);
+    };
+    const activeItemForOverlay = disabled || !activeId || activeIsGroup ? null : dndItems.flatMap((g_22) => g_22.entries).find((e_10) => e_10.url === activeId) || null;
+    const activeGroupData = disabled || !activeId || !activeIsGroup ? null : dndItems.find((g_23) => g_23.name === activeId) || null;
     return {
       sensors,
       collisionDetection,
@@ -14558,6 +14641,7 @@
       dialogOpenForGroup,
       setDialogOpenForGroup,
       handleRenameGroup,
+      handleDialogClose,
       isHoveringNewGroupDropZone,
       setIsHoveringNewGroupDropZone
     };
@@ -14935,7 +15019,7 @@
             entries: []
           });
         }
-        allProcessed = allProcessed.filter((g_4) => g_4.entries.length || groupOrderFromNavController.includes(g_4.name) || g_4.name === DEFAULT_GROUP_NAME && hasPluginAdditionalCards);
+        allProcessed = allProcessed.filter((g_4) => g_4.entries.length || g_4.name === DEFAULT_GROUP_NAME && hasPluginAdditionalCards);
       }
       const admin = allProcessed.find((g_5) => g_5.name === ADMIN_GROUP_NAME);
       return {
@@ -14983,6 +15067,7 @@
       dialogOpenForGroup,
       setDialogOpenForGroup,
       handleRenameGroup,
+      handleDialogClose,
       isHoveringNewGroupDropZone,
       setIsHoveringNewGroupDropZone
     } = useHomePageDnd({
@@ -14990,7 +15075,6 @@
       setItems: updateItems,
       disabled: !allowDragAndDrop || performingSearch,
       onPersist: persistNavigationGroups,
-      // ——► persistence here
       onGroupMoved: (g_8) => context.analyticsController?.onAnalyticsEvent?.("home_move_group", {
         name: g_8
       }),
@@ -15036,7 +15120,7 @@
             frequency: 500
           }
         }, onDragStart, onDragOver, onDragEnd, onDragCancel, modifiers: dndModifiers, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(sortable.SortableContext, { items: containers, strategy: sortable.verticalListSortingStrategy, children: items.map((groupData) => {
+          /* @__PURE__ */ jsxRuntime.jsx(sortable.SortableContext, { items: containers, strategy: sortable.verticalListSortingStrategy, children: items.map((groupData, groupIndex) => {
             const groupKey = groupData.name;
             const entriesInGroup = groupData.entries;
             const AdditionalCards = [];
@@ -15047,7 +15131,7 @@
               group: groupKey === DEFAULT_GROUP_NAME ? void 0 : groupKey,
               context
             };
-            if (entriesInGroup.length === 0 && (AdditionalCards.length === 0 || performingSearch) && !groupOrderFromNavController.includes(groupKey)) return null;
+            if (entriesInGroup.length === 0 && (AdditionalCards.length === 0 || performingSearch)) return null;
             return /* @__PURE__ */ jsxRuntime.jsx(SortableNavigationGroup, { groupName: groupKey, disabled: dndDisabled, children: /* @__PURE__ */ jsxRuntime.jsx(NavigationGroup, { group: groupKey === DEFAULT_GROUP_NAME ? void 0 : groupKey, minimised: draggingGroupId === groupKey && !isDraggingCardOnly, isPotentialCardDropTarget: isDraggingCardOnly, dndDisabled, onEditGroup: () => {
               if (dndDisabled) return;
               setDialogOpenForGroup(groupKey);
@@ -15062,7 +15146,7 @@
                 });
               } }, entry.url)),
               !performingSearch && groupKey.toLowerCase() !== ADMIN_GROUP_NAME.toLowerCase() && AdditionalCards.map((C, i_1) => /* @__PURE__ */ jsxRuntime.jsx(C, { ...actionProps }, `extra_${groupKey}_${i_1}`))
-            ] }) }) }) }, groupKey);
+            ] }) }) }) }, `group-${groupIndex}`);
           }) }, JSON.stringify(containers)),
           /* @__PURE__ */ jsxRuntime.jsx(NewGroupDropZone, { disabled: dndDisabled, setIsHovering: setIsHoveringNewGroupDropZone }),
           /* @__PURE__ */ jsxRuntime.jsx(core.DragOverlay, { adjustScale: false, dropAnimation, children: activeGroupData && draggingGroupId === activeGroupData.name ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg bg-transparent", style: {
@@ -15083,7 +15167,7 @@
         additionalPluginChildrenEnd,
         additionalChildrenEnd
       ] }),
-      dialogOpenForGroup && /* @__PURE__ */ jsxRuntime.jsx(RenameGroupDialog, { open: true, initialName: dialogOpenForGroup, existingGroupNames: items.map((g_9) => g_9.name).filter((n) => n !== dialogOpenForGroup), onClose: () => setDialogOpenForGroup(null), onRename: (newName) => {
+      dialogOpenForGroup && /* @__PURE__ */ jsxRuntime.jsx(RenameGroupDialog, { open: true, initialName: dialogOpenForGroup, existingGroupNames: items.map((g_9) => g_9.name).filter((n) => n !== dialogOpenForGroup), onClose: handleDialogClose, onRename: (newName) => {
         handleRenameGroup(dialogOpenForGroup, newName);
       } })
     ] });
@@ -15777,14 +15861,17 @@
       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." });
+      t15 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogTitle, { variant: "h6", children: "Preview Local Changes" });
       $[26] = t15;
-      $[27] = t16;
     } else {
       t15 = $[26];
+    }
+    let t16;
+    if ($[27] === Symbol.for("react.memo_cache_sentinel")) {
+      t16 = /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "body2", className: "mb-4", children: "These are the local changes that will be applied to the form." });
+      $[27] = t16;
+    } else {
       t16 = $[27];
     }
     let t17;
@@ -15800,8 +15887,7 @@
     const t18 = properties;
     let t19;
     if ($[29] !== localChangesData || $[30] !== t18) {
-      t19 = /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogContent, { children: [
-        t15,
+      t19 = /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogContent, { className: "my-4", children: [
         t16,
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: `border rounded-lg ${ui.defaultBorderMixin}`, style: t17, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsx(PropertyCollectionView, { data: localChangesData, properties: t18 }) }) })
       ] });
@@ -15835,6 +15921,7 @@
     let t22;
     if ($[35] !== previewDialogOpen || $[36] !== t19 || $[37] !== t21) {
       t22 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Dialog, { open: previewDialogOpen, onOpenChange: setPreviewDialogOpen, maxWidth: "4xl", children: [
+        t15,
         t19,
         t21
       ] });
@@ -16382,7 +16469,7 @@
       /* @__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: [
         /* @__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" }) }) })
+          formex$1.dirty ? /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "This form has been modified", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { size: "small", className: "py-1", 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", className: "py-1", children: /* @__PURE__ */ jsxRuntime.jsx(ui.CheckIcon, { size: "smallest" }) }) })
         ] }),
         formView
       ] }) }),
@@ -18547,7 +18634,7 @@
     return false;
   });
   function PropertyFieldBindingInternal(t0) {
-    const $ = reactCompilerRuntime.c(18);
+    const $ = reactCompilerRuntime.c(19);
     const {
       propertyKey,
       property,
@@ -18556,6 +18643,7 @@
       underlyingValueHasChanged,
       disabled: disabledProp,
       partOfArray,
+      partOfBlock,
       minimalistView,
       autoFocus,
       index,
@@ -18564,15 +18652,8 @@
     } = t0;
     const authController = useAuthController();
     const customizationController = useCustomizationController();
-    if (propertyKey === "created_by") {
-      console.log("Rendering field for created_by", {
-        propertyKey,
-        property,
-        context
-      });
-    }
     let t1;
-    if ($[0] !== authController || $[1] !== autoFocus || $[2] !== context || $[3] !== customizationController.propertyConfigs || $[4] !== disabledProp || $[5] !== includeDescription || $[6] !== index || $[7] !== minimalistView || $[8] !== onPropertyChange || $[9] !== partOfArray || $[10] !== property || $[11] !== propertyKey || $[12] !== size || $[13] !== underlyingValueHasChanged) {
+    if ($[0] !== authController || $[1] !== autoFocus || $[2] !== context || $[3] !== customizationController.propertyConfigs || $[4] !== disabledProp || $[5] !== includeDescription || $[6] !== index || $[7] !== minimalistView || $[8] !== onPropertyChange || $[9] !== partOfArray || $[10] !== partOfBlock || $[11] !== property || $[12] !== propertyKey || $[13] !== size || $[14] !== underlyingValueHasChanged) {
       t1 = (fieldProps) => {
         let Component;
         const resolvedProperty = resolveProperty({
@@ -18635,6 +18716,7 @@
           context,
           disabled,
           partOfArray,
+          partOfBlock,
           minimalistView,
           autoFocus,
           size,
@@ -18652,22 +18734,23 @@
       $[7] = minimalistView;
       $[8] = onPropertyChange;
       $[9] = partOfArray;
-      $[10] = property;
-      $[11] = propertyKey;
-      $[12] = size;
-      $[13] = underlyingValueHasChanged;
-      $[14] = t1;
+      $[10] = partOfBlock;
+      $[11] = property;
+      $[12] = propertyKey;
+      $[13] = size;
+      $[14] = underlyingValueHasChanged;
+      $[15] = t1;
     } else {
-      t1 = $[14];
+      t1 = $[15];
     }
     let t2;
-    if ($[15] !== propertyKey || $[16] !== t1) {
+    if ($[16] !== propertyKey || $[17] !== t1) {
       t2 = /* @__PURE__ */ jsxRuntime.jsx(formex.Field, { name: propertyKey, children: t1 }, propertyKey);
-      $[15] = propertyKey;
-      $[16] = t1;
-      $[17] = t2;
+      $[16] = propertyKey;
+      $[17] = t1;
+      $[18] = t2;
     } else {
-      t2 = $[17];
+      t2 = $[18];
     }
     return t2;
   }
@@ -18679,6 +18762,7 @@
       includeDescription,
       underlyingValueHasChanged,
       partOfArray,
+      partOfBlock,
       minimalistView,
       autoFocus,
       context,
@@ -18728,6 +18812,7 @@
       disabled: disabled ?? false,
       underlyingValueHasChanged: underlyingValueHasChanged ?? false,
       partOfArray: partOfArray ?? false,
+      partOfBlock: partOfBlock ?? false,
       minimalistView: minimalistView ?? false,
       autoFocus: autoFocus ?? false,
       customProps: customFieldProps,
@@ -20039,6 +20124,7 @@
         context,
         autoFocus,
         partOfArray: false,
+        partOfBlock: true,
         minimalistView: true,
         onPropertyChange: storeProps
       } : void 0;
@@ -21050,6 +21136,11 @@
           console.error("Save failure");
           console.error(e_0);
           setError(e_0);
+        },
+        onPreSaveHookError: (e_1) => {
+          console.error("Pre-save hook error");
+          console.error(e_1);
+          setError(e_1);
         }
       });
     };
@@ -21147,7 +21238,7 @@
       width: width_0,
       frozen
     }) => {
-      const isSelected = Boolean(usedSelectionController.selectedEntities.find((e_1) => e_1.id == entity_6.id && e_1.path == entity_6.path));
+      const isSelected = Boolean(usedSelectionController.selectedEntities.find((e_2) => e_2.id == entity_6.id && e_2.path == entity_6.path));
       const customEntityActions_0 = (collection.entityActions ?? []).map((action) => resolveEntityAction(action, customizationController.entityActions)).filter(Boolean);
       const actions_0 = getActionsForEntity({
         entity: entity_6,
@@ -21156,9 +21247,9 @@
       return /* @__PURE__ */ jsxRuntime.jsx(EntityCollectionRowActions, { entity: entity_6, width: width_0, frozen, isSelected, selectionEnabled, size: size_0, highlightEntity: setHighlightedEntity, unhighlightEntity: unselectNavigatedEntity, collection, fullPath, fullIdPath, actions: actions_0, hideId: collection?.hideIdFromCollection, onCollectionChange: updateLastDeleteTimestamp, selectionController: usedSelectionController, openEntityMode });
     }, [updateLastDeleteTimestamp, usedSelectionController]);
     const title = /* @__PURE__ */ jsxRuntime.jsx(ui.Popover, { open: popOverOpen, onOpenChange: setPopOverOpen, enabled: Boolean(collection.description), trigger: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "subtitle1", className: `leading-none truncate max-w-[160px] lg:max-w-[240px] ${collection.description ? "cursor-pointer" : "cursor-auto"}`, onClick: collection.description ? (e_2) => {
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "subtitle1", className: `leading-none truncate max-w-[160px] lg:max-w-[240px] ${collection.description ? "cursor-pointer" : "cursor-auto"}`, onClick: collection.description ? (e_3) => {
         setPopOverOpen(true);
-        e_2.stopPropagation();
+        e_3.stopPropagation();
       } : void 0, children: `${collection.name}` }),
       /* @__PURE__ */ jsxRuntime.jsx(EntitiesCount, { fullPath, collection, filter: tableController.filterValues, sortBy: tableController.sortBy, onCountChange: setDocsCount })
     ] }), children: collection.description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "m-4 text-surface-900 dark:text-white", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Markdown, { source: collection.description }) }) });
@@ -22572,22 +22663,9 @@
     const buildUrlCollectionPath = React.useCallback((path_0) => `${removeInitialAndTrailingSlashes(baseCollectionPath)}/${encodePath(path_0)}`, [baseCollectionPath]);
     const allPluginGroups = plugins?.flatMap((plugin) => plugin.homePage?.navigationEntries ? plugin.homePage.navigationEntries.map((e) => e.name) : []) ?? [];
     const pluginGroups = [...new Set(allPluginGroups)];
-    const onNavigationEntriesOrderUpdate = React.useCallback((entries) => {
-      if (!plugins) {
-        return;
-      }
-      const filteredEntries = entries.filter((entry) => entry.entries.length > 0);
-      if (plugins.some((plugin_1) => plugin_1.homePage?.onNavigationEntriesUpdate)) {
-        plugins.forEach((plugin_0) => {
-          if (plugin_0.homePage?.onNavigationEntriesUpdate) {
-            plugin_0.homePage.onNavigationEntriesUpdate(filteredEntries);
-          }
-        });
-      }
-    }, [plugins]);
-    const computeTopNavigation = React.useCallback((collections, views, adminViews, viewsOrder_0) => {
+    const computeTopNavigation = React.useCallback((collections, views, adminViews, viewsOrder_0, navigationGroupMappingsOverride, onNavigationEntriesUpdateCallback) => {
       const finalNavigationGroupMappings = computeNavigationGroups({
-        navigationGroupMappings,
+        navigationGroupMappings: navigationGroupMappingsOverride ?? navigationGroupMappings,
         collections,
         views,
         plugins
@@ -22619,7 +22697,7 @@
         return acc;
       }, []), ...(views ?? []).reduce((acc_0, view) => {
         if (view.hideFromNavigation) return acc_0;
-        const pathKey_0 = Array.isArray(view.path) ? view.path[0] : view.path;
+        const pathKey_0 = view.path;
         let groupName_0 = getGroup(view);
         if (finalNavigationGroupMappings) {
           for (const pluginGroupDef_0 of finalNavigationGroupMappings) {
@@ -22642,7 +22720,7 @@
         return acc_0;
       }, []), ...(adminViews ?? []).reduce((acc_1, view_0) => {
         if (view_0.hideFromNavigation) return acc_1;
-        const pathKey_1 = Array.isArray(view_0.path) ? view_0.path[0] : view_0.path;
+        const pathKey_1 = view_0.path;
         const groupName_1 = NAVIGATION_ADMIN_GROUP_NAME;
         acc_1.push({
           id: `admin:${pathKey_1}`,
@@ -22676,21 +22754,43 @@
         });
       }
       const collectedGroupsFromEntries = navigationEntries.map((e_0) => e_0.group).filter(Boolean);
-      const allDefinedGroups = [...pluginGroups ?? [], ...collectedGroupsFromEntries];
-      const uniqueGroups = [...new Set(allDefinedGroups)].sort((a_1, b_1) => groupOrderValue(a_1) - groupOrderValue(b_1));
+      const groupsFromMappings = finalNavigationGroupMappings.map((g_0) => g_0.name);
+      const additionalGroups = collectedGroupsFromEntries.filter((g_1) => !groupsFromMappings.includes(g_1));
+      const allDefinedGroups = [...pluginGroups ?? [], ...groupsFromMappings, ...additionalGroups];
+      const uniqueGroupsArray = [...new Set(allDefinedGroups)];
+      const adminGroups = uniqueGroupsArray.filter((g_2) => g_2 === NAVIGATION_ADMIN_GROUP_NAME);
+      const nonAdminGroups = uniqueGroupsArray.filter((g_3) => g_3 !== NAVIGATION_ADMIN_GROUP_NAME);
+      const uniqueGroups = [...nonAdminGroups, ...adminGroups];
       return {
-        allowDragAndDrop: plugins?.some((plugin_2) => plugin_2.homePage?.allowDragAndDrop) ?? false,
+        allowDragAndDrop: plugins?.some((plugin_0) => plugin_0.homePage?.allowDragAndDrop) ?? false,
         navigationEntries,
         groups: uniqueGroups,
-        onNavigationEntriesUpdate: onNavigationEntriesOrderUpdate
+        onNavigationEntriesUpdate: onNavigationEntriesUpdateCallback
       };
-    }, [navigationGroupMappings, buildCMSUrlPath, buildUrlCollectionPath, pluginGroups, onNavigationEntriesOrderUpdate]);
+    }, [navigationGroupMappings, buildCMSUrlPath, buildUrlCollectionPath, pluginGroups]);
+    const onNavigationEntriesOrderUpdate = React.useCallback((entries) => {
+      if (!plugins) {
+        return;
+      }
+      const filteredEntries = entries.filter((entry) => entry.entries.length > 0);
+      if (collectionsRef.current && viewsRef.current) {
+        const updatedNav = computeTopNavigation(collectionsRef.current, viewsRef.current, adminViewsRef.current ?? [], viewsOrder, filteredEntries, onNavigationEntriesOrderUpdate);
+        setTopLevelNavigation(updatedNav);
+      }
+      if (plugins.some((plugin_2) => plugin_2.homePage?.onNavigationEntriesUpdate)) {
+        plugins.forEach((plugin_1) => {
+          if (plugin_1.homePage?.onNavigationEntriesUpdate) {
+            plugin_1.homePage.onNavigationEntriesUpdate(filteredEntries);
+          }
+        });
+      }
+    }, [plugins, computeTopNavigation, viewsOrder]);
     const refreshNavigation = React.useCallback(async () => {
       if (disabled || authController.initialLoading) return;
       console.debug("Refreshing navigation");
       try {
         const [resolvedCollections = [], resolvedViews, resolvedAdminViews = []] = await Promise.all([resolveCollections(collectionsProp, collectionPermissions, authController, dataSourceDelegate, plugins), resolveCMSViews(viewsProp, authController, dataSourceDelegate), resolveCMSViews(adminViewsProp, authController, dataSourceDelegate)]);
-        const computedTopLevelNav = computeTopNavigation(resolvedCollections, resolvedViews, resolvedAdminViews, viewsOrder);
+        const computedTopLevelNav = computeTopNavigation(resolvedCollections, resolvedViews, resolvedAdminViews, viewsOrder, void 0, onNavigationEntriesOrderUpdate);
         let shouldUpdateTopLevelNav = false;
         if (!areCollectionListsEqual(collectionsRef.current ?? [], resolvedCollections)) {
           collectionsRef.current = resolvedCollections;
@@ -22975,6 +23075,42 @@
       }
       return acc;
     }, [...result ?? []]) : result;
+    const assignedEntries = /* @__PURE__ */ new Set();
+    if (result) {
+      result.forEach((group) => {
+        group.entries.forEach((entry) => assignedEntries.add(entry));
+      });
+    }
+    const unassignedGroupMap = {};
+    (collections ?? []).forEach((collection) => {
+      const entry = collection.id ?? collection.path;
+      if (!assignedEntries.has(entry)) {
+        const groupName = getGroup(collection);
+        if (!unassignedGroupMap[groupName]) unassignedGroupMap[groupName] = [];
+        unassignedGroupMap[groupName].push(entry);
+      }
+    });
+    (views ?? []).forEach((view) => {
+      const entry = view.path;
+      if (!assignedEntries.has(entry)) {
+        const groupName = getGroup(view);
+        if (!unassignedGroupMap[groupName]) unassignedGroupMap[groupName] = [];
+        unassignedGroupMap[groupName].push(entry);
+      }
+    });
+    Object.entries(unassignedGroupMap).forEach(([groupName, entries]) => {
+      if (result) {
+        const existingGroup = result.find((g) => g.name === groupName);
+        if (existingGroup) {
+          existingGroup.entries.push(...entries);
+        } else {
+          result.push({
+            name: groupName,
+            entries
+          });
+        }
+      }
+    });
     if (!result) {
       result = [];
       const groupMap = {};
@@ -22986,7 +23122,7 @@
       });
       (views ?? []).forEach((view) => {
         const name = getGroup(view);
-        const entry = Array.isArray(view.path) ? view.path[0] : view.path;
+        const entry = view.path;
         if (!groupMap[name]) groupMap[name] = [];
         groupMap[name].push(entry);
       });
@@ -27028,7 +27164,6 @@
   exports2.isValidRegExp = isValidRegExp;
   exports2.joinCollectionLists = joinCollectionLists;
   exports2.makePropertiesEditable = makePropertiesEditable;
-  exports2.makePropertiesNonEditable = makePropertiesNonEditable;
   exports2.mergeCallbacks = mergeCallbacks;
   exports2.mergeCollection = mergeCollection;
   exports2.mergeDeep = mergeDeep;