@rebasepro/admin 0.6.1 → 0.8.0

package/src/hooks/navigation/useResolvedCollections.ts

@@ -1,5 +1,5 @@
 import type { EntityCollection, RebasePlugin } from "@rebasepro/types";
-import { useCallback, useEffect, useRef, useState, useMemo } from "react";
+import { useRef, useMemo } from "react";
 
 import { AuthController, CollectionRegistryController, RebaseData, User } from "@rebasepro/types";
 import type { EntityCollectionsBuilder } from "@rebasepro/types";
@@ -8,6 +8,7 @@ import { CollectionRegistry } from "@rebasepro/common";
 
 import { resolveCollections } from "./useNavigationResolution";
 import { areCollectionListsEqual } from "./utils";
+import { useAsyncResolver } from "./useAsyncResolver";
 
 export type UseResolvedCollectionsProps<EC extends EntityCollection, USER extends User> = {
     authController: AuthController<USER>;
@@ -50,16 +51,11 @@ export function useResolvedCollections<EC extends EntityCollection, USER extends
         collectionRegistryController
     } = props;
 
-    const [loading, setLoading] = useState(true);
-    const [error, setError] = useState<Error | undefined>(undefined);
-    const [resolvedCollections, setResolvedCollections] = useState<EntityCollection[]>([]);
-
-    // Track the trigger count to allow force-refresh
-    const [refreshTrigger, setRefreshTrigger] = useState(0);
-
-    const refresh = useCallback(() => {
-        setRefreshTrigger(prev => prev + 1);
-    }, []);
+    // Stable identity string for the user — avoids re-triggering when the
+    // authController object reference changes but uid/roles are the same.
+    const userIdentity = authController.user
+        ? `${authController.user.uid}:${(authController.user.roles ?? []).sort().join(',')}`
+        : null;
 
     // Use refs for values that may be new objects each render but shouldn't
     // re-trigger the effect. The effect reads them at execution time.
@@ -70,74 +66,36 @@ export function useResolvedCollections<EC extends EntityCollection, USER extends
     const pluginsRef = useRef(plugins);
     pluginsRef.current = plugins;
 
+    const { data: collections, loading, error, refresh } = useAsyncResolver<EntityCollection[]>({
+        resolver: async () => {
+            const resolved = await resolveCollections(
+                collectionsProp,
+                authControllerRef.current,
+                dataRef.current,
+                pluginsRef.current
+            );
 
-    // Ref for resolved collections change detection
-    const resolvedCollectionsRef = useRef<EntityCollection[]>([]);
-
-    const initialLoading = authController.initialLoading;
-    const user = authController.user;
-
-    useEffect(() => {
-        if (disabled || initialLoading) return;
-
-        let cancelled = false;
-
-        (async () => {
-            try {
-                const resolved = await resolveCollections(
-                    collectionsProp,
-                    authControllerRef.current,
-                    dataRef.current,
-                    pluginsRef.current
-                );
+            const deduped = [...resolved];
 
-                if (cancelled) return;
+            // Register with the CollectionRegistry; returns true if changed
+            const changed = collectionRegistryController.collectionRegistryRef.current.registerMultiple(deduped);
 
-                const deduped = [...resolved];
-
-                // Register with the CollectionRegistry; returns true if changed
-                const changed = collectionRegistryController.collectionRegistryRef.current.registerMultiple(deduped);
-
-                if (changed) {
-                    console.debug("Collections have changed", deduped);
-                }
-
-                // Only update state if collections actually changed
-                if (!areCollectionListsEqual(resolvedCollectionsRef.current, deduped)) {
-                    resolvedCollectionsRef.current = deduped;
-                    setResolvedCollections(deduped);
-                }
-
-                setError(undefined);
-            } catch (e) {
-                if (!cancelled) {
-                    console.error(e);
-                    setError(e as Error);
-                }
-            } finally {
-                if (!cancelled) {
-                    setLoading(false);
-                }
+            if (changed) {
+                console.debug("Collections have changed", deduped);
             }
-        })();
 
-        return () => {
-            cancelled = true;
-        };
-    }, [
-        collectionsProp,
-        disabled,
-        collectionRegistryController.collectionRegistryRef,
-        refreshTrigger,
-        initialLoading,
-        user
-    ]);
+            return deduped;
+        },
+        initialValue: [],
+        isEqual: areCollectionListsEqual,
+        deps: [collectionsProp, userIdentity, disabled],
+        disabled: disabled || authController.initialLoading,
+    });
 
     return useMemo(() => ({
-        collections: resolvedCollections,
+        collections,
         loading,
         error,
         refresh
-    }), [resolvedCollections, loading, error, refresh]);
+    }), [collections, loading, error, refresh]);
 }
-

package/src/hooks/navigation/useResolvedViews.tsx

@@ -1,6 +1,6 @@
 
 import type { AppView, AppViewsBuilder, EffectiveRoleController, RebasePlugin } from "@rebasepro/types";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useMemo, useRef } from "react";
 
 /**
  * Compare two view arrays by their slug identity.
@@ -20,6 +20,7 @@ function viewSlugsEqual(a: AppView[] | undefined, b: AppView[] | undefined): boo
 import type { AuthController, RebaseData, User } from "@rebasepro/types";
 
 import { resolveAppViews } from "./useNavigationResolution";
+import { useAsyncResolver } from "./useAsyncResolver";
 
 export type UseResolvedViewsProps<USER extends User> = {
     authController: AuthController<USER>;
@@ -39,6 +40,23 @@ export type UseResolvedViewsResult = {
     refresh: () => void;
 };
 
+/**
+ * Combined result type for the async resolver — holds both views and
+ * adminViews so they can be resolved together in a single async call.
+ */
+type ResolvedViewsData = {
+    views: AppView[] | undefined;
+    adminViews: AppView[] | undefined;
+};
+
+/**
+ * Equality check for the combined views data.
+ * Compares both views and adminViews by slug identity.
+ */
+function areResolvedViewsEqual(a: ResolvedViewsData, b: ResolvedViewsData): boolean {
+    return viewSlugsEqual(a.views, b.views) && viewSlugsEqual(a.adminViews, b.adminViews);
+}
+
 /**
  * Hook that resolves view and admin view props (which may be async builders or arrays)
  * into concrete AppView[].
@@ -60,21 +78,11 @@ export function useResolvedViews<USER extends User>(
         effectiveRoleController
     } = props;
 
-    const [loading, setLoading] = useState(true);
-    const [error, setError] = useState<Error | undefined>(undefined);
-    const [resolvedViews, setResolvedViews] = useState<AppView[] | undefined>(undefined);
-    const [resolvedAdminViews, setResolvedAdminViews] = useState<AppView[] | undefined>(undefined);
-
-    // Track the trigger count to allow force-refresh
-    const [refreshTrigger, setRefreshTrigger] = useState(0);
-
-    const refresh = useCallback(() => {
-        setRefreshTrigger(prev => prev + 1);
-    }, []);
-
-    // Refs for change-detection (avoids state updates when views haven't changed)
-    const viewsRef = useRef<AppView[] | undefined>(undefined);
-    const adminViewsRef = useRef<AppView[] | undefined>(undefined);
+    // Stable identity string for the user — avoids re-triggering when the
+    // authController object reference changes but uid/roles are the same.
+    const userIdentity = authController.user
+        ? `${authController.user.uid}:${(authController.user.roles ?? []).sort().join(',')}`
+        : null;
 
     // Use refs for values that may be new objects each render but shouldn't
     // re-trigger the effect. The effect reads them at execution time.
@@ -104,64 +112,26 @@ export function useResolvedViews<USER extends User>(
     resolvedAuthControllerRef.current = resolvedAuthController;
 
     const initialLoading = resolvedAuthController.initialLoading;
-    const user = resolvedAuthController.user;
-
-    useEffect(() => {
-        if (initialLoading) return;
-
-        let cancelled = false;
-
-        (async () => {
-            try {
-                const [newViews, newAdminViews] = await Promise.all([
-                    resolveAppViews(viewsProp, resolvedAuthControllerRef.current, dataRef.current, pluginsRef.current),
-                    resolveAppViews(adminViewsProp, resolvedAuthControllerRef.current, dataRef.current)
-                ]);
-
-                // Compare views by slug identity rather than deepEqual.
-                // Views contain React elements (JSX) whose internal properties
-                // change on every render, making deepEqual unreliable.
-                if (!viewSlugsEqual(viewsRef.current, newViews)) {
-                    viewsRef.current = newViews;
-                    setResolvedViews(newViews);
-                }
 
-                if (!viewSlugsEqual(adminViewsRef.current, newAdminViews)) {
-                    adminViewsRef.current = newAdminViews;
-                    setResolvedAdminViews(newAdminViews);
-                }
-
-                setError(undefined);
-            } catch (e) {
-                if (!cancelled) {
-                    console.error("Error resolving views:", e);
-                    setError(e as Error);
-                }
-            } finally {
-                if (!cancelled) {
-                    setLoading(false);
-                }
-            }
-        })();
-
-        return () => {
-            cancelled = true;
-        };
-    }, [
-        viewsProp,
-        adminViewsProp,
-        refreshTrigger,
-        adminMode,
-        initialLoading,
-        user
-    ]);
+    const { data: resolvedData, loading, error, refresh } = useAsyncResolver<ResolvedViewsData>({
+        resolver: async () => {
+            const [newViews, newAdminViews] = await Promise.all([
+                resolveAppViews(viewsProp, resolvedAuthControllerRef.current, dataRef.current, pluginsRef.current),
+                resolveAppViews(adminViewsProp, resolvedAuthControllerRef.current, dataRef.current)
+            ]);
+            return { views: newViews, adminViews: newAdminViews };
+        },
+        initialValue: { views: undefined, adminViews: undefined },
+        isEqual: areResolvedViewsEqual,
+        deps: [viewsProp, adminViewsProp, adminMode, userIdentity],
+        disabled: initialLoading,
+    });
 
     return useMemo(() => ({
-        views: resolvedViews,
-        adminViews: resolvedAdminViews,
+        views: resolvedData.views,
+        adminViews: resolvedData.adminViews,
         loading,
         error,
         refresh
-    }), [resolvedViews, resolvedAdminViews, loading, error, refresh]);
+    }), [resolvedData, loading, error, refresh]);
 }
-

package/src/hooks/navigation/useTopLevelNavigation.ts

@@ -16,7 +16,7 @@ export type UseTopLevelNavigationProps = {
     viewsOrder?: string[];
     urlController: UrlController;
     adminMode?: "content" | "studio" | "settings";
-    collectionRegistryController: CollectionRegistryController<any> & { collectionRegistryRef: React.MutableRefObject<CollectionRegistry> };
+    collectionRegistryController: CollectionRegistryController & { collectionRegistryRef: React.MutableRefObject<CollectionRegistry> };
 };
 
 export type UseTopLevelNavigationResult = {
@@ -178,26 +178,30 @@ export function useTopLevelNavigation(
         ];
 
         const groupOrderValue = (groupName?: string): number => {
-            if (groupName === NAVIGATION_ADMIN_GROUP_NAME) return 1;
+            if (groupName === NAVIGATION_ADMIN_GROUP_NAME || groupName === "Settings" || groupName === "Admin") return 1;
             return 0;
         };
 
+        const usedViewsOrder = viewsOrder ?? navigationEntriesOrder;
         navigationEntries = navigationEntries.sort((a, b) => {
-            return groupOrderValue(a.group) - groupOrderValue(b.group);
-        });
+            // Primary: group priority (admin/settings last)
+            const groupDiff = groupOrderValue(a.group) - groupOrderValue(b.group);
+            if (groupDiff !== 0) return groupDiff;
 
-        const usedViewsOrder = viewsOrder ?? navigationEntriesOrder;
-        if (usedViewsOrder) {
-            navigationEntries = navigationEntries.sort((a, b) => {
+            // Secondary: explicit view order (if provided)
+            if (usedViewsOrder) {
                 const getSortPath = (navEntry: NavigationEntry) => typeof navEntry.slug === "string" ? navEntry.slug : navEntry.slug[0];
                 const aIndex = usedViewsOrder.indexOf(getSortPath(a));
                 const bIndex = usedViewsOrder.indexOf(getSortPath(b));
-                if (aIndex === -1 && bIndex === -1) return 0;
-                if (aIndex === -1) return 1;
-                if (bIndex === -1) return -1;
-                return aIndex - bIndex;
-            });
-        }
+                if (aIndex !== -1 || bIndex !== -1) {
+                    if (aIndex === -1) return 1;
+                    if (bIndex === -1) return -1;
+                    return aIndex - bIndex;
+                }
+            }
+
+            return 0;
+        });
 
         const collectedGroupsFromEntries = navigationEntries
             .map(e => e.group)
@@ -213,9 +217,9 @@ export function useTopLevelNavigation(
         ];
 
         const uniqueGroupsArray = [...new Set(allDefinedGroups)];
-        const adminGroups = uniqueGroupsArray.filter(g => g === NAVIGATION_ADMIN_GROUP_NAME);
-        const nonAdminGroups = uniqueGroupsArray.filter(g => g !== NAVIGATION_ADMIN_GROUP_NAME);
-        const uniqueGroups = [...nonAdminGroups, ...adminGroups] as string[];
+        const lastGroups = uniqueGroupsArray.filter(g => g === NAVIGATION_ADMIN_GROUP_NAME || g === "Settings" || g === "Admin");
+        const otherGroups = uniqueGroupsArray.filter(g => g !== NAVIGATION_ADMIN_GROUP_NAME && g !== "Settings" && g !== "Admin");
+        const uniqueGroups = [...otherGroups, ...lastGroups] as string[];
 
         const computedTopLevelNav = {
             allowDragAndDrop: plugins?.some((plugin: RebasePlugin) => plugin.hooks?.allowDragAndDrop) ?? false,

package/src/hooks/navigation/utils.ts

@@ -1,12 +1,12 @@
 import type { AppView, EntityCollection, RebasePlugin, NavigationGroupMapping } from "@rebasepro/types";
-;
+
 import { getSubcollections } from "@rebasepro/common";
 import { deepEqual as equal } from "fast-equals";
 
 export const NAVIGATION_DEFAULT_GROUP_NAME = "Views";
 export const NAVIGATION_ADMIN_GROUP_NAME = "Admin";
 
-export function getGroup(collectionOrView: EntityCollection<any, any> | AppView) {
+export function getGroup(collectionOrView: EntityCollection | AppView) {
     const trimmed = collectionOrView.group?.trim();
     if (!trimmed || trimmed === "") {
         return NAVIGATION_DEFAULT_GROUP_NAME;
@@ -28,8 +28,11 @@ export function computeNavigationGroups({
 
     // Deep clone the input groups upfront to avoid mutating the caller's data
     let result = navigationGroupMappings
-        ? navigationGroupMappings.map(g => ({ name: g.name,
-entries: [...g.entries] }))
+        ? navigationGroupMappings.map(g => ({
+            name: g.name,
+            entries: [...g.entries],
+            ...(g.collapsedByDefault !== undefined && { collapsedByDefault: g.collapsedByDefault })
+        }))
         : navigationGroupMappings;
 
     // Merge plugin navigation entries

package/src/index.ts

@@ -2,7 +2,7 @@
 export * from "./types";
 // Editor types only — the full ProseMirror editor (RichTextEditor) is a heavy import (~300 KB)
 // and is available as a separate entry point: @rebasepro/admin/editor
-export type { RichTextEditorProps, RichTextEditorTextSize, RebaseEditorProps, RebaseEditorTextSize, JSONContent, EditorAIController } from "./editor";
+export type { RichTextEditorProps, RichTextEditorTextSize, JSONContent, EditorAIController } from "./editor";
 export * from "./form";
 export * from "./preview";
 export * from "./routes";
@@ -92,6 +92,11 @@ export {
     getEntityTitlePropertyKey
 } from "./util";
 
+// Headless collection view adapters
+// Map entity types to the data-agnostic CollectionView from @rebasepro/ui
+export { mapPropertyToConfig, mapPropertiesToConfigs } from "./util/propertyConfigMapper";
+export { useCollectionDataController, createStaticDataController } from "./util/dataControllerAdapter";
+
 // Data import/export — merged from former standalone packages
 export * from "./data_import";
 export * from "./data_export";

package/src/preview/PropertyPreview.tsx

@@ -82,6 +82,7 @@ export const PropertyPreview = React.memo(function PropertyPreview<P extends Pro
                 content = <StorageThumbnail
                     interactive={interactive}
                     storeUrl={property.storage?.storeUrl ?? false}
+                    storageSourceKey={stringProperty.storage.storageSource}
                     size={props.size}
                     fill={fill}
                     storagePathOrDownloadUrl={filePath}/>;
@@ -107,22 +108,6 @@ export const PropertyPreview = React.memo(function PropertyPreview<P extends Pro
                     propertyKey={propertyKey}
                     size={props.size}
                 />;
-            } else if (stringProperty.reference) {
-                if (typeof stringProperty.reference.path === "string") {
-                    content = <ReferencePreview
-                        disabled={!stringProperty.reference.path}
-                        previewProperties={stringProperty.reference?.ui?.previewProperties}
-                        includeId={stringProperty.reference.includeId}
-                        includeEntityLink={stringProperty.reference.includeEntityLink}
-                        size={props.size}
-                        reference={new EntityReference({ id: value,
-path: stringProperty.reference.path })}
-                        textOnly={props.textOnly}
-                    />;
-                } else {
-                    content = <EmptyValue/>;
-                }
-
             } else {
                 content = <StringPropertyPreview {...props}
                     property={stringProperty}

package/src/preview/components/StorageThumbnail.tsx

@@ -2,7 +2,8 @@ import React, { useEffect } from "react";
 
 import { renderSkeletonImageThumbnail } from "../property_previews/SkeletonPropertyComponent";
 import { UrlComponentPreview } from "./UrlComponentPreview";
-import { ErrorView, useStorageSource } from "@rebasepro/core";
+import { ErrorView, useStorageSource, useStorageSources } from "@rebasepro/core";
+import { resolveStorageSource } from "@rebasepro/common";
 import { DownloadConfig, FileType } from "@rebasepro/types";
 import type { PreviewSize } from "../../types/components/PropertyPreviewProps";
 import { Skeleton } from "@rebasepro/ui";
@@ -12,6 +13,8 @@ type StorageThumbnailProps = {
     size: PreviewSize;
     interactive?: boolean;
     fill?: boolean;
+    /** Key of the storage source backing this property (`StorageConfig.storageSource`). */
+    storageSourceKey?: string;
 };
 
 /**
@@ -24,7 +27,8 @@ function areEqual(prevProps: StorageThumbnailProps, nextProps: StorageThumbnailP
         prevProps.storagePathOrDownloadUrl === nextProps.storagePathOrDownloadUrl &&
         prevProps.storeUrl === nextProps.storeUrl &&
         prevProps.interactive === nextProps.interactive &&
-        prevProps.fill === nextProps.fill;
+        prevProps.fill === nextProps.fill &&
+        prevProps.storageSourceKey === nextProps.storageSourceKey;
 }
 
 const URL_CACHE: Record<string, DownloadConfig> = {};
@@ -34,13 +38,26 @@ export function StorageThumbnailInternal({
     interactive,
     storagePathOrDownloadUrl,
     size,
-    fill
+    fill,
+    storageSourceKey
 }: StorageThumbnailProps) {
 
     const [error, setError] = React.useState<Error | undefined>(undefined);
-    const storage = useStorageSource();
+    const defaultStorage = useStorageSource();
+    const storageSources = useStorageSources();
+    // Resolve the per-property backend so previews of `storeUrl: false`
+    // properties pointing at a named source hit the right backend.
+    const storage = resolveStorageSource({
+        sourceKey: storageSourceKey,
+        sources: storageSources.sources,
+        defaultSource: defaultStorage
+    });
 
-    const [downloadConfig, setDownloadConfig] = React.useState<DownloadConfig>(URL_CACHE[storagePathOrDownloadUrl]);
+    // Cache key is namespaced by source so the same path on two backends
+    // does not collide.
+    const cacheKey = `${storageSourceKey ?? ""}::${storagePathOrDownloadUrl}`;
+
+    const [downloadConfig, setDownloadConfig] = React.useState<DownloadConfig>(URL_CACHE[cacheKey]);
 
     useEffect(() => {
         if (!storagePathOrDownloadUrl)
@@ -50,13 +67,13 @@ export function StorageThumbnailInternal({
             .then(function (downloadConfig) {
                 if (!unmounted) {
                     setDownloadConfig(downloadConfig);
-                    URL_CACHE[storagePathOrDownloadUrl] = downloadConfig;
+                    URL_CACHE[cacheKey] = downloadConfig;
                 }
             }).catch(setError);
         return () => {
             unmounted = true;
         };
-    }, [storagePathOrDownloadUrl]);
+    }, [storagePathOrDownloadUrl, cacheKey]);
 
     if (!storagePathOrDownloadUrl) return null;
 

package/src/routes/CustomViewRoute.tsx

@@ -1,8 +1,6 @@
+import React, { useEffect, useRef } from "react";
 import type { AppView } from "@rebasepro/types";
-;
-import { useEffect } from "react";
-import { useBreadcrumbsController } from "../index";
-import { useUrlController } from "../index";
+import { useBreadcrumbsController, useUrlController } from "../index";
 
 export function CustomViewRoute({ view }: {
     view: AppView
@@ -11,8 +9,14 @@ export function CustomViewRoute({ view }: {
     const breadcrumbs = useBreadcrumbsController();
     const urlController = useUrlController();
 
+    // Use a ref to avoid breadcrumbs identity in the dep array —
+    // breadcrumbs.set() creates a new context value each call, which would
+    // re-trigger this effect and cause an infinite render loop.
+    const breadcrumbsRef = useRef(breadcrumbs);
+    breadcrumbsRef.current = breadcrumbs;
+
     useEffect(() => {
-        breadcrumbs.set({
+        breadcrumbsRef.current.set({
             breadcrumbs: [{
                 title: view.name,
                 url: urlController.buildAppUrlPath(view.slug)
@@ -20,5 +24,9 @@ export function CustomViewRoute({ view }: {
         });
     }, [view.slug, urlController]);
 
-    return view.view;
+    if (typeof view.view === 'function') {
+        const ViewComponent = view.view;
+        return <ViewComponent />;
+    }
+    return <>{view.view}</>;
 }

package/src/types/components/EntityFormActionsProps.tsx

@@ -13,7 +13,7 @@ export interface EntityFormActionsProps {
     disabled: boolean;
     status: "new" | "existing" | "copy";
     pluginActions: React.ReactNode[];
-    openEntityMode: "side_panel" | "full_screen" | "split" | "dialog";
+    openEntityMode?: "side_panel" | "full_screen" | "split" | "dialog";
     showDefaultActions?: boolean;
     navigateBack: () => void;
     formContext: FormContext

package/src/types/components/EntityFormProps.tsx

@@ -4,6 +4,11 @@ import { FormContext } from "../fields";
 import { FormexController } from "./formex";
 import { EntityFormActionsProps } from "./EntityFormActionsProps";
 
+/**
+ * Props for the headless EntityForm component.
+ * This form can be used without CMS context — all backend concerns
+ * (save, caching, analytics, plugin slots) are provided via callbacks.
+ */
 export type EntityFormProps<M extends Record<string, unknown>> = {
     path: string;
     fullIdPath?: string;
@@ -44,6 +49,69 @@ export type EntityFormProps<M extends Record<string, unknown>> = {
     Builder?: React.ComponentType<EntityCustomViewParams<M>>;
 
     children?: React.ReactNode;
+
+    // --- Headless callbacks (replace internal CMS hooks) ---
+
+    /**
+     * Called on form submit with the values to save.
+     * The EntityFormBinding wrapper provides this automatically.
+     * When using EntityForm standalone, provide your own save logic.
+     */
+    onSubmit?: (values: M, formex: FormexController<M>) => Promise<Entity<M> | void> | void;
+
+    /**
+     * Called when form values change (deferred).
+     * The EntityFormBinding wrapper uses this for entity caching.
+     */
+    onValuesChangeDeferred?: (values: M, controller: FormexController<M>) => void;
+
+    /**
+     * Called when the form is reset.
+     */
+    onReset?: () => void;
+
+    /**
+     * Validate that a field value is unique.
+     * The EntityFormBinding wrapper provides this via the data layer.
+     */
+    uniqueFieldValidator?: (params: { name: string; value: unknown }) => Promise<boolean>;
+
+    // --- Slots (replace useSlot) ---
+
+    /** Content rendered before the form fields */
+    beforeFields?: React.ReactNode;
+    /** Content rendered after the form fields */
+    afterFields?: React.ReactNode;
+    /** Plugin-provided action elements */
+    pluginActions?: React.ReactNode[];
+
+    // --- Local changes (managed externally in binding) ---
+
+    /**
+     * Initial values for the form, after applying local changes.
+     * If not provided, computed from entity + collection defaults.
+     */
+    computedInitialValues?: Partial<M>;
+    /**
+     * Whether there are unsaved local changes in the cache.
+     */
+    hasLocalChanges?: boolean;
+    /**
+     * The local changes data for the manual-apply menu.
+     */
+    localChangesData?: Partial<M>;
+    /**
+     * Whether manual-apply local changes mode is enabled.
+     */
+    manualApplyLocalChanges?: boolean;
+    /**
+     * Cache key for the local changes menu.
+     */
+    localChangesCacheKey?: string;
+    /**
+     * Callback when local changes are cleared.
+     */
+    onClearLocalChanges?: () => void;
 };
 
 export type OnUpdateParams = {

package/src/types/components/PropertyPreviewProps.tsx

@@ -15,7 +15,7 @@ export interface PropertyPreviewProps<P extends Property | Property, CustomProps
      */
     propertyKey?: string;
 
-    value: any;
+    value: InferPropertyType<P> | any;
 
     /**
      * Property this display is related to, now strongly typed to P