4f:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1o6_421saitt-.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 50:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1o6_421saitt-.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 51:T4685,"use client" import * as React from "react" import * as TooltipPrimitive from "@radix-ui/react-tooltip" import { Check, Snowflake } from "lucide-react" import { cn } from "@/lib/utils" // Types (inlined - only fields used by this component) interface StreakPeriod { periodStart: string periodEnd: string usedFreeze?: boolean } function formatDateKey(date: Date): string { const year = date.getFullYear() const month = String(date.getMonth() + 1).padStart(2, "0") const day = String(date.getDate()).padStart(2, "0") return `${year}-${month}-${day}` } // Helper to check if a date falls within a streak period function isDateInPeriod(date: Date, period: StreakPeriod): boolean { const d = formatDateKey(date) return d >= period.periodStart && d <= period.periodEnd } // Helper to check if date used a freeze function didUseFreezeOnDate(date: Date, periods: StreakPeriod[]): boolean { for (const period of periods) { if (isDateInPeriod(date, period) && period.usedFreeze) { return true } } return false } // Helper to check if date was active in streak function wasDateActive(date: Date, periods: StreakPeriod[]): boolean { for (const period of periods) { if (isDateInPeriod(date, period)) { return true } } return false } // Get days in month function getDaysInMonth(year: number, month: number): number { return new Date(year, month + 1, 0).getDate() } // Get day of week for first day of month (0 = Sunday) function getFirstDayOfMonth(year: number, month: number): number { return new Date(year, month, 1).getDay() } // Props interface StreakCalendarProps extends React.HTMLAttributes { /** Streak periods */ streak: StreakPeriod[] /** Calendar layout variant */ view?: "week" | "month" | "year" /** Month to display (default: current month) */ month?: Date /** Date used for week view (default: today) */ referenceDate?: Date /** Show freeze indicators */ showFreezes?: boolean /** Start of week: 0 = Sunday, 1 = Monday */ startOfWeek?: 0 | 1 /** Callback when a day is clicked */ onDayClick?: (date: Date, wasActive: boolean) => void } const WEEKDAYS_SUNDAY = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"] const WEEKDAYS_MONDAY = ["Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"] const TooltipProvider = TooltipPrimitive.Provider const Tooltip = TooltipPrimitive.Root const TooltipTrigger = TooltipPrimitive.Trigger const TooltipContent = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef >(({ className, sideOffset = 4, ...props }, ref) => ( )) TooltipContent.displayName = TooltipPrimitive.Content.displayName function getDateKey(date: Date): string { return formatDateKey(date) } function getWeekStart(date: Date, startOfWeek: 0 | 1): Date { const next = new Date(date) next.setHours(0, 0, 0, 0) const day = next.getDay() const offset = startOfWeek === 1 ? (day + 6) % 7 : day next.setDate(next.getDate() - offset) return next } function getWeekDates(reference: Date, startOfWeek: 0 | 1): Date[] { const start = getWeekStart(reference, startOfWeek) return Array.from({ length: 7 }, (_, index) => { const date = new Date(start) date.setDate(start.getDate() + index) return date }) } function getWeekdayIndex(date: Date, startOfWeek: 0 | 1): number { const day = date.getDay() return startOfWeek === 1 ? (day + 6) % 7 : day } function getGitDates(endDate: Date): Date[] { const end = new Date(endDate) end.setHours(0, 0, 0, 0) return Array.from({ length: 365 }, (_, index) => { const date = new Date(end) date.setDate(end.getDate() - (364 - index)) return date }) } function getGitCells( endDate: Date, startOfWeek: 0 | 1 ): { cells: (Date | null)[] dates: Date[] } { const dates = getGitDates(endDate) const firstDate = dates[0] if (!firstDate) return { cells: [], dates: [] } const leadingEmptyCells = getWeekdayIndex(firstDate, startOfWeek) const cells: (Date | null)[] = [ ...Array.from({ length: leadingEmptyCells }, () => null), ...dates, ] return { cells, dates } } const StreakCalendar = React.forwardRef( ( { className, streak, view = "week", month = new Date(), referenceDate = new Date(), showFreezes = true, startOfWeek = 0, onDayClick, ...props }, ref ) => { const year = month.getFullYear() const monthIndex = month.getMonth() const daysInMonth = getDaysInMonth(year, monthIndex) const firstDayOfMonth = getFirstDayOfMonth(year, monthIndex) // Adjust first day based on start of week preference const adjustedFirstDay = startOfWeek === 1 ? (firstDayOfMonth + 6) % 7 // Monday start : firstDayOfMonth // Sunday start const weekdays = startOfWeek === 1 ? WEEKDAYS_MONDAY : WEEKDAYS_SUNDAY const today = new Date() today.setHours(0, 0, 0, 0) const periods = streak ?? [] const weekDates = getWeekDates(referenceDate, startOfWeek) const { cells: gitCells, dates: gitDates } = getGitCells(today, startOfWeek) const gitColumnCount = Math.ceil(gitCells.length / 7) const gitGridTemplateColumns = `repeat(${gitColumnCount}, 1rem)` const gitMonthLabels: Array<{ column: number; label: string }> = [] const seenGitMonths = new Set() gitCells.forEach((date, cellIndex) => { if (!date) return const monthKey = `${date.getFullYear()}-${date.getMonth()}` if (!seenGitMonths.has(monthKey) && date.getDate() === 1) { seenGitMonths.add(monthKey) gitMonthLabels.push({ column: Math.floor(cellIndex / 7), label: date.toLocaleDateString("en-US", { month: "short" }), }) } }) const firstDate = gitDates[0] if (firstDate) { const firstMonthKey = `${firstDate.getFullYear()}-${firstDate.getMonth()}` if (!seenGitMonths.has(firstMonthKey)) { gitMonthLabels.unshift({ column: 0, label: firstDate.toLocaleDateString("en-US", { month: "short" }), }) } } // Generate calendar days const days: (number | null)[] = [] // Add empty cells for days before the first of the month for (let i = 0; i < adjustedFirstDay; i++) { days.push(null) } // Add days of the month for (let day = 1; day <= daysInMonth; day++) { days.push(day) } const monthName = month.toLocaleDateString("en-US", { month: "long" }) const gitEndMonthName = today.toLocaleDateString("en-US", { month: "long", }) const freezeColorStyles = { "--freeze-color": "var(--info)", "--freeze-foreground-color": "var(--info-foreground)", } as React.CSSProperties const getCellState = (date: Date) => { const isToday = date.getTime() === today.getTime() const isFuture = date > today const isActive = wasDateActive(date, periods) const usedFreeze = showFreezes && didUseFreezeOnDate(date, periods) return { isToday, isFuture, isActive, usedFreeze } } return (

{view === "month" && ( <>

{monthName} {year}

{weekdays.map((day) => (

{day}

))}

{days.map((day, index) => { if (day === null) { return (

) } const date = new Date(year, monthIndex, day) const { isToday, isFuture, isActive, usedFreeze } = getCellState(date) const dateLabel = date.toLocaleDateString("en-US", { weekday: "long", month: "long", day: "numeric", }) const statusLabel = usedFreeze ? "freeze used" : isActive ? "streak active" : isFuture ? "future" : "no activity" return ( ) })}

)} {view === "week" && (

{weekDates.map((date) => { const { isToday, isFuture, isActive, usedFreeze } = getCellState(date) const dayLabel = date.toLocaleDateString("en-US", { weekday: "short", }) return (

{dayLabel}

) })}

)} {view === "year" && ( <>

Last 365 days

Ending {gitEndMonthName} {today.getDate()}

{gitCells.map((date, index) => { if (!date) { return (

) } const { isToday, isActive, usedFreeze } = getCellState(date) const dateLabel = date.toLocaleDateString("en-US", { weekday: "long", month: "long", day: "numeric", year: "numeric", }) return (

)}

) } ) StreakCalendar.displayName = "StreakCalendar" export { StreakCalendar } export type { StreakCalendarProps, StreakPeriod } 4e:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L4f",null,{"namespace":"@catalogs","registryDependencies":[]}]]}],null]}],["$","$L50",null,{"files":[{"path":"registry/trophy/ui/streak-calendar.tsx","content":"$51","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]