@asteby/metacore-runtime-react 18.2.0 → 18.4.0

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @asteby/metacore-runtime-react
 
+## 18.4.0
+
+### Minor Changes
+
+- c7fb1ad: Org-currency-aware money formatting in dynamic tables + the record dialog.
+
+  `<DynamicTable>` and `<DynamicRecordDialog>` now accept an optional `currency`
+  prop (the org's ISO-4217 code, e.g. `MXN`, threaded from org config like
+  `timeZone`). Money columns (`type:'number'` + `cellStyle:'currency'`) without an
+  explicit per-column currency now fall back to the org currency instead of
+  hardcoded `USD` — `resolveCurrency(col, orgCurrency)`. The record dialog, which
+  previously showed raw numbers, now formats money fields as a currency string in
+  the view renderer: a field is treated as money when the backend stamps
+  `cellStyle:'currency'`, or — as a robustness fallback mirroring the backend's
+  `inferDisplayCellStyle` — when it's numeric and its key matches the money
+  heuristic (`price`/`amount`/`total`/`cost`/`subtotal`/`balance`/`paid`, as the
+  whole key or a `_<m>`/`<m>_` affix). Editable inputs stay numeric.
+
+## 18.3.0
+
+### Minor Changes
+
+- fc14b4f: Relation (one_to_many) cells now show the FK product image: when an FK column's backend-resolved sibling carries an `image`, the relation row renders a thumbnail + label instead of plain text. The nested line-item edit form drops server-managed/audit columns (`id`, `created_at`, `updated_at`, `deleted_at`, `created_by(_id)`, `updated_by(_id)`) so they no longer render as `[object Object]` inputs, and the nested `dynamic_select` is seeded with the existing value's label/image from the initial record so the trigger shows the name + thumbnail instead of a raw UUID. The image-url resolver context moved to its own `image-url-context` module to avoid a circular import.
+
 ## 18.2.0
 
 ### Minor Changes

package/dist/dialogs/dynamic-record.d.ts

@@ -1,6 +1,6 @@
 import type { ModelSchema } from './types';
-/** Resolves a (possibly relative) storage path into a fetchable URL. */
-export type GetImageUrl = (path: string | null | undefined) => string;
+import { type GetImageUrl } from '../image-url-context';
+export type { GetImageUrl };
 export interface FieldOption {
     value: string;
     label: string;
@@ -45,6 +45,19 @@ export interface FieldDef {
      * its SQL type. Unknown values fall through to the `type`-based default.
      */
     widget?: string;
+    /**
+     * Declarative display hint the backend stamps on the column/modal field
+     * (mirrors the table column's `cellStyle`). `'currency'` makes the view
+     * renderer format the numeric value in the org currency. Optional —
+     * absent, a money-key heuristic still detects obvious money fields.
+     */
+    cellStyle?: string;
+    /**
+     * Per-field style overrides served alongside `cellStyle` (e.g.
+     * `{ currency: 'MXN' }`). When it carries an explicit `currency` it wins
+     * over the org fallback.
+     */
+    styleConfig?: Record<string, any>;
 }
 export interface DynamicRecordDialogProps {
     open: boolean;
@@ -118,9 +131,16 @@ export interface DynamicRecordDialogProps {
      * regardless of the viewer's browser timezone. Pure `date` values pin to UTC.
      */
     timeZone?: string;
+    /**
+     * Org ISO-4217 currency code (e.g. `MXN`) used as the fallback for money
+     * fields (`cellStyle:'currency'` or the money-key heuristic) that lack an
+     * explicit per-field currency. Optional — defaults to 'USD'.
+     */
+    currency?: string;
 }
-export declare function DynamicRecordDialog({ open, onOpenChange, mode, model, recordId, endpoint, onSaved, onCreate, onUpdate, defaults, schema, onDelete, onEdit, onOpenFullPage, initialRecord, getImageUrl, timeZone, }: DynamicRecordDialogProps): import("react").JSX.Element;
-export declare function ViewValue({ field, value: rawValue, record, getImageUrl: getImageUrlProp, timeZone: timeZoneProp, }: {
+export declare function isMoneyField(field: FieldDef, value: any): boolean;
+export declare function DynamicRecordDialog({ open, onOpenChange, mode, model, recordId, endpoint, onSaved, onCreate, onUpdate, defaults, schema, onDelete, onEdit, onOpenFullPage, initialRecord, getImageUrl, timeZone, currency, }: DynamicRecordDialogProps): import("react").JSX.Element;
+export declare function ViewValue({ field, value: rawValue, record, getImageUrl: getImageUrlProp, timeZone: timeZoneProp, currency: currencyProp, }: {
     field: FieldDef;
     value: any;
     record: any;
@@ -128,5 +148,7 @@ export declare function ViewValue({ field, value: rawValue, record, getImageUrl:
     getImageUrl?: GetImageUrl;
     /** Optional override; when omitted falls back to the nearest provider. */
     timeZone?: string;
+    /** Optional override; when omitted falls back to the nearest provider. */
+    currency?: string;
 }): import("react").JSX.Element;
 //# sourceMappingURL=dynamic-record.d.ts.map

package/dist/dialogs/dynamic-record.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-record.d.ts","sourceRoot":"","sources":["../../src/dialogs/dynamic-record.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"dynamic-record.d.ts","sourceRoot":"","sources":["../../src/dialogs/dynamic-record.tsx"],"names":[],"mappings":"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"}

package/dist/dialogs/dynamic-record.js

@@ -27,7 +27,7 @@ import { getFieldRef } from '../dynamic-form-schema';
 import { isNilUuid, normalizeNilUuid } from '../nil-uuid';
 import { humanizeToken } from '../dynamic-columns-helpers';
 import { formatDateCell } from '../dynamic-columns';
-const identityImageUrl = (p) => p ?? '';
+import { ImageUrlContext, identityImageUrl } from '../image-url-context';
 // localizedModelName resolves the (possibly addon-i18n) model name: prefer the
 // translated titleKey, fall back to the backend-provided raw title.
 function localizedModelName(meta, t) {
@@ -157,9 +157,32 @@ const MODE_CONFIG = {
 // Context threading host runtime values to nested field components (uploads,
 // image leads, tz-aware dates) without prop-drilling through every renderer.
 const ModelContext = createContext('');
-const ImageUrlContext = createContext(identityImageUrl);
 const TimeZoneContext = createContext(undefined);
-export function DynamicRecordDialog({ open, onOpenChange, mode, model, recordId, endpoint, onSaved, onCreate, onUpdate, defaults, schema, onDelete, onEdit, onOpenFullPage, initialRecord, getImageUrl = identityImageUrl, timeZone, }) {
+// Org ISO-4217 currency (org config, like the timezone) used as the fallback
+// for money fields that don't carry an explicit per-field currency.
+const CurrencyContext = createContext(undefined);
+// Money-key heuristic mirroring the backend's `inferDisplayCellStyle`: lets the
+// dialog format obvious money fields as currency even when the backend hasn't
+// stamped `cellStyle:'currency'` yet. Case-insensitive; matches a key that
+// equals one of these, or ends with `_<m>`, or starts with `<m>_`.
+const MONEY_KEY_HEURISTIC = ['price', 'amount', 'total', 'cost', 'subtotal', 'balance', 'paid'];
+// isMoneyField decides whether a field should render as currency. The explicit
+// `cellStyle:'currency'` stamp always wins; otherwise a numeric value whose key
+// matches the money heuristic qualifies (robustness fallback).
+export function isMoneyField(field, value) {
+    if (field.cellStyle === 'currency')
+        return true;
+    if (value === null || value === undefined || value === '')
+        return false;
+    const num = typeof value === 'number' ? value : Number(value);
+    if (isNaN(num))
+        return false;
+    const key = String(field.key || '').toLowerCase();
+    if (!key)
+        return false;
+    return MONEY_KEY_HEURISTIC.some(m => key === m || key.endsWith(`_${m}`) || key.startsWith(`${m}_`));
+}
+export function DynamicRecordDialog({ open, onOpenChange, mode, model, recordId, endpoint, onSaved, onCreate, onUpdate, defaults, schema, onDelete, onEdit, onOpenFullPage, initialRecord, getImageUrl = identityImageUrl, timeZone, currency, }) {
     const api = useApi();
     const { t } = useTranslation();
     const [modalMeta, setModalMeta] = useState(schema ? schema : null);
@@ -388,10 +411,10 @@ export function DynamicRecordDialog({ open, onOpenChange, mode, model, recordId,
             return false;
         return true;
     }) ?? [];
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-2xl max-h-[90vh] flex flex-col p-0 gap-0 overflow-hidden", children: [_jsxs(DialogHeader, { className: "p-6 pb-4 border-b shrink-0", children: [_jsx(DialogTitle, { children: title }), _jsx(DialogDescription, { children: config.description })] }), _jsx("div", { className: "flex-1 overflow-y-auto p-6", children: loading ? (_jsx(LoadingSkeleton, {})) : modalMeta ? (_jsx(ModelContext.Provider, { value: model, children: _jsx(ImageUrlContext.Provider, { value: getImageUrl, children: _jsxs(TimeZoneContext.Provider, { value: timeZone, children: [_jsxs("form", { id: "dynamic-record-form", onSubmit: handleSubmit, className: "grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-4", children: [visibleFields.map(field => {
-                                                const isFullWidth = field.type === 'textarea';
-                                                return (_jsx("div", { className: isFullWidth ? 'sm:col-span-2' : '', children: _jsx(FieldRow, { field: field, record: record, value: formValues[field.key] ?? '', mode: mode, onChange: val => setFormValues((prev) => ({ ...prev, [field.key]: val })) }) }, field.key));
-                                            }), record?.external_url && (_jsx("div", { className: "sm:col-span-2", children: _jsxs("a", { href: record.external_url, target: "_blank", rel: "noreferrer", className: "inline-flex items-center gap-1.5 text-sm text-primary hover:underline mt-1", children: [_jsx(ExternalLink, { className: "h-3.5 w-3.5" }), "Ver en ", record.external_provider ?? 'proveedor externo'] }) }))] }), !isCreate && record && relations.length > 0 && (_jsx("div", { className: "mt-6", children: _jsx(DynamicRelations, { record: record, relations: relations, canCreate: mode === 'edit', canEdit: mode === 'edit', canDelete: mode === 'edit' }) }))] }) }) })) : null }), _jsxs(DialogFooter, { className: "p-4 border-t shrink-0 sm:justify-between", children: [isView && onOpenFullPage ? (_jsxs(Button, { variant: "ghost", size: "sm", className: "text-muted-foreground", onClick: () => { onOpenChange(false); onOpenFullPage(); }, children: [_jsx(ExternalLink, { className: "mr-1.5 h-3.5 w-3.5" }), "Ver p\u00E1gina completa"] })) : _jsx("span", {}), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: saving || deleting, children: config.cancelLabel }), isView && onDelete && (_jsxs(Button, { variant: "destructive", onClick: handleDelete, disabled: deleting || loading, children: [deleting && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), deleting ? 'Eliminando...' : 'Eliminar'] })), isView && onEdit && (_jsx(Button, { onClick: onEdit, disabled: deleting || loading, children: "Editar" })), isEditable && (_jsxs(Button, { type: "submit", form: "dynamic-record-form", disabled: saving || loading, children: [saving && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), saving ? config.submittingLabel : config.submitLabel] }))] })] })] }) }));
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-2xl max-h-[90vh] flex flex-col p-0 gap-0 overflow-hidden", children: [_jsxs(DialogHeader, { className: "p-6 pb-4 border-b shrink-0", children: [_jsx(DialogTitle, { children: title }), _jsx(DialogDescription, { children: config.description })] }), _jsx("div", { className: "flex-1 overflow-y-auto p-6", children: loading ? (_jsx(LoadingSkeleton, {})) : modalMeta ? (_jsx(ModelContext.Provider, { value: model, children: _jsx(ImageUrlContext.Provider, { value: getImageUrl, children: _jsx(TimeZoneContext.Provider, { value: timeZone, children: _jsxs(CurrencyContext.Provider, { value: currency, children: [_jsxs("form", { id: "dynamic-record-form", onSubmit: handleSubmit, className: "grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-4", children: [visibleFields.map(field => {
+                                                    const isFullWidth = field.type === 'textarea';
+                                                    return (_jsx("div", { className: isFullWidth ? 'sm:col-span-2' : '', children: _jsx(FieldRow, { field: field, record: record, value: formValues[field.key] ?? '', mode: mode, onChange: val => setFormValues((prev) => ({ ...prev, [field.key]: val })) }) }, field.key));
+                                                }), record?.external_url && (_jsx("div", { className: "sm:col-span-2", children: _jsxs("a", { href: record.external_url, target: "_blank", rel: "noreferrer", className: "inline-flex items-center gap-1.5 text-sm text-primary hover:underline mt-1", children: [_jsx(ExternalLink, { className: "h-3.5 w-3.5" }), "Ver en ", record.external_provider ?? 'proveedor externo'] }) }))] }), !isCreate && record && relations.length > 0 && (_jsx("div", { className: "mt-6", children: _jsx(DynamicRelations, { record: record, relations: relations, canCreate: mode === 'edit', canEdit: mode === 'edit', canDelete: mode === 'edit' }) }))] }) }) }) })) : null }), _jsxs(DialogFooter, { className: "p-4 border-t shrink-0 sm:justify-between", children: [isView && onOpenFullPage ? (_jsxs(Button, { variant: "ghost", size: "sm", className: "text-muted-foreground", onClick: () => { onOpenChange(false); onOpenFullPage(); }, children: [_jsx(ExternalLink, { className: "mr-1.5 h-3.5 w-3.5" }), "Ver p\u00E1gina completa"] })) : _jsx("span", {}), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: saving || deleting, children: config.cancelLabel }), isView && onDelete && (_jsxs(Button, { variant: "destructive", onClick: handleDelete, disabled: deleting || loading, children: [deleting && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), deleting ? 'Eliminando...' : 'Eliminar'] })), isView && onEdit && (_jsx(Button, { onClick: onEdit, disabled: deleting || loading, children: "Editar" })), isEditable && (_jsxs(Button, { type: "submit", form: "dynamic-record-form", disabled: saving || loading, children: [saving && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), saving ? config.submittingLabel : config.submitLabel] }))] })] })] }) }));
 }
 function LoadingSkeleton() {
     return (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-4", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Skeleton, { className: "h-3.5 w-24" }), _jsx(Skeleton, { className: "h-9 w-full" })] }, i))) }));
@@ -440,11 +463,14 @@ function RelationViewValue({ field, value, record }) {
     };
     return (_jsxs("div", { className: "flex items-center gap-2 py-1", children: [_jsx(OptionLead, { option: lead, size: 24 }), _jsx("span", { className: "text-sm", children: label ?? '—' })] }));
 }
-export function ViewValue({ field, value: rawValue, record, getImageUrl: getImageUrlProp, timeZone: timeZoneProp, }) {
+export function ViewValue({ field, value: rawValue, record, getImageUrl: getImageUrlProp, timeZone: timeZoneProp, currency: currencyProp, }) {
+    const { i18n } = useTranslation();
     const ctxImageUrl = useContext(ImageUrlContext);
     const ctxTimeZone = useContext(TimeZoneContext);
+    const ctxCurrency = useContext(CurrencyContext);
     const getImageUrl = getImageUrlProp ?? ctxImageUrl;
     const timeZone = timeZoneProp ?? ctxTimeZone;
+    const currency = currencyProp ?? ctxCurrency;
     // created_by / avatar resolver sibling → name (+ avatar) instead of "—".
     if (field.type === 'avatar' || field.key === 'created_by' || field.key === 'created_by_id') {
         const user = createdBySibling(rawValue, record);
@@ -482,6 +508,23 @@ export function ViewValue({ field, value: rawValue, record, getImageUrl: getImag
     if (field.type === 'url' && value) {
         return (_jsx("a", { href: value, target: "_blank", rel: "noreferrer", className: "text-sm text-primary hover:underline truncate", children: value }));
     }
+    // Money → org-currency string. Detected by the backend `cellStyle:'currency'`
+    // stamp or a numeric value whose key matches the money heuristic (fallback
+    // mirroring the table cell + backend `inferDisplayCellStyle`).
+    if (isMoneyField(field, value)) {
+        const num = typeof value === 'number' ? value : Number(value);
+        if (!isNaN(num)) {
+            const resolvedCurrency = field.styleConfig?.currency || currency || 'USD';
+            const localeTag = i18n.language || 'es';
+            const formatted = new Intl.NumberFormat(localeTag, {
+                style: 'currency',
+                currency: resolvedCurrency,
+                minimumFractionDigits: 2,
+                maximumFractionDigits: 2,
+            }).format(num);
+            return _jsx("p", { className: "text-sm py-1 tabular-nums", children: formatted });
+        }
+    }
     // Date/datetime/timestamp → tz-aware format. `date` pins to UTC (calendar
     // day); instants render in the org timezone with a full-precision tooltip.
     if (field.type === 'date' || field.type === 'datetime' || field.type === 'timestamp') {

package/dist/dynamic-columns-shim.d.ts

@@ -16,7 +16,7 @@ export interface ColumnFilterConfig {
     searchEndpoint?: string;
 }
 /** Signature for the host-provided `getDynamicColumns` factory. */
-export type GetDynamicColumns = (metadata: TableMetadata, handleAction: (action: string, row: any) => void, t: (key: string, options?: any) => string, language: string, columnFilterConfigs: Map<string, ColumnFilterConfig>, timeZone?: string) => ColumnDef<any>[];
+export type GetDynamicColumns = (metadata: TableMetadata, handleAction: (action: string, row: any) => void, t: (key: string, options?: any) => string, language: string, columnFilterConfigs: Map<string, ColumnFilterConfig>, timeZone?: string, currency?: string) => ColumnDef<any>[];
 /** Signature for the host-provided `DynamicIcon` renderer. */
 export type DynamicIconComponent = React.ComponentType<{
     name: string;

package/dist/dynamic-columns-shim.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-columns-shim.d.ts","sourceRoot":"","sources":["../src/dynamic-columns-shim.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C,MAAM,WAAW,YAAY;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,WAAW,kBAAkB;IAC/B,UAAU,EAAE,QAAQ,GAAG,SAAS,GAAG,YAAY,GAAG,cAAc,GAAG,MAAM,GAAG,MAAM,CAAA;IAClF,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,cAAc,EAAE,MAAM,EAAE,CAAA;IACxB,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,cAAc,CAAC,EAAE,MAAM,CAAA;CAC1B;AAED,mEAAmE;AACnE,MAAM,MAAM,iBAAiB,GAAG,CAC5B,QAAQ,EAAE,aAAa,EACvB,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,IAAI,EAChD,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,GAAG,KAAK,MAAM,EACzC,QAAQ,EAAE,MAAM,EAChB,mBAAmB,EAAE,GAAG,CAAC,MAAM,EAAE,kBAAkB,CAAC,EACpD,QAAQ,CAAC,EAAE,MAAM,KAChB,SAAS,CAAC,GAAG,CAAC,EAAE,CAAA;AAErB,8DAA8D;AAC9D,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,aAAa,CAAC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAA"}
+{"version":3,"file":"dynamic-columns-shim.d.ts","sourceRoot":"","sources":["../src/dynamic-columns-shim.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C,MAAM,WAAW,YAAY;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,WAAW,kBAAkB;IAC/B,UAAU,EAAE,QAAQ,GAAG,SAAS,GAAG,YAAY,GAAG,cAAc,GAAG,MAAM,GAAG,MAAM,CAAA;IAClF,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,cAAc,EAAE,MAAM,EAAE,CAAA;IACxB,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,cAAc,CAAC,EAAE,MAAM,CAAA;CAC1B;AAED,mEAAmE;AACnE,MAAM,MAAM,iBAAiB,GAAG,CAC5B,QAAQ,EAAE,aAAa,EACvB,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,IAAI,EAChD,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,GAAG,KAAK,MAAM,EACzC,QAAQ,EAAE,MAAM,EAChB,mBAAmB,EAAE,GAAG,CAAC,MAAM,EAAE,kBAAkB,CAAC,EACpD,QAAQ,CAAC,EAAE,MAAM,EACjB,QAAQ,CAAC,EAAE,MAAM,KAChB,SAAS,CAAC,GAAG,CAAC,EAAE,CAAA;AAErB,8DAA8D;AAC9D,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,aAAa,CAAC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAA"}

package/dist/dynamic-columns.d.ts

@@ -16,6 +16,12 @@ export interface DynamicColumnsHelpers {
      */
     apiBaseUrl?: string;
 }
+/**
+ * Resolves the active currency for a column: the column's explicit currency
+ * style wins, then the org-level fallback (org config, like `timeZone`), then
+ * 'USD' as a last resort.
+ */
+export declare const resolveCurrency: (col: ColumnDefinition, orgCurrency?: string) => string;
 /**
  * State-machine gate for per-row actions.
  *

package/dist/dynamic-columns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-columns.d.ts","sourceRoot":"","sources":["../src/dynamic-columns.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAU,KAAK,MAAM,EAAE,MAAM,UAAU,CAAA;AAgC9C,OAAO,KAAK,EAAiB,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE9D,OAAO,KAAK,EAER,iBAAiB,EACpB,MAAM,wBAAwB,CAAA;AAE/B,qEAAqE;AACrE,MAAM,WAAW,qBAAqB;IAClC;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAA;IACtC;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AAgGD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,0BAA0B,GAAI,QAAQ,GAAG,EAAE,KAAK,GAAG,KAAG,OAMlE,CAAA;AAqKD;;;;;;;GAOG;AACH,eAAO,MAAM,cAAc,GAAI,KAAK,IAAI,CAAC,gBAAgB,EAAE,KAAK,CAAC,KAAG,MAGnE,CAAA;AAED,6EAA6E;AAC7E,eAAO,MAAM,eAAe,2DAA4D,CAAA;AAExF;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,cAAc,CAC1B,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,MAAM,GAAG,SAAS,EAC5B,MAAM,EAAE,MAAM,EACd,QAAQ,CAAC,EAAE,MAAM,GAClB;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CA6C5C;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,oBAAoB,GAAI,KAAK,gBAAgB,EAAE,KAAK,GAAG,KAAG,MAWtE,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAAI,KAAK,gBAAgB,EAAE,KAAK,GAAG,KAAG,MAOtE,CAAA;AA0ED;;;;GAIG;AACH,wBAAgB,4BAA4B,CACxC,OAAO,GAAE,qBAA0B,GACpC,iBAAiB,CAumBnB;AAED;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,EAAE,iBACL,CAAA"}
+{"version":3,"file":"dynamic-columns.d.ts","sourceRoot":"","sources":["../src/dynamic-columns.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAU,KAAK,MAAM,EAAE,MAAM,UAAU,CAAA;AAgC9C,OAAO,KAAK,EAAiB,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE9D,OAAO,KAAK,EAER,iBAAiB,EACpB,MAAM,wBAAwB,CAAA;AAE/B,qEAAqE;AACrE,MAAM,WAAW,qBAAqB;IAClC;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAA;IACtC;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AA0BD;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,KAAK,gBAAgB,EAAE,cAAc,MAAM,KAAG,MACzB,CAAA;AAoErD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,0BAA0B,GAAI,QAAQ,GAAG,EAAE,KAAK,GAAG,KAAG,OAMlE,CAAA;AAqKD;;;;;;;GAOG;AACH,eAAO,MAAM,cAAc,GAAI,KAAK,IAAI,CAAC,gBAAgB,EAAE,KAAK,CAAC,KAAG,MAGnE,CAAA;AAED,6EAA6E;AAC7E,eAAO,MAAM,eAAe,2DAA4D,CAAA;AAExF;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,cAAc,CAC1B,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,MAAM,GAAG,SAAS,EAC5B,MAAM,EAAE,MAAM,EACd,QAAQ,CAAC,EAAE,MAAM,GAClB;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CA6C5C;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,oBAAoB,GAAI,KAAK,gBAAgB,EAAE,KAAK,GAAG,KAAG,MAWtE,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAAI,KAAK,gBAAgB,EAAE,KAAK,GAAG,KAAG,MAOtE,CAAA;AA0ED;;;;GAIG;AACH,wBAAgB,4BAA4B,CACxC,OAAO,GAAE,qBAA0B,GACpC,iBAAiB,CAwmBnB;AAED;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,EAAE,iBACL,CAAA"}

package/dist/dynamic-columns.js

@@ -44,8 +44,12 @@ const styleCfg = (col, ...keys) => {
     return undefined;
 };
 const EmptyCell = () => _jsx("span", { className: "text-muted-foreground", children: "-" });
-/** Resolves the active org currency, defaulting to USD when no override. */
-const resolveCurrency = (col) => styleCfg(col, 'currency') || 'USD';
+/**
+ * Resolves the active currency for a column: the column's explicit currency
+ * style wins, then the org-level fallback (org config, like `timeZone`), then
+ * 'USD' as a last resort.
+ */
+export const resolveCurrency = (col, orgCurrency) => styleCfg(col, 'currency') || orgCurrency || 'USD';
 const formatNumber = (value, opts, locale) => new Intl.NumberFormat(locale || undefined, opts).format(value);
 /**
  * Semantic status → badge color. Used by the `status` cell when no explicit
@@ -351,7 +355,7 @@ const AvatarCell = ({ name, desc, avatarSrc, getImageUrl }) => (_jsxs("div", { c
 export function makeDefaultGetDynamicColumns(helpers = {}) {
     const getImageUrl = helpers.getImageUrl ?? defaultGetImageUrl;
     const apiBaseUrl = helpers.apiBaseUrl ?? '';
-    return function defaultGetDynamicColumns(metadata, onAction, t, currentLanguage, filterConfigs, timeZone) {
+    return function defaultGetDynamicColumns(metadata, onAction, t, currentLanguage, filterConfigs, timeZone, currency) {
         const dateLocale = currentLanguage === 'en' ? enUS : es;
         const columns = [
             {
@@ -552,7 +556,7 @@ export function makeDefaultGetDynamicColumns(helpers = {}) {
                             const decimals = styleCfg(col, 'decimals') ?? 2;
                             return (_jsx("span", { className: "block text-right font-medium tabular-nums", children: formatNumber(num, {
                                     style: 'currency',
-                                    currency: resolveCurrency(col),
+                                    currency: resolveCurrency(col, currency),
                                     minimumFractionDigits: decimals,
                                     maximumFractionDigits: decimals,
                                 }, currentLanguage) }));

package/dist/dynamic-form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-form.d.ts","sourceRoot":"","sources":["../src/dynamic-form.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EACH,cAAc,EACd,aAAa,EAGhB,MAAM,uBAAuB,CAAA;AAO9B,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,CAAA;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAE5C,MAAM,WAAW,gBAAgB;IAC7B,MAAM,EAAE,cAAc,EAAE,CAAA;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACnC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IAC/D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,wBAAgB,WAAW,CAAC,EACxB,MAAM,EACN,aAAa,EACb,QAAQ,EACR,QAAQ,EACR,WAAuB,EACvB,WAAwB,EACxB,QAAgB,GACnB,EAAE,gBAAgB,+BAkGlB"}
+{"version":3,"file":"dynamic-form.d.ts","sourceRoot":"","sources":["../src/dynamic-form.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EACH,cAAc,EACd,aAAa,EAGhB,MAAM,uBAAuB,CAAA;AAO9B,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,CAAA;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAE5C,MAAM,WAAW,gBAAgB;IAC7B,MAAM,EAAE,cAAc,EAAE,CAAA;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACnC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IAC/D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,wBAAgB,WAAW,CAAC,EACxB,MAAM,EACN,aAAa,EACb,QAAQ,EACR,QAAQ,EACR,WAAuB,EACvB,WAAwB,EACxB,QAAgB,GACnB,EAAE,gBAAgB,+BAmGlB"}

package/dist/dynamic-form.js

@@ -77,10 +77,35 @@ export function DynamicForm({ fields, initialValues, onSubmit, onCancel, submitL
                     const fullWidth = isLineItemsField(field) ||
                         resolveWidget(field) === 'textarea' ||
                         resolveWidget(field) === 'richtext';
-                    return (_jsxs("div", { className: 'grid gap-2 ' + (fullWidth ? 'sm:col-span-2' : ''), children: [_jsxs(Label, { htmlFor: field.key, children: [field.label, field.required && _jsx("span", { className: "text-red-500 ml-1", children: "*" })] }), _jsx(FieldRenderer, { field: field, value: values[field.key], onChange: (v) => update(field.key, v) }), errors[field.key] && (_jsx("span", { className: "text-red-500 text-sm", role: "alert", children: errors[field.key] }))] }, field.key));
+                    return (_jsxs("div", { className: 'grid gap-2 ' + (fullWidth ? 'sm:col-span-2' : ''), children: [_jsxs(Label, { htmlFor: field.key, children: [field.label, field.required && _jsx("span", { className: "text-red-500 ml-1", children: "*" })] }), _jsx(FieldRenderer, { field: field, value: values[field.key], onChange: (v) => update(field.key, v), initialValues: initialValues }), errors[field.key] && (_jsx("span", { className: "text-red-500 text-sm", role: "alert", children: errors[field.key] }))] }, field.key));
                 }) }), _jsxs("div", { className: "flex justify-end gap-2 pt-2", children: [onCancel && (_jsx(Button, { type: "button", variant: "outline", onClick: onCancel, disabled: submitting || disabled, children: cancelLabel })), _jsx(Button, { type: "submit", disabled: submitting || disabled || balanceBlocked, children: submitLabel })] })] }));
 }
-function FieldRenderer({ field, value, onChange }) {
+// seedOptionFromSibling builds a pre-resolved option for an FK field from the
+// resolved sibling the backend served on the initial record (e.g. a line item's
+// `product = { value, label, image }` alongside `product_id`). Lets the picker
+// show the name + thumbnail for an existing value without a lookup. Returns
+// undefined when the sibling carries nothing renderable.
+function seedOptionFromSibling(field, value, initialValues) {
+    if (!field.key.endsWith('_id'))
+        return undefined;
+    const sib = initialValues?.[field.key.replace(/_id$/, '')];
+    if (!sib || typeof sib !== 'object')
+        return undefined;
+    const label = sib.label ?? sib.name ?? '';
+    if (!label && !sib.image)
+        return undefined;
+    const id = String(sib.value ?? sib.id ?? value ?? '');
+    return {
+        id,
+        value: id,
+        label: String(label),
+        name: String(label),
+        image: sib.image,
+        color: sib.color,
+        icon: sib.icon,
+    };
+}
+function FieldRenderer({ field, value, onChange, initialValues }) {
     // Repeatable line-items group → render the row grid. Its value is an array
     // of row objects rather than a scalar.
     if (isLineItemsField(field)) {
@@ -91,7 +116,8 @@ function FieldRenderer({ field, value, onChange }) {
     // Preferred for FK fields with large option sets — no UUID typing, no
     // dumping every row into a plain <select>.
     if (widget === 'dynamic_select') {
-        return _jsx(DynamicSelectField, { field: field, value: value, onChange: onChange });
+        const seedOption = seedOptionFromSibling(field, value, initialValues);
+        return _jsx(DynamicSelectField, { field: field, value: value, onChange: onChange, seedOption: seedOption });
     }
     // File upload → themed picker that POSTs to the host upload endpoint and
     // stores the returned file url/path as the field value.

package/dist/dynamic-relation-helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-relation-helpers.d.ts","sourceRoot":"","sources":["../src/dynamic-relation-helpers.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"dynamic-relation-helpers.d.ts","sourceRoot":"","sources":["../src/dynamic-relation-helpers.ts"],"names":[],"mappings":"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"}

package/dist/dynamic-relation-helpers.js

@@ -10,6 +10,19 @@ function isEnumLikeColumn(col) {
         renderAs === 'badge' ||
         !!col.options?.length);
 }
+// Server-managed / audit columns that must never become editable form inputs.
+// They're set by the backend and several ship as resolved objects (e.g.
+// `created_by = { name, avatar, email }`) that would render as `[object Object]`.
+const MANAGED_RELATION_COLUMNS = new Set([
+    'id',
+    'created_at',
+    'updated_at',
+    'deleted_at',
+    'created_by',
+    'created_by_id',
+    'updated_by',
+    'updated_by_id',
+]);
 // Pulls a human label off a resolved relation/user object a backend serves:
 // `{ value, label }` (FK sibling), `{ name, … }` (user object such as
 // created_by) or `{ title }`. Returns undefined for plain/empty objects so the
@@ -122,6 +135,11 @@ export function deriveRelationFormFields(metadata, foreignKey) {
             continue;
         if (col.hidden)
             continue;
+        // Managed/audit columns are server-owned and ship resolved objects
+        // (`created_by = { name, avatar, … }`); making them editable inputs
+        // renders `[object Object]`. Never surface them in the inline form.
+        if (MANAGED_RELATION_COLUMNS.has(col.key.toLowerCase()))
+            continue;
         out.push({
             key: col.key,
             label: col.label,

package/dist/dynamic-relation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-relation.d.ts","sourceRoot":"","sources":["../src/dynamic-relation.tsx"],"names":[],"mappings":"AA2CA,YAAY,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAA;AACrE,OAAO,EACH,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,yBAAyB,EACzB,wBAAwB,EACxB,aAAa,EACb,wBAAwB,EACxB,kBAAkB,EAClB,WAAW,EACX,eAAe,EACf,cAAc,GACjB,MAAM,4BAA4B,CAAA;AAEnC,MAAM,WAAW,sBAAsB;IACnC,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,kBAAkB,EAAE,MAAM,CAAA;IAC1B,wBAAwB,EAAE,MAAM,CAAA;IAChC,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,iBAAiB,EAAE,MAAM,CAAA;IACzB,uBAAuB,EAAE,MAAM,CAAA;IAC/B,WAAW,EAAE,MAAM,CAAA;CACtB;AAiBD,UAAU,WAAW;IACjB,6BAA6B;IAC7B,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAChC,+DAA+D;IAC/D,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;IACxB,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC,sBAAsB,CAAC,CAAA;IACzC,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACxB;AAED,MAAM,WAAW,6BAA8B,SAAQ,WAAW;IAC9D,IAAI,EAAE,aAAa,CAAA;IACnB,yFAAyF;IACzF,KAAK,EAAE,MAAM,CAAA;IACb,kDAAkD;IAClD,UAAU,EAAE,MAAM,CAAA;IAClB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,MAAM,WAAW,8BAA+B,SAAQ,WAAW;IAC/D,IAAI,EAAE,cAAc,CAAA;IACpB,wEAAwE;IACxE,OAAO,EAAE,MAAM,CAAA;IACf,sEAAsE;IACtE,UAAU,EAAE,MAAM,CAAA;IAClB,6BAA6B;IAC7B,UAAU,EAAE,MAAM,CAAA;IAClB,oEAAoE;IACpE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,mEAAmE;IACnE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,uEAAuE;IACvE,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,MAAM,oBAAoB,GAC1B,6BAA6B,GAC7B,8BAA8B,CAAA;AAEpC,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,+BAK1D"}
+{"version":3,"file":"dynamic-relation.d.ts","sourceRoot":"","sources":["../src/dynamic-relation.tsx"],"names":[],"mappings":"AA6CA,YAAY,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAA;AACrE,OAAO,EACH,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,yBAAyB,EACzB,wBAAwB,EACxB,aAAa,EACb,wBAAwB,EACxB,kBAAkB,EAClB,WAAW,EACX,eAAe,EACf,cAAc,GACjB,MAAM,4BAA4B,CAAA;AAEnC,MAAM,WAAW,sBAAsB;IACnC,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,kBAAkB,EAAE,MAAM,CAAA;IAC1B,wBAAwB,EAAE,MAAM,CAAA;IAChC,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,iBAAiB,EAAE,MAAM,CAAA;IACzB,uBAAuB,EAAE,MAAM,CAAA;IAC/B,WAAW,EAAE,MAAM,CAAA;CACtB;AAiBD,UAAU,WAAW;IACjB,6BAA6B;IAC7B,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAChC,+DAA+D;IAC/D,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;IACxB,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC,sBAAsB,CAAC,CAAA;IACzC,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACxB;AAED,MAAM,WAAW,6BAA8B,SAAQ,WAAW;IAC9D,IAAI,EAAE,aAAa,CAAA;IACnB,yFAAyF;IACzF,KAAK,EAAE,MAAM,CAAA;IACb,kDAAkD;IAClD,UAAU,EAAE,MAAM,CAAA;IAClB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,MAAM,WAAW,8BAA+B,SAAQ,WAAW;IAC/D,IAAI,EAAE,cAAc,CAAA;IACpB,wEAAwE;IACxE,OAAO,EAAE,MAAM,CAAA;IACf,sEAAsE;IACtE,UAAU,EAAE,MAAM,CAAA;IAClB,6BAA6B;IAC7B,UAAU,EAAE,MAAM,CAAA;IAClB,oEAAoE;IACpE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,mEAAmE;IACnE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,uEAAuE;IACvE,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,MAAM,oBAAoB,GAC1B,6BAA6B,GAC7B,8BAA8B,CAAA;AAEpC,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,+BAK1D"}

package/dist/dynamic-relation.js

@@ -10,6 +10,8 @@ import { Plus, Trash2, Pencil } from 'lucide-react';
 import { useApi } from './api-context';
 import { useMetadataCache } from './metadata-cache';
 import { DynamicForm } from './dynamic-form';
+import { useImageUrl } from './image-url-context';
+import { OptionThumb } from './dynamic-select-field';
 import { useOptionsResolver } from './use-options-resolver';
 import { buildCreatePayload, buildPivotAttachPayload, buildPivotRowIndex, buildRelationFilterParams, deriveRelationFormFields, diffSelection, extractSelectedTargetIds, formatRelationCell, pickOptionLabel, relationRowKey, } from './dynamic-relation-helpers';
 export { buildCreatePayload, buildPivotAttachPayload, buildPivotRowIndex, buildRelationFilterParams, deriveRelationFormFields, diffSelection, extractSelectedTargetIds, formatRelationCell, objectLabel, pickOptionLabel, relationRowKey, } from './dynamic-relation-helpers';
@@ -35,6 +37,7 @@ export function DynamicRelation(props) {
 }
 function OneToManyRelation({ kind, model, foreignKey, parentId, filters, endpoint, hiddenColumns = [], canCreate = true, canDelete = true, canEdit = true, strings, className, onChange, }) {
     const api = useApi();
+    const getImageUrl = useImageUrl();
     const { getMetadata, setMetadata: cacheMetadata } = useMetadataCache();
     const cachedMeta = getMetadata(model);
     const labels = { ...DEFAULT_STRINGS, ...(strings || {}) };
@@ -136,6 +139,17 @@ function OneToManyRelation({ kind, model, foreignKey, parentId, filters, endpoin
     }, [api, dataEndpoint, fetchAll, onChange, rowToDelete]);
     return (_jsxs("div", { className: className, "data-relation-kind": kind, "data-relation-model": model, children: [(labels.title || canCreate) && (_jsxs("div", { className: "flex items-center justify-between pb-3", children: [labels.title ? _jsx("h3", { className: "text-sm font-medium", children: labels.title }) : _jsx("span", {}), canCreate && (_jsxs(Button, { size: "sm", variant: "outline", onClick: () => { setEditingRow(null); setFormOpen(true); }, children: [_jsx(Plus, { className: "h-4 w-4 mr-1" }), labels.addLabel] }))] })), loading ? (_jsx("div", { className: "space-y-2", children: Array.from({ length: 3 }).map((_, i) => (_jsx(Skeleton, { className: "h-10 w-full" }, `rel-skeleton-${i}`))) })) : rows.length === 0 ? (_jsx("div", { className: "text-center text-sm text-muted-foreground py-8 border rounded-md bg-muted/30", children: labels.emptyState })) : (_jsx("div", { className: "border rounded-md divide-y bg-card", children: rows.map((row, idx) => (_jsxs("div", { className: "flex items-center justify-between gap-3 px-3 py-2", children: [_jsx("div", { className: "flex-1 grid grid-cols-[repeat(auto-fit,minmax(0,1fr))] gap-2 text-sm", children: visibleColumns.map(col => {
                                 const cell = formatRelationCell(row, col);
+                                // FK column whose backend-resolved sibling
+                                // carries an image → render a thumbnail + label
+                                // instead of plain text (e.g. a line item's
+                                // product photo). The sibling is the column key
+                                // with the trailing `_id` stripped.
+                                const isFk = !!col.ref || col.key.endsWith('_id');
+                                const sibling = isFk ? row[col.key.replace(/_id$/, '')] : undefined;
+                                if (sibling && typeof sibling === 'object' && sibling.image) {
+                                    const label = sibling.label ?? sibling.name ?? cell;
+                                    return (_jsxs("span", { className: "flex min-w-0 items-center gap-2", title: String(label), children: [_jsx(OptionThumb, { image: getImageUrl(sibling.image), size: 20 }), _jsx("span", { className: "truncate", children: label })] }, col.key));
+                                }
                                 return (_jsx("span", { className: "truncate", title: cell, children: cell }, col.key));
                             }) }), _jsxs("div", { className: "flex items-center gap-1 shrink-0", children: [canEdit && (_jsx(Button, { size: "sm", variant: "ghost", onClick: () => { setEditingRow(row); setFormOpen(true); }, "aria-label": labels.editLabel, children: _jsx(Pencil, { className: "h-4 w-4" }) })), canDelete && (_jsx(Button, { size: "sm", variant: "ghost", onClick: () => setRowToDelete(row), "aria-label": labels.removeLabel, children: _jsx(Trash2, { className: "h-4 w-4" }) }))] })] }, relationRowKey(row, idx, foreignKey)))) })), _jsx(Dialog, { open: formOpen, onOpenChange: (open) => { setFormOpen(open); if (!open)
                     setEditingRow(null); }, children: _jsxs(DialogContent, { children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: editingRow ? labels.editLabel : labels.addLabel }) }), _jsx(DynamicForm, { fields: formFields, initialValues: editingRow || undefined, onSubmit: handleSubmit, onCancel: () => { setFormOpen(false); setEditingRow(null); }, submitLabel: labels.saveLabel, cancelLabel: labels.cancelLabel, disabled: submitting })] }) }), _jsx(AlertDialog, { open: !!rowToDelete, onOpenChange: (open) => !open && setRowToDelete(null), children: _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: labels.confirmRemoveTitle }), _jsx(AlertDialogDescription, { children: labels.confirmRemoveDescription })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { disabled: submitting, children: labels.cancelLabel }), _jsx(AlertDialogAction, { onClick: (e) => { e.preventDefault(); handleDelete(); }, className: "bg-red-600 hover:bg-red-700", disabled: submitting, children: labels.removeLabel })] })] }) })] }));

package/dist/dynamic-select-field.d.ts

@@ -24,7 +24,14 @@ export interface DynamicSelectFieldProps {
     field: ActionFieldDef;
     value: any;
     onChange: (v: any) => void;
+    /**
+     * Pre-resolved option for the CURRENT value (label + image/color/icon) the
+     * caller already has — e.g. the relation sibling the table served. Lets the
+     * trigger show the name + thumbnail for an existing value without waiting for
+     * a lookup (which only loads once the popover opens). Matched by id == value.
+     */
+    seedOption?: ResolvedOption | null;
 }
-export declare function DynamicSelectField({ field, value, onChange }: DynamicSelectFieldProps): import("react").JSX.Element;
+export declare function DynamicSelectField({ field, value, onChange, seedOption }: DynamicSelectFieldProps): import("react").JSX.Element;
 export default DynamicSelectField;
 //# sourceMappingURL=dynamic-select-field.d.ts.map

package/dist/dynamic-select-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-select-field.d.ts","sourceRoot":"","sources":["../src/dynamic-select-field.tsx"],"names":[],"mappings":"AAuCA,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAEhF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,IAAS,EAAE,EAAE;IAAE,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,+BA4BzF;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EACvB,MAAM,EACN,IAAS,GACZ,EAAE;IACC,MAAM,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC,GAAG,IAAI,CAAA;IAChE,IAAI,CAAC,EAAE,MAAM,CAAA;CAChB,sCAwBA;AAqBD,MAAM,WAAW,uBAAuB;IACpC,KAAK,EAAE,cAAc,CAAA;IACrB,KAAK,EAAE,GAAG,CAAA;IACV,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAA;CAC7B;AAED,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,uBAAuB,+BA0KrF;AAED,eAAe,kBAAkB,CAAA"}
+{"version":3,"file":"dynamic-select-field.d.ts","sourceRoot":"","sources":["../src/dynamic-select-field.tsx"],"names":[],"mappings":"AAuCA,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAEhF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,IAAS,EAAE,EAAE;IAAE,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,+BA4BzF;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EACvB,MAAM,EACN,IAAS,GACZ,EAAE;IACC,MAAM,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC,GAAG,IAAI,CAAA;IAChE,IAAI,CAAC,EAAE,MAAM,CAAA;CAChB,sCAwBA;AAqBD,MAAM,WAAW,uBAAuB;IACpC,KAAK,EAAE,cAAc,CAAA;IACrB,KAAK,EAAE,GAAG,CAAA;IACV,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAA;IAC1B;;;;;OAKG;IACH,UAAU,CAAC,EAAE,cAAc,GAAG,IAAI,CAAA;CACrC;AAED,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,uBAAuB,+BA2KjG;AAED,eAAe,kBAAkB,CAAA"}

package/dist/dynamic-select-field.js

@@ -79,7 +79,7 @@ function useDebounced(value, ms) {
     }, [value, ms]);
     return debounced;
 }
-export function DynamicSelectField({ field, value, onChange }) {
+export function DynamicSelectField({ field, value, onChange, seedOption }) {
     const [open, setOpen] = useState(false);
     const [search, setSearch] = useState('');
     const debounced = useDebounced(search, 250);
@@ -107,6 +107,7 @@ export function DynamicSelectField({ field, value, onChange }) {
     // label and its thumbnail.
     const selectedOption = (picked && String(picked.id) === String(value) ? picked : null) ??
         options.find((o) => String(o.id) === String(value)) ??
+        (seedOption && String(seedOption.id) === String(value) ? seedOption : null) ??
         null;
     const selectedLabel = selectedOption?.label ?? (value ? String(value) : '');
     // Only switch the picker into "with thumbnails" mode when the data actually

package/dist/dynamic-table.d.ts

@@ -23,7 +23,13 @@ interface DynamicTableProps {
      * Optional — omitting it preserves the legacy browser-local formatting.
      */
     timeZone?: string;
+    /**
+     * ISO 4217 currency code (e.g. the org's `MXN`) used as the fallback for
+     * money cells (`type:'number'` + `cellStyle:'currency'`) that don't carry
+     * an explicit per-column currency. Optional — defaults to 'USD'.
+     */
+    currency?: string;
 }
-export declare function DynamicTable({ model, endpoint, enableUrlSync, hiddenColumns, onAction, refreshTrigger, defaultFilters, extraColumns, getDynamicColumns, timeZone, }: DynamicTableProps): import("react").JSX.Element;
+export declare function DynamicTable({ model, endpoint, enableUrlSync, hiddenColumns, onAction, refreshTrigger, defaultFilters, extraColumns, getDynamicColumns, timeZone, currency, }: DynamicTableProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=dynamic-table.d.ts.map

package/dist/dynamic-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-table.d.ts","sourceRoot":"","sources":["../src/dynamic-table.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAKH,KAAK,SAAS,EAajB,MAAM,uBAAuB,CAAA;AA+B9B,OAAO,KAAK,EAAsB,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAUnF,UAAU,iBAAiB;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;IACxB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,IAAI,CAAA;IAC7C,cAAc,CAAC,EAAE,GAAG,CAAA;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACpC,YAAY,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE,CAAA;IAC/B;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;IACrC;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,wBAAgB,YAAY,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,aAAoB,EACpB,aAAkB,EAClB,QAAQ,EACR,cAAc,EACd,cAAc,EACd,YAAiB,EACjB,iBAA4C,EAC5C,QAAQ,GACX,EAAE,iBAAiB,+BAgyBnB"}
+{"version":3,"file":"dynamic-table.d.ts","sourceRoot":"","sources":["../src/dynamic-table.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAKH,KAAK,SAAS,EAajB,MAAM,uBAAuB,CAAA;AA+B9B,OAAO,KAAK,EAAsB,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAUnF,UAAU,iBAAiB;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;IACxB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,IAAI,CAAA;IAC7C,cAAc,CAAC,EAAE,GAAG,CAAA;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACpC,YAAY,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE,CAAA;IAC/B;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;IACrC;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,wBAAgB,YAAY,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,aAAoB,EACpB,aAAkB,EAClB,QAAQ,EACR,cAAc,EACd,cAAc,EACd,YAAiB,EACjB,iBAA4C,EAC5C,QAAQ,EACR,QAAQ,GACX,EAAE,iBAAiB,+BAgyBnB"}

package/dist/dynamic-table.js

@@ -31,7 +31,7 @@ import { getSearchableColumnKeys } from './column-visibility';
 import { DynamicRecordDialog } from './dialogs/dynamic-record';
 import { ExportDialog } from './dialogs/export';
 import { ImportDialog } from './dialogs/import';
-export function DynamicTable({ model, endpoint, enableUrlSync = true, hiddenColumns = [], onAction, refreshTrigger, defaultFilters, extraColumns = [], getDynamicColumns = defaultGetDynamicColumns, timeZone, }) {
+export function DynamicTable({ model, endpoint, enableUrlSync = true, hiddenColumns = [], onAction, refreshTrigger, defaultFilters, extraColumns = [], getDynamicColumns = defaultGetDynamicColumns, timeZone, currency, }) {
     const { t, i18n } = useTranslation();
     const api = useApi();
     const currentBranch = useCurrentBranch();
@@ -555,12 +555,12 @@ export function DynamicTable({ model, endpoint, enableUrlSync = true, hiddenColu
         const rowMetadata = metadata.actions?.some((a) => a.placement === 'table' || a.placement === 'create')
             ? { ...metadata, actions: metadata.actions.filter((a) => !a.placement || a.placement === 'row') }
             : metadata;
-        const baseColumns = getDynamicColumns(rowMetadata, handleInternalAction, t, i18n.language, columnFilterConfigs, timeZone);
+        const baseColumns = getDynamicColumns(rowMetadata, handleInternalAction, t, i18n.language, columnFilterConfigs, timeZone, currency);
         const filteredBase = baseColumns.filter((col) => !hiddenColumns.includes(col.id));
         const actionsCol = filteredBase.find((c) => c.id === 'actions');
         const otherCols = filteredBase.filter((c) => c.id !== 'actions');
         return [...otherCols, ...extraColumns, ...(actionsCol ? [actionsCol] : [])];
-    }, [metadata, handleInternalAction, hiddenColumns, extraColumns, t, i18n.language, columnFilterConfigs, getDynamicColumns, timeZone]);
+    }, [metadata, handleInternalAction, hiddenColumns, extraColumns, t, i18n.language, columnFilterConfigs, getDynamicColumns, timeZone, currency]);
     const filters = useMemo(() => [], []);
     const table = useReactTable({
         data,

package/dist/image-url-context.d.ts

@@ -0,0 +1,13 @@
+/** Resolves a (possibly relative) storage path into a fetchable URL. */
+export type GetImageUrl = (path: string | null | undefined) => string;
+/** Default resolver: pass the path through unchanged (works same-origin). */
+export declare const identityImageUrl: GetImageUrl;
+/**
+ * Threads the host's image-url resolver to nested field/cell components without
+ * prop-drilling. Provided by `DynamicRecordDialog`; consumers outside a provider
+ * fall back to `identityImageUrl` (the relative path, which renders same-origin).
+ */
+export declare const ImageUrlContext: import("react").Context<GetImageUrl>;
+/** Reads the nearest image-url resolver (identity outside a provider). */
+export declare const useImageUrl: () => GetImageUrl;
+//# sourceMappingURL=image-url-context.d.ts.map

package/dist/image-url-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-url-context.d.ts","sourceRoot":"","sources":["../src/image-url-context.tsx"],"names":[],"mappings":"AAQA,wEAAwE;AACxE,MAAM,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,KAAK,MAAM,CAAA;AAErE,6EAA6E;AAC7E,eAAO,MAAM,gBAAgB,EAAE,WAA4B,CAAA;AAE3D;;;;GAIG;AACH,eAAO,MAAM,eAAe,sCAA+C,CAAA;AAE3E,0EAA0E;AAC1E,eAAO,MAAM,WAAW,mBAAoC,CAAA"}

package/dist/image-url-context.js

@@ -0,0 +1,17 @@
+// Image-url resolver context — its own module so any renderer (record dialog,
+// relation cells, …) can consume the host's storage-path → URL resolver without
+// importing from `dialogs/dynamic-record`. That dialog imports
+// `dynamic-relations` (which renders `dynamic-relation`), so the relation cell
+// cannot import the context back from the dialog without a circular import —
+// hence this standalone module is the single source of truth.
+import { createContext, useContext } from 'react';
+/** Default resolver: pass the path through unchanged (works same-origin). */
+export const identityImageUrl = (p) => p ?? '';
+/**
+ * Threads the host's image-url resolver to nested field/cell components without
+ * prop-drilling. Provided by `DynamicRecordDialog`; consumers outside a provider
+ * fall back to `identityImageUrl` (the relative path, which renders same-origin).
+ */
+export const ImageUrlContext = createContext(identityImageUrl);
+/** Reads the nearest image-url resolver (identity outside a provider). */
+export const useImageUrl = () => useContext(ImageUrlContext);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@asteby/metacore-runtime-react",
-  "version": "18.2.0",
+  "version": "18.4.0",
   "description": "React runtime for metacore hosts — renders addon contributions dynamically",
   "repository": {
     "type": "git",

package/src/__tests__/dynamic-relation.test.ts

@@ -114,6 +114,23 @@ describe('deriveRelationFormFields', () => {
         expect(fields.find(f => f.key === 'id')).toBeUndefined()
     })
 
+    // Server-managed / audit columns ship as resolved objects (created_by =
+    // { name, avatar }) and must never become editable inputs ([object Object]).
+    it('omite columnas managed/audit aunque no estén hidden', () => {
+        const meta: Pick<TableMetadata, 'columns'> = {
+            columns: [
+                { key: 'sku', label: 'SKU', type: 'text', sortable: true, filterable: true },
+                { key: 'created_by', label: 'Creado por', type: 'text', sortable: false, filterable: false },
+                { key: 'created_by_id', label: 'Creado por id', type: 'text', sortable: false, filterable: false },
+                { key: 'created_at', label: 'Creado', type: 'date', sortable: true, filterable: false },
+                { key: 'updated_at', label: 'Actualizado', type: 'date', sortable: true, filterable: false },
+                { key: 'deleted_at', label: 'Eliminado', type: 'date', sortable: false, filterable: false },
+            ],
+        }
+        const fields = deriveRelationFormFields(meta, 'invoice_id')
+        expect(fields.map(f => f.key)).toEqual(['sku'])
+    })
+
     it('mapea types de ColumnDefinition al ActionFieldDef.type', () => {
         const fields = deriveRelationFormFields(baseMeta, 'invoice_id')
         const byKey = Object.fromEntries(fields.map(f => [f.key, f]))

package/src/__tests__/org-currency-money.test.ts

@@ -0,0 +1,62 @@
+// Locks the org-currency fallback contract for money rendering: the table cell
+// (`resolveCurrency`) and the record dialog (`isMoneyField`). Pure logic, no DOM.
+import { describe, it, expect } from 'vitest'
+import { resolveCurrency } from '../dynamic-columns'
+import { isMoneyField } from '../dialogs/dynamic-record'
+import type { ColumnDefinition } from '../types'
+import type { FieldDef } from '../dialogs/dynamic-record'
+
+const col = (over: Partial<ColumnDefinition>): ColumnDefinition => ({
+    key: 'total',
+    label: 'Total',
+    type: 'number',
+    sortable: true,
+    filterable: true,
+    ...over,
+})
+
+const field = (over: Partial<FieldDef>): FieldDef => ({
+    key: 'total',
+    label: 'Total',
+    type: 'number',
+    ...over,
+})
+
+describe('resolveCurrency', () => {
+    it("defaults to 'USD' when neither the column nor the org provide one", () => {
+        expect(resolveCurrency(col({}))).toBe('USD')
+    })
+
+    it('falls back to the org currency when the column has no explicit currency', () => {
+        expect(resolveCurrency(col({}), 'MXN')).toBe('MXN')
+    })
+
+    it('prefers the explicit per-column currency over the org fallback', () => {
+        expect(resolveCurrency(col({ styleConfig: { currency: 'EUR' } }), 'MXN')).toBe('EUR')
+    })
+})
+
+describe('isMoneyField', () => {
+    it("recognizes the backend cellStyle:'currency' stamp regardless of key", () => {
+        expect(isMoneyField(field({ key: 'foo', cellStyle: 'currency' }), 100)).toBe(true)
+    })
+
+    it('detects numeric money keys via the heuristic (no stamp needed)', () => {
+        expect(isMoneyField(field({ key: 'total' }), 100)).toBe(true)
+        expect(isMoneyField(field({ key: 'sub_total' }), 100)).toBe(true)
+        expect(isMoneyField(field({ key: 'tax_amount' }), 16)).toBe(true)
+        expect(isMoneyField(field({ key: 'unit_price' }), 5)).toBe(true)
+        expect(isMoneyField(field({ key: 'balance' }), 0)).toBe(true)
+    })
+
+    it('accepts numeric strings the backend serializes', () => {
+        expect(isMoneyField(field({ key: 'total' }), '100')).toBe(true)
+    })
+
+    it('ignores non-money keys and non-numeric values', () => {
+        expect(isMoneyField(field({ key: 'name' }), 'Acme')).toBe(false)
+        expect(isMoneyField(field({ key: 'quantity' }), 3)).toBe(false)
+        expect(isMoneyField(field({ key: 'total' }), 'n/a')).toBe(false)
+        expect(isMoneyField(field({ key: 'total' }), null)).toBe(false)
+    })
+})

package/src/dialogs/dynamic-record.tsx

@@ -56,10 +56,11 @@ import { isNilUuid, normalizeNilUuid } from '../nil-uuid'
 import { humanizeToken } from '../dynamic-columns-helpers'
 import { formatDateCell } from '../dynamic-columns'
 import type { ActionFieldDef, RelationMeta } from '../types'
+import { ImageUrlContext, identityImageUrl, type GetImageUrl } from '../image-url-context'
 
-/** Resolves a (possibly relative) storage path into a fetchable URL. */
-export type GetImageUrl = (path: string | null | undefined) => string
-const identityImageUrl: GetImageUrl = (p) => p ?? ''
+// Re-export the resolver type so `index.ts`'s
+// `export type { … GetImageUrl } from './dialogs/dynamic-record'` keeps working.
+export type { GetImageUrl }
 
 export interface FieldOption {
     value: string
@@ -106,6 +107,19 @@ export interface FieldDef {
      * its SQL type. Unknown values fall through to the `type`-based default.
      */
     widget?: string
+    /**
+     * Declarative display hint the backend stamps on the column/modal field
+     * (mirrors the table column's `cellStyle`). `'currency'` makes the view
+     * renderer format the numeric value in the org currency. Optional —
+     * absent, a money-key heuristic still detects obvious money fields.
+     */
+    cellStyle?: string
+    /**
+     * Per-field style overrides served alongside `cellStyle` (e.g.
+     * `{ currency: 'MXN' }`). When it carries an explicit `currency` it wins
+     * over the org fallback.
+     */
+    styleConfig?: Record<string, any>
 }
 
 // Permissive shape: the wire payload may omit some fields (e.g. `title` is
@@ -207,6 +221,12 @@ export interface DynamicRecordDialogProps {
      * regardless of the viewer's browser timezone. Pure `date` values pin to UTC.
      */
     timeZone?: string
+    /**
+     * Org ISO-4217 currency code (e.g. `MXN`) used as the fallback for money
+     * fields (`cellStyle:'currency'` or the money-key heuristic) that lack an
+     * explicit per-field currency. Optional — defaults to 'USD'.
+     */
+    currency?: string
 }
 
 function resolvePath(obj: any, path: string): any {
@@ -330,8 +350,31 @@ const MODE_CONFIG = {
 // Context threading host runtime values to nested field components (uploads,
 // image leads, tz-aware dates) without prop-drilling through every renderer.
 const ModelContext = createContext('')
-const ImageUrlContext = createContext<GetImageUrl>(identityImageUrl)
 const TimeZoneContext = createContext<string | undefined>(undefined)
+// Org ISO-4217 currency (org config, like the timezone) used as the fallback
+// for money fields that don't carry an explicit per-field currency.
+const CurrencyContext = createContext<string | undefined>(undefined)
+
+// Money-key heuristic mirroring the backend's `inferDisplayCellStyle`: lets the
+// dialog format obvious money fields as currency even when the backend hasn't
+// stamped `cellStyle:'currency'` yet. Case-insensitive; matches a key that
+// equals one of these, or ends with `_<m>`, or starts with `<m>_`.
+const MONEY_KEY_HEURISTIC = ['price', 'amount', 'total', 'cost', 'subtotal', 'balance', 'paid']
+
+// isMoneyField decides whether a field should render as currency. The explicit
+// `cellStyle:'currency'` stamp always wins; otherwise a numeric value whose key
+// matches the money heuristic qualifies (robustness fallback).
+export function isMoneyField(field: FieldDef, value: any): boolean {
+    if (field.cellStyle === 'currency') return true
+    if (value === null || value === undefined || value === '') return false
+    const num = typeof value === 'number' ? value : Number(value)
+    if (isNaN(num)) return false
+    const key = String(field.key || '').toLowerCase()
+    if (!key) return false
+    return MONEY_KEY_HEURISTIC.some(
+        m => key === m || key.endsWith(`_${m}`) || key.startsWith(`${m}_`),
+    )
+}
 
 export function DynamicRecordDialog({
     open,
@@ -351,6 +394,7 @@ export function DynamicRecordDialog({
     initialRecord,
     getImageUrl = identityImageUrl,
     timeZone,
+    currency,
 }: DynamicRecordDialogProps) {
     const api = useApi()
     const { t } = useTranslation()
@@ -603,6 +647,7 @@ export function DynamicRecordDialog({
                         <ModelContext.Provider value={model}>
                         <ImageUrlContext.Provider value={getImageUrl}>
                         <TimeZoneContext.Provider value={timeZone}>
+                        <CurrencyContext.Provider value={currency}>
                             <form
                                 id="dynamic-record-form"
                                 onSubmit={handleSubmit}
@@ -656,6 +701,7 @@ export function DynamicRecordDialog({
                                     />
                                 </div>
                             )}
+                        </CurrencyContext.Provider>
                         </TimeZoneContext.Provider>
                         </ImageUrlContext.Provider>
                         </ModelContext.Provider>
@@ -810,6 +856,7 @@ export function ViewValue({
     record,
     getImageUrl: getImageUrlProp,
     timeZone: timeZoneProp,
+    currency: currencyProp,
 }: {
     field: FieldDef
     value: any
@@ -818,11 +865,16 @@ export function ViewValue({
     getImageUrl?: GetImageUrl
     /** Optional override; when omitted falls back to the nearest provider. */
     timeZone?: string
+    /** Optional override; when omitted falls back to the nearest provider. */
+    currency?: string
 }) {
+    const { i18n } = useTranslation()
     const ctxImageUrl = useContext(ImageUrlContext)
     const ctxTimeZone = useContext(TimeZoneContext)
+    const ctxCurrency = useContext(CurrencyContext)
     const getImageUrl = getImageUrlProp ?? ctxImageUrl
     const timeZone = timeZoneProp ?? ctxTimeZone
+    const currency = currencyProp ?? ctxCurrency
 
     // created_by / avatar resolver sibling → name (+ avatar) instead of "—".
     if (field.type === 'avatar' || field.key === 'created_by' || field.key === 'created_by_id') {
@@ -904,6 +956,24 @@ export function ViewValue({
         )
     }
 
+    // Money → org-currency string. Detected by the backend `cellStyle:'currency'`
+    // stamp or a numeric value whose key matches the money heuristic (fallback
+    // mirroring the table cell + backend `inferDisplayCellStyle`).
+    if (isMoneyField(field, value)) {
+        const num = typeof value === 'number' ? value : Number(value)
+        if (!isNaN(num)) {
+            const resolvedCurrency = field.styleConfig?.currency || currency || 'USD'
+            const localeTag = i18n.language || 'es'
+            const formatted = new Intl.NumberFormat(localeTag, {
+                style: 'currency',
+                currency: resolvedCurrency,
+                minimumFractionDigits: 2,
+                maximumFractionDigits: 2,
+            }).format(num)
+            return <p className="text-sm py-1 tabular-nums">{formatted}</p>
+        }
+    }
+
     // Date/datetime/timestamp → tz-aware format. `date` pins to UTC (calendar
     // day); instants render in the org timezone with a full-precision tooltip.
     if (field.type === 'date' || field.type === 'datetime' || field.type === 'timestamp') {

package/src/dynamic-columns-shim.ts

@@ -31,6 +31,7 @@ export type GetDynamicColumns = (
     language: string,
     columnFilterConfigs: Map<string, ColumnFilterConfig>,
     timeZone?: string,
+    currency?: string,
 ) => ColumnDef<any>[]
 
 /** Signature for the host-provided `DynamicIcon` renderer. */

package/src/dynamic-columns.tsx

@@ -93,9 +93,13 @@ const styleCfg = (
 
 const EmptyCell = () => <span className="text-muted-foreground">-</span>
 
-/** Resolves the active org currency, defaulting to USD when no override. */
-const resolveCurrency = (col: ColumnDefinition): string =>
-    styleCfg(col, 'currency') || 'USD'
+/**
+ * Resolves the active currency for a column: the column's explicit currency
+ * style wins, then the org-level fallback (org config, like `timeZone`), then
+ * 'USD' as a last resort.
+ */
+export const resolveCurrency = (col: ColumnDefinition, orgCurrency?: string): string =>
+    styleCfg(col, 'currency') || orgCurrency || 'USD'
 
 const formatNumber = (
     value: number,
@@ -559,6 +563,7 @@ export function makeDefaultGetDynamicColumns(
         currentLanguage?: string,
         filterConfigs?: Map<string, ColumnFilterConfig>,
         timeZone?: string,
+        currency?: string,
     ): ColumnDef<any>[] {
         const dateLocale = currentLanguage === 'en' ? enUS : es
         const columns: ColumnDef<any>[] = [
@@ -842,7 +847,7 @@ export function makeDefaultGetDynamicColumns(
                                         num,
                                         {
                                             style: 'currency',
-                                            currency: resolveCurrency(col),
+                                            currency: resolveCurrency(col, currency),
                                             minimumFractionDigits: decimals,
                                             maximumFractionDigits: decimals,
                                         },

package/src/dynamic-form.tsx

@@ -129,6 +129,7 @@ export function DynamicForm({
                                 field={field}
                                 value={values[field.key]}
                                 onChange={(v: any) => update(field.key, v)}
+                                initialValues={initialValues}
                             />
                             {errors[field.key] && (
                                 <span className="text-red-500 text-sm" role="alert">{errors[field.key]}</span>
@@ -155,9 +156,38 @@ interface FieldRendererProps {
     field: ActionFieldDef
     value: any
     onChange: (v: any) => void
+    /** The form's initial record — used to seed an FK picker's existing label/image. */
+    initialValues?: Record<string, any>
+}
+
+// seedOptionFromSibling builds a pre-resolved option for an FK field from the
+// resolved sibling the backend served on the initial record (e.g. a line item's
+// `product = { value, label, image }` alongside `product_id`). Lets the picker
+// show the name + thumbnail for an existing value without a lookup. Returns
+// undefined when the sibling carries nothing renderable.
+function seedOptionFromSibling(
+    field: ActionFieldDef,
+    value: any,
+    initialValues?: Record<string, any>,
+): ResolvedOption | undefined {
+    if (!field.key.endsWith('_id')) return undefined
+    const sib = initialValues?.[field.key.replace(/_id$/, '')]
+    if (!sib || typeof sib !== 'object') return undefined
+    const label = sib.label ?? sib.name ?? ''
+    if (!label && !sib.image) return undefined
+    const id = String(sib.value ?? sib.id ?? value ?? '')
+    return {
+        id,
+        value: id,
+        label: String(label),
+        name: String(label),
+        image: sib.image,
+        color: sib.color,
+        icon: sib.icon,
+    }
 }
 
-function FieldRenderer({ field, value, onChange }: FieldRendererProps) {
+function FieldRenderer({ field, value, onChange, initialValues }: FieldRendererProps) {
     // Repeatable line-items group → render the row grid. Its value is an array
     // of row objects rather than a scalar.
     if (isLineItemsField(field)) {
@@ -168,7 +198,8 @@ function FieldRenderer({ field, value, onChange }: FieldRendererProps) {
     // Preferred for FK fields with large option sets — no UUID typing, no
     // dumping every row into a plain <select>.
     if (widget === 'dynamic_select') {
-        return <DynamicSelectField field={field} value={value} onChange={onChange} />
+        const seedOption = seedOptionFromSibling(field, value, initialValues)
+        return <DynamicSelectField field={field} value={value} onChange={onChange} seedOption={seedOption} />
     }
     // File upload → themed picker that POSTs to the host upload endpoint and
     // stores the returned file url/path as the field value.

package/src/dynamic-relation-helpers.ts

@@ -20,6 +20,20 @@ function isEnumLikeColumn(col: ColumnDefinition): boolean {
 
 export type DynamicRelationKind = 'one_to_many' | 'many_to_many'
 
+// Server-managed / audit columns that must never become editable form inputs.
+// They're set by the backend and several ship as resolved objects (e.g.
+// `created_by = { name, avatar, email }`) that would render as `[object Object]`.
+const MANAGED_RELATION_COLUMNS = new Set([
+    'id',
+    'created_at',
+    'updated_at',
+    'deleted_at',
+    'created_by',
+    'created_by_id',
+    'updated_by',
+    'updated_by_id',
+])
+
 // Pulls a human label off a resolved relation/user object a backend serves:
 // `{ value, label }` (FK sibling), `{ name, … }` (user object such as
 // created_by) or `{ title }`. Returns undefined for plain/empty objects so the
@@ -146,6 +160,10 @@ export function deriveRelationFormFields(
     for (const col of metadata.columns) {
         if (col.key === foreignKey) continue
         if (col.hidden) continue
+        // Managed/audit columns are server-owned and ship resolved objects
+        // (`created_by = { name, avatar, … }`); making them editable inputs
+        // renders `[object Object]`. Never surface them in the inline form.
+        if (MANAGED_RELATION_COLUMNS.has(col.key.toLowerCase())) continue
         out.push({
             key: col.key,
             label: col.label,

package/src/dynamic-relation.tsx

@@ -25,6 +25,8 @@ import { Plus, Trash2, Pencil } from 'lucide-react'
 import { useApi } from './api-context'
 import { useMetadataCache } from './metadata-cache'
 import { DynamicForm } from './dynamic-form'
+import { useImageUrl } from './image-url-context'
+import { OptionThumb } from './dynamic-select-field'
 import { useOptionsResolver } from './use-options-resolver'
 import type { ApiResponse, TableMetadata } from './types'
 import {
@@ -169,6 +171,7 @@ function OneToManyRelation({
     onChange,
 }: DynamicRelationOneToManyProps) {
     const api = useApi()
+    const getImageUrl = useImageUrl()
     const { getMetadata, setMetadata: cacheMetadata } = useMetadataCache()
     const cachedMeta = getMetadata(model)
     const labels = { ...DEFAULT_STRINGS, ...(strings || {}) }
@@ -305,6 +308,22 @@ function OneToManyRelation({
                             <div className="flex-1 grid grid-cols-[repeat(auto-fit,minmax(0,1fr))] gap-2 text-sm">
                                 {visibleColumns.map(col => {
                                     const cell = formatRelationCell(row, col)
+                                    // FK column whose backend-resolved sibling
+                                    // carries an image → render a thumbnail + label
+                                    // instead of plain text (e.g. a line item's
+                                    // product photo). The sibling is the column key
+                                    // with the trailing `_id` stripped.
+                                    const isFk = !!col.ref || col.key.endsWith('_id')
+                                    const sibling = isFk ? (row as any)[col.key.replace(/_id$/, '')] : undefined
+                                    if (sibling && typeof sibling === 'object' && sibling.image) {
+                                        const label = sibling.label ?? sibling.name ?? cell
+                                        return (
+                                            <span key={col.key} className="flex min-w-0 items-center gap-2" title={String(label)}>
+                                                <OptionThumb image={getImageUrl(sibling.image)} size={20} />
+                                                <span className="truncate">{label}</span>
+                                            </span>
+                                        )
+                                    }
                                     return (
                                         <span key={col.key} className="truncate" title={cell}>
                                             {cell}

package/src/dynamic-select-field.tsx

@@ -138,9 +138,16 @@ export interface DynamicSelectFieldProps {
     field: ActionFieldDef
     value: any
     onChange: (v: any) => void
+    /**
+     * Pre-resolved option for the CURRENT value (label + image/color/icon) the
+     * caller already has — e.g. the relation sibling the table served. Lets the
+     * trigger show the name + thumbnail for an existing value without waiting for
+     * a lookup (which only loads once the popover opens). Matched by id == value.
+     */
+    seedOption?: ResolvedOption | null
 }
 
-export function DynamicSelectField({ field, value, onChange }: DynamicSelectFieldProps) {
+export function DynamicSelectField({ field, value, onChange, seedOption }: DynamicSelectFieldProps) {
     const [open, setOpen] = useState(false)
     const [search, setSearch] = useState('')
     const debounced = useDebounced(search, 250)
@@ -172,6 +179,7 @@ export function DynamicSelectField({ field, value, onChange }: DynamicSelectFiel
     const selectedOption =
         (picked && String(picked.id) === String(value) ? picked : null) ??
         options.find((o) => String(o.id) === String(value)) ??
+        (seedOption && String(seedOption.id) === String(value) ? seedOption : null) ??
         null
 
     const selectedLabel = selectedOption?.label ?? (value ? String(value) : '')

package/src/dynamic-table.tsx

@@ -97,6 +97,12 @@ interface DynamicTableProps {
      * Optional — omitting it preserves the legacy browser-local formatting.
      */
     timeZone?: string
+    /**
+     * ISO 4217 currency code (e.g. the org's `MXN`) used as the fallback for
+     * money cells (`type:'number'` + `cellStyle:'currency'`) that don't carry
+     * an explicit per-column currency. Optional — defaults to 'USD'.
+     */
+    currency?: string
 }
 
 export function DynamicTable({
@@ -110,6 +116,7 @@ export function DynamicTable({
     extraColumns = [],
     getDynamicColumns = defaultGetDynamicColumns,
     timeZone,
+    currency,
 }: DynamicTableProps) {
     const { t, i18n } = useTranslation()
     const api = useApi()
@@ -598,12 +605,12 @@ export function DynamicTable({
         const rowMetadata = metadata.actions?.some((a) => a.placement === 'table' || a.placement === 'create')
             ? { ...metadata, actions: metadata.actions.filter((a) => !a.placement || a.placement === 'row') }
             : metadata
-        const baseColumns = getDynamicColumns(rowMetadata, handleInternalAction, t, i18n.language, columnFilterConfigs, timeZone)
+        const baseColumns = getDynamicColumns(rowMetadata, handleInternalAction, t, i18n.language, columnFilterConfigs, timeZone, currency)
         const filteredBase = baseColumns.filter((col: ColumnDef<any>) => !hiddenColumns.includes(col.id as string))
         const actionsCol = filteredBase.find((c: ColumnDef<any>) => c.id === 'actions')
         const otherCols = filteredBase.filter((c: ColumnDef<any>) => c.id !== 'actions')
         return [...otherCols, ...extraColumns, ...(actionsCol ? [actionsCol] : [])]
-    }, [metadata, handleInternalAction, hiddenColumns, extraColumns, t, i18n.language, columnFilterConfigs, getDynamicColumns, timeZone])
+    }, [metadata, handleInternalAction, hiddenColumns, extraColumns, t, i18n.language, columnFilterConfigs, getDynamicColumns, timeZone, currency])
 
     const filters = useMemo(() => [], [])
 

package/src/image-url-context.tsx

@@ -0,0 +1,23 @@
+// Image-url resolver context — its own module so any renderer (record dialog,
+// relation cells, …) can consume the host's storage-path → URL resolver without
+// importing from `dialogs/dynamic-record`. That dialog imports
+// `dynamic-relations` (which renders `dynamic-relation`), so the relation cell
+// cannot import the context back from the dialog without a circular import —
+// hence this standalone module is the single source of truth.
+import { createContext, useContext } from 'react'
+
+/** Resolves a (possibly relative) storage path into a fetchable URL. */
+export type GetImageUrl = (path: string | null | undefined) => string
+
+/** Default resolver: pass the path through unchanged (works same-origin). */
+export const identityImageUrl: GetImageUrl = (p) => p ?? ''
+
+/**
+ * Threads the host's image-url resolver to nested field/cell components without
+ * prop-drilling. Provided by `DynamicRecordDialog`; consumers outside a provider
+ * fall back to `identityImageUrl` (the relative path, which renders same-origin).
+ */
+export const ImageUrlContext = createContext<GetImageUrl>(identityImageUrl)
+
+/** Reads the nearest image-url resolver (identity outside a provider). */
+export const useImageUrl = () => useContext(ImageUrlContext)