@object-ui/fields 4.0.5 → 4.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@object-ui/fields",
-  "version": "4.0.5",
+  "version": "4.0.7",
   "description": "Field renderers and registry for Object UI",
   "license": "MIT",
   "type": "module",
@@ -27,12 +27,12 @@
     "clsx": "^2.1.1",
     "lucide-react": "^1.14.0",
     "tailwind-merge": "^3.5.0",
-    "@object-ui/components": "4.0.5",
-    "@object-ui/core": "4.0.5",
-    "@object-ui/i18n": "4.0.5",
-    "@object-ui/providers": "4.0.5",
-    "@object-ui/react": "4.0.5",
-    "@object-ui/types": "4.0.5"
+    "@object-ui/components": "4.0.7",
+    "@object-ui/core": "4.0.7",
+    "@object-ui/i18n": "4.0.7",
+    "@object-ui/providers": "4.0.7",
+    "@object-ui/react": "4.0.7",
+    "@object-ui/types": "4.0.7"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",

package/src/index.tsx

@@ -290,7 +290,7 @@ export function PercentCellRenderer({ value, field }: CellRendererProps): React.
   return (
     <div className="flex items-center gap-2">
       <div
-        className="h-1.5 w-16 rounded-full bg-muted overflow-hidden flex-shrink-0"
+        className="h-1.5 w-16 rounded-full bg-muted overflow-hidden shrink-0"
         role="progressbar"
         aria-valuenow={clampedBar}
         aria-valuemin={0}
@@ -1217,7 +1217,11 @@ const fieldWidgetMap: Record<string, () => Promise<{ default: React.ComponentTyp
   'markdown': () => import('./widgets/RichTextField').then(m => ({ default: m.RichTextField })),
   'html': () => import('./widgets/RichTextField').then(m => ({ default: m.RichTextField })),
   'lookup': () => import('./widgets/LookupField').then(m => ({ default: m.LookupField })),
-  'master_detail': () => import('./widgets/MasterDetailField').then(m => ({ default: m.MasterDetailField })),
+  // master_detail represents the child-side FK to its parent. In create/edit forms it
+  // must render as a single-value lookup picker (it is typically NOT NULL). The legacy
+  // MasterDetailField widget modelled this as a one-to-many list, which is incorrect
+  // for the child-side and prevented users from filling the required parent reference.
+  'master_detail': () => import('./widgets/LookupField').then(m => ({ default: m.LookupField })),
   
   // File fields
   'file': () => import('./widgets/FileField').then(m => ({ default: m.FileField })),
@@ -1317,7 +1321,9 @@ export function registerFields() {
   ComponentRegistry.register('markdown', createFieldRenderer(RichTextField), { namespace: 'field' });
   ComponentRegistry.register('html', createFieldRenderer(RichTextField), { namespace: 'field' });
   ComponentRegistry.register('lookup', createFieldRenderer(LookupField), { namespace: 'field' });
-  ComponentRegistry.register('master_detail', createFieldRenderer(MasterDetailField), { namespace: 'field' });
+  // master_detail = child-side FK lookup (single value, typically required). See
+  // fieldWidgetMap above for rationale.
+  ComponentRegistry.register('master_detail', createFieldRenderer(LookupField), { namespace: 'field' });
   
   // File fields
   ComponentRegistry.register('file', createFieldRenderer(FileField), { namespace: 'field' });

package/src/widgets/FileField.tsx

@@ -266,11 +266,11 @@ export function FileField({ value, onChange, field, readonly, ...props }: FieldW
               >
                 <div className="flex items-center gap-2 flex-1 min-w-0">
                   {isImage(file) && file.url ? (
-                    <img src={file.url} alt={file.name} className="size-8 object-cover rounded flex-shrink-0" />
+                    <img src={file.url} alt={file.name} className="size-8 object-cover rounded shrink-0" />
                   ) : isImage(file) ? (
-                    <ImageIcon className="size-4 text-muted-foreground flex-shrink-0" />
+                    <ImageIcon className="size-4 text-muted-foreground shrink-0" />
                   ) : (
-                    <FileIcon className="size-4 text-muted-foreground flex-shrink-0" />
+                    <FileIcon className="size-4 text-muted-foreground shrink-0" />
                   )}
                   <span className="text-sm truncate">
                     {file.name || file.original_name || 'File'}