react-calendar-full/dist/esm/components/calendar-events-for-date.js

A full-featured React calendar component with event scheduling and monthly, weekly, and daily views.

import React from 'react';
import { calculateMinutesSinceMidnight } from '../utils/time';
function getEventPosition(event, dayStartTime) {
    const startTimeMinutes = calculateMinutesSinceMidnight(event.startTime);
    const endTimeMinutes = calculateMinutesSinceMidnight(event.endTime);
    const topPx = startTimeMinutes - dayStartTime * 60;
    const heightPx = endTimeMinutes - startTimeMinutes;
    return {
        top: `${topPx}px`,
        height: `${heightPx}px`,
    };
}
const CalendarEventsForDate = ({ dayStartTime, events, onClick }) => {
    return (React.createElement(React.Fragment, null, events.map((event) => {
        const positionStyle = getEventPosition(event, dayStartTime);
        return (React.createElement("div", { key: event.id, className: "calendar-event green", style: positionStyle, onClick: (e) => {
                e.stopPropagation();
                onClick(event);
            } }, event.description));
    })));
};
export default CalendarEventsForDate;