From a1f8e48cbecce89fabb77c24f05280be055afe03 Mon Sep 17 00:00:00 2001 From: rinick Date: Mon, 13 May 2024 20:24:58 -0700 Subject: [PATCH] cleanup agenda related code --- .husky/.gitignore | 1 - .husky/commit-msg | 4 - README.md | 5 +- es/Agenda.js | 196 ---------- es/Views.js | 2 + es/addons/dragAndDrop/index.d.ts | 59 +++ es/index.d.ts | 600 +++++++++++++++++++++++++++++++ package.json | 20 +- 8 files changed, 669 insertions(+), 218 deletions(-) delete mode 100644 .husky/.gitignore delete mode 100755 .husky/commit-msg delete mode 100644 es/Agenda.js create mode 100644 es/addons/dragAndDrop/index.d.ts create mode 100644 es/index.d.ts diff --git a/.husky/.gitignore b/.husky/.gitignore deleted file mode 100644 index 31354ec..0000000 --- a/.husky/.gitignore +++ /dev/null @@ -1 +0,0 @@ -_ diff --git a/.husky/commit-msg b/.husky/commit-msg deleted file mode 100755 index fe4c17a..0000000 --- a/.husky/commit-msg +++ /dev/null @@ -1,4 +0,0 @@ -#!/bin/sh -. "$(dirname "$0")/_/husky.sh" - -npx --no-install commitlint --edit "" diff --git a/README.md b/README.md index ac00dc0..58962e0 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,7 @@ -# react-big-calendar +# ticlo-big-calendar + +This project is forked from https://github.com/jquense/react-big-calendar +It's intended to be used only by the [ticlo](https://github.com/ticlo/ticlo) project An events calendar component built for React and designed for modern browsers (read: not IE) and uses flexbox over the classic tables-caption approach. diff --git a/es/Agenda.js b/es/Agenda.js deleted file mode 100644 index 7272806..0000000 --- a/es/Agenda.js +++ /dev/null @@ -1,196 +0,0 @@ -"use strict"; - -var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default; -var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default; -Object.defineProperty(exports, "__esModule", { - value: true -}); -exports.default = void 0; -var _react = _interopRequireWildcard(require("react")); -var _addClass = _interopRequireDefault(require("dom-helpers/addClass")); -var _removeClass = _interopRequireDefault(require("dom-helpers/removeClass")); -var _width = _interopRequireDefault(require("dom-helpers/width")); -var _scrollbarSize = _interopRequireDefault(require("dom-helpers/scrollbarSize")); -var _constants = require("./utils/constants"); -var _eventLevels = require("./utils/eventLevels"); -var _selection = require("./utils/selection"); -function Agenda(_ref) { - var accessors = _ref.accessors, - components = _ref.components, - date = _ref.date, - events = _ref.events, - getters = _ref.getters, - length = _ref.length, - localizer = _ref.localizer, - onDoubleClickEvent = _ref.onDoubleClickEvent, - onSelectEvent = _ref.onSelectEvent, - selected = _ref.selected; - var headerRef = (0, _react.useRef)(null); - var dateColRef = (0, _react.useRef)(null); - var timeColRef = (0, _react.useRef)(null); - var contentRef = (0, _react.useRef)(null); - var tbodyRef = (0, _react.useRef)(null); - (0, _react.useEffect)(function () { - _adjustHeader(); - }); - var renderDay = function renderDay(day, events, dayKey) { - var Event = components.event, - AgendaDate = components.date; - events = events.filter(function (e) { - return (0, _eventLevels.inRange)(e, localizer.startOf(day, 'day'), localizer.endOf(day, 'day'), accessors, localizer); - }); - return events.map(function (event, idx) { - var title = accessors.title(event); - var end = accessors.end(event); - var start = accessors.start(event); - var userProps = getters.eventProp(event, start, end, (0, _selection.isSelected)(event, selected)); - var dateLabel = idx === 0 && localizer.format(day, 'agendaDateFormat'); - var first = idx === 0 ? /*#__PURE__*/_react.default.createElement("td", { - rowSpan: events.length, - className: "rbc-agenda-date-cell" - }, AgendaDate ? /*#__PURE__*/_react.default.createElement(AgendaDate, { - day: day, - label: dateLabel - }) : dateLabel) : false; - return /*#__PURE__*/_react.default.createElement("tr", { - key: dayKey + '_' + idx, - className: userProps.className, - style: userProps.style - }, first, /*#__PURE__*/_react.default.createElement("td", { - className: "rbc-agenda-time-cell" - }, timeRangeLabel(day, event)), /*#__PURE__*/_react.default.createElement("td", { - className: "rbc-agenda-event-cell", - onClick: function onClick(e) { - return onSelectEvent && onSelectEvent(event, e); - }, - onDoubleClick: function onDoubleClick(e) { - return onDoubleClickEvent && onDoubleClickEvent(event, e); - } - }, Event ? /*#__PURE__*/_react.default.createElement(Event, { - event: event, - title: title - }) : title)); - }, []); - }; - var timeRangeLabel = function timeRangeLabel(day, event) { - var labelClass = '', - TimeComponent = components.time, - label = localizer.messages.allDay; - var end = accessors.end(event); - var start = accessors.start(event); - if (!accessors.allDay(event)) { - if (localizer.eq(start, end)) { - label = localizer.format(start, 'agendaTimeFormat'); - } else if (localizer.isSameDate(start, end)) { - label = localizer.format({ - start: start, - end: end - }, 'agendaTimeRangeFormat'); - } else if (localizer.isSameDate(day, start)) { - label = localizer.format(start, 'agendaTimeFormat'); - } else if (localizer.isSameDate(day, end)) { - label = localizer.format(end, 'agendaTimeFormat'); - } - } - if (localizer.gt(day, start, 'day')) labelClass = 'rbc-continues-prior'; - if (localizer.lt(day, end, 'day')) labelClass += ' rbc-continues-after'; - return /*#__PURE__*/_react.default.createElement("span", { - className: labelClass.trim() - }, TimeComponent ? /*#__PURE__*/_react.default.createElement(TimeComponent, { - event: event, - day: day, - label: label - }) : label); - }; - var _adjustHeader = function _adjustHeader() { - if (!tbodyRef.current) return; - var header = headerRef.current; - var firstRow = tbodyRef.current.firstChild; - if (!firstRow) return; - var isOverflowing = contentRef.current.scrollHeight > contentRef.current.clientHeight; - var _widths = []; - var widths = _widths; - _widths = [(0, _width.default)(firstRow.children[0]), (0, _width.default)(firstRow.children[1])]; - if (widths[0] !== _widths[0] || widths[1] !== _widths[1]) { - dateColRef.current.style.width = _widths[0] + 'px'; - timeColRef.current.style.width = _widths[1] + 'px'; - } - if (isOverflowing) { - (0, _addClass.default)(header, 'rbc-header-overflowing'); - header.style.marginRight = (0, _scrollbarSize.default)() + 'px'; - } else { - (0, _removeClass.default)(header, 'rbc-header-overflowing'); - } - }; - var messages = localizer.messages; - var end = localizer.add(date, length, 'day'); - var range = localizer.range(date, end, 'day'); - events = events.filter(function (event) { - return (0, _eventLevels.inRange)(event, localizer.startOf(date, 'day'), localizer.endOf(end, 'day'), accessors, localizer); - }); - events.sort(function (a, b) { - return +accessors.start(a) - +accessors.start(b); - }); - return /*#__PURE__*/_react.default.createElement("div", { - className: "rbc-agenda-view" - }, events.length !== 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("table", { - ref: headerRef, - className: "rbc-agenda-table" - }, /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("th", { - className: "rbc-header", - ref: dateColRef - }, messages.date), /*#__PURE__*/_react.default.createElement("th", { - className: "rbc-header", - ref: timeColRef - }, messages.time), /*#__PURE__*/_react.default.createElement("th", { - className: "rbc-header" - }, messages.event)))), /*#__PURE__*/_react.default.createElement("div", { - className: "rbc-agenda-content", - ref: contentRef - }, /*#__PURE__*/_react.default.createElement("table", { - className: "rbc-agenda-table" - }, /*#__PURE__*/_react.default.createElement("tbody", { - ref: tbodyRef - }, range.map(function (day, idx) { - return renderDay(day, events, idx); - }))))) : /*#__PURE__*/_react.default.createElement("span", { - className: "rbc-agenda-empty" - }, messages.noEventsInRange)); -} -Agenda.defaultProps = { - length: 30 -}; -Agenda.range = function (start, _ref2) { - var _ref2$length = _ref2.length, - length = _ref2$length === void 0 ? Agenda.defaultProps.length : _ref2$length, - localizer = _ref2.localizer; - var end = localizer.add(start, length, 'day'); - return { - start: start, - end: end - }; -}; -Agenda.navigate = function (date, action, _ref3) { - var _ref3$length = _ref3.length, - length = _ref3$length === void 0 ? Agenda.defaultProps.length : _ref3$length, - localizer = _ref3.localizer; - switch (action) { - case _constants.navigate.PREVIOUS: - return localizer.add(date, -length, 'day'); - case _constants.navigate.NEXT: - return localizer.add(date, length, 'day'); - default: - return date; - } -}; -Agenda.title = function (start, _ref4) { - var _ref4$length = _ref4.length, - length = _ref4$length === void 0 ? Agenda.defaultProps.length : _ref4$length, - localizer = _ref4.localizer; - var end = localizer.add(start, length, 'day'); - return localizer.format({ - start: start, - end: end - }, 'agendaHeaderFormat'); -}; -var _default = exports.default = Agenda; \ No newline at end of file diff --git a/es/Views.js b/es/Views.js index a1a5b62..50b497f 100644 --- a/es/Views.js +++ b/es/Views.js @@ -10,5 +10,7 @@ var _constants = require("./utils/constants"); var _Month = _interopRequireDefault(require("./Month")); var _Day = _interopRequireDefault(require("./Day")); var _Week = _interopRequireDefault(require("./Week")); +// import WorkWeek from './WorkWeek' + var VIEWS = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _constants.views.MONTH, _Month.default), _constants.views.WEEK, _Week.default), _constants.views.DAY, _Day.default); var _default = exports.default = VIEWS; \ No newline at end of file diff --git a/es/addons/dragAndDrop/index.d.ts b/es/addons/dragAndDrop/index.d.ts new file mode 100644 index 0000000..4e2afdd --- /dev/null +++ b/es/addons/dragAndDrop/index.d.ts @@ -0,0 +1,59 @@ +import * as React from "react"; +import { CalendarProps, Components, Event, stringOrDate } from "../../index"; + +export type DragAction = "resize" | "move"; + +export type DragDirection = "UP" | "DOWN" | "LEFT" | "RIGHT"; + +export interface EventInteractionArgs { + event: TEvent; + start: stringOrDate; + end: stringOrDate; + isAllDay?: boolean; + resourceId?: string | number; +} + +export interface OnDragStartArgs { + event: TEvent; + action: DragAction; + direction: DragDirection; +} + +export interface DragFromOutsideItemArgs { + start: stringOrDate; + end: stringOrDate; + allDay: boolean; +} + +export interface withDragAndDropProps { + onEventDrop?: ((args: EventInteractionArgs) => void) | undefined; + onEventResize?: ((args: EventInteractionArgs) => void) | undefined; + onDragStart?: ((args: OnDragStartArgs) => void) | undefined; + onDragOver?: ((event: React.DragEvent) => void) | undefined; + onDropFromOutside?: ((args: DragFromOutsideItemArgs) => void) | undefined; + dragFromOutsideItem?: (() => keyof TEvent | ((event: TEvent) => Date)) | undefined; + draggableAccessor?: keyof TEvent | ((event: TEvent) => boolean) | undefined; + resizableAccessor?: keyof TEvent | ((event: TEvent) => boolean) | undefined; + selectable?: true | false | "ignoreEvents" | undefined; + resizable?: boolean | undefined; + components?: Components | undefined; + elementProps?: React.HTMLAttributes | undefined; + step?: number | undefined; +} + +interface DragAndDropCalendarProps + extends CalendarProps, withDragAndDropProps +{} + +declare class DragAndDropCalendar + extends React.Component> +{} + +declare function withDragAndDrop( + calendar: React.ComponentType>, +): React.ComponentType>; + +export default withDragAndDrop; + +// Turn off automatic exports +export {}; diff --git a/es/index.d.ts b/es/index.d.ts new file mode 100644 index 0000000..464ce09 --- /dev/null +++ b/es/index.d.ts @@ -0,0 +1,600 @@ +import { + add, + endOf, + eq, + gt, + gte, + hours, + inRange, + lt, + lte, + max, + milliseconds, + min, + minutes, + month, + neq, + seconds, + startOf, + StartOfWeek, + Unit, +} from "date-arithmetic"; +import { Validator } from "prop-types"; +import * as React from "react"; + +type Omit = Pick>; + +export type DayPropGetter = (date: Date, resourceId?: number | string) => React.HTMLAttributes; +export type EventPropGetter = ( + event: T, + start: Date, + end: Date, + isSelected: boolean, +) => { className?: string | undefined; style?: React.CSSProperties }; +export type SlotPropGetter = (date: Date, resourceId?: number | string) => React.HTMLAttributes; +export type SlotGroupPropGetter = () => React.HTMLAttributes; + +export type stringOrDate = string | Date; // this isn't documented in the official repo, a thorough review is needed as to where stringOrDate or Date applies + +export type ViewKey = "MONTH" | "WEEK" | "WORK_WEEK" | "DAY"; +export type View = "month" | "week" | "work_week" | "day"; +export type ViewProps = + & Omit< + CalendarProps, + "elementProps" | "className" | "style" | "view" | "toolbar" | "components" | "formats" | "messages" | "culture" + > + & { + date: stringOrDate; // date has always a value, in contrast to optional date in CalendarProps + + // props assigned from Calendar's this.state.context, see there if you want to improve the type defs: + accessors: any; + components: any; + getters: any; + localizer: any; + + // props assigned from Calendar instance, see there if you want to improve the type defs: + getDrilldownView: any; // = this.getDrilldownView + onNavigate: any; // = this.handleNavigate + onDrillDown: any; // = this.handleDrillDown + onSelectEvent: any; // = this.handleSelectEvent + onDoubleClickEvent: any; // = this.handleDoubleClickEvent + onSelectSlot: any; // = this.handleSelectSlot + }; +export type ViewsProps = + | View[] + | { + work_week?: boolean | (React.ComponentType & ViewStatic) | undefined; + day?: boolean | (React.ComponentType & ViewStatic) | undefined; + month?: boolean | (React.ComponentType & ViewStatic) | undefined; + week?: boolean | (React.ComponentType & ViewStatic) | undefined; + }; +export type DayLayoutFunction = (_: { + events: TEvent[]; + minimumStartDifference: number; + slotMetrics: any; + accessors: any; +}) => Array<{ event: TEvent; style: React.CSSProperties }>; +export type DayLayoutAlgorithm = "overlap" | "no-overlap"; +export type NavigateAction = "PREV" | "NEXT" | "TODAY" | "DATE"; +export interface Event { + allDay?: boolean | undefined; + title?: React.ReactNode | undefined; + start?: Date | undefined; + end?: Date | undefined; + resource?: any; +} +export interface DateRange { + start: Date; + end: Date; +} + +export type DateFormatFunction = (date: Date, culture?: Culture, localizer?: DateLocalizer) => string; +export type DateRangeFormatFunction = (range: DateRange, culture?: Culture, localizer?: DateLocalizer) => string; +export type DateFormat = string | DateFormatFunction; + +export interface Formats { + /** + * Format for the day of the month heading in the Month view. + * e.g. "01", "02", "03", etc + */ + dateFormat?: DateFormat | undefined; + + /** + * A day of the week format for Week and Day headings, + * e.g. "Wed 01/04" + */ + dayFormat?: DateFormat | undefined; + + /** + * Week day name format for the Month week day headings, + * e.g: "Sun", "Mon", "Tue", etc + */ + weekdayFormat?: DateFormat | undefined; + + /** + * The timestamp cell formats in Week and Time views, e.g. "4:00 AM" + */ + timeGutterFormat?: DateFormat | undefined; + + /** + * Toolbar header format for the Month view, e.g "2015 April" + */ + monthHeaderFormat?: DateFormat | undefined; + + /** + * Toolbar header format for the Week views, e.g. "Mar 29 - Apr 04" + */ + dayRangeHeaderFormat?: DateRangeFormatFunction | undefined; + + /** + * Toolbar header format for the Day view, e.g. "Wednesday Apr 01" + */ + dayHeaderFormat?: DateFormat | undefined; + + /** + * A time range format for selecting time slots, e.g "8:00am — 2:00pm" + */ + selectRangeFormat?: DateRangeFormatFunction | undefined; + + /** + * Time range displayed on events. + */ + eventTimeRangeFormat?: DateRangeFormatFunction | undefined; + + /** + * An optional event time range for events that continue onto another day + */ + eventTimeRangeStartFormat?: DateRangeFormatFunction | undefined; + + /** + * An optional event time range for events that continue from another day + */ + eventTimeRangeEndFormat?: DateRangeFormatFunction | undefined; +} + +export interface HeaderProps { + date: Date; + label: string; + localizer: DateLocalizer; +} + +export interface DateHeaderProps { + date: Date; + drilldownView: string; + isOffRange: boolean; + label: string; + onDrillDown: () => void; +} + +export interface ResourceHeaderProps { + label: React.ReactNode; + index: number; + resource: TResource; +} + +export interface DateCellWrapperProps { + range: Date[]; + value: Date; + children: React.JSX.Element; +} + +export interface Components { + event?: React.ComponentType> | undefined; + eventWrapper?: React.ComponentType> | undefined; + eventContainerWrapper?: React.ComponentType | undefined; + dateCellWrapper?: React.ComponentType | undefined; + dayColumnWrapper?: React.ComponentType | undefined; + timeSlotWrapper?: React.ComponentType | undefined; + timeGutterHeader?: React.ComponentType | undefined; + timeGutterWrapper?: React.ComponentType | undefined; + toolbar?: React.ComponentType> | undefined; + day?: + | { + header?: React.ComponentType | undefined; + event?: React.ComponentType> | undefined; + } + | undefined; + week?: + | { + header?: React.ComponentType | undefined; + event?: React.ComponentType> | undefined; + } + | undefined; + work_week?: + | { + header?: React.ComponentType | undefined; + event?: React.ComponentType> | undefined; + } + | undefined; + month?: + | { + header?: React.ComponentType | undefined; + dateHeader?: React.ComponentType | undefined; + event?: React.ComponentType> | undefined; + } + | undefined; + /** + * component used as a header for each column in the TimeGridHeader + */ + header?: React.ComponentType | undefined; + resourceHeader?: React.ComponentType> | undefined; +} + +export interface ToolbarProps { + date: Date; + view: View; + views: ViewsProps; + label: string; + localizer: { messages: Messages }; + onNavigate: (navigate: NavigateAction, date?: Date) => void; + onView: (view: View) => void; + children?: React.ReactNode | undefined; +} + +export interface EventProps { + event: TEvent; + title: string; + continuesPrior: boolean; + continuesAfter: boolean; + isAllDay?: boolean; + localizer: DateLocalizer; + slotStart: Date; + slotEnd: Date; +} + +export interface EventWrapperProps { + // https://github.com/intljusticemission/react-big-calendar/blob/27a2656b40ac8729634d24376dff8ea781a66d50/src/TimeGridEvent.js#L28 + style?: (React.CSSProperties & { xOffset: number }) | undefined; + className: string; + event: TEvent; + isRtl: boolean; + getters: { + eventProp?: EventPropGetter | undefined; + slotProp?: SlotPropGetter | undefined; + dayProp?: DayPropGetter | undefined; + }; + onClick: (e: React.MouseEvent) => void; + onDoubleClick: (e: React.MouseEvent) => void; + accessors: { + title?: ((event: TEvent) => string) | undefined; + tooltip?: ((event: TEvent) => string) | undefined; + end?: ((event: TEvent) => Date) | undefined; + start?: ((event: TEvent) => Date) | undefined; + }; + selected: boolean; + label: string; + continuesEarlier: boolean; + continuesLater: boolean; +} + +export interface Messages { + date?: string | undefined; + time?: string | undefined; + event?: string | undefined; + allDay?: string | undefined; + week?: string | undefined; + work_week?: string | undefined; + day?: string | undefined; + month?: string | undefined; + previous?: string | undefined; + next?: string | undefined; + yesterday?: string | undefined; + tomorrow?: string | undefined; + today?: string | undefined; + agenda?: string | undefined; + showMore?: ((count: number) => string) | undefined; + noEventsInRange?: string | undefined; +} + +export interface SlotInfo { + start: Date; + end: Date; + slots: Date[]; + action: "select" | "click" | "doubleClick"; + /** For "TimeGrid" views */ + resourceId?: number | string | undefined; + /** For "select" action */ + bounds?: + | { + x: number; + y: number; + top: number; + bottom: number; + left: number; + right: number; + } + | undefined; + /** For "click" or "doubleClick" actions */ + box?: + | { + x: number; + y: number; + clientX: number; + clientY: number; + } + | undefined; +} + +export type Culture = string; +export type FormatInput = number | string | Date; + +export interface DateLocalizerSpec { + firstOfWeek: (culture: Culture) => number; + format: (value: FormatInput, format: string, culture?: Culture) => string; + formats: Formats; + propType?: Validator | undefined; + startOfWeek: StartOfWeek; + merge: (date: Date, time: Date) => Date | null; + inRange: typeof inRange; + lt: typeof lt; + lte: typeof lte; + gt: typeof gt; + gte: typeof gte; + eq: typeof eq; + neq: typeof neq; + startOf: typeof startOf; + endOf: typeof endOf; + add: typeof add; + range: (start: Date, end: Date, unit?: Unit) => Date[]; + diff: (dateA: Date, dateB: Date, unit?: Unit) => number; + ceil: (date: Date, unit: Unit) => Date; + min: typeof min; + max: typeof max; + minutes: typeof minutes; + firstVisibleDay: (date: Date, localizer: any) => Date; + lastVisibleDay: (date: Date, localizer: any) => Date; + visibleDays: (date: Date, localizer: any) => Date[]; + + getSlotDate: (date: Date, minutesFromMidnight: number, offset: number) => Date; + getTimezoneOffset: (date: Date) => number; + getDstOffset: (date: Date, dateB: Date) => number; + getTotalMin: (dateA: Date, dateB: Date) => number; + getMinutesFromMidnight: (date: Date) => number; + continuesPrior: (dateA: Date, dateB: Date) => boolean; + continuesAfter: (dateA: Date, dateB: Date, dateC: Date) => boolean; + sortEvents: (eventA: Event, eventB: Event) => boolean; + inEventRange: (event: Event, range: DateRange) => boolean; + isSameDate: (dateA: Date, dateB: Date) => boolean; + startAndEndAreDateOnly: (dateA: Date, dateB: Date) => boolean; + segmentOffset: number; +} + +// As documented in https://jquense.github.io/react-big-calendar/examples/?path=/docs/guides-localizers--page +export class DateLocalizer { + formats: Formats; + propType: Validator; + startOfWeek: (culture: Culture) => StartOfWeek; + + constructor(spec: DateLocalizerSpec); + + format(value: FormatInput, format: string, culture?: Culture): string; + messages: Messages; + + merge: (date: Date, time: Date) => Date | null; + inRange: typeof inRange; + lt: typeof lt; + lte: typeof lte; + gt: typeof gt; + gte: typeof gte; + eq: typeof eq; + neq: typeof neq; + startOf: typeof startOf; + endOf: typeof endOf; + add: typeof add; + range: (start: Date, end: Date, unit?: Unit) => Date[]; + diff: (dateA: Date, dateB: Date, unit?: Unit) => number; + ceil: (date: Date, unit?: Unit) => Date; + min: typeof min; + max: typeof max; + minutes: typeof minutes; + firstVisibleDay: (date: Date, localizer: any) => Date; + lastVisibleDay: (date: Date, localizer: any) => Date; + visibleDays: (date: Date, localizer: any) => Date[]; + + getSlotDate: (date: Date, minutesFromMidnight: number, offset: number) => Date; + getTimezoneOffset: (date: Date) => number; + getDstOffset: (date: Date, dateB: Date) => number; + getTotalMin: (dateA: Date, dateB: Date) => number; + getMinutesFromMidnight: (date: Date) => number; + continuesPrior: (dateA: Date, dateB: Date) => boolean; + continuesAfter: (dateA: Date, dateB: Date, dateC: Date) => boolean; + sortEvents: (eventA: Event, eventB: Event) => boolean; + inEventRange: (event: Event, range: DateRange) => boolean; + isSameDate: (dateA: Date, dateB: Date) => boolean; + startAndEndAreDateOnly: (dateA: Date, dateB: Date) => boolean; + segmentOffset: number; +} + +export interface CalendarProps + extends React.RefAttributes> +{ + children?: React.ReactNode; + localizer: DateLocalizer; + + date?: stringOrDate | undefined; + getNow?: () => stringOrDate | undefined; + view?: View | undefined; + events?: TEvent[] | undefined; + backgroundEvents?: TEvent[] | undefined; + handleDragStart?: ((event: TEvent) => void) | undefined; + onNavigate?: ((newDate: Date, view: View, action: NavigateAction) => void) | undefined; + onView?: ((view: View) => void) | undefined; + onDrillDown?: ((date: Date, view: View) => void) | undefined; + onSelectSlot?: ((slotInfo: SlotInfo) => void) | undefined; + onDoubleClickEvent?: ((event: TEvent, e: React.SyntheticEvent) => void) | undefined; + onSelectEvent?: ((event: TEvent, e: React.SyntheticEvent) => void) | undefined; + onKeyPressEvent?: ((event: TEvent, e: React.SyntheticEvent) => void) | undefined; + onSelecting?: (range: { start: Date; end: Date }) => boolean | undefined; + // eslint-disable-next-line @typescript-eslint/no-invalid-void-type + onRangeChange?: (range: Date[] | { start: Date; end: Date }, view?: View) => void | undefined; + showAllEvents?: boolean | undefined; + selected?: any; + views?: ViewsProps | undefined; + doShowMoreDrillDown?: boolean | undefined; + drilldownView?: View | null | undefined; + getDrilldownView?: + | ((targetDate: Date, currentViewName: View, configuredViewNames: View[]) => void) + | null + | undefined; + length?: number | undefined; + toolbar?: boolean | undefined; + popup?: boolean | undefined; + popupOffset?: number | { x: number; y: number } | undefined; + selectable?: boolean | "ignoreEvents" | undefined; + longPressThreshold?: number | undefined; + step?: number | undefined; + timeslots?: number | undefined; + rtl?: boolean | undefined; + eventPropGetter?: EventPropGetter | undefined; + slotPropGetter?: SlotPropGetter | undefined; + slotGroupPropGetter?: SlotGroupPropGetter | undefined; + dayPropGetter?: DayPropGetter | undefined; + showMultiDayTimes?: boolean | undefined; + allDayMaxRows?: number | undefined; + min?: Date | undefined; + max?: Date | undefined; + scrollToTime?: Date | undefined; + enableAutoScroll?: boolean | undefined; + culture?: Culture | undefined; + formats?: Formats | undefined; + components?: Components | undefined; + messages?: Messages | undefined; + dayLayoutAlgorithm?: DayLayoutAlgorithm | DayLayoutFunction | undefined; + titleAccessor?: keyof TEvent | ((event: TEvent) => string) | undefined; + tooltipAccessor?: keyof TEvent | ((event: TEvent) => string) | null | undefined; + allDayAccessor?: keyof TEvent | ((event: TEvent) => boolean) | undefined; + startAccessor?: keyof TEvent | ((event: TEvent) => Date) | undefined; + endAccessor?: keyof TEvent | ((event: TEvent) => Date) | undefined; + resourceAccessor?: keyof TEvent | ((event: TEvent) => any) | undefined; + resources?: TResource[] | undefined; + resourceIdAccessor?: keyof TResource | ((resource: TResource) => any) | undefined; + resourceTitleAccessor?: keyof TResource | ((resource: TResource) => any) | undefined; + defaultView?: View | undefined; + defaultDate?: stringOrDate | undefined; + className?: string | undefined; + elementProps?: React.HTMLAttributes | undefined; + style?: React.CSSProperties | undefined; + onShowMore?: ((events: TEvent[], date: Date) => void) | undefined; +} + +export interface TitleOptions { + formats: DateFormat[]; + culture?: Culture | undefined; + [propName: string]: any; +} + +export interface ViewStatic { + navigate(date: Date, action: NavigateAction, props: any): Date; + title(date: Date, options: TitleOptions): string; +} + +export interface MoveOptions { + action: NavigateAction; + date: Date; + today: Date; +} + +export class Calendar extends React.Component< + CalendarProps +> {} + +export interface components { + timeSlotWrapper: React.ComponentType; + dateCellWrapper: React.ComponentType; + eventWrapper: React.ComponentType; +} +export function globalizeLocalizer(globalizeInstance: object): DateLocalizer; +export function momentLocalizer(momentInstance: object): DateLocalizer; +export function dateFnsLocalizer(config: object): DateLocalizer; +export function luxonLocalizer( + luxonDateTime: object, + options?: { + /** + * Luxon uses 1 based values for month and weekday + * So we default to Sunday (7) + * @default 7 + */ + firstDayOfWeek: number; + }, +): DateLocalizer; +export function dayjsLocalizer(dayjs: object): DateLocalizer; + +export const Navigate: { + PREVIOUS: "PREV"; + NEXT: "NEXT"; + TODAY: "TODAY"; + DATE: "DATE"; +}; +export const Views: { + MONTH: "month"; + WEEK: "week"; + WORK_WEEK: "work_week"; + DAY: "day"; + AGENDA: "agenda"; +}; +export function move(View: ViewStatic | ViewKey, options: MoveOptions): Date; + +export interface TimeGridProps { + eventOffset: number; + events?: TEvent[] | undefined; + backgroundEvents?: TEvent[] | undefined; + resources?: TResource[] | undefined; + step?: number | undefined; + timeslots?: number | undefined; + range?: any[] | undefined; + min?: Date | undefined; + max?: Date | undefined; + getNow?: (() => Date) | undefined; + scrollToTime?: Date | undefined; + showMultiDayTimes?: boolean | undefined; + rtl?: boolean | undefined; + width?: number | undefined; + accessors?: object | undefined; + components?: object | undefined; + getters?: object | undefined; + localizer?: object | undefined; + selected?: object | undefined; + selectable?: boolean | "ignoreEvents" | undefined; + longPressThreshold?: number | undefined; + onNavigate?: ((action: NavigateAction) => void) | undefined; + onSelectSlot?: ((slotInfo: SlotInfo) => void) | undefined; + onSelectEnd?: ((...args: any[]) => any) | undefined; + onSelectStart?: ((...args: any[]) => any) | undefined; + onSelectEvent?: ((event: TEvent, e: React.SyntheticEvent) => void) | undefined; + onDoubleClickEvent?: ((event: TEvent, e: React.SyntheticEvent) => void) | undefined; + onKeyPressEvent?: ((...args: any[]) => any) | undefined; + onDrillDown?: ((date: Date, view: View) => void) | undefined; + getDrilldownView?: + | ((targetDate: Date, currentViewName: View, configuredViewNames: View[]) => void) + | null + | undefined; + dayLayoutAlgorithm?: any; +} + +export class TimeGrid extends React.Component< + TimeGridProps +> {} + +export interface WorkWeekProps { + date: Date; +} + +export class WorkWeek extends Week {} + +export interface WeekProps { + date: Date; +} + +export class Week extends React.Component { + static range: (date: Date) => Date[]; + static navigate: (date: Date, action: NavigateAction) => Date; + static title: (date: Date) => string; +} + +export interface DayProps { + date: Date; +} +export class Day extends React.Component {} + +// Turn off automatic exports +export {}; diff --git a/package.json b/package.json index 57a3c02..7df4fca 100644 --- a/package.json +++ b/package.json @@ -1,18 +1,10 @@ { - "name": "react-big-calendar", - "version": "1.12.1-ticlo", + "name": "ticlo-big-calendar", + "version": "1.12.1", "description": "Calendar! with events", - "author": { - "name": "Jason Quense", - "email": "monastic.panic@gmail.com" - }, "repository": { "type": "git", - "url": "git+https://github.com/jquense/react-big-calendar.git" - }, - "publishConfig": { - "access": "public", - "registry": "https://registry.npmjs.org/" + "url": "git+https://github.com/ticlo/react-big-calendar.git" }, "license": "MIT", "main": "es/index.js", @@ -39,8 +31,7 @@ "prepare": "is-ci || husky install", "prepublishOnly": "yarn build", "prettier": "prettier '**/*js' '!lib/**' --write ", - "storybook": "start-storybook -p 9002", - "tdd": "NODE_ENV=test jest --watch" + "storybook": "start-storybook -p 9002" }, "peerDependencies": { "react": "^16.14.0 || ^17 || ^18", @@ -119,8 +110,5 @@ "react-overlays": "^5.2.1", "uncontrollable": "^7.2.1" }, - "bugs": { - "url": "https://github.com/jquense/react-big-calendar/issues" - }, "homepage": "https://github.com/jquense/react-big-calendar#readme" }