shadcn.io is not affiliated with official shadcn/ui
Habit Tracker Chat Block for Solid
A quiet check-in thread: answer Did you stretch today with a button, pick a reason for a miss, and get a week card with the days done, the misses and the streak.
Installation
Overview
Show a daily check-in with this habit tracker chat for Solid with Ark UI. A framed window of fixed height holds a quiet thread between you and Naveen Fairweather, a habit coach at Streakdale: bubbles have no avatars, the top bar holds your streak, and last week's recap sits above as a card. He asks "Did you stretch today?" with two answers under the message, Yes and Not today. Not today asks "What got in the way?" with four more (Tired, Busy, Forgot, Sick) and his typed reply differs by reason. Then the week card appears, worked out from six typed days plus your answer: how many days of seven, the misses in order and the streak, which also moves the top bar. The composer's Shine Button is the only colored control. The frame is ruled by Guides, and everything moves with CSS only. It suits a habit app, a coaching check-in or any daily question with a reason for a miss.
FAQ
What stays in the page, and how do I make it real?
Everything. The six earlier days, the reasons and the replies are typed in this file, and today's answer lives in the page's state. Nothing is sent and no model runs, as the line under the composer says. To make it real, send today's answer from post to your habit service and build the week card from the days it returns.
How is the week card worked out?
From seven days of data: six typed days and today's answer. The count of done days, the list of misses in date order and the streak (the unbroken days at the end) are each derived by one small function, so the card and the top bar always agree. A miss ends the streak at 0; a Yes after Sunday makes it 2.
Do I have to use the buttons?
No. Typing "yes", "not today" or a reason word such as "busy" does the same, because the answer is read from your message either way. A second answer updates the week card instead of adding another.
Why is there no month grid?
This block is about the conversation and the reason for a miss. The week card is a short list of facts rather than a calendar of ticks, which the habit and calendar blocks already cover.
Is it usable with a keyboard and a screen reader?
The log is a focusable region announced as a log, so new messages are read out once, and every message starts with a hidden name and time such as "You, 09:42". Delivery is a glyph and a word, never a color. The reply buttons sit in a labelled group and are spent once anything of yours follows, and the week card is a description list. Nothing is told by color.