\n {date.getDate()}\n

\n \n {/* Month label */}\n {showMonthLabel && (\n

\n {getMonthName()}\n

\n )}\n \n {/* Events */}\n

\n {visibleEvents.map((event, index) => {\n // Get formatting from the event if available\n const formatting = event.formatting || {};\n const backgroundColor = formatting.backgroundColor || (event.colorId ? getColorForId(event.colorId) : '#e2e8f0');\n const textColor = formatting.textColor || getContrastColor(backgroundColor);\n \n return (\n

\n {formatting.displayText || event.summary}\n

\n );\n })}\n \n {/* Show count of hidden events */}\n {hiddenEventCount > 0 && (\n

\n +{hiddenEventCount} more\n

\n )}\n

\n \n {/* Event details popup */}\n {showEventDetails && events.length > 0 && (\n

e.stopPropagation()}\n >\n

\n {date.toLocaleDateString(undefined, { weekday: 'long', month: 'long', day: 'numeric' })}\n

\n {events.map((event, index) => {\n const backgroundColor = event.formatting?.backgroundColor || (event.colorId ? getColorForId(event.colorId) : '#e2e8f0');\n const textColor = event.formatting?.textColor || getContrastColor(backgroundColor);\n \n return (\n

{event.summary}

\n {event.start?.dateTime && (\n

\n {new Date(event.start.dateTime).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}\n {event.end?.dateTime && (\n <> - {new Date(event.end.dateTime).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}\n )}\n

\n )}\n {event.location && (\n

📍 {event.location}

\n )}\n

\n );\n })}\n \n

\n )}\n \n );\n};\n\n// Helper function to get color for a colorId\nfunction getColorForId(colorId: string): string {\n const colors: Record = {\n '1': '#7986cb', // Lavender\n '2': '#33b679', // Sage\n '3': '#8e24aa', // Grape\n '4': '#e67c73', // Flamingo\n '5': '#f6bf26', // Banana\n '6': '#f4511e', // Tangerine\n '7': '#039be5', // Peacock\n '8': '#616161', // Graphite\n '9': '#3f51b5', // Blueberry\n '10': '#0b8043', // Basil\n '11': '#d50000', // Tomato\n };\n \n return colors[colorId] || '#9e9e9e';\n}\n\n// Helper function to get contrast color (black or white) based on background\nfunction getContrastColor(hexColor: string): string {\n // Convert hex to RGB\n const r = parseInt(hexColor.slice(1, 3), 16);\n const g = parseInt(hexColor.slice(3, 5), 16);\n const b = parseInt(hexColor.slice(5, 7), 16);\n \n // Calculate luminance\n const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;\n \n // Return black for bright colors, white for dark colors\n return luminance > 0.5 ? '#000000' : '#ffffff';\n}\n\nexport default Day;","deleted","label",[169,170,171,172,150],"frontend","components","views","YearView","permalink","https://www.val.town/x/malcolmocean/FlexCal/code/frontend/components/views/YearView/Day.tsx","extension","actionData","errors"]