componente · @solu30/ui-kit/display

ActivityTimeline

Línea de tiempo de auditoría, con el actor, la fecha y qué campos cambió cada evento.

7 sitios de import en 5 de 15 verticales — un archivo que la importa cuenta una vez, monte una instancia o veinte.

EasyYachts
carlosmartinpavon
cmp-packages
elliot
zentrya

El componente, montado

Cargando el espécimen…

export function ActivityTimelineSpecimen() {
  return (
    <Stage label="ActivityTimeline · alta, cambio de estado, edición multi-campo y baja" tall wide>
      <div className="w-full max-w-md">
        <ActivityTimeline
          entries={TIMELINE_ENTRIES}
          actionConfig={TIMELINE_ACTION_CONFIG}
          clientNotifiedLabel="Cliente avisado"
          locale="es-AR"
        />
      </div>
    </Stage>
  )
}

De specimens/display.tsx · ActivityTimelineSpecimen: el espécimen del Muestrario, no un ejemplo oficial del paquete. Muestra cómo se usa la pieza de verdad, montada contra los tipos instalados —eso es lo que vale— pero no es documentación del kit.

Cómo se usa

import { ActivityTimeline } from '@solu30/ui-kit/display'

Props

8 props declaradas en los tipos de la versión instalada.
Prop	Requerida	Tipo	Qué hace
entries	sí	`ActivityTimelineEntry[]`	—
actionConfig	opcional	`Record<string, ActionConfig>`	Override or extend default action → color/label mapping
clientNotifiedLabel	opcional	`string`	Label shown on the "client notified" badge
emptyMessage	opcional	`string`	—
emptySubtitle	opcional	`string`	—
className	opcional	`string`	—
locale	opcional	`string`	—
translationFn	opcional	`(key: string) => string`	Optional i18n function applied to status values and fallback action labels

Ejemplo del paquete

<ActivityTimeline
  entries={[{ id: '1', action: 'status_change', timestamp: new Date(),
    actor: { name: 'Ana' }, details: { oldStatus: 'pendiente', newStatus: 'confirmada' } }]}
  emptyMessage="Sin movimientos todavía"
  locale="es-AR"
/>

Del @example del JSDoc de @solu30/ui-kit, sin editar: son 65 de los 541 símbolos. La sangría y los renglones en blanco son los del paquete.