@asteby/metacore-runtime-react 47.0.0 → 48.0.0

package/src/__tests__/primitives.test.ts

@@ -0,0 +1,224 @@
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { allocatePayment, validateAllocation, type OpenDocument } from '../primitives/allocation'
+import { bucketFor, computeAging, daysOverdue } from '../primitives/aging'
+import {
+    __resetContributions,
+    contributionsVersion,
+    federatedModalComponent,
+    registerDocumentContribution,
+    registerFederatedModal,
+    resolveContributions,
+    resolveFederatedModal,
+    slotIdFor,
+    subscribeContributions,
+} from '../primitives/contributions'
+import { approvalsClient, groupApprovals, parseJSONField, registerApprovalCategory, type ApprovalRequestDTO } from '../primitives/approvals'
+import { CORE_DOCUMENT_KINDS, getDocumentKind, listDocumentKinds, registerDocumentKind } from '../primitives/document-kinds'
+import { blockingChecks } from '../primitives/panels'
+import { installedPredicate } from '../primitives/use-contributions'
+import { slotRegistry } from '../slot'
+import type { ApiClient } from '../api-context'
+
+// Datos del mockup complemento-pago.html (Transportes del Bajío).
+const docs: OpenDocument[] = [
+    { id: 'a1060', number: 'A-1060', issued_at: '2026-09-10', due_at: '2026-10-10', total: 42270.4, balance: 42270.4, currency: 'MXN', payment_method: 'PPD' },
+    { id: 'a1051', number: 'A-1051', issued_at: '2026-08-15', due_at: '2026-09-14', total: 18560, balance: 8500, currency: 'MXN', payment_method: 'PPD', installments_paid: 1 },
+    { id: 'a1066', number: 'A-1066', issued_at: '2026-09-28', due_at: '2026-10-28', total: 23260, balance: 23260, currency: 'MXN', payment_method: 'PPD' },
+]
+
+describe('allocatePayment', () => {
+    it('aplica primero lo más vencido y calcula parcialidad e insoluto', () => {
+        const r = allocatePayment(30000, docs)
+        expect(r.allocations).toEqual([
+            { document_id: 'a1051', amount: 8500, balance_before: 8500, balance_after: 0, installment: 2 },
+            { document_id: 'a1060', amount: 21500, balance_before: 42270.4, balance_after: 20770.4, installment: 1 },
+        ])
+        expect(r.unapplied).toBe(0)
+    })
+    it('manual respeta montos y deja sin aplicar el resto', () => {
+        const r = allocatePayment(10000, docs, 'manual', { a1066: 4000 })
+        expect(r.applied).toBe(4000)
+        expect(r.unapplied).toBe(6000)
+        expect(validateAllocation(10000, 'MXN', docs, r.allocations).map(i => i.code)).toEqual(['unapplied'])
+        expect(validateAllocation(10000, 'MXN', docs, r.allocations, { allowUnapplied: true })[0].severity).toBe('warning')
+    })
+    it('detecta pago mayor al saldo y moneda distinta', () => {
+        const codes = validateAllocation(9000, 'USD', docs, [{ document_id: 'a1051', amount: 9000, balance_before: 8500, balance_after: -500, installment: 2 }]).map(i => i.code)
+        expect(codes).toContain('over_balance')
+        expect(codes).toContain('currency_mismatch')
+    })
+})
+
+describe('computeAging', () => {
+    it('tramos y vencido por cliente al corte', () => {
+        expect(daysOverdue('2026-09-14', '2026-10-05')).toBe(21)
+        const { rows, totals, total } = computeAging(docs.map(d => ({ party_id: 'tba', due_at: d.due_at ?? null, issued_at: d.issued_at, balance: d.balance })), '2026-10-05')
+        expect(totals.current).toBe(65530.4)
+        expect(totals.d1_30).toBe(8500)
+        expect(total).toBe(74030.4)
+        expect(rows[0].oldest_overdue_days).toBe(21)
+    })
+})
+
+describe('contribuciones federadas', () => {
+    afterEach(() => __resetContributions())
+    const ctx = { kind: 'invoice', model: 'customers.Invoice', values: {}, mode: 'create' as const }
+    it('se ocultan si el addon no está instalado y se ordenan por prioridad', () => {
+        const Comp = () => null
+        registerDocumentContribution({ id: 'fiscal_mexico.header.cfdi', kinds: ['invoice', 'credit_note'], region: 'header.fields', requiresAddon: 'fiscal_mexico', priority: 10, component: Comp })
+        registerDocumentContribution({ id: 'inventory.header.warehouse', kinds: '*', region: 'header.fields', requiresAddon: 'inventory', component: Comp })
+        expect(resolveContributions(ctx, 'header.fields', a => a === 'inventory').map(c => c.id)).toEqual(['inventory.header.warehouse'])
+        expect(resolveContributions(ctx, 'header.fields', () => true).map(c => c.id)).toEqual(['fiscal_mexico.header.cfdi', 'inventory.header.warehouse'])
+    })
+    it('el disposer la quita (desinstalación en caliente)', () => {
+        const off = registerDocumentContribution({ id: 'x', kinds: '*', region: 'side.panels', component: () => null })
+        off()
+        expect(resolveContributions(ctx, 'side.panels', () => true)).toEqual([])
+    })
+    it('modal federado sin addon → null (el dispatcher usa el formulario genérico)', () => {
+        registerFederatedModal({ key: 'fiscal_mexico.import_cfdi', addon: 'fiscal_mexico', load: async () => ({ default: () => null }) })
+        expect(resolveFederatedModal('fiscal_mexico.import_cfdi', () => false)).toBeNull()
+        expect(resolveFederatedModal('fiscal_mexico.import_cfdi', () => true)?.addon).toBe('fiscal_mexico')
+    })
+})
+
+describe('groupApprovals', () => {
+    it('agrupa por categoría registrada por cada addon', () => {
+        const off = registerApprovalCategory({ key: 'cfdi', label: 'Cancelación CFDI', match: r => r.action_key === 'cancel_fiscal' })
+        const base = { kind: 'action', status: 'pending' } as ApprovalRequestDTO
+        const g = groupApprovals([{ ...base, id: '1', action_key: 'cancel_fiscal' }, { ...base, id: '2', action_key: 'approve_adjustment' }])
+        expect(Object.keys(g).sort()).toEqual(['cfdi', 'other'])
+        off()
+    })
+})
+
+describe('allocatePayment (estrategias y bordes)', () => {
+    it('oldest_issued_first ordena por emisión', () => {
+        const r = allocatePayment(50000, docs, 'oldest_issued_first')
+        expect(r.allocations.map(a => a.document_id)).toEqual(['a1051', 'a1060'])
+    })
+    it('monto negativo o cero no aplica nada y validateAllocation lo marca', () => {
+        expect(allocatePayment(-5, docs)).toEqual({ allocations: [], applied: 0, unapplied: 0 })
+        expect(validateAllocation(0, 'MXN', docs, []).map(i => i.code)).toContain('non_positive')
+    })
+    it('pago mayor a todos los saldos deja el excedente sin aplicar', () => {
+        const r = allocatePayment(100000, docs)
+        expect(r.applied).toBe(74030.4)
+        expect(r.unapplied).toBe(25969.6)
+    })
+})
+
+describe('bucketFor', () => {
+    it('ubica los bordes de cada tramo', () => {
+        expect(bucketFor(-3)).toBe('current')
+        expect(bucketFor(0)).toBe('current')
+        expect(bucketFor(30)).toBe('d1_30')
+        expect(bucketFor(31)).toBe('d31_60')
+        expect(bucketFor(400)).toBe('d90_plus')
+    })
+})
+
+describe('contribuciones federadas (registro)', () => {
+    afterEach(() => __resetContributions())
+    const ctx = { kind: 'invoice', model: 'customers.Invoice', values: { total: 10 }, mode: 'edit' as const }
+
+    it('publica en slotRegistry por kind/region y el disposer la retira', () => {
+        const off = registerDocumentContribution({ id: 'a.body.x', kinds: ['invoice', 'quote'], region: 'body.sections', component: () => null })
+        expect(slotRegistry.get(slotIdFor('invoice', 'body.sections'))).toHaveLength(1)
+        expect(slotRegistry.get(slotIdFor('quote', 'body.sections'))).toHaveLength(1)
+        off()
+        off() // idempotente
+        expect(slotRegistry.get(slotIdFor('invoice', 'body.sections'))).toHaveLength(0)
+    })
+
+    it('re-registrar el mismo id reemplaza; el disposer viejo no borra el nuevo', () => {
+        const offOld = registerDocumentContribution({ id: 'a.side.p', kinds: '*', region: 'side.panels', priority: 1, component: () => null })
+        registerDocumentContribution({ id: 'a.side.p', kinds: '*', region: 'side.panels', priority: 5, component: () => null })
+        expect(slotRegistry.get(slotIdFor('*', 'side.panels'))).toHaveLength(1)
+        offOld()
+        expect(resolveContributions(ctx, 'side.panels', () => true).map(c => c.priority)).toEqual([5])
+    })
+
+    it('filtra por `when` y por kind; con `load` siempre expone un componente', () => {
+        registerDocumentContribution({ id: 'a.h.only_edit', kinds: ['invoice'], region: 'header.fields', when: c => c.mode === 'edit', load: async () => ({ default: () => null }) })
+        registerDocumentContribution({ id: 'a.h.quote', kinds: ['quote'], region: 'header.fields', component: () => null })
+        const [only] = resolveContributions(ctx, 'header.fields', () => true)
+        expect(only.id).toBe('a.h.only_edit')
+        expect(typeof only.component).toBe('function')
+        expect(resolveContributions({ ...ctx, mode: 'create' }, 'header.fields', () => true)).toEqual([])
+    })
+
+    it('exige component o load', () => {
+        expect(() => registerDocumentContribution({ id: 'bad', kinds: '*', region: 'side.panels' })).toThrow(/component o load/)
+    })
+
+    it('notifica a los suscriptores en register/dispose', () => {
+        const spy = vi.fn()
+        const unsub = subscribeContributions(spy)
+        const v0 = contributionsVersion()
+        const off = registerDocumentContribution({ id: 'n', kinds: '*', region: 'side.panels', component: () => null })
+        off()
+        expect(spy).toHaveBeenCalledTimes(2)
+        expect(contributionsVersion()).toBe(v0 + 2)
+        unsub()
+    })
+
+    it('modal federado: no registrado → null; disposer lo retira; componente memoizado', () => {
+        expect(resolveFederatedModal('returns.settle_method', () => true)).toBeNull()
+        const m = { key: 'returns.settle_method', addon: 'returns', load: async () => ({ default: () => null }) }
+        const off = registerFederatedModal(m)
+        expect(resolveFederatedModal('returns.settle_method', () => true)).toBe(m)
+        expect(federatedModalComponent(m)).toBe(federatedModalComponent(m))
+        off()
+        expect(resolveFederatedModal('returns.settle_method', () => true)).toBeNull()
+    })
+
+    it('installedPredicate: sin provider = instalado; con provider consulta el set', () => {
+        expect(installedPredicate(null)('lo_que_sea')).toBe(true)
+        const p = installedPredicate({ addons: new Set(['customers']), capabilities: new Set() })
+        expect(p('customers')).toBe(true)
+        expect(p('fiscal_mexico')).toBe(false)
+    })
+})
+
+describe('tipos de documento', () => {
+    it('registerDocumentKind con disposer y filtrado por addon instalado', () => {
+        const offs = CORE_DOCUMENT_KINDS.map(registerDocumentKind)
+        expect(getDocumentKind('invoice')?.model).toBe('customers.Invoice')
+        expect(listDocumentKinds(a => a === 'purchases').map(k => k.key)).toEqual(['purchase_order', 'supplier_invoice', 'supplier_payment'])
+        offs.forEach(off => off())
+        expect(getDocumentKind('invoice')).toBeUndefined()
+    })
+})
+
+describe('paneles', () => {
+    it('blockingChecks: solo errores sin política de autorización', () => {
+        const checks = [
+            { key: 'a', severity: 'error' as const, message: 'Falta RFC' },
+            { key: 'b', severity: 'error' as const, message: 'Sin crédito', approval_policy: 'credit_override' },
+            { key: 'c', severity: 'warning' as const, message: 'Sin correo' },
+        ]
+        expect(blockingChecks(checks).map(c => c.key)).toEqual(['a'])
+    })
+})
+
+describe('approvalsClient', () => {
+    it('arma la consulta y lee lista y conteo', async () => {
+        const get = vi.fn(async (url: string) =>
+            url.startsWith('/approvals/count') ? { data: { data: { count: 3 } } } : { data: { data: [{ id: '1' }], meta: { total: 1 } } },
+        )
+        const post = vi.fn(async () => ({ data: {} }))
+        const c = approvalsClient({ get, post } as unknown as ApiClient)
+        expect(await c.list({ status: 'pending', for_me: true, model: undefined })).toEqual({ items: [{ id: '1' }], total: 1 })
+        expect(get).toHaveBeenCalledWith('/approvals?status=pending&for_me=true')
+        expect(await c.count()).toBe(3)
+        await c.reject('9', 'No procede')
+        expect(post).toHaveBeenCalledWith('/approvals/9/reject', { reason: 'No procede' })
+    })
+    it('parseJSONField tolera string, objeto y basura', () => {
+        expect(parseJSONField('{"a":1}')).toEqual({ a: 1 })
+        expect(parseJSONField({ a: 2 })).toEqual({ a: 2 })
+        expect(parseJSONField('no-json')).toBeNull()
+        expect(parseJSONField('')).toBeNull()
+    })
+})

package/src/__tests__/record-prefill-bar.test.tsx

@@ -0,0 +1,50 @@
+// @vitest-environment happy-dom
+//
+// RecordPrefillBar: pinta los ayudantes registrados para el modelo/modo, los
+// filtra por permiso y solo deja pasar al formulario las claves que declara.
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { act, cleanup, fireEvent, render, screen } from '@testing-library/react'
+import { registerRecordPrefill, unregisterRecordPrefillsByOwner, type RecordPrefillProps } from '@asteby/metacore-sdk'
+import { RecordPrefillBar } from '../record-prefill-bar'
+import { PermissionsProvider } from '../permissions-context'
+
+afterEach(() => {
+    cleanup()
+    unregisterRecordPrefillsByOwner('fiscal_mexico')
+})
+
+function CsfButton({ applyValues }: RecordPrefillProps) {
+    return (
+        <button type="button" onClick={() => applyValues({ tax_id: 'XAXX010101000', organization_id: 'hack' })}>
+            Cargar constancia
+        </button>
+    )
+}
+
+describe('RecordPrefillBar', () => {
+    it('aplica solo claves permitidas y aparece cuando el remote registra tarde', () => {
+        const onApply = vi.fn()
+        render(
+            <RecordPrefillBar model="customers.Customer" mode="create" values={{}} allowedKeys={new Set(['tax_id'])} onApply={onApply} />,
+        )
+        expect(screen.queryByText('Cargar constancia')).toBeNull()
+        act(() => {
+            registerRecordPrefill({ id: 'fiscal_mexico.csf', models: ['Customer'], component: CsfButton }, 'fiscal_mexico')
+        })
+        fireEvent.click(screen.getByText('Cargar constancia'))
+        expect(onApply).toHaveBeenCalledWith({ tax_id: 'XAXX010101000' })
+    })
+
+    it('se oculta sin el permiso declarado', () => {
+        registerRecordPrefill(
+            { id: 'fiscal_mexico.csf', models: ['Customer'], component: CsfButton, permission: 'customers.csf' },
+            'fiscal_mexico',
+        )
+        render(
+            <PermissionsProvider permissions={[]} isAdmin={false}>
+                <RecordPrefillBar model="Customer" mode="create" values={{}} allowedKeys={new Set(['tax_id'])} onApply={() => {}} />
+            </PermissionsProvider>,
+        )
+        expect(screen.queryByText('Cargar constancia')).toBeNull()
+    })
+})

package/src/__tests__/structured-view-value.test.tsx

@@ -82,7 +82,11 @@ describe('detail-view jsonb line-items (ViewValue → inline CollectionCell)', (
                 record={{}}
             />
         )
-        expect(screen.getByText('Precio:')).toBeTruthy()
+        // Keys are humanized (the addon-declared label is the localized source);
+        // each pair renders as a <dt>/<dd>, never "[object Object]".
+        expect(screen.getByText('Price').tagName).toBe('DT')
+        expect(screen.getByText('10').tagName).toBe('DD')
+        expect(screen.getByText('Quantity')).toBeTruthy()
         expect(container.textContent).not.toContain('[object Object]')
     })
 

package/src/__tests__/wizard-action-modal.test.tsx

@@ -14,7 +14,7 @@ import { afterEach, describe, expect, it, vi } from 'vitest'
 import { cleanup, render, screen, fireEvent, waitFor } from '@testing-library/react'
 
 vi.mock('react-i18next', () => ({
-    useTranslation: () => ({ t: (k: string, o?: any) => o?.defaultValue ?? k }),
+    useTranslation: () => ({ t: (k: string, o?: any) => o?.defaultValue ?? k, i18n: { language: 'es' } }),
 }))
 
 import { ActionModalDispatcher } from '../action-modal-dispatcher'

package/src/action-modal-dispatcher.tsx

@@ -15,7 +15,7 @@
 // The host injects its axios-like client via <ApiProvider>; we no longer
 // depend on a bundler alias to `@/lib/api`.
 import { emitRecordMutation } from './record-mutation-events'
-import { useState, useCallback, useEffect, useMemo, useRef, useSyncExternalStore } from 'react'
+import { Suspense, useState, useCallback, useEffect, useMemo, useRef, useSyncExternalStore } from 'react'
 import { useTranslation } from 'react-i18next'
 import {
     Dialog,
@@ -88,6 +88,9 @@ import {
     subscribeActionComponents,
 } from '@asteby/metacore-sdk'
 import { requestFederatedAction } from './federated-action-loader'
+import { useInstalledAddons } from './installed-addons-context'
+import { federatedModalComponent, resolveFederatedModal } from './primitives/contributions'
+import { installedPredicate, useContributionsVersion } from './primitives/use-contributions'
 
 export type { ActionMetadata, ActionModalProps }
 
@@ -375,6 +378,15 @@ export function ActionModalDispatcher({
     const readComponent = () => getActionComponent(model, action.key)
     const CustomComponent = useSyncExternalStore(subscribeActionComponents, readComponent, readComponent)
 
+    // Modal federado declarativo (registerFederatedModal). Si el addon dueño
+    // del slug consta como NO instalado, el `modal` se ignora y se usa el
+    // formulario genérico de la acción de inmediato (sin esperar el timeout).
+    useContributionsVersion()
+    const installed = useInstalledAddons()
+    const slug = action.modal || ''
+    const federatedModal = slug ? resolveFederatedModal(slug, installedPredicate(installed)) : null
+    const modalAddonMissing = !!slug && !federatedModal && !!installed && !installed.addons.has(slug.split('.')[0])
+
     if (CustomComponent) {
         return (
             <CustomComponent
@@ -389,10 +401,28 @@ export function ActionModalDispatcher({
         )
     }
 
+    if (federatedModal) {
+        const FederatedComponent = federatedModalComponent<ActionModalProps>(federatedModal)
+        return (
+            <Suspense fallback={<LoadingActionDialog open={open} onOpenChange={onOpenChange} action={action} />}>
+                <FederatedComponent
+                    open={open}
+                    onOpenChange={onOpenChange}
+                    action={action}
+                    model={model}
+                    record={record}
+                    endpoint={endpoint}
+                    onSuccess={onSuccess}
+                />
+            </Suspense>
+        )
+    }
+
     // Declarative custom slot (`modal: "addon.action"`). Wait for the remote,
     // then a hard error — confirm/fields generics look "fine" and hide a
-    // missing remote.
-    if (action.modal) {
+    // missing remote. Exception: the slug's addon is known NOT installed — the
+    // remote will never come, so fall through to the generic form now.
+    if (action.modal && !modalAddonMissing) {
         return (
             <PendingCustomActionModal
                 open={open}
@@ -479,7 +509,6 @@ function PendingCustomActionModal({
     action: ActionMetadata
     model: string
 }) {
-    const { t } = useTranslation()
     const slug = action.modal || ''
     const [timedOut, setTimedOut] = useState(false)
 
@@ -522,6 +551,20 @@ function PendingCustomActionModal({
         return <MissingCustomActionModal open={open} onOpenChange={onOpenChange} action={action} model={model} />
     }
 
+    return <LoadingActionDialog open={open} onOpenChange={onOpenChange} action={action} />
+}
+
+/** Diálogo «Cargando…» mientras llega el componente federado de la acción. */
+function LoadingActionDialog({
+    open,
+    onOpenChange,
+    action,
+}: {
+    open: boolean
+    onOpenChange: (open: boolean) => void
+    action: ActionMetadata
+}) {
+    const { t } = useTranslation()
     return (
         <Dialog open={open} onOpenChange={onOpenChange}>
             <DialogContent>

package/src/audit-info.tsx

@@ -0,0 +1,219 @@
+/**
+ * audit-info.tsx
+ *
+ * <AuditInfo> — discreet "when and who" footer for a record: created, modified
+ * and (if tombstoned) deleted, each with the actor and a relative + absolute
+ * date. Driven only by the kernel's `TableMetadata.audit` (column names) and
+ * the record row — manifests declare nothing.
+ *
+ * Actor resolution (no extra requests), in order:
+ *   1. the host's `resolveActor(id)` when it returns a name;
+ *   2. the record's expanded sibling (`created_by_id` → `row.created_by`,
+ *      `{ label | name | title }` or a plain string);
+ *   3. the system actor id → "Sistema" / "System";
+ *   4. a short id (first 8 chars) — never a long uuid.
+ *
+ * Renders nothing when `audit` is absent or the record has none of its values.
+ */
+import * as React from 'react'
+import { useTranslation } from 'react-i18next'
+import { formatDistanceToNow } from 'date-fns'
+import { es, enUS } from 'date-fns/locale'
+import { ChevronDown, ChevronRight, History } from 'lucide-react'
+import { cn } from '@asteby/metacore-ui/lib'
+import { formatDateCell } from './dynamic-columns'
+import { objectLabel } from './dynamic-relation-helpers'
+import { isNilUuid } from './nil-uuid'
+import { useTimeZone } from './org-runtime-context'
+import type { AuditMeta } from './types'
+
+/** The kernel's actor for unattended work (schedules, webhooks, connectors). */
+export const SYSTEM_ACTOR_ID = '00000000-0000-0000-0000-000000000001'
+
+const AUDIT_KEYS: (keyof AuditMeta)[] = [
+    'created_at',
+    'created_by',
+    'updated_at',
+    'updated_by',
+    'deleted_at',
+    'deleted_by',
+]
+
+/**
+ * Defensive reader for the served `audit` block: keeps only known keys whose
+ * value is a non-empty string; returns `undefined` when nothing usable remains.
+ */
+export function readAuditMeta(raw: unknown): AuditMeta | undefined {
+    if (!raw || typeof raw !== 'object' || Array.isArray(raw)) return undefined
+    const src = raw as Record<string, unknown>
+    const out: AuditMeta = {}
+    for (const k of AUDIT_KEYS) {
+        const v = src[k]
+        if (typeof v === 'string' && v.trim() !== '') out[k] = v
+    }
+    return Object.keys(out).length ? out : undefined
+}
+
+export interface AuditActor {
+    /** Display text. */
+    name: string
+    /** True when the name is a real resolved label (not a short id). */
+    resolved: boolean
+}
+
+/** Resolves the actor stored in `row[idColumn]` to something human. */
+export function resolveAuditActor(
+    row: Record<string, unknown>,
+    idColumn: string | undefined,
+    opts: { resolveActor?: (id: string) => string | undefined; systemLabel: string },
+): AuditActor | null {
+    if (!idColumn) return null
+    const raw = row[idColumn]
+    // The column itself may already be an expanded object.
+    const own = objectLabel(raw)
+    const id = typeof raw === 'string' ? raw.trim() : ''
+    if (!own && (!id || isNilUuid(id))) return null
+    if (id.toLowerCase() === SYSTEM_ACTOR_ID) return { name: opts.systemLabel, resolved: true }
+    if (id) {
+        const fromHost = opts.resolveActor?.(id)
+        if (fromHost) return { name: fromHost, resolved: true }
+    }
+    if (own) return { name: own, resolved: true }
+    const base = idColumn.endsWith('_id') ? idColumn.slice(0, -3) : idColumn
+    const sibling = base === idColumn ? undefined : row[base]
+    const siblingName =
+        objectLabel(sibling) ?? (typeof sibling === 'string' && sibling.trim() !== '' ? sibling : undefined)
+    if (siblingName) return { name: siblingName, resolved: true }
+    return { name: id.length > 8 ? id.slice(0, 8) : id, resolved: false }
+}
+
+const COPY = {
+    es: {
+        title: 'Historial del registro',
+        created: 'Creado por {{who}}',
+        updated: 'Modificado por {{who}}',
+        deleted: 'Eliminado por {{who}}',
+        createdAt: 'Creado',
+        updatedAt: 'Modificado',
+        deletedAt: 'Eliminado',
+        system: 'Sistema',
+    },
+    en: {
+        title: 'Record history',
+        created: 'Created by {{who}}',
+        updated: 'Modified by {{who}}',
+        deleted: 'Deleted by {{who}}',
+        createdAt: 'Created',
+        updatedAt: 'Modified',
+        deletedAt: 'Deleted',
+        system: 'System',
+    },
+} as const
+
+export interface AuditInfoProps {
+    /** The record row (keys are the column names `audit` points at). */
+    record: Record<string, unknown> | null | undefined
+    /** `TableMetadata.audit`. Absent → renders nothing. */
+    audit: AuditMeta | null | undefined
+    /** Optional host resolver uuid → display name (e.g. from a users cache). */
+    resolveActor?: (id: string) => string | undefined
+    /** IANA timezone; defaults to the org runtime timezone. */
+    timeZone?: string
+    /** BCP-47 locale; defaults to the i18n language. */
+    locale?: string
+    /** Start expanded. Default: collapsed. */
+    defaultOpen?: boolean
+    className?: string
+}
+
+interface Line {
+    key: string
+    text: string
+    absolute: string
+    title?: string
+    relative: string
+}
+
+export function AuditInfo({
+    record,
+    audit,
+    resolveActor,
+    timeZone,
+    locale,
+    defaultOpen = false,
+    className,
+}: AuditInfoProps) {
+    const { t, i18n } = useTranslation()
+    const ctxTz = useTimeZone()
+    const [open, setOpen] = React.useState(defaultOpen)
+
+    const meta = readAuditMeta(audit)
+    if (!meta || !record) return null
+
+    const lang = (locale || i18n?.language || 'es').toLowerCase().startsWith('en') ? 'en' : 'es'
+    const copy = COPY[lang]
+    const dfLocale = lang === 'en' ? enUS : es
+    const tz = timeZone ?? ctxTz
+    const tt = (key: keyof typeof copy, vars?: Record<string, string>) =>
+        t(`audit.${key}`, { defaultValue: copy[key], ...vars }) as string
+
+    const build = (
+        key: string,
+        atCol: string | undefined,
+        byCol: string | undefined,
+        whoKey: 'created' | 'updated' | 'deleted',
+        whenKey: 'createdAt' | 'updatedAt' | 'deletedAt',
+    ): Line | null => {
+        const f = atCol ? formatDateCell(record[atCol], undefined, dfLocale, tz) : null
+        if (!f) return null
+        const actor = resolveAuditActor(record, byCol, { resolveActor, systemLabel: tt('system') })
+        const date = new Date(record[atCol as string] as string)
+        const relative = formatDistanceToNow(date, { addSuffix: true, locale: dfLocale })
+        return {
+            key,
+            text: actor ? tt(whoKey, { who: actor.name }) : tt(whenKey),
+            absolute: f.display,
+            title: f.title,
+            relative,
+        }
+    }
+
+    const lines = [
+        build('created', meta.created_at, meta.created_by, 'created', 'createdAt'),
+        // Hide "modified" when it is the creation instant itself (never edited).
+        meta.updated_at && record[meta.updated_at] !== record[meta.created_at ?? '']
+            ? build('updated', meta.updated_at, meta.updated_by, 'updated', 'updatedAt')
+            : null,
+        build('deleted', meta.deleted_at, meta.deleted_by, 'deleted', 'deletedAt'),
+    ].filter((l): l is Line => l !== null)
+
+    if (lines.length === 0) return null
+
+    const Chevron = open ? ChevronDown : ChevronRight
+    return (
+        <div className={cn('text-xs text-muted-foreground', className)} data-testid="audit-info">
+            <button
+                type="button"
+                className="flex items-center gap-1.5 hover:text-foreground"
+                aria-expanded={open}
+                onClick={() => setOpen(o => !o)}
+            >
+                <Chevron className="h-3.5 w-3.5" />
+                <History className="h-3.5 w-3.5" />
+                <span>{tt('title')}</span>
+            </button>
+            {open && (
+                <ul className="mt-2 space-y-1 pl-6">
+                    {lines.map(l => (
+                        <li key={l.key} data-audit-line={l.key}>
+                            <span>{l.text}</span>
+                            {' · '}
+                            <time title={l.title}>{l.absolute}</time>
+                            <span className="opacity-70"> ({l.relative})</span>
+                        </li>
+                    ))}
+                </ul>
+            )}
+        </div>
+    )
+}