fix(calendar): Monday-first Swedish week, today highlight, default to current month
- Convert week calculation to Monday-first (startOffset = (firstDay.getDay() + 6) % 7) - Update weekday headers to Swedish labels: [Mån, Tis, Ons, Tor, Fre, Lör, Sön] - Change default currentMonth from June 2026 to current date (new Date()) - Add isToday prop to CalendarDay component - Add --today modifier to highlight current date with blue circle background - Pass computed isToday boolean to CalendarDay when date equals today's date string - Renders correctly for Sunday-starting months (e.g., March 2026) Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -2,9 +2,10 @@ import { ReactNode } from 'react'
|
|||||||
|
|
||||||
export interface CalendarDayProps {
|
export interface CalendarDayProps {
|
||||||
date: string
|
date: string
|
||||||
events?: { type: string; color: string; title?: string }[]
|
events?: { type: string; color: string; title?: string }[] | undefined
|
||||||
isCurrentMonth?: boolean
|
isCurrentMonth?: boolean | undefined
|
||||||
onClick?: () => void
|
onClick?: (() => void) | undefined
|
||||||
|
isToday?: boolean | undefined
|
||||||
}
|
}
|
||||||
|
|
||||||
export function CalendarDay({
|
export function CalendarDay({
|
||||||
@@ -12,6 +13,7 @@ export function CalendarDay({
|
|||||||
events = [],
|
events = [],
|
||||||
isCurrentMonth = true,
|
isCurrentMonth = true,
|
||||||
onClick,
|
onClick,
|
||||||
|
isToday = false,
|
||||||
}: CalendarDayProps): ReactNode {
|
}: CalendarDayProps): ReactNode {
|
||||||
const dayNum = new Date(date + 'T00:00:00Z').getUTCDate()
|
const dayNum = new Date(date + 'T00:00:00Z').getUTCDate()
|
||||||
|
|
||||||
@@ -22,7 +24,7 @@ export function CalendarDay({
|
|||||||
role="button"
|
role="button"
|
||||||
tabIndex={0}
|
tabIndex={0}
|
||||||
aria-label={`${date}${events.length > 0 ? ` with ${events.length} event(s)` : ''}`}
|
aria-label={`${date}${events.length > 0 ? ` with ${events.length} event(s)` : ''}`}
|
||||||
className={`calendar-day ${!isCurrentMonth ? 'calendar-day--disabled' : ''} ${events.length > 0 ? 'calendar-day--has-events' : ''}`}
|
className={`calendar-day ${!isCurrentMonth ? 'calendar-day--disabled' : ''} ${events.length > 0 ? 'calendar-day--has-events' : ''} ${isToday ? 'calendar-day--today' : ''}`}
|
||||||
onKeyDown={(e) => {
|
onKeyDown={(e) => {
|
||||||
if (e.key === 'Enter' || e.key === ' ') {
|
if (e.key === 'Enter' || e.key === ' ') {
|
||||||
onClick?.()
|
onClick?.()
|
||||||
|
|||||||
Reference in New Issue
Block a user