@object-ui/fields 17.1.0 → 17.2.0

package/src/widgets/ColorField.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { Input, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * Color field widget - provides a color picker input
  * Supports hex color values (e.g., #ff0000)
  */
-export function ColorField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<string>) {
+export function ColorField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<string>) {
   const colorField = (field || (props as any).schema) as any;
 
   if (readonly) {

package/src/widgets/CurrencyField.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Input, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import { useLocalization } from '@object-ui/i18n';
 import { resolveFieldCurrency } from '../currency';
 
@@ -36,7 +36,7 @@ const CURRENCY_SYMBOLS: Record<string, string> = {
   USD: '$',
 };
 
-export function CurrencyField({ value, onChange, field, readonly, errorMessage, className, ...props }: FieldWidgetProps<number>) {
+export function CurrencyField({ value, onChange, field, readonly, errorMessage, className, ...props }: FieldWidgetComponentProps<number>) {
   const currencyField = (field || (props as any).schema) as any;
   // Shared precedence: field currency → currencyConfig → tenant default (ADR-0053).
   const { currency: tenantCurrency } = useLocalization();

package/src/widgets/DateField.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import { Input, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import { openNativePicker } from './openNativePicker';
 
 /**
  * DateField - Date picker input widget
  * Uses native date input and displays locale-formatted date in readonly mode
  */
-export function DateField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<string>) {
+export function DateField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<string>) {
   if (readonly) {
     return value ? <span className="text-sm">{new Date(value).toLocaleDateString()}</span> : <EmptyValue />;
   }

package/src/widgets/DateTimeField.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import { Input, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import { openNativePicker } from './openNativePicker';
 
 /**
  * DateTimeField - Combined date and time picker widget
  * Displays both date and time in locale format when readonly
  */
-export function DateTimeField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<string>) {
+export function DateTimeField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<string>) {
   if (readonly) {
     if (!value) return <EmptyValue />;
     const date = new Date(value);

package/src/widgets/EmailField.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { Input, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * EmailField - Email address input with mailto link in readonly mode
  * Renders as a clickable mailto link when readonly, standard email input otherwise
  */
-export function EmailField({ value, onChange, field, readonly, errorMessage, ...props }: FieldWidgetProps<string>) {
+export function EmailField({ value, onChange, field, readonly, errorMessage, ...props }: FieldWidgetComponentProps<string>) {
   const config = field || (props as any).schema;
   if (readonly) {
     if (!value) return <EmptyValue />;

package/src/widgets/FileField.tsx

@@ -3,7 +3,7 @@ import { Button, EmptyValue } from '@object-ui/components';
 import { useUpload } from '@object-ui/providers';
 import { useObjectTranslation } from '@object-ui/i18n';
 import { Upload, X, File as FileIcon, ImageIcon, Camera, Loader2 } from 'lucide-react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import { useUploadingSignal } from './useUploadingSignal';
 import {
   fileValueForSubmit,
@@ -115,7 +115,7 @@ function useFileUploads(opts: {
  * Supports single and multiple file uploads with configurable accepted file types.
  * L2: File size validation, per-file progress indicators, error messages.
  */
-export function FileField({ value, onChange, field, readonly, onUploadingChange, ...props }: FieldWidgetProps<any>) {
+export function FileField({ value, onChange, field, readonly, onUploadingChange, ...props }: FieldWidgetComponentProps<any>) {
   const { t } = useObjectTranslation();
   const inputRef = useRef<HTMLInputElement>(null);
   const cameraRef = useRef<HTMLInputElement>(null);

package/src/widgets/FilterConditionField.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { FilterBuilder, cn } from '@object-ui/components';
 import { SchemaRendererContext } from '@object-ui/react';
-import type { FieldWidgetProps } from './types';
+import type { FieldWidgetComponentProps } from './types';
 import { useFieldTranslation } from './useFieldTranslation';
 
 /**
@@ -298,10 +298,10 @@ export function FilterConditionField({
   readonly,
   className,
   ...props
-}: FieldWidgetProps<string | object>) {
+}: FieldWidgetComponentProps<string | object>) {
   const ctx = React.useContext(SchemaRendererContext);
   const { t } = useFieldTranslation();
-  const dataSource: any = (props as any).dataSource ?? (ctx as any)?.dataSource ?? null;
+  const dataSource: any = props.dataSource ?? (ctx as any)?.dataSource ?? null;
   const dependentValues: Record<string, any> = (props as any).dependentValues ?? {};
   const objectName = String(dependentValues.object_name ?? '');
 

package/src/widgets/FormulaField.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * FormulaField - Read-only computed field
  * Values are computed on the backend and cannot be edited
  */
-export function FormulaField({ value, field, ...props }: FieldWidgetProps<any>) {
+export function FormulaField({ value, field, ...props }: FieldWidgetComponentProps<any>) {
   const formulaField = (field || (props as any).schema) as any;
   const returnType = formulaField?.return_type || 'text';
 

package/src/widgets/GeolocationField.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Input, Button, Label, EmptyValue } from '@object-ui/components';
 import { MapPin, Crosshair } from 'lucide-react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * Geolocation data structure
@@ -16,7 +16,7 @@ export interface GeolocationValue {
  * Geolocation field widget - provides a location picker with coordinates
  * Supports manual entry and browser geolocation API
  */
-export function GeolocationField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<GeolocationValue>) {
+export function GeolocationField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<GeolocationValue>) {
   const [isLoading, setIsLoading] = React.useState(false);
   const location = value || {};
 

package/src/widgets/GridField.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useRef } from 'react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import {
   cn,
   Button,
@@ -306,7 +306,7 @@ export function GridField({
   displayMode,
   onAdd,
   ...props
-}: FieldWidgetProps<Row[]> & {
+}: FieldWidgetComponentProps<Row[]> & {
   /** When provided, each row shows an "expand" button that opens the row in a
    *  full form (the host — e.g. MasterDetailForm — renders the drawer/modal and
    *  writes the edited values back). Lets a "fat" child be edited in a real form
@@ -327,7 +327,7 @@ export function GridField({
   const cfg = (field || (props as any).schema || {}) as any;
   const allColumns: GridColumn[] = cfg.columns || [];
   const rows: Row[] = Array.isArray(value) ? value : [];
-  const contextRecord = (props as any).contextRecord as Record<string, unknown> | undefined;
+  const contextRecord = props.contextRecord;
 
   // Per-cell CEL rule state (B2 in grids). A column with no readonlyWhen/
   // requiredWhen resolves to its static flags (cheap fast-path — no engine

package/src/widgets/ImageField.tsx

@@ -3,7 +3,7 @@ import { Button, EmptyValue } from '@object-ui/components';
 import { useUpload } from '@object-ui/providers';
 import { useObjectTranslation } from '@object-ui/i18n';
 import { X, Image as ImageIcon, Crop as CropIcon, Loader2 } from 'lucide-react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import { ImageLightbox } from './ImageLightbox';
 import { useUploadingSignal } from './useUploadingSignal';
 import {
@@ -24,7 +24,7 @@ const ImageCropperDialog = lazy(() =>
  * ImageField - Image upload widget with preview thumbnails
  * Supports single and multiple image uploads with drag-and-drop and preview display
  */
-export function ImageField({ value, onChange, field, readonly, onUploadingChange, ...props }: FieldWidgetProps<any>) {
+export function ImageField({ value, onChange, field, readonly, onUploadingChange, ...props }: FieldWidgetComponentProps<any>) {
   const inputRef = useRef<HTMLInputElement>(null);
   const imageField = (field || (props as any).schema) as any;
   const multiple = imageField?.multiple || false;

package/src/widgets/LocationField.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { Input, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * LocationField - Geographic coordinate input for latitude and longitude
  * Stores location as { latitude, longitude } object and displays as comma-separated pair
  */
-export function LocationField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<any>) {
+export function LocationField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<any>) {
   const config = field || (props as any).schema;
   // Location is stored as { latitude, longitude } object
   // For display, convert to "latitude, longitude" string format

package/src/widgets/LookupField.tsx

@@ -10,7 +10,7 @@ import { cn,
   PopoverTrigger,
   PopoverContent, EmptyValue } from '@object-ui/components';
 import { Search, X, Loader2, AlertCircle, Plus, TableProperties } from 'lucide-react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import type { DataSource, QueryParams, LookupColumnDef } from '@object-ui/types';
 import { RecordPickerDialog, lookupFiltersToRecord } from './RecordPickerDialog';
 import type { RecordPickerFilterColumn } from './RecordPickerDialog';
@@ -191,7 +191,7 @@ function mapFieldTypeToFilterType(
  * from the referenced object using `DataSource.find()`.
  * Falls back to static `options` when no DataSource is available.
  */
-export function LookupField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<any>) {
+export function LookupField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<any>) {
   const [isOpen, setIsOpen] = useState(false);
   const { t } = useFieldTranslation();
   const listboxId = React.useId();
@@ -280,13 +280,13 @@ export function LookupField({ value, onChange, field, readonly, ...props }: Fiel
   }, [fieldMeta?.depends_on, fieldMeta?.dependsOn]);
 
   // Resolve dependent field values from explicit prop or SchemaRendererContext.data
-  const dependentValuesProp = (props as any).dependentValues as Record<string, any> | undefined;
+  const dependentValuesProp = props.dependentValues;
 
   // Resolve DataSource: explicit prop > field-level > wrapper field > SchemaRendererContext > none
   const ctx = useContext(SchemaRendererContext);
   const contextDataSource = ctx?.dataSource ?? null;
   const dataSource: DataSource | null =
-    (props as any).dataSource ?? lookupField?.dataSource ?? fieldMeta?.dataSource ?? contextDataSource;
+    (props.dataSource as DataSource | null | undefined) ?? lookupField?.dataSource ?? fieldMeta?.dataSource ?? contextDataSource;
 
   /** Resolve dependent values from the explicit prop (preferred), the form-data
    *  context provided by @object-ui/react, or finally `ctx.data` (record scope). */
@@ -369,7 +369,7 @@ export function LookupField({ value, onChange, field, readonly, ...props }: Fiel
 
   // Optional create-new callback
   const onCreateNew: ((searchQuery: string) => void) | undefined =
-    (props as any).onCreateNew ?? lookupField?.onCreateNew;
+    props.onCreateNew ?? lookupField?.onCreateNew;
 
   // State for the full Record Picker dialog (Level 2)
   const [isPickerOpen, setIsPickerOpen] = useState(false);
@@ -657,7 +657,7 @@ export function LookupField({ value, onChange, field, readonly, ...props }: Fiel
   // auto-fill sibling fields from it — e.g. a line-item grid copying a product's
   // unit_price/description when the item is chosen. When provided (single
   // select), it drives the update and the host owns the resulting value change.
-  const onSelectRecord = (props as any).onSelectRecord as ((record: LookupOption) => void) | undefined;
+  const onSelectRecord = props.onSelectRecord;
 
   const handleSelect = useCallback(
     (option: LookupOption) => {
@@ -906,7 +906,7 @@ export function LookupField({ value, onChange, field, readonly, ...props }: Fiel
   // Compact mode (e.g. inside a line-item grid cell): show the selected value
   // INSIDE a borderless trigger on a single line — no chip stacked above a
   // separate "Select…" button (which double-stacks and wastes the row height).
-  const compact = !!(props as any).compact;
+  const compact = !!props.compact;
   const singleSelectedLabel = selectedOptions[0]?.label || selectedOptions[0]?.[displayField];
 
   // Shared field trigger — the anchor for either the inline PeoplePicker
@@ -920,8 +920,8 @@ export function LookupField({ value, onChange, field, readonly, ...props }: Fiel
         compact && 'h-8 rounded-none border-0 bg-transparent px-2 shadow-none focus-visible:ring-1 focus-visible:ring-ring/60',
       )}
       type="button"
-      disabled={dependenciesMissing || (props as any).disabled}
-      data-testid={dependenciesMissing ? 'lookup-trigger-gated' : (((props as any).name || lookupField?.name) ? `lookup-trigger-${(props as any).name || lookupField.name}` : 'lookup-trigger')}
+      disabled={dependenciesMissing || props.disabled}
+      data-testid={dependenciesMissing ? 'lookup-trigger-gated' : ((props.name || lookupField?.name) ? `lookup-trigger-${props.name || lookupField.name}` : 'lookup-trigger')}
       title={dependenciesMissing
         ? t('lookup.selectFirst', { fields: dependsOn.map(d => d.field).join(', ') })
         : undefined}
@@ -1214,7 +1214,7 @@ export function LookupField({ value, onChange, field, readonly, ...props }: Fiel
           type="button"
           // Gated exactly like the main trigger (#2215) — pre-fix this button
           // opened the full unscoped table while the dependency was missing.
-          disabled={dependenciesMissing || (props as any).disabled}
+          disabled={dependenciesMissing || props.disabled}
           onClick={() => setIsPickerOpen(true)}
           aria-label={t('lookup.browseAll')}
           title={dependenciesMissing

package/src/widgets/MasterDetailField.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Button, Badge, cn } from '@object-ui/components';
 import { Plus, X, ExternalLink } from 'lucide-react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * Master-Detail relationship data structure
@@ -23,7 +23,7 @@ export function MasterDetailField({
   readonly,
   className,
   ...props 
-}: FieldWidgetProps<MasterDetailValue[]>) {
+}: FieldWidgetComponentProps<MasterDetailValue[]>) {
   const items = value || [];
   const config = field || (props as any).schema;
 

package/src/widgets/MultiSelectField.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect } from 'react';
 import { Badge, EmptyValue, cn } from '@object-ui/components';
 import type { OptionLike } from '@object-ui/core';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import { useCascadingOptions } from './useCascadingOptions';
 
 interface Option extends OptionLike { color?: string }
@@ -32,11 +32,11 @@ export function MultiSelectField({
   emptyHint: _emptyHint,
   dataSource: _dataSource,
   ...props
-}: FieldWidgetProps<string[]>) {
+}: FieldWidgetComponentProps<string[]>) {
   const config = (field || schema) as any;
   const rawOptions: Option[] = config?.options || [];
   const selected: string[] = Array.isArray(value) ? value : value == null ? [] : [value as unknown as string];
-  const fieldName = (props as any).name || config?.name || (props as any).id || '';
+  const fieldName = props.name || config?.name || props.id || '';
 
   const dependsOn = config?.dependsOn ?? dependsOnProp;
   const { options, gated, dependsOnFields } = useCascadingOptions<Option>(
@@ -107,7 +107,7 @@ export function MultiSelectField({
             type="button"
             key={value}
             onClick={() => toggle(value)}
-            disabled={(props as any).disabled}
+            disabled={props.disabled}
             aria-pressed={active}
             data-testid={`multiselect-option-${opt.value}`}
             className={cn(

package/src/widgets/NumberField.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import { Input, EmptyValue } from '@object-ui/components';
 import { NumberFieldMetadata } from '@object-ui/types';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * NumberField - Numeric input with optional decimal precision
  * Supports min/max/step constraints and configurable decimal precision
  */
-export function NumberField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<number>) {
+export function NumberField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<number>) {
   if (readonly) {
     return value == null ? <EmptyValue /> : <span className="text-sm">{value}</span>;
   }

package/src/widgets/ObjectField.tsx

@@ -1,12 +1,12 @@
 import React, { useState, useEffect } from 'react';
 import { Textarea, cn, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * ObjectField - JSON object editor
  * Allows editing structured JSON data
  */
-export function ObjectField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<any>) {
+export function ObjectField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<any>) {
   const config = field || (props as any).schema;
   
   // Initialize string state based on value

package/src/widgets/ObjectRefField.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Combobox, EmptyValue, cn } from '@object-ui/components';
 import { SchemaRendererContext } from '@object-ui/react';
-import type { FieldWidgetProps } from './types';
+import type { FieldWidgetComponentProps } from './types';
 import { useFieldTranslation } from './useFieldTranslation';
 
 /**
@@ -32,11 +32,11 @@ export function ObjectRefField({
   readonly,
   className,
   ...props
-}: FieldWidgetProps<string>) {
+}: FieldWidgetComponentProps<string>) {
   const ctx = React.useContext(SchemaRendererContext);
   const { t } = useFieldTranslation();
-  const dataSource: any = (props as any).dataSource ?? (ctx as any)?.dataSource ?? null;
-  const disabled = (props as any).disabled as boolean | undefined;
+  const dataSource: any = props.dataSource ?? (ctx as any)?.dataSource ?? null;
+  const disabled = props.disabled;
 
   const [objects, setObjects] = React.useState<ObjectHeader[] | null>(null);
 

package/src/widgets/PasswordField.tsx

@@ -2,13 +2,13 @@ import React, { useState } from 'react';
 import { Input } from '@object-ui/components';
 import { Button } from '@object-ui/components';
 import { Eye, EyeOff } from 'lucide-react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * PasswordField - Secure password input with visibility toggle
  * Includes show/hide toggle button and masks value in readonly mode
  */
-export function PasswordField({ value, onChange, field, readonly, className, ...props }: FieldWidgetProps<string>) {
+export function PasswordField({ value, onChange, field, readonly, className, ...props }: FieldWidgetComponentProps<string>) {
   const [showPassword, setShowPassword] = useState(false);
   const config = field || (props as any).schema;
 

package/src/widgets/PercentField.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import { Input, Slider, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * PercentField - Percentage input with configurable decimal precision
  * Stores values as decimals (0-1) and displays as percentages (0-100%)
  * Includes a slider for interactive control.
  */
-export function PercentField({ value, onChange, field, readonly, errorMessage, className, ...props }: FieldWidgetProps<number>) {
+export function PercentField({ value, onChange, field, readonly, errorMessage, className, ...props }: FieldWidgetComponentProps<number>) {
   const percentField = (field || (props as any).schema) as any;
   const precision = percentField?.precision ?? 2;
 

package/src/widgets/PhoneField.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { Input, EmptyValue } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * PhoneField - Telephone number input with tel link in readonly mode
  * Renders as a clickable tel link when readonly, standard phone input otherwise
  */
-export function PhoneField({ value, onChange, field, readonly, errorMessage, ...props }: FieldWidgetProps<string>) {
+export function PhoneField({ value, onChange, field, readonly, errorMessage, ...props }: FieldWidgetComponentProps<string>) {
   const config = field || (props as any).schema;
   if (readonly) {
     if (!value) return <EmptyValue />;

package/src/widgets/QRCodeField.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import { Input, Button, EmptyValue } from '@object-ui/components';
 import { QrCode, Copy } from 'lucide-react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * QR Code field widget - generates QR codes from text
  * Uses a simple SVG-based QR code generator
  */
-export function QRCodeField({ value, onChange, field, readonly, ...props }: FieldWidgetProps<string>) {
+export function QRCodeField({ value, onChange, field, readonly, ...props }: FieldWidgetComponentProps<string>) {
   const [showQR, setShowQR] = React.useState(false);
   const config = field || (props as any).schema;
 

package/src/widgets/RadioField.tsx

@@ -1,7 +1,7 @@
 import React, { useId, useEffect } from 'react';
 import { RadioGroup, RadioGroupItem, Label, EmptyValue } from '@object-ui/components';
 import { isValueStillOffered, type OptionLike } from '@object-ui/core';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import { useCascadingOptions } from './useCascadingOptions';
 
 type Option = OptionLike;
@@ -30,11 +30,11 @@ export function RadioField({
   emptyHint: _emptyHint,
   dataSource: _dataSource,
   ...props
-}: FieldWidgetProps<string>) {
+}: FieldWidgetComponentProps<string>) {
   const config = (field || schema) as any;
   const rawOptions: Option[] = config?.options || [];
   const groupId = useId();
-  const fieldName = (props as any).name || config?.name || (props as any).id || '';
+  const fieldName = props.name || config?.name || props.id || '';
 
   const dependsOn = config?.dependsOn ?? dependsOnProp;
   const { options, gated, dependsOnFields } = useCascadingOptions<Option>(
@@ -81,7 +81,7 @@ export function RadioField({
     <RadioGroup
       value={value ?? ''}
       onValueChange={onChange}
-      disabled={(props as any).disabled}
+      disabled={props.disabled}
       className={className}
     >
       {options.map((opt) => {

package/src/widgets/RatingField.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import { Star } from 'lucide-react';
 import { cn } from '@object-ui/components';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * Rating field widget - provides a star rating input
  * Supports numeric values from 0 to max (default 5)
  */
-export function RatingField({ value, onChange, field, readonly, className, ...props }: FieldWidgetProps<number>) {
+export function RatingField({ value, onChange, field, readonly, className, ...props }: FieldWidgetComponentProps<number>) {
   // Get rating-specific configuration from field metadata
   const ratingField = (field || (props as any).schema) as any;
   const max = ratingField?.max ?? 5;

package/src/widgets/RecipientPickerField.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Combobox, EmptyValue, cn } from '@object-ui/components';
 import { SchemaRendererContext } from '@object-ui/react';
-import type { FieldWidgetProps } from './types';
+import type { FieldWidgetComponentProps } from './types';
 import { useFieldTranslation } from './useFieldTranslation';
 
 /**
@@ -54,11 +54,11 @@ export function RecipientPickerField({
   readonly,
   className,
   ...props
-}: FieldWidgetProps<string>) {
+}: FieldWidgetComponentProps<string>) {
   const ctx = React.useContext(SchemaRendererContext);
   const { t } = useFieldTranslation();
-  const dataSource: any = (props as any).dataSource ?? (ctx as any)?.dataSource ?? null;
-  const disabled = (props as any).disabled as boolean | undefined;
+  const dataSource: any = props.dataSource ?? (ctx as any)?.dataSource ?? null;
+  const disabled = props.disabled;
   const dependentValues: Record<string, any> = (props as any).dependentValues ?? {};
   const recipientType = String(dependentValues.recipient_type ?? '');
   const mapping = TYPE_TO_OBJECT[recipientType];

package/src/widgets/RichTextField.tsx

@@ -1,14 +1,14 @@
 import React from 'react';
 import { Textarea, EmptyValue } from '@object-ui/components';
 import { useObjectTranslation } from '@object-ui/react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * Rich text field with markdown/HTML support
  * For now, this is a simple textarea. A full implementation would use
  * a rich text editor like TipTap, Lexical, or Slate.
  */
-export function RichTextField({ value, onChange, field, readonly, errorMessage, ...props }: FieldWidgetProps<string>) {
+export function RichTextField({ value, onChange, field, readonly, errorMessage, ...props }: FieldWidgetComponentProps<string>) {
   const { t } = useObjectTranslation();
   if (readonly) {
     return (

package/src/widgets/SelectField.tsx

@@ -10,7 +10,7 @@ import {
 import { isValueStillOffered } from '@object-ui/core';
 import { SelectFieldMetadata } from '@object-ui/types';
 import { useFieldTranslation } from './useFieldTranslation';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 import { MultiSelectField } from './MultiSelectField';
 import { useCascadingOptions } from './useCascadingOptions';
 
@@ -29,12 +29,12 @@ import { useCascadingOptions } from './useCascadingOptions';
  * the shared {@link useCascadingOptions} hook (#2715), so single and multi stay
  * in lockstep.
  */
-export function SelectField(props: FieldWidgetProps<any>) {
+export function SelectField(props: FieldWidgetComponentProps<any>) {
   const config = (props.field || (props as any).schema) as SelectFieldMetadata | undefined;
   if ((config as any)?.multiple) {
     return <MultiSelectField {...props} />;
   }
-  return <SingleSelectField {...(props as FieldWidgetProps<string>)} />;
+  return <SingleSelectField {...(props as FieldWidgetComponentProps<string>)} />;
 }
 
 /**
@@ -59,7 +59,7 @@ function SingleSelectField({
   emptyHint: _emptyHint,
   dataSource: _dataSource,
   ...props
-}: FieldWidgetProps<string>) {
+}: FieldWidgetComponentProps<string>) {
   const config = (field || schema) as SelectFieldMetadata;
   const rawOptions = config?.options || [];
   const { t } = useFieldTranslation();
@@ -67,7 +67,7 @@ function SingleSelectField({
   // driven by synthetic DOM events, so e2e must target the trigger/options by a
   // deterministic testid keyed on the field name. `props.name` is the
   // react-hook-form field name spread in by the form renderer (FormField).
-  const fieldName = (props as any).name || (config as any)?.name || props.id || '';
+  const fieldName = props.name || (config as any)?.name || props.id || '';
 
   const dependsOn = (config as any)?.dependsOn ?? dependsOnProp;
   const { options, gated, dependsOnFields } = useCascadingOptions(

package/src/widgets/SignatureField.tsx

@@ -1,13 +1,13 @@
 import React, { useRef, useEffect } from 'react';
 import { Button } from '@object-ui/components';
 import { Eraser } from 'lucide-react';
-import { FieldWidgetProps } from './types';
+import { FieldWidgetComponentProps } from './types';
 
 /**
  * Signature field widget - provides a signature pad for capturing signatures
  * Outputs signature as a base64 PNG image
  */
-export function SignatureField({ value, onChange, readonly }: FieldWidgetProps<string>) {
+export function SignatureField({ value, onChange, readonly }: FieldWidgetComponentProps<string>) {
   const canvasRef = useRef<HTMLCanvasElement>(null);
   const [isDrawing, setIsDrawing] = React.useState(false);
   const [isEmpty, setIsEmpty] = React.useState(!value);