import { JSXElementConstructor, PropsWithChildren } from "react"; /** The current size of the root schedulely container, based on width */ type ComponentSize = "small" | "medium" | "large"; declare enum WeekDay { Sunday = 0, Monday = 1, Tuesday = 2, Wednesday = 3, Thursday = 4, Friday = 5, Saturday = 6 } /** * Common interface for porting date libraries so they can be used with Schedulely */ interface DateTimeAdapter { /** Add the specified number of months to the date. Using a negative value will subtract that amount. */ addMonthsToDate: (date: Date, amount: number) => Date; /** Returns all days in the month, split apart by week. Includes leading/trailing days. */ getCalendarView: (date: Date, weekStartsOn?: WeekDay) => Date[][]; /** * Get names of all days of the week in the format specified * @param format The format of the name that will be returned * @returns Array of strings that contain the names of the days of the week */ getDaysOfWeek: (format?: "long" | "short" | "narrow") => string[]; /** * Get the full name of the month for a given date * @param date The date to get the name of the month for * @param format The format of the name that will be returned * @returns Name of the month in the specified format */ getMonthName: (date: Date, format: "long" | "short") => string; /** Get the year component for a given date */ getYear: (date: Date) => number; /** Convert and ISO format string to a Date object */ convertIsoToDate: (isoDate: string) => Date; /** Returns true if the date represent today */ isDateToday: (date: Date) => boolean; /** Does the event fall within or span the supplied week */ isEventInWeek: (eventStartDate: Date, eventEndDate: Date, week: Date[]) => boolean; /** Compare two dates, returns true if they are in the same month, in the same year */ isSameMonth: (firstDate: Date, secondDate: Date) => boolean; /** Is the supplied month the same as the current month */ isCurrentMonth: (date: Date) => boolean; /** Does the target date fall between the supplied dates */ isDateBetween: (targetDate: Date, dateOne: Date, dateTwo: Date) => boolean; } /** * This object represents an event that is supplied by the client */ type CalendarEvent = { /** Unique *external* ID of the event */ id: string; /** Start date of the event (ISO format w/Timezone) */ start: string; /** End date of the event (ISO format w/Timezone) */ end: string; /** Text that will be visible on the event */ summary: string; /** Visible color of the event *(css color value)* */ color: string; /** Optional event data object */ data?: T; }; /** * This object is used internally to represent Events */ type InternalCalendarEvent = Omit, "start" | "end"> & { /** Start date of the event */ start: Date; /** End date of the event */ end: Date; /** Is this event visible (not hidden) */ visible: boolean; }; /** This represents a single calendar week, including both days, events, and their relationships */ interface InternalEventWeek { /** The calendar days in the week */ daysInWeek: Date[]; /** The events that occur within the week */ events: InternalCalendarEvent[]; } interface SchedulelyComponents { dayComponent: DayComponent; headerComponent: HeaderComponent; eventComponent: EventComponent; } declare enum EventPriority { long = 0, short = 1 } /** Properties used to initialize Schedulely */ interface SchedulelyProps { /** DateAdapter used to process dates */ dateAdapter?: DateTimeAdapter; /** Component overrides */ schedulelyComponents?: Partial; /** List of events to display */ events: CalendarEvent[]; /** Additional class names to apply to the root div */ additionalClassNames?: string[]; /** Name of theme to display */ theme?: string; /** Toggle dark theme (if available) */ dark?: boolean; /** Schedulely actions */ actions?: Partial; /** Initial Date that Schedulely should be opened to */ initialDate?: string; /** Which length of event should take priority. * If set to short, long events will be pushed off the calendar before short ones. * If set to long, short events will be pushed off the calendar before long ones. * * _Long is the default_ */ eventPriority?: EventPriority; } /** * Props interface for creating Day components */ interface DayComponentProps { /** Does this date represent the current month (used for coloring trailing/leading days) */ isCurrentMonth: boolean; /** Does this date represent today? */ isToday: boolean; /** Does this date have more events than can fit in the grid? */ isOverflowed: boolean; /** Events occuring on this date */ events: InternalCalendarEvent[]; /** Function executes when the more events indicator is clicked */ onMoreEventsClick: (event: InternalCalendarEvent[]) => void; /** Function executes when the day container is clicked */ onDayClick: (day: Date) => void; /** JS Date object representing this day */ date: Date; } /** * Type used for creating DayComponent */ type DayComponent = JSXElementConstructor>>; /** * Props interface for creating Event components */ interface EventComponentProps { /* The object that represents this event */ event: InternalCalendarEvent; /* True when event is hovered. Can be used to control event display when spanning multiple weeks. */ isHovered: boolean; /** Function executes when the event is clicked */ onClick: (event: InternalCalendarEvent) => void; } /** * Type used for creating EventComponent. * * *optional:* The `` parameter is used to define the structure of the Event `data` property if required. * This can be used to pass additional data into Event component. */ type EventComponent = JSXElementConstructor>; /** Props used when creating a Header */ interface HeaderComponentProps { /** The current month the calendar is displaying */ month: string; /** The current year the calendar is displaying */ year: number; /** True if the selected month is the same as the current month */ isCurrentMonth: boolean; /** Triggers moving forward one month */ onNextMonth: () => void; /** Triggers moving forward one year */ onNextYear: () => void; /** Triggers moving back one month */ onPrevMonth: () => void; /** Triggers moving back one year */ onPrevYear: () => void; } /** The month/year banner displayed at the top of the calendar */ type HeaderComponent = JSXElementConstructor; /** Represents the state of the ActionProvider */ interface ActionContextState { /** function that will run when an event is clicked on */ onEventClick: (event: InternalCalendarEvent) => void; /** function that will run when the 'more events' indicator is clicked on */ onMoreEventsClick: (event: InternalCalendarEvent[]) => void; /** function that will run whenever the month of the calendar is changed */ onMonthChangeClick: (firstOfMonth: Date, lastOfMonth: Date) => void; /** function that will run whenever a day container on the calendar is clicked */ onDayClick: (day: Date) => void; } type BreakpointContextState = { /** The current size of the root container */ breakpoint?: ComponentSize; }; type CalendarContextState = { /** The current active date (this controls calendar position) */ currentDate: Date; /** The current active month */ currentMonth: string; /** The current active year */ currentYear: number; /** The DateTimeAdapter that is being utilized */ dateAdapter: DateTimeAdapter; /** Indicates if the active month is the current month */ isCurrentMonth: boolean; /** The days of the week, for use in the calendar header */ daysOfWeek: string[]; /** Advance the calendar one month */ onNextMonth: () => void; /** Decrease the calendar by one month */ onPrevMonth: () => void; /** Advance the calendar one year */ onNextYear: () => void; /** Decrease the calendar by one year */ onPrevYear: () => void; /** Calendar with events that will be displayed */ calendarWithEvents: InternalEventWeek[]; /** Which length of event should take priority. * If set to short, long events will be pushed off the calendar before short ones. * If set to long, short events will be pushed off the calendar before long ones. * * _Long is the default_ */ eventPriority: EventPriority; }; type EventIntersectionState = { /** Set the parent container that will be used as the root element for overflow detection */ setParentContainerRef: React.Dispatch>; /** Gets an array of events that occur on or span the supplied date. */ getEventsOnDate: (date: Date) => InternalCalendarEvent[]; /** Gets an array of events that occur on or span the supplied date. */ getEvent: (eventId: string) => InternalCalendarEvent; }; interface HighlightEventContextState { /** Set the ID of the currently highlighted event */ setHighlight: (eventId: string) => void; /** Clear the currently value for highlightedEvent */ clearHighlight: () => void; /** Check if the eventId equals the currently highlighted event */ isHighlighted: (eventId: string) => boolean; } /** * Create an instance of Schedulely * @param {SchedulelyProps} param0 Schedulely configuration properties * @returns */ declare const Schedulely: ({ dateAdapter, schedulelyComponents, events, theme, additionalClassNames, actions, dark, eventPriority, initialDate }: SchedulelyProps) => import("react/jsx-runtime").JSX.Element; /** * Create an instance of the default date adapter * @param locale Locale override * @returns DateTimeAdapter */ declare const createDefaultAdapter: (locale?: string, firstDayOfWeek?: WeekDay) => DateTimeAdapter; export { Schedulely, ComponentSize, DateTimeAdapter, CalendarEvent, InternalCalendarEvent, InternalEventWeek, SchedulelyComponents, SchedulelyProps, WeekDay, DayComponentProps, DayComponent, EventComponentProps, EventComponent, HeaderComponentProps, HeaderComponent, ActionContextState, BreakpointContextState, CalendarContextState, EventIntersectionState, HighlightEventContextState, createDefaultAdapter }; //# sourceMappingURL=index.d.ts.map