@firecms/core 3.0.0-canary.235 → 3.0.0-canary.237

package/dist/index.es.js

@@ -3764,6 +3764,108 @@ function replacePlaceholders({
   if (!result) result = randomString() + "_" + file.name;
   return result;
 }
+const mergeCallbacks = (baseCallbacks = {}, pluginCallbacks = {}) => {
+  if (!baseCallbacks && !pluginCallbacks) {
+    return void 0;
+  }
+  const mergedCallbacks = {};
+  if (baseCallbacks.onFetch || pluginCallbacks.onFetch) {
+    mergedCallbacks.onFetch = async (props) => {
+      let entity = props.entity;
+      if (baseCallbacks.onFetch) {
+        entity = await Promise.resolve(baseCallbacks.onFetch(props));
+      }
+      if (pluginCallbacks.onFetch) {
+        entity = await Promise.resolve(pluginCallbacks.onFetch({
+          ...props,
+          entity
+        }));
+      }
+      return entity;
+    };
+  }
+  if (baseCallbacks.onSaveSuccess || pluginCallbacks.onSaveSuccess) {
+    mergedCallbacks.onSaveSuccess = async (props) => {
+      if (baseCallbacks.onSaveSuccess) {
+        await Promise.resolve(baseCallbacks.onSaveSuccess(props));
+      }
+      if (pluginCallbacks.onSaveSuccess) {
+        await Promise.resolve(pluginCallbacks.onSaveSuccess(props));
+      }
+    };
+  }
+  if (baseCallbacks.onSaveFailure || pluginCallbacks.onSaveFailure) {
+    mergedCallbacks.onSaveFailure = async (props) => {
+      if (baseCallbacks.onSaveFailure) {
+        await Promise.resolve(baseCallbacks.onSaveFailure(props));
+      }
+      if (pluginCallbacks.onSaveFailure) {
+        await Promise.resolve(pluginCallbacks.onSaveFailure(props));
+      }
+    };
+  }
+  if (baseCallbacks.onPreSave || pluginCallbacks.onPreSave) {
+    mergedCallbacks.onPreSave = async (props) => {
+      let values = {
+        ...props.values
+      };
+      if (baseCallbacks.onPreSave) {
+        const baseValues = await Promise.resolve(baseCallbacks.onPreSave(props));
+        values = {
+          ...values,
+          ...baseValues
+        };
+      }
+      if (pluginCallbacks.onPreSave) {
+        const pluginValues = await Promise.resolve(pluginCallbacks.onPreSave({
+          ...props,
+          values
+        }));
+        values = {
+          ...values,
+          ...pluginValues
+        };
+      }
+      return values;
+    };
+  }
+  if (baseCallbacks.onPreDelete || pluginCallbacks.onPreDelete) {
+    mergedCallbacks.onPreDelete = (props) => {
+      if (baseCallbacks.onPreDelete) {
+        baseCallbacks.onPreDelete(props);
+      }
+      if (pluginCallbacks.onPreDelete) {
+        pluginCallbacks.onPreDelete(props);
+      }
+    };
+  }
+  if (baseCallbacks.onDelete || pluginCallbacks.onDelete) {
+    mergedCallbacks.onDelete = (props) => {
+      if (baseCallbacks.onDelete) {
+        baseCallbacks.onDelete(props);
+      }
+      if (pluginCallbacks.onDelete) {
+        pluginCallbacks.onDelete(props);
+      }
+    };
+  }
+  if (baseCallbacks.onIdUpdate || pluginCallbacks.onIdUpdate) {
+    mergedCallbacks.onIdUpdate = async (props) => {
+      let id = props.entityId || "";
+      if (baseCallbacks.onIdUpdate) {
+        id = await Promise.resolve(baseCallbacks.onIdUpdate(props));
+      }
+      if (pluginCallbacks.onIdUpdate) {
+        id = await Promise.resolve(pluginCallbacks.onIdUpdate({
+          ...props,
+          entityId: id
+        }));
+      }
+      return id;
+    };
+  }
+  return Object.keys(mergedCallbacks).length > 0 ? mergedCallbacks : void 0;
+};
 const CONTAINER_FULL_WIDTH = "100vw";
 const ADDITIONAL_TAB_WIDTH = "55vw";
 const FORM_CONTAINER_WIDTH = "768px";
@@ -4656,7 +4758,6 @@ function ErrorView(t0) {
     tooltip
   } = t0;
   const component = error instanceof Error ? error.message : error;
-  console.warn("ErrorView", error);
   let t1;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = /* @__PURE__ */ jsx(ErrorIcon, { className: "mx-2", size: "small", color: "error" });
@@ -5194,9 +5295,9 @@ function SkeletonPropertyComponent(t0) {
         } else {
           if (arrayProperty.of.dataType === "map" && arrayProperty.of.properties) {
             let t1;
-            if ($[10] !== arrayProperty.of.previewProperties || $[11] !== arrayProperty.of.properties || $[12] !== size) {
-              t1 = renderArrayOfMaps(arrayProperty.of.properties, size, arrayProperty.of.previewProperties);
-              $[10] = arrayProperty.of.previewProperties;
+            if ($[10] !== arrayProperty.of.previewKeys || $[11] !== arrayProperty.of.properties || $[12] !== size) {
+              t1 = renderArrayOfMaps(arrayProperty.of.properties, size, arrayProperty.of.previewKeys);
+              $[10] = arrayProperty.of.previewKeys;
               $[11] = arrayProperty.of.properties;
               $[12] = size;
               $[13] = t1;
@@ -5683,11 +5784,13 @@ function EntityPreview({
   disabled,
   hover,
   collection: collectionProp,
-  previewProperties,
+  previewKeys,
   onClick,
   size,
   includeId = true,
+  includeTitle = true,
   includeEntityLink = true,
+  includeImage = true,
   entity
 }) {
   const authController = useAuthController();
@@ -5706,9 +5809,9 @@ function EntityPreview({
     propertyConfigs: customizationController.propertyConfigs,
     authController
   }), [collection]);
-  const listProperties = useMemo(() => getEntityPreviewKeys(authController, resolvedCollection, customizationController.propertyConfigs, previewProperties, size === "medium" || size === "large" ? 3 : 1), [previewProperties, resolvedCollection, size]);
-  const titleProperty = getEntityTitlePropertyKey(resolvedCollection, customizationController.propertyConfigs);
-  const imagePropertyKey = getEntityImagePreviewPropertyKey(resolvedCollection);
+  const listProperties = useMemo(() => previewKeys ?? getEntityPreviewKeys(authController, resolvedCollection, customizationController.propertyConfigs, previewKeys, size === "medium" || size === "large" ? 3 : 1), [previewKeys, resolvedCollection, size]);
+  const titleProperty = includeTitle ? getEntityTitlePropertyKey(resolvedCollection, customizationController.propertyConfigs) : void 0;
+  const imagePropertyKey = includeImage ? getEntityImagePreviewPropertyKey(resolvedCollection) : void 0;
   const imageProperty = imagePropertyKey ? resolvedCollection.properties[imagePropertyKey] : void 0;
   const usedImageProperty = imageProperty && "of" in imageProperty ? imageProperty.of : imageProperty;
   const restProperties = listProperties.filter((p) => p !== titleProperty && p !== imagePropertyKey);
@@ -5719,18 +5822,17 @@ function EntityPreview({
       usedImageProperty && usedImageValue && /* @__PURE__ */ jsx(PropertyPreview, { property: usedImageProperty, propertyKey: imagePropertyKey, size: "small", value: usedImageValue }),
       (!usedImageProperty || !usedImageValue) && /* @__PURE__ */ jsx(IconForView, { collectionOrView: collection, color: "primary", size, className: "m-auto p-1" })
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col grow-1 w-full m-1 shrink-1", style: {
-      "maxWidth": "calc(100% - 96px)"
-    }, children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col grow w-full m-1 shrink min-w-0", children: [
       size !== "small" && includeId && (entity ? /* @__PURE__ */ jsx("div", { className: "block whitespace-nowrap overflow-hidden truncate", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "disabled", className: "font-mono", children: entity.id }) }) : /* @__PURE__ */ jsx(Skeleton, {})),
       titleProperty && /* @__PURE__ */ jsx("div", { className: "truncate my-0.5 text-sm font-medium", children: entity ? /* @__PURE__ */ jsx(PropertyPreview, { propertyKey: titleProperty, value: getValueInPath(entity.values, titleProperty), property: resolvedCollection.properties[titleProperty], size: "large" }) : /* @__PURE__ */ jsx(SkeletonPropertyComponent, { property: resolvedCollection.properties[titleProperty], size: "large" }) }),
       restProperties && restProperties.map((key) => {
-        const childProperty = resolvedCollection.properties[key];
+        const childProperty = getPropertyInPath(resolvedCollection.properties, key);
         if (!childProperty) return null;
-        return /* @__PURE__ */ jsx("div", { className: cls("truncate", restProperties.length > 1 ? "my-0.5" : "my-0"), children: entity ? /* @__PURE__ */ jsx(PropertyPreview, { propertyKey: key, value: getValueInPath(entity.values, key), property: childProperty, size: "small" }) : /* @__PURE__ */ jsx(SkeletonPropertyComponent, { property: childProperty, size: "small" }) }, "ref_prev_" + key);
+        const valueInPath = getValueInPath(entity.values, key);
+        return /* @__PURE__ */ jsx("div", { className: cls("truncate", restProperties.length > 1 ? "my-0.5" : "my-0"), children: entity ? /* @__PURE__ */ jsx(PropertyPreview, { propertyKey: key, value: valueInPath, property: childProperty, size: "small" }) : /* @__PURE__ */ jsx(SkeletonPropertyComponent, { property: childProperty, size: "small" }) }, "ref_prev_" + key);
       })
     ] }),
-    entity && includeEntityLink && /* @__PURE__ */ jsx(Tooltip, { title: `See details for ${entity.id}`, className: "shrink-0", children: /* @__PURE__ */ jsx(IconButton, { color: "inherit", size: "medium", className: size !== "small" ? "self-start" : "", onClick: (e) => {
+    entity && includeEntityLink && /* @__PURE__ */ jsx(Tooltip, { title: `See details for ${entity.id}`, className: "shrink-0", children: /* @__PURE__ */ jsx(IconButton, { color: "inherit", size: "small", className: size !== "small" ? "self-start" : "", onClick: (e) => {
       e.stopPropagation();
       analyticsController.onAnalyticsEvent?.("entity_click_from_reference", {
         path: entity.path,
@@ -5742,7 +5844,7 @@ function EntityPreview({
         collection,
         updateUrl: true
       });
-    }, children: /* @__PURE__ */ jsx(KeyboardTabIcon, { size: "medium" }) }) }),
+    }, children: /* @__PURE__ */ jsx(KeyboardTabIcon, { size: "small" }) }) }),
     actions
   ] });
 }
@@ -6078,7 +6180,7 @@ function ReferencePreviewExisting(t0) {
   }
   let t3;
   if ($[25] !== collection || $[26] !== disabled || $[27] !== hover || $[28] !== includeEntityLink || $[29] !== includeId || $[30] !== onClick || $[31] !== previewProperties || $[32] !== size || $[33] !== usedEntity) {
-    t3 = /* @__PURE__ */ jsx(EntityPreview, { size, previewProperties, disabled, entity: usedEntity, collection, onClick, includeEntityLink, includeId, hover });
+    t3 = /* @__PURE__ */ jsx(EntityPreview, { size, previewKeys: previewProperties, disabled, entity: usedEntity, collection, onClick, includeEntityLink, includeId, hover });
     $[25] = collection;
     $[26] = disabled;
     $[27] = hover;
@@ -6926,7 +7028,7 @@ function ArrayOfMapsPreview(t0) {
         throw Error(`You need to specify a 'properties' prop (or specify a custom field) in your map property ${propertyKey}`);
       }
       const values = value;
-      const previewProperties = mapProperty.previewProperties;
+      const previewProperties = mapProperty.previewKeys;
       if (!values) {
         t4 = null;
         break bb0;
@@ -9246,7 +9348,7 @@ const PropertyTableCell = React__default.memo(function PropertyTableCell2({
           }
         } else if (arrayProperty.of.dataType === "reference") {
           if (typeof arrayProperty.of.path === "string") {
-            innerComponent = /* @__PURE__ */ jsx(TableReferenceField, { name: propertyKey, disabled, internalValue, updateValue, size, multiselect: true, path: arrayProperty.of.path, previewProperties: arrayProperty.of.previewProperties, title: arrayProperty.name, forceFilter: arrayProperty.of.forceFilter, includeId: arrayProperty.of.includeId, includeEntityLink: arrayProperty.of.includeEntityLink });
+            innerComponent = /* @__PURE__ */ jsx(TableReferenceField, { name: propertyKey, disabled, internalValue, updateValue, size, multiselect: true, path: arrayProperty.of.path, previewProperties: arrayProperty.of.previewKeys, title: arrayProperty.name, forceFilter: arrayProperty.of.forceFilter, includeId: arrayProperty.of.includeId, includeEntityLink: arrayProperty.of.includeEntityLink });
           }
           allowScroll = false;
         }
@@ -9509,7 +9611,7 @@ function CollectionTableToolbar(t0) {
   }
   let t6;
   if ($[6] !== t3 || $[7] !== t4) {
-    t6 = /* @__PURE__ */ jsx(Tooltip, { title: "Table row size", side: "right", sideOffset: 4, children: /* @__PURE__ */ jsx(Select, { value: t3, className: "w-16 h-10", size: "small", onValueChange: t4, renderValue: _temp$j, children: t5 }) });
+    t6 = /* @__PURE__ */ jsx(Tooltip, { title: "Table row size", side: "right", sideOffset: 4, children: /* @__PURE__ */ jsx(Select, { value: t3, className: "w-16 ml-2", size: "small", onValueChange: t4, renderValue: _temp$j, children: t5 }) });
     $[6] = t3;
     $[7] = t4;
     $[8] = t6;
@@ -10551,8 +10653,8 @@ const VirtualTable = React__default.memo(function VirtualTable2({
   });
   const onColumnResizeInternal = useCallback((params) => {
     if (debug) console.log("onColumnResizeInternal", params);
-    setColumns(columns.map((column) => column.key === params.column.key ? params.column : column));
-  }, [columns]);
+    setColumns((prevColumns) => prevColumns.map((column) => column.key === params.column.key ? params.column : column));
+  }, []);
   const onColumnResizeEndInternal = useCallback((params_0) => {
     if (debug) console.log("onColumnResizeEndInternal", params_0);
     setColumns(columns.map((column_0) => column_0.key === params_0.column.key ? params_0.column : column_0));
@@ -11310,97 +11412,94 @@ function _temp2$6(op_1) {
 function _temp$g(op_0) {
   return operationLabels[op_0];
 }
-const SelectableTable = React__default.memo(
-  function SelectableTable2({
-    onValueChange,
-    cellRenderer,
-    onEntityClick,
-    onColumnResize,
-    hoverRow = true,
-    size = "m",
-    inlineEditing = false,
-    tableController: {
-      data,
-      dataLoading,
-      noMoreToLoad,
-      dataLoadingError,
-      filterValues,
-      setFilterValues,
-      sortBy,
-      setSortBy,
-      itemCount,
-      setItemCount,
-      pageSize = 50,
-      paginationEnabled,
-      checkFilterCombination,
-      setPopupCell
-    },
-    filterable = true,
-    onScroll,
-    initialScroll,
-    emptyComponent,
-    columns,
-    forceFilter,
-    highlightedRow,
-    endAdornment,
-    AddColumnComponent
-  }) {
-    const ref = useRef(null);
-    const [selectedCell, setSelectedCell] = React__default.useState(void 0);
-    const loadNextPage = () => {
-      if (!paginationEnabled || dataLoading || noMoreToLoad) return;
-      if (itemCount !== void 0) setItemCount?.(itemCount + pageSize);
-    };
-    const resetPagination = useCallback(() => {
-      setItemCount?.(pageSize);
-    }, [pageSize]);
-    const onRowClick = useCallback(({
-      rowData
-    }) => {
-      if (inlineEditing) return;
-      return onEntityClick && onEntityClick(rowData);
-    }, [onEntityClick, inlineEditing]);
-    useOutsideAlerter(ref, () => {
-      if (selectedCell) {
+const SelectableTable = function SelectableTable2({
+  onValueChange,
+  cellRenderer,
+  onEntityClick,
+  onColumnResize,
+  hoverRow = true,
+  size = "m",
+  inlineEditing = false,
+  tableController: {
+    data,
+    dataLoading,
+    noMoreToLoad,
+    dataLoadingError,
+    filterValues,
+    setFilterValues,
+    sortBy,
+    setSortBy,
+    itemCount,
+    setItemCount,
+    pageSize = 50,
+    paginationEnabled,
+    checkFilterCombination,
+    setPopupCell
+  },
+  filterable = true,
+  onScroll,
+  initialScroll,
+  emptyComponent,
+  columns,
+  forceFilter,
+  highlightedRow,
+  endAdornment,
+  AddColumnComponent
+}) {
+  const ref = useRef(null);
+  const [selectedCell, setSelectedCell] = React__default.useState(void 0);
+  const loadNextPage = () => {
+    if (!paginationEnabled || dataLoading || noMoreToLoad) return;
+    if (itemCount !== void 0) setItemCount?.(itemCount + pageSize);
+  };
+  const resetPagination = useCallback(() => {
+    setItemCount?.(pageSize);
+  }, [pageSize]);
+  const onRowClick = useCallback(({
+    rowData
+  }) => {
+    if (inlineEditing) return;
+    return onEntityClick && onEntityClick(rowData);
+  }, [onEntityClick, inlineEditing]);
+  useOutsideAlerter(ref, () => {
+    if (selectedCell) {
+      unselect();
+    }
+  }, Boolean(selectedCell));
+  const select = useCallback((cell) => {
+    setSelectedCell(cell);
+  }, []);
+  const unselect = useCallback(() => {
+    setSelectedCell(void 0);
+  }, []);
+  useEffect(() => {
+    const escFunction = (event) => {
+      if (event.keyCode === 27) {
         unselect();
       }
-    }, Boolean(selectedCell));
-    useEffect(() => {
-      const escFunction = (event) => {
-        if (event.keyCode === 27) {
-          unselect();
-        }
-      };
-      document.addEventListener("keydown", escFunction, false);
-      return () => {
-        document.removeEventListener("keydown", escFunction, false);
-      };
+    };
+    document.addEventListener("keydown", escFunction, false);
+    return () => {
+      document.removeEventListener("keydown", escFunction, false);
+    };
+  }, [unselect]);
+  const onFilterUpdate = useCallback((updatedFilterValues) => {
+    setFilterValues?.({
+      ...updatedFilterValues,
+      ...forceFilter
     });
-    const select = useCallback((cell) => {
-      setSelectedCell(cell);
-    }, []);
-    const unselect = useCallback(() => {
-      setSelectedCell(void 0);
-    }, []);
-    const onFilterUpdate = useCallback((updatedFilterValues) => {
-      setFilterValues?.({
-        ...updatedFilterValues,
-        ...forceFilter
-      });
-    }, [forceFilter]);
-    return /* @__PURE__ */ jsx(SelectableTableContext.Provider, { value: {
-      setPopupCell,
-      select,
-      onValueChange,
-      size: size ?? "m",
-      selectedCell
-    }, children: /* @__PURE__ */ jsx("div", { className: "h-full w-full flex flex-col bg-white dark:bg-surface-950", ref, children: /* @__PURE__ */ jsx(VirtualTable, { data, columns, cellRenderer, onRowClick: inlineEditing ? void 0 : onEntityClick ? onRowClick : void 0, onEndReached: loadNextPage, onResetPagination: resetPagination, error: dataLoadingError, onColumnResize, rowHeight: getRowHeight(size), loading: dataLoading, filter: filterValues, onFilterUpdate: setFilterValues ? onFilterUpdate : void 0, sortBy, onSortByUpdate: setSortBy, hoverRow, initialScroll, onScroll, checkFilterCombination, createFilterField: filterable ? createFilterField : void 0, rowClassName: useCallback((entity) => {
-      return highlightedRow?.(entity) ? "bg-surface-100 bg-opacity-75 dark:bg-surface-800 dark:bg-opacity-75" : "";
-    }, [highlightedRow]), className: "flex-grow", emptyComponent, endAdornment, AddColumnComponent }) }) });
-  },
-  () => false
-  // equal
-);
+  }, [forceFilter]);
+  const contextValue = useMemo(() => ({
+    setPopupCell,
+    select,
+    onValueChange,
+    size: size ?? "m",
+    selectedCell
+  }), [setPopupCell, select, onValueChange, size, selectedCell]);
+  return /* @__PURE__ */ jsx(SelectableTableContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: "h-full w-full flex flex-col bg-white dark:bg-surface-950", ref, children: /* @__PURE__ */ jsx(VirtualTable, { data, columns, cellRenderer, onRowClick: inlineEditing ? void 0 : onEntityClick ? onRowClick : void 0, onEndReached: loadNextPage, onResetPagination: resetPagination, error: dataLoadingError, onColumnResize, rowHeight: getRowHeight(size), loading: dataLoading, filter: filterValues, onFilterUpdate: setFilterValues ? onFilterUpdate : void 0, sortBy, onSortByUpdate: setSortBy, hoverRow, initialScroll, onScroll, checkFilterCombination, createFilterField: filterable ? createFilterField : void 0, rowClassName: useCallback((entity) => {
+    return highlightedRow?.(entity) ? "bg-surface-100 bg-opacity-75 dark:bg-surface-800 dark:bg-opacity-75" : "";
+  }, [highlightedRow]), className: "flex-grow", emptyComponent, endAdornment, AddColumnComponent }) }) });
+};
 function createFilterField({
   id,
   filterValue,
@@ -13345,7 +13444,7 @@ function DefaultHomePage(t0) {
             context.analyticsController?.onAnalyticsEvent?.(event, {
               path: entry_1.path
             });
-          } }) }, `nav_${entry_1.group}_${entry_1.name}`)),
+          } }) }, `nav_${entry_1.group}_${entry_1.path}_${entry_1.name}`)),
           group_0?.toLowerCase() !== "admin" && AdditionalCards && AdditionalCards.map((AdditionalCard, i_2) => /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(AdditionalCard, { ...actionProps }) }, `nav_${group_0}_add_${i_2}`))
         ] }) }, `plugin_section_${group_0}`);
       };
@@ -16657,7 +16756,6 @@ function KeyValueFieldBinding(t0) {
     t6 = $[15];
   }
   const title = t6;
-  console.log("minimalistView", propertyKey, minimalistView);
   let t7;
   if ($[16] !== expanded || $[17] !== mapFormView || $[18] !== minimalistView || $[19] !== title) {
     t7 = !minimalistView && /* @__PURE__ */ jsx(ExpandablePanel, { initiallyExpanded: expanded, title, innerClassName: "px-2 md:px-4 pb-2 md:pb-4 pt-1 md:pt-2", children: mapFormView });
@@ -19139,7 +19237,7 @@ function ConfirmationDialog(t0) {
   }
   let t5;
   if ($[8] !== loading || $[9] !== onAccept) {
-    t5 = /* @__PURE__ */ jsx(LoadingButton, { color: "primary", type: "submit", loading, onClick: onAccept, children: "Ok" });
+    t5 = /* @__PURE__ */ jsx(LoadingButton, { color: "primary", type: "submit", loading, onClick: onAccept, autoFocus: true, children: "Ok" });
     $[8] = loading;
     $[9] = onAccept;
     $[10] = t5;
@@ -20143,9 +20241,9 @@ function useBuildNavigationController(props) {
     views: viewsProp,
     adminViews: adminViewsProp,
     viewsOrder,
+    plugins,
     userConfigPersistence,
     dataSourceDelegate,
-    injectCollections,
     disabled
   } = props;
   const navigate = useNavigate();
@@ -20235,7 +20333,7 @@ function useBuildNavigationController(props) {
     if (disabled || authController.initialLoading) return;
     console.debug("Refreshing navigation");
     try {
-      const [resolvedCollections = [], resolvedViews, resolvedAdminViews = []] = await Promise.all([resolveCollections(collectionsProp, collectionPermissions, authController, dataSourceDelegate, injectCollections), resolveCMSViews(viewsProp, authController, dataSourceDelegate), resolveCMSViews(adminViewsProp, authController, dataSourceDelegate)]);
+      const [resolvedCollections = [], resolvedViews, resolvedAdminViews = []] = await Promise.all([resolveCollections(collectionsProp, collectionPermissions, authController, dataSourceDelegate, plugins), resolveCMSViews(viewsProp, authController, dataSourceDelegate), resolveCMSViews(adminViewsProp, authController, dataSourceDelegate)]);
       let shouldUpdateTopLevelNav = false;
       if (!areCollectionListsEqual(collectionsRef.current ?? [], resolvedCollections)) {
         collectionsRef.current = resolvedCollections;
@@ -20264,7 +20362,7 @@ function useBuildNavigationController(props) {
     }
     if (navigationLoading) setNavigationLoading(false);
     if (!initialised) setInitialised(true);
-  }, [collectionsProp, collectionPermissions, authController.user, authController.initialLoading, disabled, viewsProp, adminViewsProp, computeTopNavigation, injectCollections]);
+  }, [collectionsProp, collectionPermissions, authController.user, authController.initialLoading, disabled, viewsProp, adminViewsProp, computeTopNavigation]);
   useEffect(() => {
     refreshNavigation();
   }, [refreshNavigation]);
@@ -20406,7 +20504,19 @@ function filterOutNotAllowedCollections(resolvedCollections, authController) {
     };
   });
 }
-async function resolveCollections(collections, collectionPermissions, authController, dataSource, injectCollections) {
+function applyPluginModifyCollection(resolvedCollections, modifyCollection) {
+  return resolvedCollections.map((collection) => {
+    const modifiedCollection = modifyCollection(collection);
+    if (modifiedCollection.subcollections) {
+      return {
+        ...modifiedCollection,
+        subcollections: applyPluginModifyCollection(modifiedCollection.subcollections, modifyCollection)
+      };
+    }
+    return modifiedCollection;
+  });
+}
+async function resolveCollections(collections, collectionPermissions, authController, dataSource, plugins) {
   let resolvedCollections = [];
   if (typeof collections === "function") {
     resolvedCollections = await collections({
@@ -20417,8 +20527,15 @@ async function resolveCollections(collections, collectionPermissions, authContro
   } else if (Array.isArray(collections)) {
     resolvedCollections = collections;
   }
-  if (injectCollections) {
-    resolvedCollections = injectCollections(resolvedCollections ?? []);
+  if (plugins) {
+    for (const plugin of plugins) {
+      if (plugin.collection?.modifyCollection) {
+        resolvedCollections = applyPluginModifyCollection(resolvedCollections, plugin.collection.modifyCollection);
+      }
+      if (plugin.collection?.injectCollections) {
+        resolvedCollections = plugin.collection.injectCollections(resolvedCollections ?? []);
+      }
+    }
   }
   resolvedCollections = applyPermissionsFunctionIfEmpty(resolvedCollections, collectionPermissions);
   resolvedCollections = filterOutNotAllowedCollections(resolvedCollections, authController);
@@ -21339,10 +21456,11 @@ function EntityEditViewInner({
   }, [selectedTabProp]);
   const subcollections = (collection.subcollections ?? []).filter((c2) => !c2.hideFromNavigation);
   const subcollectionsCount = subcollections?.length ?? 0;
-  const customViews = collection.entityViews;
+  const customViews = collection.entityViews ?? [];
   const customViewsCount = customViews?.length ?? 0;
   const includeJsonView = collection.includeJsonView === void 0 ? true : collection.includeJsonView;
   const hasAdditionalViews = customViewsCount > 0 || subcollectionsCount > 0 || includeJsonView;
+  const plugins = customizationController.plugins;
   const {
     resolvedEntityViews,
     selectedEntityView,
@@ -21440,7 +21558,8 @@ function EntityEditViewInner({
     formProps?.onSaved?.(res);
   }, Builder: selectedSecondaryForm?.Builder });
   const subcollectionTabs = subcollections && subcollections.map((subcollection_0) => /* @__PURE__ */ jsx(Tab, { className: "text-sm min-w-[120px]", value: subcollection_0.id, children: subcollection_0.name }, `entity_detail_collection_tab_${subcollection_0.name}`));
-  const customViewTabs = resolvedEntityViews.map((view) => /* @__PURE__ */ jsx(Tab, { className: "text-sm min-w-[120px]", value: view.key, children: view.name }, `entity_detail_collection_tab_${view.name}`));
+  const customViewTabsStart = resolvedEntityViews.filter((view) => view.position === "start").map((view_0) => /* @__PURE__ */ jsx(Tab, { className: !view_0.tabComponent ? "text-sm min-w-[120px]" : void 0, value: view_0.key, children: view_0.tabComponent ?? view_0.name }, `entity_detail_collection_tab_${view_0.name}`));
+  const customViewTabsEnd = resolvedEntityViews.filter((view_1) => !view_1.position || view_1.position === "end").map((view_2) => /* @__PURE__ */ jsx(Tab, { className: !view_2.tabComponent ? "text-sm min-w-[120px]" : void 0, value: view_2.key, children: view_2.tabComponent ?? view_2.name }, `entity_detail_collection_tab_${view_2.name}`));
   const shouldShowTopBar = Boolean(barActions) || hasAdditionalViews;
   let result = /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col h-full w-full bg-white dark:bg-surface-900", children: [
     shouldShowTopBar && /* @__PURE__ */ jsxs("div", { className: cls("h-14 flex overflow-visible overflow-x-scroll w-full no-scrollbar h-14 border-b pl-2 pr-2 pt-1 flex items-end bg-surface-50 dark:bg-surface-900", defaultBorderMixin), children: [
@@ -21450,9 +21569,10 @@ function EntityEditViewInner({
       hasAdditionalViews && /* @__PURE__ */ jsxs(Tabs, { value: selectedTab, onValueChange: (value_1) => {
         onSideTabClick(value_1);
       }, children: [
-        includeJsonView && /* @__PURE__ */ jsx(Tab, { disabled: !hasAdditionalViews, value: JSON_TAB_VALUE, innerClassName: "block", className: "text-sm", children: /* @__PURE__ */ jsx(CodeIcon, { size: "small" }) }),
+        includeJsonView && /* @__PURE__ */ jsx(Tab, { disabled: !hasAdditionalViews, value: JSON_TAB_VALUE, className: "text-sm", children: /* @__PURE__ */ jsx(CodeIcon, { size: "small" }) }),
+        customViewTabsStart,
         /* @__PURE__ */ jsx(Tab, { disabled: !hasAdditionalViews, value: MAIN_TAB_VALUE, className: "text-sm min-w-[120px]", children: collection.singularName ?? collection.name }),
-        customViewTabs,
+        customViewTabsEnd,
         subcollectionTabs
       ] })
     ] }),
@@ -21464,7 +21584,6 @@ function EntityEditViewInner({
     customViewsView,
     subCollectionsViews
   ] });
-  const plugins = customizationController.plugins;
   if (plugins) {
     plugins.forEach((plugin) => {
       if (plugin.form?.provider) {
@@ -21475,6 +21594,12 @@ function EntityEditViewInner({
   return result;
 }
 function EntitySidePanel(props) {
+  const {
+    allowFullScreen = true,
+    path,
+    entityId,
+    formProps
+  } = props;
   const {
     blocked,
     setBlocked,
@@ -21494,8 +21619,8 @@ function EntitySidePanel(props) {
     close(true);
   };
   const onUpdate = (params) => {
-    if (props.onUpdate) {
-      props.onUpdate(params);
+    {
+      onUpdate(params);
     }
     if (params.status !== "existing") {
       sideEntityController.replace({
@@ -21512,18 +21637,18 @@ function EntitySidePanel(props) {
     }
   };
   const parentCollectionIds = useMemo(() => {
-    return navigationController.getParentCollectionIds(props.path);
-  }, [navigationController, props.path]);
+    return navigationController.getParentCollectionIds(path);
+  }, [navigationController, path]);
   const collection = useMemo(() => {
     if (props.collection) {
       return props.collection;
     }
-    const registryCollection = navigationController.getCollection(props.path);
+    const registryCollection = navigationController.getCollection(path);
     if (registryCollection) {
       return registryCollection;
     }
-    console.error("ERROR: No collection found in path `", props.path, "`. Entity id: ", props.entityId);
-    throw Error("ERROR: No collection found in path `" + props.path + "`. Make sure you have defined a collection for this path in the root navigation.");
+    console.error("ERROR: No collection found in path `", path, "`. Entity id: ", entityId);
+    throw Error("ERROR: No collection found in path `" + path + "`. Make sure you have defined a collection for this path in the root navigation.");
   }, [navigationController, props.collection]);
   useEffect(() => {
     function beforeunload(e) {
@@ -21550,24 +21675,24 @@ function EntitySidePanel(props) {
   }
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(ErrorBoundary, { children: /* @__PURE__ */ jsx(EntityEditView, { ...props, layout: "side_panel", collection, parentCollectionIds, onValuesModified, onSaved: onUpdate, barActions: /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(IconButton, { className: "self-center", onClick: onClose, children: /* @__PURE__ */ jsx(CloseIcon, { size: "small" }) }),
-    /* @__PURE__ */ jsx(IconButton, { className: "self-center", onClick: () => {
-      if (props.entityId) navigate(location.pathname);
+    allowFullScreen && /* @__PURE__ */ jsx(IconButton, { className: "self-center", onClick: () => {
+      if (entityId) navigate(location.pathname);
       else navigate(location.pathname + "#new");
     }, children: /* @__PURE__ */ jsx(OpenInFullIcon, { size: "small" }) })
   ] }), onTabChange: ({
-    path,
-    entityId,
+    path: path_0,
+    entityId: entityId_0,
     selectedTab,
     collection: collection_0
   }) => {
     sideEntityController.replace({
-      path,
-      entityId,
+      path: path_0,
+      entityId: entityId_0,
       selectedTab,
       updateUrl: true,
       collection: collection_0
     });
-  }, formProps: props.formProps }) }) });
+  }, formProps }) }) });
 }
 const NEW_URL_HASH = "new_side";
 const SIDE_URL_HASH = "side";
@@ -21576,7 +21701,7 @@ function getEntityViewWidth(props, small, customizationController, authControlle
   const {
     selectedSecondaryForm
   } = resolvedSelectedEntityView(props.collection?.entityViews, customizationController, props.selectedTab);
-  const shouldUseSmallLayout = !props.selectedTab || props.selectedTab === JSON_TAB_VALUE || Boolean(selectedSecondaryForm);
+  const shouldUseSmallLayout = !props.selectedTab || props.selectedTab === JSON_TAB_VALUE || props.selectedTab === "__history" || Boolean(selectedSecondaryForm);
   let resolvedWidth;
   if (props.width) {
     resolvedWidth = typeof props.width === "number" ? `${props.width}px` : props.width;
@@ -24013,6 +24138,8 @@ export {
   EntityCollectionView,
   EntityCollectionViewActions,
   EntityForm,
+  EntityPreview,
+  EntityPreviewContainer,
   EntityReference,
   EntityView,
   EnumValuesChip,
@@ -24146,6 +24273,7 @@ export {
   joinCollectionLists,
   makePropertiesEditable,
   makePropertiesNonEditable,
+  mergeCallbacks,
   mergeCollection,
   mergeDeep,
   mergeEntityActions,