Live Feed

Data · BarList, LiveFeed

Real-time activity: LiveFeed (events as they happen, with pause and filters) and BarList (ranked values with inline bars, e.g. top countries or services).

LiveFeed: items ({id, type, icon, tint, title, text, amount, currency, time, fresh}), types ({value, label} filter chips), paused / onPause, maxHeight, emptyText. While paused, new events are held back and counted.
BarList: items ({id, label, mark, value, share (0–1), tint}), format, onPick(item), label.

Show at most ~50 events; older ones belong in a table.
fresh slides a row in once; it never blinks or repeats.

PreviewCode

Live

1,000 Instagram followersOrder #48213 · Germany · PayPal+€12.902s

Payment receivedStripe · card ending 4242+€3914s

Provider timeoutSMM provider B · retried41s

5,000 TikTok viewsOrder #48212 · Austria+€4.901m

Revenue by country

Germany€18,24052%

Austria€6,12017%

Switzerland€5,48016%

Netherlands€2,2106%

Other€3,1009%

Props

BarList

Prop	Type	Notes
`items`	`{ id?: string; label: ReactNode; mark?: ReactNode; value: number; share?: number; tint?: Tint; }[]`	Required
`format?`	`(v: number) => string`
`onPick?`	`(item: NonNullable<BarListProps["items"]>[number]) => void`
`label?`	`string`
`className?`	`string`	Extra class on the root element.
`style?`	`CSSProperties`	Inline style on the root element.

LiveFeed

Prop	Type	Notes
`items`	`LiveFeedItem[]`	Required
`types?`	`{ value: string; label: string }[]`
`paused?`	`boolean`
`onPause?`	`(paused: boolean) => void`
`maxHeight?`	`number`
`emptyText?`	`string`
`className?`	`string`	Extra class on the root element.
`style?`	`CSSProperties`	Inline style on the root element.