Data Display
v1.0.0Added in 1.0.0
Things that happened, in order: activity feeds, audit trails, changelogs and order tracking, with icons, relative times and day groups.
Read it top to bottom: each event has a marker on the line (a dot, an icon tile in its tone, or the person's avatar), a title, an optional description and a timestamp that stays fresh ("5 min. ago", "yesterday"); hover a timestamp on desktop for the full date and time (use timeFormat "datetime" where people on phones need it). Items with details show a Details button: click or tap it (Enter or Space from the keyboard) and the details slide open while the chevron turns; press again to close. New events slide in at the top and the rest glide down. In the feed variant events sit under day headings ("Today", "Yesterday") that can stick while you scroll. In the tracking variant finished steps get a check, the current step pulses, upcoming ones are hollow, a failed one turns red with an X, and the line fills down to the current step when it scrolls into view. Show older at the end loads more and spins while it waits. Tab only stops on real controls (links in titles, Details, Show older, buttons in meta). On a phone or in a narrow panel the side date column folds under the title and every button has a 44px touch target. Reduced motion drops the stagger, the growth and the pulse.
npx wingo-ui@latest add timelinePro item: the CLI needs a Pro account. See plans
Tech Solutions Inc. · New York
Add an event to see it slide in at the top