diff --git a/src/components/ui/flexible-date-input.tsx b/src/components/ui/flexible-date-input.tsx index 2c33bfbb..f47117d1 100644 --- a/src/components/ui/flexible-date-input.tsx +++ b/src/components/ui/flexible-date-input.tsx @@ -1,6 +1,6 @@ import * as React from "react"; import { format } from "date-fns"; -import { CalendarIcon } from "lucide-react"; +import { CalendarIcon, Info } from "lucide-react"; import { cn } from "@/lib/utils"; import { Button } from "@/components/ui/button"; import { DatePicker } from "@/components/ui/date-picker"; @@ -119,6 +119,25 @@ export function FlexibleDateInput({ } }; + const getPrecisionHelpText = () => { + switch (localPrecision) { + case 'exact': + return 'Use when you know the specific day (e.g., June 15, 2010)'; + case 'month': + return 'Use when you only know the month (e.g., June 2010)'; + case 'year': + return 'Use when you only know the year (e.g., 2010)'; + case 'decade': + return 'Use for events in a general decade (e.g., 1980s). Enter any year from that decade.'; + case 'century': + return 'Use for very old dates spanning a century (e.g., 19th century). Enter any year from that century.'; + case 'approximate': + return 'Use when the date is uncertain or estimated (e.g., circa 2010)'; + default: + return ''; + } + }; + return (
{label && } @@ -181,6 +200,11 @@ export function FlexibleDateInput({
+ +
+ +

{getPrecisionHelpText()}

+
); }