@visactor/vtable-calendar 1.7.6

package/cjs/index.js

@@ -0,0 +1,30 @@
+"use strict";
+
+var __createBinding = this && this.__createBinding || (Object.create ? function(o, m, k, k2) {
+    void 0 === k2 && (k2 = k);
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    desc && !("get" in desc ? !m.__esModule : desc.writable || desc.configurable) || (desc = {
+        enumerable: !0,
+        get: function() {
+            return m[k];
+        }
+    }), Object.defineProperty(o, k2, desc);
+} : function(o, m, k, k2) {
+    void 0 === k2 && (k2 = k), o[k2] = m[k];
+}), __exportStar = this && this.__exportStar || function(m, exports) {
+    for (var p in m) "default" === p || Object.prototype.hasOwnProperty.call(exports, p) || __createBinding(exports, m, p);
+};
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.CALENDAR_EVENT_TYPE = void 0, __exportStar(require("./month-calendar"), exports);
+
+var type_1 = require("./event/type");
+
+Object.defineProperty(exports, "CALENDAR_EVENT_TYPE", {
+    enumerable: !0,
+    get: function() {
+        return type_1.CALENDAR_EVENT_TYPE;
+    }
+});
+//# sourceMappingURL=index.js.map

package/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,mDAAiC;AAEjC,qCAAmD;AAA1C,2GAAA,mBAAmB,OAAA","file":"index.js","sourcesContent":["export * from './month-calendar';\nexport type { ICustomEvent } from './custom/custom-handler';\nexport { CALENDAR_EVENT_TYPE } from './event/type';\n"]}

package/cjs/month-calendar.d.ts

@@ -0,0 +1,65 @@
+import { ListTable, EventTarget } from '@visactor/vtable';
+import type { DateRecord } from './date-util';
+import type { TYPES, ListTableConstructorOptions } from '@visactor/vtable';
+import type { ICustomEvent, ICustomEventOptions, IEventData } from './custom/custom-handler';
+import { CustomEventHandler } from './custom/custom-handler';
+import type { CalendarEventHandlersEventArgumentMap, CalendarEventHandlersReturnMap, CalendarEventListener } from './event/type';
+import type { EventListenerId } from '@visactor/vtable/src/ts-types';
+export interface CalendarConstructorOptions {
+    startDate?: Date;
+    endDate?: Date;
+    currentDate?: Date;
+    rangeDays?: number;
+    dayTitles?: [string, string, string, string, string, string, string];
+    tableOptions?: ListTableConstructorOptions;
+    customEvents?: ICustomEvent[];
+    customEventOptions?: ICustomEventOptions;
+}
+export declare class Calendar extends EventTarget {
+    container: HTMLElement;
+    options: CalendarConstructorOptions;
+    table: ListTable;
+    startDate: Date;
+    endDate: Date;
+    currentDate: Date;
+    rangeDays: number;
+    tableStartDate: Date;
+    records: DateRecord[];
+    currentMonthCellRanges: {
+        range: TYPES.CellRange;
+    }[];
+    currentMonth: number;
+    currentYear: number;
+    titleClickHandler: () => void;
+    maxCol: number;
+    minCol: number;
+    customHandler: CustomEventHandler;
+    constructor(container: HTMLElement, options?: CalendarConstructorOptions);
+    _createTable(): void;
+    getYearAndMonth(): any;
+    jumpToDate(date: Date, animation?: boolean | TYPES.ITableAnimationOption): void;
+    jumpToCurrentMonth(animation?: boolean | TYPES.ITableAnimationOption): void;
+    _updateMonthCustomStyle(year: number, month: number): void;
+    fireListeners<TYPE extends keyof CalendarEventHandlersEventArgumentMap>(type: TYPE, event: CalendarEventHandlersEventArgumentMap[TYPE]): CalendarEventHandlersReturnMap[TYPE][];
+    on<TYPE extends keyof CalendarEventHandlersEventArgumentMap>(type: TYPE, listener: CalendarEventListener<TYPE>): EventListenerId;
+    _bindEvent(): void;
+    release(): void;
+    getCellLocation(date: Date): {
+        row: number;
+        col: number;
+    };
+    getCellDate(col: number, row: number): Date;
+    get selectedDate(): {
+        date: Date;
+        col: number;
+        row: number;
+    }[];
+    addCustomEvent(event: ICustomEvent): void;
+    removeCustomEvent(id: string): void;
+    updateCustomEvent(event: ICustomEvent): void;
+    addCustomEvents(events: ICustomEvent[]): void;
+    removeCustomEvents(ids: string[]): void;
+    updateCustomEvents(events: ICustomEvent[]): void;
+    getCellCustomEventByDate(date: Date): IEventData[];
+    getCellCustomEventByLocation(col: number, row: number): IEventData[];
+}

package/cjs/month-calendar.js

@@ -0,0 +1,177 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.Calendar = void 0;
+
+const vtable_1 = require("@visactor/vtable"), date_util_1 = require("./date-util"), date_fns_1 = require("date-fns"), style_1 = require("./style"), table_option_1 = require("./table/table-option"), custom_handler_1 = require("./custom/custom-handler"), type_1 = require("./event/type"), vutils_1 = require("@visactor/vutils");
+
+class Calendar extends vtable_1.EventTarget {
+    constructor(container, options) {
+        super(), this.minCol = 0, this.container = container, this.options = null != options ? options : {};
+        const {startDate: startDate, endDate: endDate, currentDate: currentDate, rangeDays: rangeDays} = this.options;
+        if (this.currentDate = null != currentDate ? currentDate : new Date, this.rangeDays = null != rangeDays ? rangeDays : 90, 
+        startDate && endDate) this.startDate = startDate, this.endDate = endDate; else {
+            const {startDate: computedStartDate, endDate: computedEndDate} = (0, date_util_1.getStartAndEndDate)(this.currentDate, this.rangeDays);
+            this.startDate = null != startDate ? startDate : computedStartDate, this.endDate = null != endDate ? endDate : computedEndDate;
+        }
+        this.tableStartDate = 0 === this.startDate.getDay() ? this.startDate : (0, date_fns_1.previousSunday)(this.startDate), 
+        this.customHandler = new custom_handler_1.CustomEventHandler(this, null == options ? void 0 : options.customEventOptions), 
+        this._createTable(), this._bindEvent(), this.options.customEvents && this.addCustomEvents(this.options.customEvents);
+    }
+    _createTable() {
+        const {dayTitles: dayTitles} = this.options, records = (0, date_util_1.getRecords)(this.startDate, this.endDate);
+        this.records = records;
+        const week = null != dayTitles ? dayTitles : date_util_1.defaultDayTitles;
+        this.maxCol = week.length - 1;
+        const option = (0, table_option_1.createTableOption)(week, this.currentDate, {
+            tableOptions: this.options.tableOptions,
+            containerWidth: this.container.clientWidth,
+            containerHeight: this.container.clientHeight
+        });
+        option.records = records, option.container = this.container, option._calendar = this;
+        const tableInstance = new vtable_1.ListTable(option);
+        this.table = tableInstance, tableInstance.addEventListener("scroll", (() => {
+            const record = this.getYearAndMonth();
+            if (!record.Sun) return void this._updateMonthCustomStyle(this.startDate.getFullYear(), this.startDate.getMonth());
+            const firstDateInWeek = new Date(record.year, record.month, record.Sun), lastDateInNextWeek = (0, 
+            date_fns_1.add)(firstDateInWeek, {
+                days: 13
+            });
+            this._updateMonthCustomStyle(lastDateInNextWeek.getFullYear(), lastDateInNextWeek.getMonth());
+        })), tableInstance.addEventListener("scroll_vertical_end", (() => {
+            this._updateMonthCustomStyle(this.endDate.getFullYear(), this.endDate.getMonth());
+        })), this.jumpToCurrentMonth();
+    }
+    getYearAndMonth() {
+        const x = this.table.tableX + 10, y = this.table.tableY + this.table.getFrozenRowsHeight() + 10, topRow = this.table.getCellAtRelativePosition(x, y), {row: row} = topRow;
+        return this.table.getCellRawRecord(0, row);
+    }
+    jumpToDate(date, animation) {
+        date = (0, date_fns_1.startOfDay)(date);
+        const dataIndex = Math.floor(((0, date_fns_1.differenceInDays)(date, this.tableStartDate) + 1) / 7);
+        this.table.scrollToCell({
+            col: 0,
+            row: dataIndex + 1
+        }, animation), this._updateMonthCustomStyle(date.getFullYear(), date.getMonth());
+    }
+    jumpToCurrentMonth(animation) {
+        const topDate = new Date(this.currentDate.getTime());
+        topDate.setDate(1), this.jumpToDate(topDate, animation);
+    }
+    _updateMonthCustomStyle(year, month) {
+        var _a;
+        this.currentMonth === month && this.currentYear === year || (null === (_a = this.currentMonthCellRanges) || void 0 === _a || _a.forEach((range => {
+            this.table.arrangeCustomCellStyle(range, null);
+        })), this.currentMonth = month, this.currentYear = year, this.currentMonthCellRanges = (0, 
+        style_1.getMonthCustomStyleRange)(year, month, this.tableStartDate, this.records), 
+        this.currentMonthCellRanges.forEach((range => {
+            this.table.arrangeCustomCellStyle(range, "current-month");
+        })));
+    }
+    fireListeners(type, event) {
+        return super.fireListeners(type, event);
+    }
+    on(type, listener) {
+        return super.on(type, listener);
+    }
+    _bindEvent() {
+        const titleComponent = this.table.internalProps.title.getComponentGraphic();
+        titleComponent.setAttributes({
+            cursor: "pointer",
+            childrenPickable: !1
+        }), this.titleClickHandler = (() => {
+            this.jumpToCurrentMonth({
+                duration: 500
+            });
+        }).bind(this), titleComponent.addEventListener("click", this.titleClickHandler), 
+        this.table.on("click_cell", (e => {
+            const {target: target} = e;
+            "calendar-custom-event" === target._role ? this.fireListeners(type_1.CALENDAR_EVENT_TYPE.CALENDAR_CUSTOM_EVENT_CLICK, {
+                tableEvent: e,
+                date: this.getCellDate(e.col, e.row),
+                customEvent: target._customEvent
+            }) : this.table.isHeader(e.col, e.row) || this.fireListeners(type_1.CALENDAR_EVENT_TYPE.CALENDAR_DATE_CLICK, {
+                tableEvent: e,
+                date: this.getCellDate(e.col, e.row)
+            });
+        })), this.table.on("selected_cell", (e => {
+            this.table.isHeader(e.col, e.row) || this.fireListeners(type_1.CALENDAR_EVENT_TYPE.SELECTED_DATE, {
+                tableEvent: e,
+                date: this.getCellDate(e.col, e.row)
+            });
+        })), this.table.on("selected_clear", (() => {
+            this.fireListeners(type_1.CALENDAR_EVENT_TYPE.SELECTED_DATE_CLEAR, void 0);
+        })), this.table.on("drag_select_end", (e => {
+            const {cells: cells} = e, dates = [];
+            cells.map((row => {
+                row.map((cell => {
+                    this.table.isHeader(cell.col, cell.row) || dates.push(this.getCellDate(cell.col, cell.row));
+                }));
+            })), this.fireListeners(type_1.CALENDAR_EVENT_TYPE.DRAG_SELECT_DATE_END, {
+                tableEvent: e,
+                dates: dates
+            });
+        }));
+    }
+    release() {
+        this.table.release();
+    }
+    getCellLocation(date) {
+        date = (0, date_fns_1.startOfDay)(date);
+        return {
+            row: Math.floor(((0, date_fns_1.differenceInDays)(date, this.tableStartDate) + 1) / 7) + 1,
+            col: date.getDay()
+        };
+    }
+    getCellDate(col, row) {
+        return (0, date_fns_1.add)(this.tableStartDate, {
+            days: 7 * (row - 1) + col
+        });
+    }
+    get selectedDate() {
+        const cells = this.table.getSelectedCellInfos();
+        if (!(0, vutils_1.isArray)(cells) || 0 === cells.length) return [];
+        const dates = [];
+        return cells.map((row => {
+            row.map((cell => {
+                this.table.isHeader(cell.col, cell.row) || dates.push({
+                    date: this.getCellDate(cell.col, cell.row),
+                    col: cell.col,
+                    row: cell.row
+                });
+            }));
+        })), dates;
+    }
+    addCustomEvent(event) {
+        this.customHandler.addEvent(event), this.table.scenegraph.updateNextFrame();
+    }
+    removeCustomEvent(id) {
+        this.customHandler.removeEvents([ id ]), this.table.scenegraph.updateNextFrame();
+    }
+    updateCustomEvent(event) {
+        this.customHandler.updateEvents([ event ]), this.table.scenegraph.updateNextFrame();
+    }
+    addCustomEvents(events) {
+        this.customHandler.addEvents(events), this.table.scenegraph.updateNextFrame();
+    }
+    removeCustomEvents(ids) {
+        this.customHandler.removeEvents(ids), this.table.scenegraph.updateNextFrame();
+    }
+    updateCustomEvents(events) {
+        this.customHandler.updateEvents(events), this.table.scenegraph.updateNextFrame();
+    }
+    getCellCustomEventByDate(date) {
+        const location = this.getCellLocation(date);
+        return this.getCellCustomEventByLocation(location.col, location.row);
+    }
+    getCellCustomEventByLocation(col, row) {
+        const cellEvent = this.customHandler.getCellCustomEvent(col, row), events = [];
+        return null == cellEvent || cellEvent.keys.forEach((key => {
+            events.push(cellEvent.values[key]);
+        })), events;
+    }
+}
+
+exports.Calendar = Calendar;
+//# sourceMappingURL=month-calendar.js.map

package/cjs/month-calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["month-calendar.ts"],"names":[],"mappings":"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","file":"month-calendar.js","sourcesContent":["import { ListTable, EventTarget } from '@visactor/vtable';\nimport type { DateRecord, DateRecordKeys } from './date-util';\nimport { defaultDayTitles, getRecords, getStartAndEndDate } from './date-util';\nimport { bindDebugTool } from '../../vtable/src/scenegraph/debug-tool';\nimport { add, differenceInDays, previousSunday, startOfDay } from 'date-fns';\nimport { getMonthCustomStyleRange } from './style';\nimport type { TYPES, ListTableConstructorOptions } from '@visactor/vtable';\nimport { createTableOption } from './table/table-option';\nimport type { ICustomEvent, ICustomEventOptions, IEventData } from './custom/custom-handler';\nimport { CustomEventHandler } from './custom/custom-handler';\nimport type {\n  CalendarEventHandlersEventArgumentMap,\n  CalendarEventHandlersReturnMap,\n  CalendarEventListener\n} from './event/type';\nimport { CALENDAR_EVENT_TYPE } from './event/type';\nimport type { EventListenerId } from '@visactor/vtable/src/ts-types';\nimport { isArray } from '@visactor/vutils';\n\nexport interface CalendarConstructorOptions {\n  startDate?: Date;\n  endDate?: Date;\n  currentDate?: Date;\n  rangeDays?: number;\n\n  dayTitles?: [string, string, string, string, string, string, string];\n\n  tableOptions?: ListTableConstructorOptions;\n\n  customEvents?: ICustomEvent[];\n  customEventOptions?: ICustomEventOptions;\n}\n\nexport class Calendar extends EventTarget {\n  container: HTMLElement;\n  options: CalendarConstructorOptions;\n  table: ListTable;\n  startDate: Date;\n  endDate: Date;\n  currentDate: Date;\n  rangeDays: number;\n  tableStartDate: Date;\n  records: DateRecord[];\n  currentMonthCellRanges: { range: TYPES.CellRange }[];\n  currentMonth: number;\n  currentYear: number;\n\n  titleClickHandler: () => void;\n\n  maxCol: number;\n  minCol: number = 0;\n  customHandler: CustomEventHandler;\n\n  constructor(container: HTMLElement, options?: CalendarConstructorOptions) {\n    super();\n    this.container = container;\n    this.options = options ?? {};\n    const { startDate, endDate, currentDate, rangeDays } = this.options;\n\n    this.currentDate = currentDate ?? new Date();\n    this.rangeDays = rangeDays ?? 90;\n    if (startDate && endDate) {\n      this.startDate = startDate;\n      this.endDate = endDate;\n    } else {\n      const { startDate: computedStartDate, endDate: computedEndDate } = getStartAndEndDate(\n        this.currentDate,\n        this.rangeDays\n      );\n      this.startDate = startDate ?? computedStartDate;\n      this.endDate = endDate ?? computedEndDate;\n    }\n    this.tableStartDate = this.startDate.getDay() === 0 ? this.startDate : previousSunday(this.startDate);\n\n    this.customHandler = new CustomEventHandler(this, options?.customEventOptions);\n\n    this._createTable();\n\n    this._bindEvent();\n\n    if (this.options.customEvents) {\n      this.addCustomEvents(this.options.customEvents);\n    }\n  }\n\n  _createTable() {\n    const { dayTitles } = this.options;\n\n    const records = getRecords(this.startDate, this.endDate);\n    this.records = records;\n\n    const week = (dayTitles ?? defaultDayTitles) as DateRecordKeys[];\n    this.maxCol = week.length - 1;\n    const option = createTableOption(week, this.currentDate, {\n      tableOptions: this.options.tableOptions,\n      containerWidth: this.container.clientWidth,\n      containerHeight: this.container.clientHeight\n    });\n    option.records = records;\n    option.container = this.container;\n    (option as any)._calendar = this;\n\n    const tableInstance = new ListTable(option);\n    this.table = tableInstance;\n\n    tableInstance.addEventListener('scroll', () => {\n      const record: DateRecord = this.getYearAndMonth();\n      if (!record.Sun) {\n        // top\n        this._updateMonthCustomStyle(this.startDate.getFullYear(), this.startDate.getMonth());\n        return;\n      }\n      const firstDateInWeek = new Date(record.year, record.month, record.Sun);\n      const lastDateInNextWeek = add(firstDateInWeek, {\n        days: 13\n      });\n      this._updateMonthCustomStyle(lastDateInNextWeek.getFullYear(), lastDateInNextWeek.getMonth());\n    });\n\n    tableInstance.addEventListener('scroll_vertical_end', () => {\n      this._updateMonthCustomStyle(this.endDate.getFullYear(), this.endDate.getMonth());\n    });\n\n    this.jumpToCurrentMonth();\n\n    // bindDebugTool(tableInstance.scenegraph.stage as any, {\n    //   customGrapicKeys: ['col', 'row']\n    // });\n  }\n\n  getYearAndMonth() {\n    const x = this.table.tableX + 10; // buffer\n    const y = this.table.tableY + this.table.getFrozenRowsHeight() + 10; // buffer\n    const topRow = this.table.getCellAtRelativePosition(x, y);\n    const { row } = topRow;\n    const record = this.table.getCellRawRecord(0, row);\n    return record;\n  }\n\n  jumpToDate(date: Date, animation?: boolean | TYPES.ITableAnimationOption) {\n    date = startOfDay(date);\n    const dataIndex = Math.floor((differenceInDays(date, this.tableStartDate) + 1) / 7);\n    this.table.scrollToCell(\n      {\n        col: 0,\n        row: dataIndex + 1\n      },\n      animation\n    );\n\n    this._updateMonthCustomStyle(date.getFullYear(), date.getMonth());\n  }\n\n  jumpToCurrentMonth(animation?: boolean | TYPES.ITableAnimationOption) {\n    // scroll to current month\n    const topDate = new Date(this.currentDate.getTime());\n    topDate.setDate(1);\n    this.jumpToDate(topDate, animation);\n  }\n\n  _updateMonthCustomStyle(year: number, month: number) {\n    if (this.currentMonth === month && this.currentYear === year) {\n      return;\n    }\n\n    // clear current\n    this.currentMonthCellRanges?.forEach(range => {\n      this.table.arrangeCustomCellStyle(range, null);\n    });\n\n    this.currentMonth = month;\n    this.currentYear = year;\n    this.currentMonthCellRanges = getMonthCustomStyleRange(year, month, this.tableStartDate, this.records);\n    this.currentMonthCellRanges.forEach(range => {\n      this.table.arrangeCustomCellStyle(range, 'current-month');\n    });\n  }\n\n  // @ts-ignore\n  fireListeners<TYPE extends keyof CalendarEventHandlersEventArgumentMap>(\n    type: TYPE,\n    event: CalendarEventHandlersEventArgumentMap[TYPE]\n  ): CalendarEventHandlersReturnMap[TYPE][] {\n    // 调用父类的方法\n    return super.fireListeners(type as any, event as any);\n  }\n\n  // @ts-ignore\n  on<TYPE extends keyof CalendarEventHandlersEventArgumentMap>(\n    type: TYPE,\n    listener: CalendarEventListener<TYPE>\n  ): EventListenerId {\n    // 调用父类的方法\n    return super.on(type as any, listener as any);\n  }\n\n  _bindEvent() {\n    // click title jump to current month\n    const titleComponent = this.table.internalProps.title.getComponentGraphic();\n    titleComponent.setAttributes({\n      cursor: 'pointer',\n      // hack for cursor\n      childrenPickable: false\n    });\n    this.titleClickHandler = (() => {\n      this.jumpToCurrentMonth({\n        duration: 500\n      });\n    }).bind(this);\n    titleComponent.addEventListener('click', this.titleClickHandler);\n\n    this.table.on('click_cell', e => {\n      const { target } = e;\n      if ((target as any)._role === 'calendar-custom-event') {\n        this.fireListeners(CALENDAR_EVENT_TYPE.CALENDAR_CUSTOM_EVENT_CLICK, {\n          tableEvent: e,\n          date: this.getCellDate(e.col, e.row),\n          customEvent: (target as any)._customEvent\n        });\n      } else if (!this.table.isHeader(e.col, e.row)) {\n        this.fireListeners(CALENDAR_EVENT_TYPE.CALENDAR_DATE_CLICK, {\n          tableEvent: e,\n          date: this.getCellDate(e.col, e.row)\n        });\n      }\n    });\n\n    this.table.on('selected_cell', e => {\n      if (!this.table.isHeader(e.col, e.row)) {\n        this.fireListeners(CALENDAR_EVENT_TYPE.SELECTED_DATE, {\n          tableEvent: e,\n          date: this.getCellDate(e.col, e.row)\n        });\n      }\n    });\n\n    this.table.on('selected_clear', () => {\n      this.fireListeners(CALENDAR_EVENT_TYPE.SELECTED_DATE_CLEAR, undefined);\n    });\n\n    this.table.on('drag_select_end', e => {\n      const { cells } = e;\n      const dates: Date[] = [];\n      cells.map(row => {\n        row.map(cell => {\n          if (!this.table.isHeader(cell.col, cell.row)) {\n            dates.push(this.getCellDate(cell.col, cell.row));\n          }\n        });\n      });\n      this.fireListeners(CALENDAR_EVENT_TYPE.DRAG_SELECT_DATE_END, {\n        tableEvent: e,\n        dates\n      });\n    });\n  }\n\n  release() {\n    this.table.release();\n  }\n\n  getCellLocation(date: Date) {\n    date = startOfDay(date);\n    const dataIndex = Math.floor((differenceInDays(date, this.tableStartDate) + 1) / 7);\n    const row = dataIndex + 1;\n    const col = date.getDay();\n\n    return {\n      row,\n      col\n    };\n  }\n\n  getCellDate(col: number, row: number) {\n    const startDate = add(this.tableStartDate, {\n      days: (row - 1) * 7 + col\n    });\n    return startDate;\n  }\n\n  get selectedDate(): { date: Date; col: number; row: number }[] {\n    const cells = this.table.getSelectedCellInfos();\n    if (!isArray(cells) || cells.length === 0) {\n      return [];\n    }\n    const dates: { date: Date; col: number; row: number }[] = [];\n    cells.map(row => {\n      row.map(cell => {\n        if (!this.table.isHeader(cell.col, cell.row)) {\n          dates.push({\n            date: this.getCellDate(cell.col, cell.row),\n            col: cell.col,\n            row: cell.row\n          });\n        }\n      });\n    });\n\n    return dates;\n  }\n\n  addCustomEvent(event: ICustomEvent) {\n    this.customHandler.addEvent(event);\n    this.table.scenegraph.updateNextFrame();\n  }\n\n  removeCustomEvent(id: string) {\n    this.customHandler.removeEvents([id]);\n    this.table.scenegraph.updateNextFrame();\n  }\n\n  updateCustomEvent(event: ICustomEvent) {\n    this.customHandler.updateEvents([event]);\n    this.table.scenegraph.updateNextFrame();\n  }\n\n  addCustomEvents(events: ICustomEvent[]) {\n    this.customHandler.addEvents(events);\n    this.table.scenegraph.updateNextFrame();\n  }\n\n  removeCustomEvents(ids: string[]) {\n    this.customHandler.removeEvents(ids);\n    this.table.scenegraph.updateNextFrame();\n  }\n\n  updateCustomEvents(events: ICustomEvent[]) {\n    this.customHandler.updateEvents(events);\n    this.table.scenegraph.updateNextFrame();\n  }\n\n  getCellCustomEventByDate(date: Date) {\n    const location = this.getCellLocation(date);\n    return this.getCellCustomEventByLocation(location.col, location.row);\n  }\n\n  getCellCustomEventByLocation(col: number, row: number) {\n    const cellEvent = this.customHandler.getCellCustomEvent(col, row);\n    const events: IEventData[] = [];\n    cellEvent?.keys.forEach(key => {\n      events.push(cellEvent.values[key]);\n    });\n    return events;\n  }\n}\n"]}

package/cjs/style.d.ts

@@ -0,0 +1,13 @@
+import type { DateRecord } from './date-util';
+export declare function getMonthCustomStyleRange(year: number, month: number, tableStartDate: Date, records: DateRecord[]): {
+    range: {
+        start: {
+            col: number;
+            row: number;
+        };
+        end: {
+            col: number;
+            row: number;
+        };
+    };
+}[];

package/cjs/style.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.getMonthCustomStyleRange = void 0;
+
+const date_fns_1 = require("date-fns");
+
+function getMonthCustomStyleRange(year, month, tableStartDate, records) {
+    const startDate = new Date(year, month, 1), startDataIndex = Math.floor(((0, date_fns_1.differenceInDays)(startDate, tableStartDate) + 1) / 7), startRecord = records[startDataIndex], endDate = (0, 
+    date_fns_1.lastDayOfMonth)(startDate), endDataIndex = Math.floor(((0, date_fns_1.differenceInDays)(endDate, tableStartDate) + 1) / 7), endRecord = records[endDataIndex], customCellRanges = [ {
+        range: {
+            start: {
+                col: 0,
+                row: startDataIndex + 1 + 1
+            },
+            end: {
+                col: 6,
+                row: endDataIndex
+            }
+        }
+    } ];
+    let startIndex, endIndex;
+    1 === startRecord.Sun ? startIndex = 0 : 1 === startRecord.Mon ? startIndex = 1 : 1 === startRecord.Tue ? startIndex = 2 : 1 === startRecord.Wed ? startIndex = 3 : 1 === startRecord.Thu ? startIndex = 4 : 1 === startRecord.Fri ? startIndex = 5 : 1 === startRecord.Sat && (startIndex = 6), 
+    customCellRanges.push({
+        range: {
+            start: {
+                col: startIndex,
+                row: startDataIndex + 1
+            },
+            end: {
+                col: 6,
+                row: startDataIndex + 1
+            }
+        }
+    });
+    const monthEndDate = endDate.getDate();
+    return endRecord.Sun === monthEndDate ? endIndex = 0 : endRecord.Mon === monthEndDate ? endIndex = 1 : endRecord.Tue === monthEndDate ? endIndex = 2 : endRecord.Wed === monthEndDate ? endIndex = 3 : endRecord.Thu === monthEndDate ? endIndex = 4 : endRecord.Fri === monthEndDate ? endIndex = 5 : endRecord.Sat === monthEndDate && (endIndex = 6), 
+    customCellRanges.push({
+        range: {
+            start: {
+                col: 0,
+                row: endDataIndex + 1
+            },
+            end: {
+                col: endIndex,
+                row: endDataIndex + 1
+            }
+        }
+    }), customCellRanges;
+}
+
+exports.getMonthCustomStyleRange = getMonthCustomStyleRange;
+//# sourceMappingURL=style.js.map

package/cjs/style.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["style.ts"],"names":[],"mappings":"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","file":"style.js","sourcesContent":["import { differenceInDays, lastDayOfMonth } from 'date-fns';\nimport type { DateRecord } from './date-util';\n\nexport function getMonthCustomStyleRange(year: number, month: number, tableStartDate: Date, records: DateRecord[]) {\n  const startDate = new Date(year, month, 1);\n  const startDataIndex = Math.floor((differenceInDays(startDate, tableStartDate) + 1) / 7);\n  const startRecord = records[startDataIndex];\n\n  const endDate = lastDayOfMonth(startDate);\n  const endDataIndex = Math.floor((differenceInDays(endDate, tableStartDate) + 1) / 7);\n  const endRecord = records[endDataIndex];\n\n  const customCellRanges = [\n    {\n      range: {\n        start: {\n          col: 0,\n          row: startDataIndex + 1 + 1\n        },\n        end: {\n          col: 6,\n          row: endDataIndex\n        }\n      }\n    }\n  ];\n\n  let startIndex;\n  if (startRecord.Sun === 1) {\n    startIndex = 0;\n  } else if (startRecord.Mon === 1) {\n    startIndex = 1;\n  } else if (startRecord.Tue === 1) {\n    startIndex = 2;\n  } else if (startRecord.Wed === 1) {\n    startIndex = 3;\n  } else if (startRecord.Thu === 1) {\n    startIndex = 4;\n  } else if (startRecord.Fri === 1) {\n    startIndex = 5;\n  } else if (startRecord.Sat === 1) {\n    startIndex = 6;\n  }\n  customCellRanges.push({\n    range: {\n      start: {\n        col: startIndex,\n        row: startDataIndex + 1\n      },\n      end: {\n        col: 6,\n        row: startDataIndex + 1\n      }\n    }\n  });\n\n  let endIndex;\n  const monthEndDate = endDate.getDate();\n  if (endRecord.Sun === monthEndDate) {\n    endIndex = 0;\n  } else if (endRecord.Mon === monthEndDate) {\n    endIndex = 1;\n  } else if (endRecord.Tue === monthEndDate) {\n    endIndex = 2;\n  } else if (endRecord.Wed === monthEndDate) {\n    endIndex = 3;\n  } else if (endRecord.Thu === monthEndDate) {\n    endIndex = 4;\n  } else if (endRecord.Fri === monthEndDate) {\n    endIndex = 5;\n  } else if (endRecord.Sat === monthEndDate) {\n    endIndex = 6;\n  }\n\n  customCellRanges.push({\n    range: {\n      start: {\n        col: 0,\n        row: endDataIndex + 1\n      },\n      end: {\n        col: endIndex,\n        row: endDataIndex + 1\n      }\n    }\n  });\n\n  return customCellRanges;\n}\n"]}

package/cjs/table/table-option.d.ts

@@ -0,0 +1,7 @@
+import type { ListTableConstructorOptions } from '@visactor/vtable';
+import type { DateRecordKeys } from '../date-util';
+export declare function createTableOption(week: DateRecordKeys[], currentDate: Date, config: {
+    tableOptions?: ListTableConstructorOptions;
+    containerWidth: number;
+    containerHeight: number;
+}): ListTableConstructorOptions;

package/cjs/table/table-option.js

@@ -0,0 +1,61 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.createTableOption = void 0;
+
+const vtable_1 = require("@visactor/vtable"), date_util_1 = require("../date-util"), custom_layout_1 = require("../custom/custom-layout"), vutils_1 = require("@visactor/vutils");
+
+function createTableOption(week, currentDate, config) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
+    const columns = week.map(((item, index) => ({
+        field: date_util_1.defaultDayTitles[index],
+        title: item,
+        fieldFormat: record => {
+            if (record.year === currentDate.getFullYear() && record.month === currentDate.getMonth() && record[item] === currentDate.getDate()) return `${record[item]}\nToday`;
+            if (1 === record[item]) {
+                const monthIndex = "Sun" === item ? record.month : record.month + 1, mouthStr = (0, 
+                date_util_1.getMonthString)(monthIndex);
+                return `${record[item]}\n${mouthStr}`;
+            }
+            return record[item];
+        },
+        customLayout: custom_layout_1.calendarCustomLayout
+    }))), rowHeight = Math.floor((config.containerHeight - ((null !== (_d = null === (_c = null === (_b = null === (_a = config.tableOptions) || void 0 === _a ? void 0 : _a.title) || void 0 === _b ? void 0 : _b.textStyle) || void 0 === _c ? void 0 : _c.fontSize) && void 0 !== _d ? _d : 20) + (null !== (_h = null === (_g = null === (_f = null === (_e = config.tableOptions) || void 0 === _e ? void 0 : _e.title) || void 0 === _f ? void 0 : _f.subtextStyle) || void 0 === _g ? void 0 : _g.fontSize) && void 0 !== _h ? _h : 16) + 1) - (null !== (_k = null === (_j = config.tableOptions) || void 0 === _j ? void 0 : _j.defaultHeaderRowHeight) && void 0 !== _k ? _k : 40)) / 5);
+    return Object.assign(Object.assign({}, null !== (_l = config.tableOptions) && void 0 !== _l ? _l : {}), {
+        columns: columns,
+        defaultRowHeight: null != rowHeight ? rowHeight : 120,
+        defaultHeaderRowHeight: null !== (_o = null === (_m = config.tableOptions) || void 0 === _m ? void 0 : _m.defaultHeaderRowHeight) && void 0 !== _o ? _o : 40,
+        widthMode: "adaptive",
+        columnResizeMode: "none",
+        theme: vtable_1.themes.DEFAULT.extends((0, vutils_1.merge)({
+            headerStyle: {
+                textAlign: "center"
+            },
+            bodyStyle: {
+                bgColor: args => {
+                    const {col: col, row: row, dataValue: dataValue, table: table} = args, record = table.getCellRawRecord(col, row), date = dataValue, month = record.Sun > dataValue ? record.month + 1 : record.month;
+                    return (11 === record.month && record.Sun > dataValue ? record.year + 1 : record.year) === currentDate.getFullYear() && month === currentDate.getMonth() && date === currentDate.getDate() ? "#f0f0f0" : "#fff";
+                },
+                textAlign: "right",
+                textBaseline: "top",
+                color: "#999"
+            }
+        }, null === (_p = config.tableOptions) || void 0 === _p ? void 0 : _p.theme)),
+        title: Object.assign(Object.assign({}, null !== (_r = null === (_q = config.tableOptions) || void 0 === _q ? void 0 : _q.title) && void 0 !== _r ? _r : {}), {
+            orient: "top",
+            text: `${(0, date_util_1.getWeekdayString)(currentDate.getDay())}, ${(0, date_util_1.getMonthString)(currentDate.getMonth())} ${currentDate.getDate()}`,
+            subtext: currentDate.getFullYear()
+        }),
+        enableLineBreak: !0,
+        customCellStyle: [ {
+            id: "current-month",
+            style: {
+                color: "#000"
+            }
+        } ]
+    });
+}
+
+exports.createTableOption = createTableOption;
+//# sourceMappingURL=table-option.js.map

package/cjs/table/table-option.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["table/table-option.ts"],"names":[],"mappings":"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","file":"table-option.js","sourcesContent":["import type { ListTableConstructorOptions, TYPES } from '@visactor/vtable';\nimport { themes } from '@visactor/vtable';\nimport type { DateRecord, DateRecordKeys } from '../date-util';\nimport { defaultDayTitles, getMonthString, getWeekdayString } from '../date-util';\nimport { calendarCustomLayout } from '../custom/custom-layout';\nimport { merge } from '@visactor/vutils';\n\nexport function createTableOption(\n  week: DateRecordKeys[],\n  currentDate: Date,\n  config: { tableOptions?: ListTableConstructorOptions; containerWidth: number; containerHeight: number }\n) {\n  const columns = week.map((item: DateRecordKeys, index: number) => {\n    return {\n      field: defaultDayTitles[index],\n      title: item,\n      // width: columnWidth ?? 140,\n      fieldFormat: (record: DateRecord) => {\n        if (\n          record.year === currentDate.getFullYear() &&\n          record.month === currentDate.getMonth() &&\n          record[item] === currentDate.getDate()\n        ) {\n          return `${record[item]}\\nToday`;\n        } else if (record[item] === 1) {\n          const monthIndex = item === 'Sun' ? record.month : record.month + 1;\n          const mouthStr = getMonthString(monthIndex);\n          return `${record[item]}\\n${mouthStr}`;\n        }\n        return record[item];\n      },\n      customLayout: calendarCustomLayout\n    };\n  });\n\n  const rowHeight = Math.floor(\n    (config.containerHeight -\n      ((config.tableOptions?.title?.textStyle?.fontSize ?? 20) +\n        (config.tableOptions?.title?.subtextStyle?.fontSize ?? 16) +\n        1) -\n      ((config.tableOptions?.defaultHeaderRowHeight as number) ?? 40)) /\n      5\n  ); // height - title - header\n  const option: TYPES.ListTableConstructorOptions = {\n    ...(config.tableOptions ?? {}),\n\n    columns,\n    defaultRowHeight: rowHeight ?? 120,\n    defaultHeaderRowHeight: config.tableOptions?.defaultHeaderRowHeight ?? 40,\n    widthMode: 'adaptive',\n    columnResizeMode: 'none',\n    theme: themes.DEFAULT.extends(\n      merge(\n        {\n          headerStyle: {\n            textAlign: 'center'\n          },\n          bodyStyle: {\n            bgColor: args => {\n              const { col, row, dataValue, table } = args;\n              const record = table.getCellRawRecord(col, row);\n              const date = dataValue;\n              const month = record.Sun > dataValue ? record.month + 1 : record.month;\n              const year = record.month === 11 && record.Sun > dataValue ? record.year + 1 : record.year;\n              if (\n                year === currentDate.getFullYear() &&\n                month === currentDate.getMonth() &&\n                date === currentDate.getDate()\n              ) {\n                return '#f0f0f0';\n              }\n              return '#fff';\n            },\n            textAlign: 'right',\n            textBaseline: 'top',\n            color: '#999'\n          }\n        },\n        config.tableOptions?.theme\n      )\n    ),\n    title: {\n      ...(config.tableOptions?.title ?? {}),\n\n      orient: 'top',\n      // text: 'Thu, Aug 22',\n      text: `${getWeekdayString(currentDate.getDay())}, ${getMonthString(\n        currentDate.getMonth()\n      )} ${currentDate.getDate()}`,\n      subtext: currentDate.getFullYear()\n    },\n    enableLineBreak: true,\n    customCellStyle: [\n      {\n        id: 'current-month',\n        style: {\n          color: '#000'\n        }\n      }\n    ]\n  };\n\n  return option;\n}\n"]}