@firecms/core 3.0.0-canary.112 → 3.0.0-canary.114

package/dist/index.umd.js

@@ -2688,7 +2688,11 @@
     return iconKey in iconKeysMap ? /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { iconKey, size: "medium", className }) : void 0;
   }
   const IconForView = React.memo(
-    function IconForView2({ collectionOrView, className }) {
+    function IconForView2({
+      collectionOrView,
+      className,
+      size = "medium"
+    }) {
       if (!collectionOrView) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
       const icon = getIcon(collectionOrView.icon, className);
       if (collectionOrView?.icon && icon)
@@ -2705,7 +2709,7 @@
       const iconsCount = ui.coolIconKeys.length;
       if (!key)
         key = ui.coolIconKeys[hashString(collectionOrView.path) % iconsCount];
-      return /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { iconKey: key, size: "medium", className });
+      return /* @__PURE__ */ jsxRuntime.jsx(ui.Icon, { iconKey: key, size, className });
     },
     (prevProps, nextProps) => {
       return equal(prevProps.collectionOrView?.icon, nextProps.collectionOrView?.icon);
@@ -3252,8 +3256,6 @@
   const DataSourceContext = React.createContext({});
   const useDataSource = (collection) => {
     const defaultDataSource = React.useContext(DataSourceContext);
-    if (collection?.overrides?.dataSource)
-      return collection?.overrides.dataSource;
     return defaultDataSource;
   };
   const NavigationContext = React.createContext({});
@@ -3391,7 +3393,7 @@
     itemCount,
     searchString
   }) {
-    const dataSource = useDataSource(collection);
+    const dataSource = useDataSource();
     const navigationController = useNavigationController();
     const path = navigationController.resolveAliasesFrom(inputPath);
     const sortByProperty = sortBy ? sortBy[0] : void 0;
@@ -3474,7 +3476,7 @@
     collection,
     useCache = false
   }) {
-    const dataSource = useDataSource(collection);
+    const dataSource = useDataSource();
     const navigationController = useNavigationController();
     const path = navigationController.resolveAliasesFrom(inputPath);
     const context = useFireCMSContext();
@@ -3685,7 +3687,8 @@
       }
     }
     return dataSource.deleteEntity({
-      entity
+      entity,
+      collection
     }).then(() => {
       onDeleteSuccess && onDeleteSuccess(entity);
       try {
@@ -4085,7 +4088,6 @@
         );
         let shouldUpdateTopLevelNav = false;
         if (!areCollectionListsEqual(collectionsRef.current ?? [], resolvedCollections)) {
-          console.log("Collections need to be updated");
           collectionsRef.current = resolvedCollections;
           shouldUpdateTopLevelNav = true;
         }
@@ -4094,12 +4096,10 @@
           shouldUpdateTopLevelNav = true;
         }
         if (!equal(viewsRef.current, resolvedViews)) {
-          console.log("Views need to be updated");
           viewsRef.current = resolvedViews;
           shouldUpdateTopLevelNav = true;
         }
         if (!equal(adminViewsRef.current, resolvedAdminViews)) {
-          console.log("Admin views need to be updated");
           adminViewsRef.current = resolvedAdminViews;
           shouldUpdateTopLevelNav = true;
         }
@@ -4969,8 +4969,8 @@
   function renderSkeletonIcon() {
     return /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { width: 24, height: 24 });
   }
-  const StorageThumbnail = React.memo(StorageThumbnailInternal, areEqual$2);
-  function areEqual$2(prevProps, nextProps) {
+  const StorageThumbnail = React.memo(StorageThumbnailInternal, areEqual$1);
+  function areEqual$1(prevProps, nextProps) {
     return prevProps.size === nextProps.size && prevProps.storagePathOrDownloadUrl === nextProps.storagePathOrDownloadUrl && prevProps.storeUrl === nextProps.storeUrl && prevProps.interactive === nextProps.interactive;
   }
   const URL_CACHE = {};
@@ -5177,15 +5177,18 @@
         hover: disabled ? void 0 : hover,
         size,
         children: [
-          imageProperty && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cls("w-10 h-10 mr-2 shrink-0 grow-0", size === "smallest" ? "my-0.5" : "m-2 self-start"), children: /* @__PURE__ */ jsxRuntime.jsx(
-            PropertyPreview,
-            {
-              property: imageProperty,
-              propertyKey: imagePropertyKey,
-              size: "smallest",
-              value: getValueInPath(entity.values, imagePropertyKey)
-            }
-          ) }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("w-10 h-10 mr-2 shrink-0 grow-0", size === "smallest" ? "my-0.5" : "m-2 self-start"), children: [
+            imageProperty && /* @__PURE__ */ jsxRuntime.jsx(
+              PropertyPreview,
+              {
+                property: imageProperty,
+                propertyKey: imagePropertyKey,
+                size: "smallest",
+                value: getValueInPath(entity.values, imagePropertyKey)
+              }
+            ),
+            !imageProperty && /* @__PURE__ */ jsxRuntime.jsx(IconForView, { collectionOrView: collection, size, className: "mr-2" })
+          ] }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-grow w-full m-1", children: [
             size !== "smallest" && includeId && (entity ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${size !== "medium" ? "block whitespace-nowrap overflow-hidden truncate" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx(
               ui.Typography,
@@ -5265,7 +5268,7 @@
       }
     );
   }
-  const EntityPreviewContainerInner = React__namespace.forwardRef(({
+  const EntityPreviewContainer = React__namespace.forwardRef(({
     children,
     hover,
     onClick,
@@ -5307,9 +5310,7 @@
       }
     );
   });
-  EntityPreviewContainerInner.displayName = "EntityPreviewContainer";
-  const EntityPreviewContainer = React__namespace.memo(EntityPreviewContainerInner);
-  const ReferencePreview = React__namespace.memo(function ReferencePreview2(props) {
+  const ReferencePreview = function ReferencePreview2(props) {
     const reference = props.reference;
     if (!(typeof reference === "object" && "isEntityReference" in reference && reference.isEntityReference())) {
       console.warn("Reference preview received value of type", typeof reference);
@@ -5329,10 +5330,7 @@
       );
     }
     return /* @__PURE__ */ jsxRuntime.jsx(ReferencePreviewInternal, { ...props });
-  }, areEqual$1);
-  function areEqual$1(prevProps, nextProps) {
-    return prevProps.disabled === nextProps.disabled && prevProps.size === nextProps.size && prevProps.hover === nextProps.hover && prevProps.reference?.id === nextProps.reference?.id && prevProps.reference?.path === nextProps.reference?.path && prevProps.includeEntityLink === nextProps.includeEntityLink && prevProps.onClick === nextProps.onClick;
-  }
+  };
   function ReferencePreviewInternal({
     disabled,
     reference,
@@ -6293,6 +6291,7 @@
     return /* @__PURE__ */ jsxRuntime.jsx(
       ui.TextareaAutosize,
       {
+        className: ui.focusedDisabled,
         ref,
         style: {
           padding: 0,
@@ -6493,7 +6492,7 @@
       "input",
       {
         ref,
-        className: "w-full text-right p-0 m-0 bg-transparent border-none resize-none outline-none font-normal leading-normal text-unset",
+        className: ui.cls("w-full text-right p-0 m-0 bg-transparent border-none resize-none outline-none font-normal leading-normal text-unset", ui.focusedDisabled),
         style: {
           textAlign: align
         },
@@ -6546,8 +6545,8 @@
         onChange: (dateValue) => updateValue(dateValue ?? null),
         size: "medium",
         invisible: true,
-        className: "w-full h-full",
-        inputClassName: "w-full h-full",
+        inputClassName: ui.cls("w-full h-full", ui.focusedDisabled),
+        className: ui.cls("w-full h-full", ui.focusedDisabled),
         mode,
         locale
       }
@@ -7158,10 +7157,10 @@
         throw Error(`Couldn't find the corresponding collection view for the path: ${path}`);
       }
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(TableReferenceFieldSuccess, { ...props, collection });
+    return /* @__PURE__ */ jsxRuntime.jsx(TableReferenceFieldInternal, { ...props, collection });
   }
-  const TableReferenceFieldSuccess = React.memo(
-    function TableReferenceFieldSuccess2(props) {
+  const TableReferenceFieldInternal = React.memo(
+    function TableReferenceFieldInternal2(props) {
       const {
         name,
         internalValue,
@@ -7196,11 +7195,11 @@
           forceFilter
         }
       );
-      const handleOpen = React.useCallback(() => {
+      const handleOpen = () => {
         if (disabled)
           return;
         referenceDialogController.open();
-      }, [disabled, referenceDialogController]);
+      };
       const valueNotSet = !internalValue || Array.isArray(internalValue) && internalValue.length === 0;
       const buildSingleReferenceField = () => {
         if (internalValue && !Array.isArray(internalValue) && internalValue.isEntityReference && internalValue.isEntityReference())
@@ -7263,12 +7262,21 @@
           EntityPreviewContainer,
           {
             className: ui.cls(
-              "p-4 text-sm font-medium flex items-center gap-4 uppercase",
+              "p-4 text-sm font-medium flex items-center uppercase",
+              multiselect ? "gap-4" : "gap-6",
               disabled ? "text-slate-500" : "cursor-pointer text-slate-700 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-gray-800 group-hover:bg-slate-50 dark:group-hover:bg-gray-800"
             ),
             onClick: handleOpen,
             size: "medium",
             children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                IconForView,
+                {
+                  size: "small",
+                  collectionOrView: collection,
+                  className: "text-gray-300 dark:text-gray-600"
+                }
+              ),
               "Edit ",
               title
             ]
@@ -10352,7 +10360,7 @@
     } = collection;
     const [popupCell, setPopupCell] = React.useState(void 0);
     const navigation = useNavigationController();
-    const dataSource = useDataSource(collection);
+    const dataSource = useDataSource();
     const resolvedPath = React.useMemo(() => navigation.resolveAliasesFrom(fullPath), [fullPath, navigation.resolveAliasesFrom]);
     const forceFilter = forceFilterFromProps ?? forceFilterFromCollection;
     const paginationEnabled = collection.pagination === void 0 || Boolean(collection.pagination);
@@ -10600,7 +10608,7 @@
     onMultipleEntitiesDelete,
     path
   }) {
-    const dataSource = useDataSource(collection);
+    const dataSource = useDataSource();
     const customizationController = useCustomizationController();
     const snackbarController = useSnackbarController();
     const [loading, setLoading] = React.useState(false);
@@ -10895,7 +10903,8 @@
     const analyticsController = useAnalyticsController();
     const customizationController = useCustomizationController();
     const fullPath = navigation.resolveAliasesFrom(pathInput);
-    const dataSource = useDataSource(collection);
+    console.trace("Opening reference dialog for path " + fullPath);
+    const dataSource = useDataSource();
     const [entitiesDisplayedFirst, setEntitiesDisplayedFirst] = React.useState([]);
     const toggleEntitySelection = (entity) => {
       let newValue;
@@ -11050,7 +11059,17 @@
           tableController,
           enablePopupIcon: false,
           tableRowActionsBuilder,
-          title: /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "subtitle2", children: collection.singularName ? `Select ${collection.singularName}` : `Select from ${collection.name}` }),
+          title: /* @__PURE__ */ jsxRuntime.jsxs(ui.Typography, { variant: "subtitle2", className: "flex flex-row gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              IconForView,
+              {
+                size: "small",
+                collectionOrView: collection,
+                className: "text-gray-300 dark:text-gray-600"
+              }
+            ),
+            collection.singularName ? `Select ${collection.singularName}` : `Select from ${collection.name}`
+          ] }),
           defaultSize: collection.defaultSize,
           properties: resolvedCollection.properties,
           forceFilter,
@@ -11482,15 +11501,11 @@
       groups
     } = navigationController.topLevelNavigation;
     const [filteredUrls, setFilteredUrls] = React.useState(null);
-    const filteredNavigationEntries = filteredUrls ? navigationEntries.filter((entry) => filteredUrls.includes(entry.url)) : navigationEntries;
+    const performingSearch = Boolean(filteredUrls);
+    const filteredNavigationEntries = filteredUrls ? filteredUrls.map((url) => navigationEntries.find((e) => e.url === url)).filter(Boolean) : navigationEntries;
     React.useEffect(() => {
       fuse.current = new Fuse(navigationEntries, {
-        keys: [
-          "name",
-          "description",
-          "group",
-          "path"
-        ]
+        keys: ["name", "description", "group", "path"]
       });
     }, [navigationEntries]);
     const updateSearchResults = React.useCallback(
@@ -11507,7 +11522,8 @@
       },
       []
     );
-    const allGroups = [...groups];
+    const filteredGroups = filteredUrls ? filteredNavigationEntries.map((entry) => entry.group) : [];
+    const allGroups = filteredUrls ? filteredGroups.filter((group, index) => filteredGroups.indexOf(group) === index) : [...groups];
     if (filteredNavigationEntries.filter((e) => !e.group).length > 0 || filteredNavigationEntries.length === 0) {
       allGroups.push(void 0);
     }
@@ -11563,7 +11579,7 @@
               ]
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(FavouritesView, { hidden: Boolean(filteredUrls) }),
+          /* @__PURE__ */ jsxRuntime.jsx(FavouritesView, { hidden: performingSearch }),
           additionalChildrenStart,
           additionalPluginChildrenStart,
           allGroups.map((group, index) => {
@@ -11580,7 +11596,7 @@
               });
             }
             const thisGroupCollections = filteredNavigationEntries.filter((entry) => entry.group === group || !entry.group && group === void 0);
-            if (thisGroupCollections.length === 0 && AdditionalCards.length === 0)
+            if (thisGroupCollections.length === 0 && (AdditionalCards.length === 0 || performingSearch))
               return null;
             return /* @__PURE__ */ jsxRuntime.jsx(
               NavigationGroup,
@@ -12244,7 +12260,7 @@
     }) {
       const context = useFireCMSContext();
       const fullPath = fullPathProp ?? collectionProp.path;
-      const dataSource = useDataSource(collectionProp);
+      const dataSource = useDataSource();
       const navigation = useNavigationController();
       const sideEntityController = useSideEntityController();
       const authController = useAuthController();
@@ -12378,7 +12394,7 @@
           value,
           property,
           entityId
-        }) => dataSource.checkUniqueField(fullPath, name, value, entityId, collection.databaseId),
+        }) => dataSource.checkUniqueField(fullPath, name, value, entityId, collection),
         [fullPath]
       );
       const onValueChange = ({
@@ -12758,7 +12774,7 @@
     sortBy,
     onCountChange
   }) {
-    const dataSource = useDataSource(collection);
+    const dataSource = useDataSource();
     const navigation = useNavigationController();
     const [count, setCount] = React.useState(void 0);
     const [error, setError] = React.useState(void 0);
@@ -13279,7 +13295,8 @@
     onInternalIdAdded,
     includeAddButton,
     newDefaultEntry,
-    onValueChange
+    onValueChange,
+    className
   }) {
     const hasValue = value && Array.isArray(value) && value.length > 0;
     const internalIdsRef = React.useRef(buildIdsMap(value));
@@ -13368,6 +13385,7 @@
         children: (droppableProvided, droppableSnapshot) => /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
+            className,
             ...droppableProvided.droppableProps,
             ref: droppableProvided.innerRef,
             children: [
@@ -13438,7 +13456,7 @@
         ref: provided.innerRef,
         ...provided.draggableProps,
         style: provided.draggableProps.style,
-        className: `${isDragging || onHover ? ui.fieldBackgroundHoverMixin : ""} mb-1 rounded-md opacity-100`,
+        className: `${isDragging || onHover ? "hover:bg-slate-50 dark:hover:bg-gray-800 dark:hover:bg-opacity-20" : ""} mb-1 rounded-md opacity-100`,
         children: /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
@@ -13447,7 +13465,7 @@
               /* @__PURE__ */ jsxRuntime.jsx(
                 "div",
                 {
-                  className: "flex-grow w-[calc(100%-48px)] text-text-primary dark:text-text-primary-dark bg-white dark:bg-gray-900 bg-opacity-80 dark:bg-opacity-80",
+                  className: "flex-grow w-[calc(100%-48px)] text-text-primary dark:text-text-primary-dark",
                   children: buildEntry(index, internalId)
                 }
               ),
@@ -13757,7 +13775,8 @@
     onInternalIdAdded,
     includeAddButton,
     newDefaultEntry = null,
-    setFieldValue
+    setFieldValue,
+    className
   }) {
     return /* @__PURE__ */ jsxRuntime.jsx(
       ArrayContainer,
@@ -13771,6 +13790,7 @@
         onInternalIdAdded,
         includeAddButton,
         newDefaultEntry,
+        className,
         onValueChange: (value2) => setFieldValue(name, value2)
       }
     );
@@ -14110,10 +14130,10 @@
         forceFilter: ofProperty.forceFilter
       }
     );
-    const onEntryClick = React.useCallback((e) => {
+    const onEntryClick = (e) => {
       e.preventDefault();
       referenceDialogController.open();
-    }, [referenceDialogController]);
+    };
     const buildEntry = React.useCallback((index, internalId) => {
       const entryValue = value && value.length > index ? value[index] : void 0;
       if (!entryValue)
@@ -14141,7 +14161,7 @@
           icon: getIconForProperty(property, "small"),
           required: property.validation?.required,
           title: property.name,
-          className: "flex-grow text-text-secondary dark:text-text-secondary-dark"
+          className: "flex flex-grow text-text-secondary dark:text-text-secondary-dark"
         }
       ),
       Array.isArray(value) && /* @__PURE__ */ jsxRuntime.jsxs(ui.Typography, { variant: "caption", className: "px-4", children: [
@@ -14174,7 +14194,7 @@
           ui.Button,
           {
             className: "my-4 justify-center text-left",
-            variant: "outlined",
+            variant: "text",
             color: "primary",
             disabled: isSubmitting,
             onClick: onEntryClick,
@@ -14933,10 +14953,10 @@
         forceFilter: property.forceFilter
       }
     );
-    const onEntryClick = React.useCallback((e) => {
+    const onEntryClick = (e) => {
       e.preventDefault();
       referenceDialogController.open();
-    }, [referenceDialogController]);
+    };
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       !minimalistView && /* @__PURE__ */ jsxRuntime.jsx(
         LabelWithIconAndTooltip,
@@ -14978,7 +14998,13 @@
             onClick: onEntryClick,
             size: "medium",
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx(EmptyValue, {}),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                IconForView,
+                {
+                  collectionOrView: collection,
+                  className: "text-gray-300 dark:text-gray-600"
+                }
+              ),
               `Edit ${property.name}`.toUpperCase()
             ]
           }
@@ -16083,6 +16109,7 @@
       FormikArrayContainer,
       {
         value,
+        className: "flex flex-col gap-3",
         name: propertyKey,
         addLabel: property.name ? "Add entry to " + property.name : "Add entry",
         buildEntry,
@@ -16164,7 +16191,7 @@
       formex$1.setFieldValue(typeFieldName, newType);
       formex$1.setFieldValue(valueFieldName, newSelectedProperty ? getDefaultValueFor(newSelectedProperty) : null);
     };
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls(ui.paperMixin, "bg-transparent p-2 mb-4"), children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls(ui.paperMixin, "bg-transparent p-2"), children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         formex.Field,
         {
@@ -17315,7 +17342,7 @@
     }, false, 2e3);
     const inputCollection = collection;
     const authController = useAuthController();
-    const dataSource = useDataSource(collection);
+    const dataSource = useDataSource();
     const sideDialogContext = useSideDialogContext();
     const sideEntityController = useSideEntityController();
     const snackbarController = useSnackbarController();
@@ -17337,7 +17364,7 @@
         if (mustSetCustomId) {
           return void 0;
         } else {
-          return dataSource.generateEntityId(path);
+          return dataSource.generateEntityId(path, collection);
         }
       } else {
         return entityIdProp;
@@ -17354,8 +17381,8 @@
         entityId
       }
     );
-    const selectedTabRef = React.useRef(defaultSelectedView ?? MAIN_TAB_VALUE);
-    const mainViewVisible = selectedTabRef.current === MAIN_TAB_VALUE;
+    const [selectedTab, setSelectedTab] = React.useState(defaultSelectedView ?? MAIN_TAB_VALUE);
+    const mainViewVisible = selectedTab === MAIN_TAB_VALUE;
     const subcollections = (collection.subcollections ?? []).filter((c) => !c.hideFromNavigation);
     const subcollectionsCount = subcollections?.length ?? 0;
     const customViews = collection.entityViews;
@@ -17415,7 +17442,7 @@
         sideEntityController.replace({
           path,
           entityId: updatedEntity.id,
-          selectedSubPath: MAIN_TAB_VALUE === selectedTabRef.current ? void 0 : selectedTabRef.current,
+          selectedSubPath: MAIN_TAB_VALUE === selectedTab ? void 0 : selectedTab,
           updateUrl: true,
           collection
         });
@@ -17563,13 +17590,13 @@
       formex: formex$1
     };
     const resolvedEntityViews = customViews ? customViews.map((e) => resolveEntityView(e, customizationController.entityViews)).filter(Boolean) : [];
-    const selectedEntityView = resolvedEntityViews.find((e) => e.key === selectedTabRef.current);
-    const shouldShowEntityActions = !autoSave && (selectedTabRef.current === MAIN_TAB_VALUE || selectedEntityView?.includeActions);
+    const selectedEntityView = resolvedEntityViews.find((e) => e.key === selectedTab);
+    const shouldShowEntityActions = !autoSave && (selectedTab === MAIN_TAB_VALUE || selectedEntityView?.includeActions);
     const customViewsView = customViews && resolvedEntityViews.map(
       (customView, colIndex) => {
         if (!customView)
           return null;
-        if (selectedTabRef.current !== customView.key)
+        if (selectedTab !== customView.key)
           return null;
         const Builder = customView.Builder;
         if (!Builder) {
@@ -17604,7 +17631,7 @@
       (subcollection, colIndex) => {
         const subcollectionId = subcollection.id ?? subcollection.path;
         const fullPath = usedEntity ? `${path}/${usedEntity?.id}/${removeInitialAndTrailingSlashes(subcollectionId)}` : void 0;
-        if (selectedTabRef.current !== subcollectionId)
+        if (selectedTab !== subcollectionId)
           return null;
         return /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
@@ -17638,14 +17665,16 @@
       onValuesAreModified(false);
     }, []);
     const onSideTabClick = (value) => {
-      selectedTabRef.current = value;
-      sideEntityController.replace({
-        path,
-        entityId,
-        selectedSubPath: value === MAIN_TAB_VALUE ? void 0 : value,
-        updateUrl: true,
-        collection
-      });
+      setSelectedTab(value);
+      if (status === "existing") {
+        sideEntityController.replace({
+          path,
+          entityId,
+          selectedSubPath: value === MAIN_TAB_VALUE ? void 0 : value,
+          updateUrl: true,
+          collection
+        });
+      }
     };
     const onIdUpdateError = React.useCallback((error) => {
       snackbarController.open({
@@ -17710,7 +17739,7 @@
         name,
         value,
         property
-      }) => dataSource.checkUniqueField(path, name, value, entityId, collection.databaseId),
+      }) => dataSource.checkUniqueField(path, name, value, entityId, collection),
       [dataSource, path, entityId]
     );
     const validationSchema = React.useMemo(
@@ -18048,7 +18077,7 @@
             /* @__PURE__ */ jsxRuntime.jsxs(
               ui.Tabs,
               {
-                value: selectedTabRef.current,
+                value: selectedTab,
                 onValueChange: (value) => {
                   onSideTabClick(value);
                 },
@@ -18263,11 +18292,9 @@
       setDrawerCloseRequested(false);
     };
     const onCloseRequest = (force) => {
-      console.log("onCloseRequest", blocked, force);
       if (blocked && !force) {
         setDrawerCloseRequested(true);
       } else {
-        console.log("onCloseRequest closing");
         sideDialogsController.close();
         panel?.onClose?.();
       }
@@ -18461,6 +18488,15 @@
         initialised.current = true;
       }
     }, [location, navigation.loading, navigation.isUrlCollectionPath, navigation.buildUrlCollectionPath, navigation.resolveAliasesFrom, sideDialogsController, smallLayout, navigation]);
+    React.useEffect(() => {
+      const updatedSidePanels = sideDialogsController.sidePanels.map((sidePanelProps) => {
+        if (sidePanelProps.additional) {
+          return propsToSidePanel(sidePanelProps.additional, navigation.buildUrlCollectionPath, navigation.resolveAliasesFrom, smallLayout);
+        }
+        return sidePanelProps;
+      });
+      sideDialogsController.setSidePanels(updatedSidePanels);
+    }, [smallLayout]);
     const close = React.useCallback(() => {
       sideDialogsController.close();
     }, [sideDialogsController]);
@@ -18553,7 +18589,8 @@
       urlPath: newPath,
       parentUrlPath: buildUrlCollectionPath(collectionPath),
       width: entityViewWidth,
-      onClose: props.onClose
+      onClose: props.onClose,
+      additional: props
     };
   };
   function useBuildSideDialogsController() {
@@ -18646,6 +18683,7 @@
     }, [location, navigate, sidePanels]);
     return {
       sidePanels,
+      setSidePanels: updateSidePanels,
       close,
       open,
       replace
@@ -18681,7 +18719,8 @@
         orderBy,
         order
       }) => {
-        return delegate.fetchCollection({
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
+        return usedDelegate.fetchCollection({
           path,
           filter,
           limit,
@@ -18721,10 +18760,10 @@
         onError
       }) => {
         const collection = collectionProp ?? navigationController.getCollection(path);
-        Boolean(collection?.collectionGroup);
-        if (!delegate.listenCollection)
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
+        if (!usedDelegate.listenCollection)
           throw Error("useBuildDataSource delegate not initialised");
-        return delegate.listenCollection({
+        return usedDelegate.listenCollection({
           path,
           filter,
           limit,
@@ -18748,11 +18787,14 @@
         path,
         entityId,
         collection
-      }) => delegate.fetchEntity({
-        path,
-        entityId,
-        collection
-      }), [delegate]),
+      }) => {
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
+        return usedDelegate.fetchEntity({
+          path,
+          entityId,
+          collection
+        });
+      }, [delegate.fetchEntity]),
       /**
        *
        * @param path
@@ -18770,9 +18812,10 @@
         onUpdate,
         onError
       }) => {
-        if (!delegate.listenEntity)
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
+        if (!usedDelegate.listenEntity)
           throw Error("useBuildDataSource delegate not initialised");
-        return delegate.listenEntity({
+        return usedDelegate.listenEntity({
           path,
           entityId,
           onUpdate,
@@ -18799,6 +18842,7 @@
         status
       }) => {
         const collection = collectionProp ?? navigationController.getCollection(path);
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
         console.log("useBuildDatasource save", {
           path,
           entityId,
@@ -18814,29 +18858,29 @@
           fields: propertyConfigs
         }) : void 0;
         const properties = resolvedCollection?.properties;
-        const firestoreValues = delegate.cmsToDelegateModel(
+        const firestoreValues = usedDelegate.cmsToDelegateModel(
           values
         );
-        const updatedFirestoreValues = properties ? updateDateAutoValues(
+        const updatedValues = properties ? updateDateAutoValues(
           {
             inputValues: firestoreValues,
             properties,
             status,
-            timestampNowValue: delegate.currentTime?.() ?? /* @__PURE__ */ new Date(),
-            setDateToMidnight: delegate.setDateToMidnight
+            timestampNowValue: usedDelegate.currentTime?.() ?? /* @__PURE__ */ new Date(),
+            setDateToMidnight: usedDelegate.setDateToMidnight
           }
         ) : firestoreValues;
-        return delegate.saveEntity({
+        return usedDelegate.saveEntity({
           path,
           collection,
           entityId,
-          values: updatedFirestoreValues,
+          values: updatedValues,
           status
         }).then((res) => {
           return {
             id: res.id,
             path: res.path,
-            values: delegate.delegateToCMSModel(updatedFirestoreValues)
+            values: usedDelegate.delegateToCMSModel(updatedValues)
           };
         });
       }, [delegate.saveEntity, navigationController.getCollection]),
@@ -18847,9 +18891,11 @@
        * @group Firestore
        */
       deleteEntity: React.useCallback(({
-        entity
+        entity,
+        collection
       }) => {
-        return delegate.deleteEntity({ entity });
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
+        return usedDelegate.deleteEntity({ entity, collection });
       }, [delegate.deleteEntity]),
       /**
        * Check if the given property is unique in the given collection
@@ -18861,11 +18907,13 @@
        * @return `true` if there are no other fields besides the given entity
        * @group Firestore
        */
-      checkUniqueField: React.useCallback((path, name, value, entityId, databaseId) => {
-        return delegate.checkUniqueField(path, name, value, entityId, databaseId);
+      checkUniqueField: React.useCallback((path, name, value, entityId, collection) => {
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
+        return usedDelegate.checkUniqueField(path, name, value, entityId, collection);
       }, [delegate.checkUniqueField]),
-      generateEntityId: React.useCallback((path) => {
-        return delegate.generateEntityId(path);
+      generateEntityId: React.useCallback((path, collection) => {
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
+        return usedDelegate.generateEntityId(path, collection);
       }, [delegate.generateEntityId]),
       countEntities: delegate.countEntities ? async ({
         path,
@@ -18874,7 +18922,8 @@
         order,
         orderBy
       }) => {
-        return delegate.countEntities({
+        const usedDelegate = collection?.overrides?.dataSourceDelegate ?? delegate;
+        return usedDelegate.countEntities({
           path,
           filter,
           orderBy,
@@ -18900,9 +18949,10 @@
         );
       }, [delegate.isFilterCombinationValid]),
       initTextSearch: React.useCallback(async (props) => {
-        if (!delegate.initTextSearch)
+        const usedDelegate = props.collection?.overrides?.dataSourceDelegate ?? delegate;
+        if (!usedDelegate.initTextSearch)
           return false;
-        return delegate.initTextSearch(props);
+        return usedDelegate.initTextSearch(props);
       }, [delegate.initTextSearch])
     };
   }