shadcn.io is not affiliated with official shadcn/ui
No Activity Log Empty State Block for Solid
A personal activity feed with nothing recorded yet: four tick cards for the kinds of event beside a vertical timeline of dashed nodes that turn solid and write a first-person sample line as each kind is ticked.
Installation
Overview
Let someone choose what their feed records and watch the first lines appear, with this no activity log empty state for Solid with Ark UI. A header over one framed panel opens Wakeline, a personal activity feed, and the panel splits in two. At the start four kinds of event, Sign-ins, Edits, Shares and Exports, are tick cards, each a Checkbox whose whole card is its label; at the end a vertical timeline has four fixed slots, newest first, each with a dashed node and a dashed ghost of a line. Ticking a kind turns its node solid and writes a first-person sample line in its slot, such as "You edited Launch notes", with the day, the time and the words "Sample line"; unticking dashes it again. The foot holds the one Shine Button, the only colored control, Start recording, which marks the feed as recording and then goes quiet. The panel's frame and rules come from Guides, and everything moves with CSS only.
FAQ
What stays in the page, and how do I make it real?
The ticks, the four sample lines and the recording state stay in the page, and a reload or Start over takes them back. Every line is labelled Sample line and dated on the page's fixed Friday, 9 October 2026; nothing is recorded or sent. To make it real, start recording the ticked kinds through your backend where the code says so, and render the slots from the events it returns, newest first.
Why four fixed slots, and in what order are the lines?
The timeline always has four slots, one per kind, so the panel never changes height when a line appears: a slot shows a dashed node and a ghost until its kind is ticked, then a solid node and the line. The slots are in the order of their times, newest first (the export at 09:41 on top, the sign-in at 08:42 at the foot), whatever order you tick them in.
What does Start recording do?
It marks the feed as recording in this demo: the chip over the timeline changes from Not recording to Recording and the button goes quiet and reads Recording. With nothing ticked it says "Tick an event first." and moves focus to the first card; once recording it says it already is. Start over turns everything off again and puts focus back on the button.
Is it usable with a keyboard and a screen reader?
Each card is a real checkbox named by its kind and described by its hint, reached with Tab and toggled with Space. The feed is a real list named by its heading, an empty slot reads as "Edits: not recorded", a filled one reads its line and its time, and a polite status line in the foot says what changed. The nodes and ghost lines are hidden from assistive technology.