shadcn.io is not affiliated with official shadcn/ui
Training Program Calendar Block for Svelte
A four-week strength block as a grid of weeks by weekdays, a deload switch that cuts week four by 40 percent and works the sets and each week's volume out again, and a day's exercises to tick off.
Installation
Overview
Show an athlete a whole block at once with this training program calendar for Svelte with Ark UI. A hairline frame with a plus mark on each corner holds a grid of four weeks (Base, Build, Peak and Deload) by seven weekdays, starting Monday 12 October 2026. Each day is a button that names its session (Lower A, Upper, Lower B, Full body or Rest) and its sets, with a check when every exercise is done. A Switch, "Deload week (minus 40 percent)", cuts week four's sets to 60 percent of the plan; the sets in the grid, in the day's list and the volume of each week are worked out again from sets by reps by load, and a bar for each week shows it. Choosing a day, with a click or the arrow keys, lists its exercises as sets of reps at a load, each with a Checkbox, over a Progress bar that says "2 of 4 done". A rest day says so at the same height. On a phone the grid keeps a short code for each session. It's built from Switch, Checkbox, Progress, Badge and a native table, with a CSS entrance only. For coaches, athletes and any plan that scales sets and load week by week.
FAQ
How do I change the exercises and the weeks?
Edit SESSIONS and WEEKS. A session lists exercises with base sets, reps and a base load in kilograms; a week has a factor for sets and one for load, and deload: true marks the week the switch applies to. WEEK_PLAN says which session falls on each weekday. Sets, loads, volumes and the bars are worked out from those.
What does the deload switch change?
Only week four. With it on, that week's sets are 60 percent of what the plan would have asked, rounded to whole sets, so the week's volume drops by about two fifths; with it off, week four carries on at the peak. The note under the switch compares week four with the peak.
How is a week's volume worked out?
For every exercise in the week it multiplies sets by reps by load in kilograms and adds them up. The bars all use the same scale, the heaviest week with the deload off, so switching the deload on visibly shortens week four.