迷你月历
紧凑的独立月份选择器——就是每个侧边栏里的那个小月历。可用作日期选择器，或绑定到大日历的 date 组成双栏布局。
点选日期 → 右侧日视图联动
一
二
三
四
五
六
日
周六
全天
1时
2时
3时
4时
5时
6时
7时
8时
9时
10时
11时
12时
13时
14时
15时
16时
17时
18时
19时
20时
21时
22时
23时
0时
属性
| 属性 | 类型 | 说明 |
|---|---|---|
bind:value | Date | null | 选中的日期。 |
bind:month | Date | 当前显示的月份。 |
events | CalendarEvent[] | 有事件的日期显示圆点。 |
locale / firstDayOfWeek | string / Weekday | 语义与主日历一致。 |
theme | 'light' | 'dark' | 'auto' | 配色方案。 |
onSelect | (date: Date) => void | 点击日期时触发。 |
双向联动的实现
- 迷你 → 日视图：onSelect 把选中的日期写入 Calendar 绑定的 date。
- 日视图 → 迷你：bind:date 让工具栏导航更新同一份状态；再用一行 $effect 让迷你月历绑定的 month 跟随即可。
- 把 value={date} 传给迷你月历，选中的日期会保持高亮。