← Preview 1 Preview 2 of 5 Preview 3 →

Preview 2 / 5 — Calendar

The date picker on Step 1 of the wizard. Today this is `react-day-picker v9` (cal.com-style inline). All four are inline, single-date, with min/max constraints.

Decision in B's spirit: you said you like C's polish from Preview 1. I've kept blue accent + light theme across all four below — these differ on density, day-cell shape, motion, and library. Pick by feel; size budget noted on each.

A   Current   +0 KB   react-day-picker v9, polished

Same library you have today. Round day cells (Apple Calendar / cal.com style), tighter weekday labels, blue selected, ringed "today". Smallest diff — this is "design polish only."

Pros
  • Zero new deps
  • Already in repo
  • Tiny bundle delta
Cons
  • Less expressive than B/D
  • No multi-month view built in
May 2026
Su
Mo
Tu
We
Th
Fr
Sa
26
27
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
1
2
3
4
5
6

Round cells · ringed today · same lib

B   + New dep   +13 KB   react-aria Calendar

Adobe's `react-aria-components`. Best-in-class keyboard nav (page-up/down for month, home/end), screen-reader, RTL, automatic timezone handling. Larger day cells, soft hover. Roomier feel.

Pros
  • Best-in-class a11y
  • Built-in tz/locale
  • Future-proof for ranges
Cons
  • +13 KB gzipped
  • Theming via CSS vars only
  • New API to learn
May 2026
Su
Mo
Tu
We
Th
Fr
Sa
26
27
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
1
2
3
4
5
6

Larger cells · square selection · best a11y

C   Current   +0 KB   Stripe-checkout style

Same `react-day-picker v9`, restyled to feel like Stripe's checkout calendar — soft gradient surface, drop-shadow on the selected pill, range-ready visuals (faded inner days). Looks "premium" without adding deps.

Pros
  • Polished, premium feel
  • Zero deps
  • Range-ready for future
Cons
  • Heaviest custom CSS
  • Drop-shadow tricky in dark mode
May 2026
Su
Mo
Tu
We
Th
Fr
Sa
26
27
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
1
2
3
4
5
6

Soft surface · shadowed selection · premium feel

D   + New dep   +18 KB   Mantine DatePicker

Mantine's `@mantine/dates`. Quick month/year jump via tappable chips in the header, presets, very polished out of the box. Has its own design language — not 100% match with shadcn primitives, but high quality.

Pros
  • Month/year quick-jump
  • Presets ("today", "next week")
  • Very polished defaults
Cons
  • +18 KB + ecosystem
  • Style language drift
  • Ecosystem buy-in (other pieces want it too)
May
2026
Su
Mo
Tu
We
Th
Fr
Sa
26
27
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
1
2
3
4
5
6

Quick month/year jump · square cells · presets

Reply with A / B / C / D — or "C, but tighter rows"