@rebasepro/admin 0.4.0 → 0.5.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rebasepro/admin",
   "type": "module",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Rebase CMS — content management views, forms, and routing",
   "funding": {
     "url": "https://github.com/sponsors/rebaseco"
@@ -80,17 +80,16 @@
     "prosemirror-tables": "^1.8.5",
     "prosemirror-transform": "^1.12.0",
     "prosemirror-view": "^1.41.8",
-    "react-compiler-runtime": "1.0.0",
+    "zod": "^3.25.76",
     "react-dropzone": "^14.4.1",
     "react-use-measure": "^2.1.7",
-    "zod": "^3.25.76",
-    "@rebasepro/core": "0.4.0",
-    "@rebasepro/common": "0.4.0",
-    "@rebasepro/formex": "0.4.0",
-    "@rebasepro/schema-inference": "0.4.0",
-    "@rebasepro/types": "0.4.0",
-    "@rebasepro/utils": "0.4.0",
-    "@rebasepro/ui": "0.4.0"
+    "@rebasepro/common": "0.5.0",
+    "@rebasepro/formex": "0.5.0",
+    "@rebasepro/core": "0.5.0",
+    "@rebasepro/schema-inference": "0.5.0",
+    "@rebasepro/utils": "0.5.0",
+    "@rebasepro/types": "0.5.0",
+    "@rebasepro/ui": "0.5.0"
   },
   "peerDependencies": {
     "react": ">=19.0.0",

package/src/collection_editor/ui/collection_editor/CollectionRelationsTab.tsx

@@ -85,7 +85,7 @@ export function CollectionRelationsTab() {
                     <Button variant="filled" color="neutral" onClick={() => {
                         setEditingRelationIndex(-1);
                         setEditingRelationState({ relationName: "",
-target: "" as unknown as Relation["target"],
+target: "",
 cardinality: "many",
 direction: "owning" });
                     }}>
@@ -134,7 +134,7 @@ direction: "owning" });
                         <Button variant="text" onClick={() => {
                             setEditingRelationIndex(-1);
                             setEditingRelationState({ relationName: "",
-target: "" as unknown as Relation["target"],
+target: "",
 cardinality: "many",
 direction: "owning" });
                         }}>Create your first relation</Button>

package/src/collection_editor/ui/collection_editor/PropertyEditView.tsx

@@ -50,7 +50,8 @@ import { MarkdownPropertyField } from "./properties/MarkdownPropertyField";
 import { isValidRegExp, mergeDeep } from "@rebasepro/utils";
 
 export type PropertyWithId = Property & {
-    id?: string
+    id?: string;
+    conditions?: import('@rebasepro/types').PropertyConditions;
 };
 
 export type OnPropertyChangedParams = {

package/src/collection_editor/ui/collection_editor/PropertyFieldPreview.tsx

@@ -76,7 +76,7 @@ export function PropertyFieldPreview({
 
             <ErrorBoundary>
                 <Typography variant="caption" component="span" className="ml-auto shrink-0 text-text-disabled dark:text-text-disabled-dark font-mono bg-surface-100 dark:bg-surface-900 px-1.5 py-0.5 rounded mr-8">
-                    {("columnType" in property ? (property as Property & { columnType?: string }).columnType : undefined) || property.type}
+                    {"columnType" in property ? (property as { columnType?: string }).columnType ?? property.type : property.type}
                 </Typography>
             </ErrorBoundary>
 
@@ -146,7 +146,7 @@ export function NonEditablePropertyPreview({
 
             {property && !isPropertyBuilder(property) && <ErrorBoundary>
                 <Typography variant="caption" component="span" className="ml-auto shrink-0 text-text-disabled dark:text-text-disabled-dark font-mono bg-surface-100 dark:bg-surface-900 px-1.5 py-0.5 rounded mr-8">
-                    {("columnType" in property ? (property as Property & { columnType?: string }).columnType : undefined) || property.type}
+                    {"columnType" in property ? (property as { columnType?: string }).columnType ?? property.type : property.type}
                 </Typography>
             </ErrorBoundary>}
         </Paper>

package/src/collection_editor/ui/collection_editor/properties/conditions/ConditionsEditor.tsx

@@ -18,6 +18,7 @@ import {
 } from "@rebasepro/ui";
 import { getFieldConfig, DEFAULT_FIELD_CONFIGS } from "../../../../_cms_internals";
 import { Properties, Property, EnumValueConfig } from "@rebasepro/types";
+import type { PropertyConditions } from "@rebasepro/types";
 import { isPropertyBuilder } from "@rebasepro/common";
 import { PropertyWithId } from "../../PropertyEditView";
 import { getPropertyPaths } from "./property_paths";
@@ -817,7 +818,7 @@ export function ConditionsEditor({ disabled, collectionProperties }: ConditionsE
         : [];
 
     // Get current conditions from form values
-    const conditions: Record<string, unknown> = (values as PropertyWithId & { conditions?: Record<string, unknown> }).conditions ?? {};
+    const conditions: PropertyConditions = values.conditions ?? {};
 
     const activeConditions: { type: ConditionType; group: ConditionGroup }[] = [];
 

package/src/collection_editor/ui/collection_editor/properties/conditions/EnumConditionsEditor.tsx

@@ -528,7 +528,7 @@ export function EnumConditionsEditor({ disabled, collectionProperties }: EnumCon
     const allEnumIds = propertyEnumValues.map(ev => String(ev.id));
 
     // Get conditions from the correct path: values.conditions
-    const conditions = (values as PropertyWithId & { conditions?: Record<string, unknown> }).conditions ?? {};
+    const conditions = values.conditions ?? {};
 
     // Parse existing enum conditions
     const activeConditions: { type: EnumConditionType; config: EnumConditionConfig }[] = [];

package/src/collection_editor/ui/collection_editor/templates/blog_template.ts

@@ -1,4 +1,4 @@
-import { EntityCollection } from "@rebasepro/types";
+import type { EntityCollection } from "@rebasepro/types";
 
 export const blogCollectionTemplate = {
     slug: "blog",

package/src/collection_editor/ui/collection_editor/templates/pages_template.ts

@@ -1,4 +1,4 @@
-import { EntityCollection } from "@rebasepro/types";
+import type { EntityCollection } from "@rebasepro/types";
 
 export const pagesCollectionTemplate = {
     slug: "pages",

package/src/collection_editor/ui/collection_editor/templates/products_template.ts

@@ -1,4 +1,4 @@
-import { EntityCollection } from "@rebasepro/types";
+import type { EntityCollection } from "@rebasepro/types";
 
 export const productsCollectionTemplate = {
     slug: "products",

package/src/collection_editor/ui/collection_editor/templates/users_template.ts

@@ -1,4 +1,4 @@
-import { EntityCollection } from "@rebasepro/types";
+import type { EntityCollection } from "@rebasepro/types";
 
 export const usersCollectionTemplate = {
     slug: "users",

package/src/components/EntityCollectionTable/internal/popup_field/useDraggable.tsx

@@ -1,5 +1,8 @@
 import React, { useCallback, useEffect } from "react";
 
+/** Tracks events originating inside the inner (non-draggable) area. */
+const innerClicked = new WeakSet<MouseEvent>();
+
 interface DraggableProps {
     containerRef: React.RefObject<HTMLDivElement | null>,
     innerRef: React.RefObject<HTMLDivElement | null>,
@@ -22,7 +25,7 @@ export function useDraggable({
     const listeningRef = React.useRef(false);
 
     const onMouseDown = useCallback((event: MouseEvent) => {
-        if (event.button !== 0 || !containerRef.current || event.defaultPrevented || (event as MouseEvent & { innerClicked?: boolean }).innerClicked) {
+        if (event.button !== 0 || !containerRef.current || event.defaultPrevented || innerClicked.has(event)) {
             return;
         }
 
@@ -41,7 +44,7 @@ export function useDraggable({
     }, [containerRef, onMove]);
 
     const onMouseDownInner = useCallback((event: MouseEvent) => {
-        (event as MouseEvent & { innerClicked?: boolean }).innerClicked = true;
+        innerClicked.add(event);
     }, [])
 
     const onSelect = useCallback((event: Event) => {

package/src/components/EntityCollectionView/useEntityPreviewSlots.ts

@@ -451,9 +451,8 @@ function resolveRelationDisplayName(
 
             // Helper to check if a property is hidden/internal
             const isHiddenProp = (p: Property): boolean => {
-                const ui = (p as any).ui;
-                if (ui?.hideFromCollection) return true;
-                if (ui?.disabled?.hidden) return true;
+                if (p.ui?.hideFromCollection) return true;
+                if (typeof p.ui?.disabled === "object" && p.ui.disabled.hidden) return true;
                 return false;
             };
 
@@ -502,7 +501,7 @@ function resolveRelationDisplayName(
     // 2. Try the entity cache (sessionStorage) as a fallback
     if (id !== undefined && targetCollection) {
         try {
-            const slug = targetCollection.slug ?? (targetCollection as any).table;
+            const slug = targetCollection.slug ?? ("table" in targetCollection ? targetCollection.table : undefined);
             if (slug) {
                 const cacheKey = `${slug}/${id}`;
                 const cached = getEntityFromCache(cacheKey) as { values?: Record<string, unknown> } | undefined;

package/src/components/EntityDetailView.tsx

@@ -152,27 +152,23 @@ function EntityDetailViewInner<M extends Record<string, unknown>>({
         { status: "existing", entityId }
     ), [collection, entityId]);
 
-    // Track whether we've applied the defaultSelectedView already.
-    // See EntityEditView for a full explanation of this pattern.
-    const hasAppliedDefault = useRef(false);
+    // Track whether the user has explicitly clicked a tab in this component
+    // instance. See EntityEditViewInner for full explanation.
+    const userHasChangedTab = useRef(false);
 
     const [selectedTab, setSelectedTab] = useState<string>(() => {
         const val = selectedTabProp ?? defaultSelectedView ?? MAIN_TAB_VALUE;
-        hasAppliedDefault.current = true;
         return val === "edit" ? MAIN_TAB_VALUE : val;
     });
     useEffect(() => {
-        const val = hasAppliedDefault.current
+        const val = userHasChangedTab.current
             ? (selectedTabProp ?? MAIN_TAB_VALUE)
             : (selectedTabProp ?? defaultSelectedView ?? MAIN_TAB_VALUE);
         const target = val === "edit" ? MAIN_TAB_VALUE : val;
-        if (!hasAppliedDefault.current) {
-            hasAppliedDefault.current = true;
-        }
         if (target !== selectedTab) {
             setSelectedTab(target);
         }
-    }, [selectedTabProp]);
+    }, [selectedTabProp, defaultSelectedView]);
 
     const subcollections = getSubcollections(collection).filter(c => !c.hideFromNavigation);
     const subcollectionsCount = subcollections?.length ?? 0;
@@ -347,6 +343,7 @@ function EntityDetailViewInner<M extends Record<string, unknown>>({
     }).filter(Boolean);
 
     const onSideTabClick = useCallback((value: string) => {
+        userHasChangedTab.current = true;
         setSelectedTab(value);
         onTabChange?.({
             path,

package/src/components/EntityEditView.tsx

@@ -224,33 +224,26 @@ export function EntityEditViewInner<M extends Record<string, unknown>>({
         }
     ), [collection, status, entityId]);
 
-    // Track whether we've applied the defaultSelectedView already.
-    // On the initial render, selectedTabProp may be undefined because the URL
-    // has no tab segment — in that case we fall back to defaultSelectedView.
-    // But once the component is mounted, selectedTabProp=undefined means the
-    // user explicitly selected the form tab (which has no URL segment), so we
-    // must NOT re-apply defaultSelectedView.
-    const hasAppliedDefault = useRef(false);
+    // Track whether the user has explicitly clicked a tab in this component
+    // instance. When false, we fall back to defaultSelectedView (which may
+    // resolve asynchronously if the collection loads from the registry after
+    // mount). Once true, selectedTabProp=undefined means the user selected
+    // the form tab, so we must NOT re-apply defaultSelectedView.
+    const userHasChangedTab = useRef(false);
 
     const [selectedTab, setSelectedTab] = useState<string>(() => {
         const val = selectedTabProp ?? defaultSelectedView ?? MAIN_TAB_VALUE;
-        hasAppliedDefault.current = true;
         return val === "edit" ? MAIN_TAB_VALUE : val;
     });
     useEffect(() => {
-        // After initial mount, only sync from selectedTabProp — don't fall
-        // back to defaultSelectedView, because undefined now means "form tab".
-        const val = hasAppliedDefault.current
+        const val = userHasChangedTab.current
             ? (selectedTabProp ?? MAIN_TAB_VALUE)
             : (selectedTabProp ?? defaultSelectedView ?? MAIN_TAB_VALUE);
         const target = val === "edit" ? MAIN_TAB_VALUE : val;
-        if (!hasAppliedDefault.current) {
-            hasAppliedDefault.current = true;
-        }
         if (target !== selectedTab) {
             setSelectedTab(target);
         }
-    }, [selectedTabProp]);
+    }, [selectedTabProp, defaultSelectedView]);
 
     const subcollections = getSubcollections(collection).filter(c => !c.hideFromNavigation);
     const subcollectionsCount = subcollections?.length ?? 0;
@@ -420,6 +413,7 @@ export function EntityEditViewInner<M extends Record<string, unknown>>({
     }).filter(Boolean);
 
     const onSideTabClick = useCallback((value: string) => {
+        userHasChangedTab.current = true;
         setSelectedTab(value);
         if (status === "existing") {
             onTabChange?.({

package/src/components/EntitySidePanel.tsx

@@ -102,6 +102,9 @@ export function EntitySidePanel(props: EntitySidePanelProps) {
     // editor / Studio and is not available on the collection object the
     // caller passed to sideEntityController.open().
     const hasCorrectedDefaultView = useRef(false);
+    useEffect(() => {
+        hasCorrectedDefaultView.current = false;
+    }, [entityId]);
     useEffect(() => {
         if (hasCorrectedDefaultView.current) return;
         if (selectedTab) return; // Already has a tab — no correction needed

package/src/form/PropertyFieldBinding.tsx

@@ -219,7 +219,7 @@ function FieldInternal<CustomProps, M extends Record<string, unknown>>
         collection: context.collection,
         propertyKey: propertyKey,
         property: property,
-        Component: Component as any, // Cast component here since it is a generic component type
+        Component: Component as ComponentType<FieldProps<Property, unknown, M>>,
         plugins: plugins
     });
     const UsedComponent: ComponentType<FieldProps<Property, any, any>> = WrappedComponent ?? Component;

package/src/form/field_bindings/KeyValueFieldBinding.tsx

@@ -348,7 +348,7 @@ function MapKeyValueRow<T extends Record<string, unknown>>({
                                         value={arrayValue[index]}
                                         disabled={disabled || !fieldKey}
                                         setValue={(newValue) => {
-                                            const newArrayValue = [...arrayValue] as any[];
+                                            const newArrayValue = [...arrayValue] as unknown[];
                                             newArrayValue[index] = newValue;
                                             setValue({
                                                 ...value,

package/src/form/field_bindings/MapFieldBinding.tsx

@@ -1,4 +1,3 @@
-import type { Properties } from "@rebasepro/types";
 import type { FieldProps, PropertyFieldBindingProps } from "../../types/fields";
 import type { MapProperty } from "@rebasepro/types";
 import React from "react";
@@ -10,8 +9,7 @@ import { getIconForProperty } from "../../util/property_utils";
 import { isHidden, isReadOnly } from "@rebasepro/common";
 import { FieldHelperText, LabelWithIconAndTooltip } from "../components";
 import { PropertyFieldBinding } from "../PropertyFieldBinding";
-import { cls, ExpandablePanel, InputLabel, Select, SelectItem } from "@rebasepro/ui";
-import { pick } from "@rebasepro/utils";
+import { cls, ExpandablePanel } from "@rebasepro/ui";
 
 /**
  * Field that renders the children property fields
@@ -35,7 +33,6 @@ export function MapFieldBinding({
     onPropertyChange
 }: FieldProps<MapProperty>) {
 
-    const pickOnlySomeKeys = property.pickOnlySomeKeys || false;
     const expanded = property.ui?.expanded === undefined ? true : property.ui?.expanded;
     const minimalistView = minimalistViewProp || property.ui?.minimalistView;
     const { t } = useTranslation();
@@ -44,19 +41,7 @@ export function MapFieldBinding({
         throw Error(`You need to specify a 'properties' prop (or specify a custom field) in your map property ${propertyKey}`);
     }
 
-    let mapProperties: Properties;
-    if (pickOnlySomeKeys) {
-        if (value) {
-            mapProperties = pick(property.properties,
-                ...Object.keys(value)
-                    .filter(key => key in property.properties!)
-            ) as Properties;
-        } else {
-            mapProperties = {};
-        }
-    } else {
-        mapProperties = property.properties;
-    }
+    const mapProperties = property.properties;
 
     const mapFormView = <>
         <div
@@ -96,7 +81,7 @@ export function MapFieldBinding({
             }
         </div>
 
-        {/*{pickOnlySomeKeys && buildPickKeysSelect(disabled, property.properties, setValue, value)}*/}
+
 
     </>
         ;
@@ -133,30 +118,3 @@ export function MapFieldBinding({
     );
 }
 
-const buildPickKeysSelect = (disabled: boolean, properties: Properties, setValue: (value: Record<string, unknown> | null) => void, value: Record<string, unknown> | undefined) => {
-
-    const keys = Object.keys(properties)
-        .filter((key) => !value || !(key in value));
-
-    const handleAddProperty = (updatedValue: string | string[]) => {
-        setValue({
-            ...value,
-            [updatedValue as string]: null
-        });
-    };
-
-    if (!keys.length) return <></>;
-
-    return <div className={"m-4"}>
-        <InputLabel>Add property</InputLabel>
-        <Select
-            value={""}
-            fullWidth={true}
-            disabled={disabled}
-            onValueChange={handleAddProperty}
-            renderValue={(key) => (properties as Properties)[key].name || key}>
-            {keys.map((key) => <SelectItem key={key}
-                value={key}>{(properties as Properties)[key].name || key}</SelectItem>)}
-        </Select>
-    </div>;
-};