rootandClaude Fable 5.1
304feea141
- root deno.json workspace (nodeModulesDir auto), npm versions registered once in imports, deno.lock; remove pnpm-lock/pnpm-workspace/root package.json; members keep minimal package.json (name/type/exports) - tasks: dev, typecheck (tsc 7.0.2 per member + deno check), lint/fmt (biome, useImportExtensions), test (vitest via deno), check:tokens, build (web + deno compile), ci, db:migrate/reset, gen:types - tsconfig base moved to config/ (no root tsconfig.json); deno types -> types/deno.d.ts; web drops baseUrl - server: Deno.serve entry with graceful shutdown, --role migrate|preflight|probe, WEB_ROOT static SPA hosting; drop @hono/node-server, tsx, esbuild build.mjs - logger: redact child() bindings and serialize err by message/stack; sync stdout destination; tests - relative imports get explicit extensions (sites/mp-sync paths left for follow-up) - crash-recovery tests spawn `deno run -A`; tasks tests use unique per-file schemas - single-container Dockerfile + entrypoint (migrate -> preflight -> api+worker watchdog), docker-compose.yml - docs: README, runbook, ADR-001 superseded, plan §1 validation row Co-Authored-By: Claude Fable 5.1 <[email protected]>
48 lines
2.3 KiB
TypeScript
48 lines
2.3 KiB
TypeScript
import { zhCN } from "date-fns/locale";
|
|
import { ChevronLeft, ChevronRight } from "lucide-react";
|
|
import { DayPicker, type DayPickerProps } from "react-day-picker";
|
|
|
|
import { cn } from "~/lib/utils.ts";
|
|
|
|
// 日历(react-day-picker v10)的玻璃族皮肤:全部走语义 token + 玻璃 hover
|
|
// 语言(中性灰纱、选中 primary 药丸 + 顶部内高光、今日描边)。键盘导航
|
|
// 与 aria 由 DayPicker 自带。默认中文 locale。
|
|
export function Calendar({ className, classNames, ...props }: DayPickerProps) {
|
|
return (
|
|
<DayPicker
|
|
locale={zhCN}
|
|
showOutsideDays
|
|
className={cn("p-3 select-none", className)}
|
|
classNames={{
|
|
months: "relative flex flex-col",
|
|
month: "space-y-2.5",
|
|
nav: "absolute inset-x-0 top-0 z-10 flex items-center justify-between",
|
|
button_previous:
|
|
"inline-flex size-8 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:bg-foreground/[0.06] hover:text-foreground disabled:pointer-events-none disabled:opacity-30",
|
|
button_next:
|
|
"inline-flex size-8 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:bg-foreground/[0.06] hover:text-foreground disabled:pointer-events-none disabled:opacity-30",
|
|
month_caption: "flex h-8 items-center justify-center",
|
|
caption_label: "text-sm font-semibold text-foreground",
|
|
month_grid: "w-full border-collapse",
|
|
weekdays: "flex",
|
|
weekday: "w-9 pb-1 text-center text-label font-medium text-muted-foreground/80",
|
|
week: "mt-1 flex",
|
|
day: "p-0",
|
|
day_button:
|
|
"inline-flex size-9 cursor-pointer items-center justify-center rounded-full text-sm font-medium tabular-nums text-foreground/85 transition-colors hover:bg-foreground/[0.06] hover:text-foreground",
|
|
selected: "[&>button]:pill-selected [&>button]:rounded-full",
|
|
today: "[&>button]:border [&>button]:border-primary/35",
|
|
outside: "[&>button]:text-muted-foreground/45",
|
|
disabled: "[&>button]:pointer-events-none [&>button]:opacity-30",
|
|
hidden: "invisible",
|
|
...classNames,
|
|
}}
|
|
components={{
|
|
Chevron: ({ orientation }) =>
|
|
orientation === "left" ? <ChevronLeft className="size-4" /> : <ChevronRight className="size-4" />,
|
|
}}
|
|
{...props}
|
|
/>
|
|
);
|
|
}
|